一、任務描述
1.使用Asp.NET技術，完成銀行管理系統
2.開發工具：VS2010
3.資料庫：SQL Server 2008
功能子產品：登入、開戶、存款、取款、轉賬、挂失等功能
運作界面：
1.登入界面（Login.aspx），在背景提供篩選，如果是管理者的登入賬号與密碼就跳入管理者首頁，如果是普通使用者，就進入普通使用者首頁。
2.管理者首頁（AdministratorIndex.aspx）,提供使用者資訊，銀行卡資訊（選項切換），和新增使用者和檢視日志的跳轉。在使用者管理選項裡，在使用者名下提供修改使用者資料功能，在客戶卡資訊下可以檢視該使用者擁有的多有卡的資訊。在銀行卡資訊管理選項中，可以查詢卡資訊，也可以對卡進行當機，并記錄日志。
3.單個使用者資訊頁面（UserEdit.aspx）該頁面可以對該使用者的基本資訊進行修改。
4.客戶卡資訊（UserCardInfo.aspx）該界面提供挂失和取消挂失，并記錄日志，并且在該頁面提供了開戶功能（突然覺得這個連結放在銀行卡資訊管理下或許更合适一些，哈哈）。
5.開戶界面（AddCard.aspx）
6.新增使用者界面（UserEdit.aspx）與單個的使用者資訊界面是同一個界面
7.檢視日志界面（Log.aspx）由于條數很多，進行了分頁，添加了搜尋
8.使用者首頁（CustomerIndex.aspx）可以進行存錢，取錢，轉賬，利用ajax判斷金額是否足夠以及轉賬時對方卡号是否存在。
二、任務詳細要求
1.登入子產品：
輸入使用者名和密碼，進行比對，比對成功，根據不同使用者類型，跳轉到不同界面；普通使用者跳轉到普通使用者的首頁、管理者跳轉到管理者首頁；
2.開戶子產品（管理者）：
使用者管理子產品
顯示使用者清單，清單中，通過點選使用者名，可以連結到使用者資訊的編輯頁面；提供連結，能夠連結檢視該使用者的所有銀行卡資訊，并在該使用者的銀行卡清單頁中，提供開戶（新增銀行卡）、挂失（記錄日志）等功能
提供新增使用者的功能
3.銀行卡清單（管理者）：
羅列出所有銀行卡資訊
包括卡号、使用者名、身份證号、開卡日期、是否當機
并能夠使用身份證号、使用者名、銀行卡号進行檢索功能；
提供挂失功能（記錄日志）；
4.日志清單（管理者）
5.存款子產品（普通使用者）：
登入使用者，選擇本人的銀行卡号（下拉框羅列未挂失賬戶），輸入金額，将錢存入該賬戶中（僅模拟存款）； 并記錄日志；
6.取款子產品（普通使用者）：
登入使用者，選擇本人的某個銀行卡号（下拉框羅列未挂失賬戶），輸入取款金額，取款前，使用ajax判斷是否賬戶中有足夠的錢；足夠，則取款（并記錄日志），否則作出相應提示；
7.轉賬子產品（普通使用者）：
登入使用者，選擇本人的某個銀行卡号（下拉框羅列未挂失賬戶），輸入轉賬金額和對方帳号，使用ajax判斷是否賬戶中有足夠的錢并且對方帳号是否存在并未挂失；滿足條件，則可以轉賬并記錄日志，否則作出相應提示；
三、資料庫設計
資料庫結構：
有些日期是操作的目前日期，可在資料庫中直接進行操作：
--為日志的操作日期添加目前日期
ALTER TABLE dbo.Log
ADD CONSTRAINT DFT_Log_operationdate
DEFAULT(CURRENT_TIMESTAMP) FOR operationdate; 四、界面設計與功能實作
檔案配置：
<connectionStrings>
<add name="MainConn" connectionString="server=.;database=bank;user=sa;pwd=0301;Max Pool Size = 512;"
providerName="System.Data.SqlClient" />
</connectionStrings> 添加引用:
這裡引用的是内部的.dll,可以自行下載下傳Maticsoft.DBUtility。此引用主要用于資料庫查詢。
4.1 登入界面
Login.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
// 判斷輸入是否為空
function checkUserInfo() {
if ($("#txtUserName").val() == "") {
alert("請輸入使用者名");
return false;
}
if ($("#txtPassword").val() == "") {
alert("請輸入密碼");
return false;
}
}
</script>
<style type="text/css">
body{background-color:#646464;}
.my_login{width:300px;margin:100px auto;color:White}
#buttonLogin{display: inline-block;outline: none;cursor: pointer;text-align: center;
text-decoration: none;font: 14px/100% Arial, Helvetica, sans-serif;padding: .5em 2em .5em;
text-shadow: 0 1px 1px rgba(0,0,0,.3);-webkit-border-radius: .5em; -moz-border-radius: .5em;
border-radius: 0em;-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);margin-left:20px;}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="my_login" style="text-align:center;">
<h2>銀行管理系統</h2>
<%--登入使用者名--%>
<asp:Label ID="labelUserName" runat="server" Text="使用者名： "></asp:Label>
<asp:TextBox ID="txtUserName" runat="server"></asp:TextBox><br/><br/>
<%--登入密碼--%>
<asp:Label ID="labelPassword" runat="server" Text="密 碼 ： "></asp:Label>
<asp:TextBox ID="txtPassword" runat="server"></asp:TextBox><br/><br/>
<%--登入按鈕--%>
<asp:Button ID="buttonLogin" runat="server" Text="登入"
onclientclick="return checkUserInfo()" onclick="buttonLogin_Click"/>
</div>
</form>
</body>
</html> 這裡寫了一段js，在前端處理是否有為空的輸入，如果有為空的輸入就不再進入背景進行處理。注意return的使用。
Login.aspx.cs
namespace web
{
public partial class Login : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void buttonLogin_Click(object sender, EventArgs e)
{
//編寫sql語句，此處的top 1 就是選出查詢的第一條記錄，此處可避免查出内容相同的兩條語句
string sql = "SELECT TOP 1 * FROM Users WHERE username = @username AND password = @password";
//設定參數
SqlParameter[] pms = {
new SqlParameter("@username",SqlDbType.NVarChar,50),
new SqlParameter("@password",SqlDbType.NVarChar,30)
};
//為參數指派
pms[0].Value = txtUserName.Text;
pms[1].Value = txtPassword.Text;
DataSet ds = DbHelperSQL.Query(sql, pms); //執行查詢，并将資料放置在一個資料集中
//判斷表中是否存在資料，如果有資料則登入成功，如果沒有資料，則登入失敗
if (ds.Tables[0].Rows.Count > 0)
{
//根據判斷選擇進入哪個首頁,無論進來的管理者或者是普通使用者都記錄下操作者的ID，友善記錄日志
if (ds.Tables[0].Rows[0]["usertype"].ToString() == "管理者")
{
Session["id"] = ds.Tables[0].Rows[0]["id"].ToString();
Session["username"] = ds.Tables[0].Rows[0]["username"].ToString();
Response.Redirect("AdministratorIndex.aspx");
}
else
{
Session["id"] = ds.Tables[0].Rows[0]["id"].ToString();
Session["username"] = ds.Tables[0].Rows[0]["username"].ToString();
Response.Redirect("CustomerIndex.aspx");
}
}
//驗證失敗彈出提示框
else
{
Response.Write("<script>alert('使用者名或密碼錯誤，請重新登入');</script>");
}
}
}
} 此處在背景查詢顯示判斷是否賬戶與密碼比對，然後根據輸入的賬戶得到賬戶類型，跳轉到不同使用者的首頁。
4.2 普通使用者的首頁
CustomerIndex.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(function () {
$("#btnDrawMoney").click(function () { //點選事件
var money = $("#txtDrawMoney").val();
var cnumber = $("#ddlCNumber").find("option:selected").text()
$.ajax({
url: "DrawMoneyHandler.ashx",
type: "POST",
data: { money: money, cnumber: cnumber },
success: function (data) {
if (data != '') {
alert(data);
location.reload();
} else {
location.reload();
}
}
}
);
});
$("#btnTransMoney").click(function () { //點選轉賬事件
var money = $("#txtTransMoney").val();
var otherCard = $("#txtOtherCard").val();
var cnumber = $("#ddlCNumber").find("option:selected").text()
$.ajax({
url: "TransMoneyHandler.ashx",
type: "POST",
data: { money: money, otherCard: otherCard, cnumber: cnumber },
success: function (data) {
if (data != '') {
alert(data);
alert("轉賬成功");
location.reload();
} else {
location.reload();
}
}
}
);
});
});
</script>
<script type="text/javascript">
//頁籤js
// 頁籤js代碼
window.onload = function () {
$(".draw").css("display", "none");
$(".trans").css("display", "none");}
function showSave() {
$("#lbSave").css("background-color", "red");
$("#lbDraw").css("background-color", "");
$("#lbTrans").css("background-color", "");
$(".save").css("display", "block");
$(".draw").css("display", "none");
$(".trans").css("display", "none");
}
function showDraw() {
$("#lbSave").css("background-color", "");
$("#lbDraw").css("background-color", "red");
$("#lbTrans").css("background-color", "");
$(".save").css("display", "none");
$(".draw").css("display", "block");
$(".trans").css("display", "none");
}
function showTrans() {
$("#lbSave").css("background-color", "");
$("#lbDraw").css("background-color", "");
$("#lbTrans").css("background-color", "red");
$(".save").css("display", "none");
$(".draw").css("display", "none");
$(".trans").css("display", "block");
}
</script>
<style type="text/css">
*{margin:5px;}
body{background-color:#646464;}
.my_login{width:400px;margin:100px auto;color:White}
#btnSaveMoney,#btnDrawMoney,#btnTransMoney{display: inline-block;outline: none;cursor: pointer;text-align: center;
text-decoration: none;font: 14px/100% Arial, Helvetica, sans-serif;padding: .5em 2em .5em;
text-shadow: 0 1px 1px rgba(0,0,0,.3);-webkit-border-radius: .5em; -moz-border-radius: .5em;
border-radius: 0em;-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);}
#lbSave,#lbDraw,#lbTrans{cursor:pointer;padding:5px 5px 5px;}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="my_login">
<asp:Label ID="Label1" runat="server" Text="選擇自己卡号"></asp:Label>
<asp:DropDownList ID="ddlCNumber" runat="server"></asp:DropDownList>
<%--頂部的頁籤訓示--%>
<asp:Label ID="lbSave" runat="server" Text="存錢" onmouseover = "showSave()"></asp:Label>
<asp:Label ID="lbDraw" runat="server" Text="取錢" onmouseover = "showDraw()"></asp:Label>
<asp:Label ID="lbTrans" runat="server" Text="轉賬" onmouseover = "showTrans()"></asp:Label>
<br/>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div class="save" style="text-align:center;">
<asp:TextBox ID="txtSaveMoney" runat="server"></asp:TextBox><br/>
<asp:Button ID="btnSaveMoney" runat="server" Text="存錢"
onclick="btnSaveMoney_Click" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<div class="draw" style="text-align:center;display:none;">
<asp:TextBox ID="txtDrawMoney" runat="server"></asp:TextBox><br/>
<asp:Button ID="btnDrawMoney" runat="server" Text="取錢" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel3" runat="server">
<ContentTemplate>
<div class="trans" style="text-align:center;display:none;">
<asp:Label ID="Label2" runat="server" Text="對方賬号"></asp:Label>
<asp:TextBox ID="txtOtherCard" runat="server"></asp:TextBox><br/>
<asp:Label ID="Label3" runat="server" Text="轉入金額"></asp:Label>
<asp:TextBox ID="txtTransMoney" runat="server"></asp:TextBox><br/>
<asp:Button ID="btnTransMoney" runat="server" Text="轉賬" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html> 此處在前端首先有一個頁籤，裡面用到了updatePanel局部更新功能，然後是通過ajax向後端提供輸入資料，并獲得傳回。
在背景程式綁定下拉：
private void BindDrop()
{
int userid = Convert.ToInt32(Session["id"]);
//測試用，這樣就可以不用從頭開始測試
if (userid == 0)
{
userid = 2;
}
string sql = "SELECT cnumber,id FROM BankAccount WHERE islost = 'False' AND userid = @userid";
SqlParameter[] pms = {
new SqlParameter("@userid",SqlDbType.Int)
};
pms[0].Value = userid;
DataSet ds = DbHelperSQL.Query(sql,pms);
ddlCNumber.DataSource = ds;
ddlCNumber.DataTextField = "cnumber";
ddlCNumber.DataValueField = "id";
DataRow drNew = ds.Tables[0].NewRow();//方法，建立一行
drNew["id"] = 0;//為新增的一行添加兩個屬性
drNew["cnumber"] = "請選擇";
ds.Tables[0].Rows.InsertAt(drNew, 0);//将新增的一行添加到ds中
ddlCNumber.DataBind();
} 在一般程式裡面，為了使用session值：
首先
using System.Web.SessionState; 其次
public class TransMoneyHandler : IHttpHandler, IRequiresSessionState 最後
int ruserid = Convert.ToInt32(context.Session["id"]);
string username = Convert.ToString(context.Session["username"]); 4.3 管理者首頁
在添加多個輸入框進行查詢時，注意sql語句書寫方式：
StringBuilder sbsql = new StringBuilder();
sbsql.AppendLine("SELECT B.cnumber,U.username,U.userID,B.opendate,B.islost FROM ");
sbsql.AppendLine("Users AS U INNER JOIN BankAccount AS B ON U.id = B.userid");
sbsql.AppendLine("WHERE 1=1");
if (username != "")
{
sbsql.AppendLine("AND U.username LIKE @username");
}
if (userID != "")
{
sbsql.AppendLine("AND U.userID = @userID");
}
if (cnumber != "")
{
sbsql.AppendLine("AND B.cnumber LIKE @cnumber");
}
SqlParameter[] pms = {
new SqlParameter("@username",SqlDbType.NVarChar,50),
new SqlParameter("@userID",SqlDbType.NVarChar,30),
new SqlParameter("@cnumber",SqlDbType.NVarChar,30)
};
pms[0].Value = "%" + username + "%";
pms[1].Value = userID;
pms[2].Value = "%" + cnumber + "%";
DataSet ds1 = DbHelperSQL.Query(sbsql.ToString(),pms); 4.4 檢視日志界面
在此詳細講下如何進行分頁：
首先為gridview更改屬性：
添加事件：
在gridview底部添加代碼：
<%--添加分頁--%>
<PagerTemplate>
目前第:
<%--//((GridView)Container.NamingContainer)就是為了得到目前的控件--%>
<asp:Label ID="LabelCurrentPage" runat="server" Text="<%# ((GridView)Container.NamingContainer).PageIndex + 1 %>"></asp:Label>
頁/共:
<%-- //得到分頁頁面的總數--%>
<asp:Label ID="LabelPageCount" runat="server" Text="<%# ((GridView)Container.NamingContainer).PageCount %>"></asp:Label>
頁
<%--//如果該分頁是首分頁，那麼該連接配接就不會顯示了.同時對應了自帶識别的指令參數CommandArgument--%>
<asp:LinkButton ID="LinkButtonFirstPage" runat="server" CommandArgument="First" CommandName="Page"
Visible='<%#((GridView)Container.NamingContainer).PageIndex != 0 %>'>首頁</asp:LinkButton>
<asp:LinkButton ID="LinkButtonPreviousPage" runat="server" CommandArgument="Prev"
CommandName="Page" Visible='<%# ((GridView)Container.NamingContainer).PageIndex != 0 %>'>上一頁</asp:LinkButton>
<%--//如果該分頁是尾頁，那麼該連接配接就不會顯示了--%>
<asp:LinkButton ID="LinkButtonNextPage" runat="server" CommandArgument="Next" CommandName="Page"
Visible='<%# ((GridView)Container.NamingContainer).PageIndex != ((GridView)Container.NamingContainer).PageCount - 1 %>'>下一頁</asp:LinkButton>
<asp:LinkButton ID="LinkButtonLastPage" runat="server" CommandArgument="Last" CommandName="Page"
Visible='<%# ((GridView)Container.NamingContainer).PageIndex != ((GridView)Container.NamingContainer).PageCount - 1 %>'>尾頁</asp:LinkButton>
轉到第
<asp:TextBox ID="txtNewPageIndex" runat="server" Width="20px" Text='<%# ((GridView)Container.Parent.Parent).PageIndex + 1 %>'/>頁
<%--//這裡将CommandArgument即使點選該按鈕e.newIndex 值為3--%>
<asp:LinkButton ID="btnGo" runat="server" CausesValidation="False" CommandArgument="-2"
CommandName="Page" Text="Go"/>
</PagerTemplate> 背景代碼：
protected void gvLog_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
// 得到該控件
GridView theGrid = sender as GridView;
int newPageIndex = 0;
if (e.NewPageIndex == -3)
{
//點選了Go按鈕
TextBox txtNewPageIndex = null;
//GridView較DataGrid提供了更多的API，擷取分頁塊可以使用BottomPagerRow 或者TopPagerRow，當然還增加了HeaderRow和FooterRow
GridViewRow pagerRow = theGrid.BottomPagerRow;
if (pagerRow != null)
{
//得到text控件
txtNewPageIndex = pagerRow.FindControl("txtNewPageIndex") as TextBox;
}
if (txtNewPageIndex != null)
{
//得到索引
newPageIndex = int.Parse(txtNewPageIndex.Text) - 1;
}
}
else
{
//點選了其他的按鈕
newPageIndex = e.NewPageIndex;
}
//防止新索引溢出
newPageIndex = newPageIndex < 0 ? 0 : newPageIndex;
newPageIndex = newPageIndex >= theGrid.PageCount ? theGrid.PageCount - 1 : newPageIndex;
//得到新的值
theGrid.PageIndex = newPageIndex;
//重新綁定
BindData();
}