第六组前台界面设计与实现总结书.docx

网上图书管理系统
——前台界面设计与制做
目录：
一：功能实现和界面，代码展示
二：自己的总结体会（末页）
三：存在的不足和展望（末页）

——14软件第六组：管金洋
2016.5.28
一：前台功能 
1、新客户注册：普通用户必须先注册,才能进行图书的查询、浏览、定购、信息反馈等操作。用户需要注册,并且要得到系统管理的审批和确认,主要功能是对用户个人基本信息的管理。 
2、书籍分类搜索：用户可根据对书籍的分类浏览和输入关键字进行本站包含书籍的查找浏览。 
3、新书籍上架:把本站最近入库的书籍显示出来方便客户知道本站书籍的更新。 
4、实现购物车功能模块：实时显示用户当前所购书目，可以增加或删除
 5、订单查询功能：客户确认购买号即生成一个唯一的订单号，客户依此号码可以查询所购书目到书情况。 
6、前台页面管理：注册会员对自己资料的修改，账户的管理和书籍收藏夹的管理,以及对于自己登陆界面风格的管理。
二：购物主要处理流程 
根据需求分析，本系统主要实现两大管理模块：前台的图书管理。前台的图书管理主要用于通过Internet向普通浏览者提供图书的一些基本信息，而后台主要是实现用户的管理以及对图书信息的管理。系统的功能特点如下： 
1、页面模块化：系统界面的设计使用模块进行处理，如把页面的头、尾页面内容，数据库的连接等做成单独的文件，在其它页面设计中需要时可以把其他页面的相应的内容包括进去了，这样有利于页面风格比较统一以及提高开发系统的效率。 
2、图书信息模板的应用：本系统的图书信息代码的生成是基于模块的，更换图书信息内容时只要将图书新的一些必要的信息录入，然后自动修改图书信息的模板。 
3、功能较完善，管理方便：功能方面包括图书产品的展示、用户注册及登录、图书的在线查询、定购等各个方面，完整。
因此得用户登陆网站后购物的主要处理流程如下：
N
Y
Y
Y
N
商家删除订单
收到货款
服务商家处理订单
商品结算
是否结算
放入购物车
选购商品
浏览检索商品
注册成功证
写个人信息
新用户注册
密码验证
老用户登录
登录界面
是否登录
选购书
浏览检索书

Y
N
Y
N
商家发货
前台管理：分为 用户管理 图书查询 图书订购 用户基本信息
首页编辑及运行 
1：网站的首页：（如下图展示）是网站的主体信息中心。主体分为TOP，LEFT,MAIN,和BOTTOM四个部分，其中MAIN是整个页面的中心。 
在MAIN区，放置了一本主编推荐的图书，有一张书面的图片和旁白图书的详细介绍及图书的销售价格和折扣等信息。再下面就是其他的书籍图片，方便用户选择图书，而不需要页面的跳转。所有的图片都有链接，可以方便的实现链接订购。图片介绍下面还有书的折扣，价钱的信息等，MAIN区起的主要作用是和数据库交互，实现图书的订阅，浏览等。如果顾客想购买此物品，就点击“购买”按钮，然后进入购物流程，转到“我的购物车”板块。 
MAIN区的下面部分显示了本月推荐的几本新书，和MAIN区域上面部分的图书采用相同的显示方式。然后就是本周的图书推荐，这只是单本图书，所以信息显网上书店管理系统 和主编推荐的图书采用相同的显示效果，只是添加了媒体评论这个交流的平台区域。 
LEFT部分主要是一个导航，将所有的图书分类导航，使客户可以方便的选择自己需要的图书分类，也很容易才查看到书店的所有图书，所以是一个实用性很强的导航区域。 BOTTOM区显示的是公司的信息，及版权的分需求功能。当用户选择时BOTTOM区就会根据用户的选择自动跳转到相应的页面。
首页界面展示图
首页详细设计的核心代码如下： 
Default.aspx  用来显示主页 
<%@ Page Language="C#" MasterPageFile="~/common.master" 
AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" Title="首页|第三波+书店" %> 
<asp:Content ID="Content1" ContentPlaceHolderID="cphContent" Runat="Server"> 
<table width="98%"  border="0" cellspacing="0" cellpadding="0">         <tr> 
          <td height="10" bgcolor="#BBE188"></td>         </tr>       </table>       <br /> 
      <table width="98%"  border="0" cellspacing="0" cellpadding="0">         <tr> 
          <td align="left"><img src="images/06default_1018_28.gif" width="77" height="18" /></td> 
            <td align="right">&nbsp;</td>         </tr>       </table>         <br />        
<table width="98%"  border="0" cellspacing="0" cellpadding="0">         <tr> 
          <td width="120" height="155" align="left" valign="top"><a href="BookDetail.aspx?bid=4943" target="_blank"><img 
src="BookCover.ashx?isbn=978711515888" width="111" height="148" border="0" /></a></td> 
            <td align="center" valign="top"><table width="95%"  border="0" cellspacing="0" cellpadding="0">               <tr> 
                <td align="left" colspan="5" class="linetext"><a 
href="BookDetail.aspx?bid=4943" target="_blank"><strong>Effective C# 中文版改善C#程序的50种方法</strong></a></td>               </tr>               <tr> 
                <td align="left" colspan="5" class="linetext">
2：用户注册页面和老用户登陆
新用户注册页面。新用户只有注册了才能完成对图书的订购，管理自己的购物车，查看已经订阅的图书图书。点确定后，转入首页，填入的信息写进数据库，实现交互。

注册页面展示登陆界面

详细设计 代码详情 
    public static class DBHelper     {  
        private static SqlConnection connection;         public static SqlConnection Connection         { 
            get              { 
                string connectionString = 
ConfigurationManager.ConnectionStrings["MyBookShop"].ConnectionString;                 if (connection == null)                 { 
                    connection = new SqlConnection(connectionString);                     connection.Open();                 } 
                else if (connection.State == System.Data.ConnectionState.Closed)                 { 
                    connection.Open();                 } 
                else if (connection.State == System.Data.ConnectionState.Broken)                 { 
                    connection.Close();                     connection.Open();                 } 
                return connection;             }         }   
        public static int ExecuteCommand(string safeSql)         { 
            SqlCommand cmd = new SqlCommand(safeSql, Connection);             int result = cmd.ExecuteNonQuery();             return result;         }  
        public static int ExecuteCommand(string sql, params SqlParameter[] values)         { 
            SqlCommand cmd = new SqlCommand(sql, Connection); 
            cmd.Parameters.AddRange(values);             return cmd.ExecuteNonQuery();         }  
        public static int GetScalar(string safeSql)         { 
            SqlCommand cmd = new SqlCommand(safeSql, Connection);             int result = Convert.ToInt32(cmd.ExecuteScalar());             return result;         }  
        public static int GetScalar(string sql, params SqlParameter[] values)         { 
            SqlCommand cmd = new SqlCommand(sql, Connection);             cmd.Parameters.AddRange(values); 
            int result = Convert.ToInt32(cmd.ExecuteScalar());             return result;         }  
        public static SqlDataReader GetReader(string safeSql)         { 
            SqlCommand cmd = new SqlCommand(safeSql, Connection);             SqlDataReader reader = cmd.ExecuteReader();             return reader;         }  
        public static SqlDataReader GetReader(string sql, params SqlParameter[] values)         { 
            SqlCommand cmd = new SqlCommand(sql, Connection);             cmd.Parameters.AddRange(values); 
            SqlDataReader reader = cmd.ExecuteReader();             return reader;         }  
        public static DataTable GetDataSet(string safeSql)         { 
            DataSet ds = new DataSet(); 
            SqlCommand cmd = new SqlCommand(safeSql, Connection);             SqlDataAdapter da = new SqlDataAdapter(cmd);             da.Fill(ds); 
            return ds.Tables[0];         }  
        public static DataTable GetDataSet(string sql, params SqlParameter[] values)         { 
            DataSet ds = new DataSet(); 
            SqlCommand cmd = new SqlCommand(sql, Connection);             cmd.Parameters.AddRange(values); 
            SqlDataAdapter da = new SqlDataAdapter(cmd);             da.Fill(ds); 
            return ds.Tables[0];         }  
} } 

3：购买页面运行
录顾客点击“购买”按钮后，系统会弹出他的购物车，并显示他已购买的物品和现在想购买的书籍，他在“编辑”中可以输入现在购买书籍的数量，而“删除”可以取消订购的图书。如果顾客想完成本次购买就可以点击“结算”，然后操作流程就进入了书店的后台管理部分。 
系统会把当前“购买”所对应的图书的书名、价格、数量等信息添加到购物车中,默认图书的数量为1本。在浏览购物车页面,用户可以对图书的数量进行修改,也可删除购物车中的图书信息。系统根据用户购买图书的数量和价格,计算出总价。通过与数据库实现交互，此时用户也可以继续购买其他的书籍。

购买界面展示

  </span></div></td>     </tr>     <tr>          <td> 
            <img src="images/shop-cart-header-blue.gif" width="206" height="27" />&nbsp;<asp:ValidationSummary 
                ID="vsMessage" runat="server" ShowSummary="False" ShowMessageBox="True" />         </td>     </tr>   </table>   
  <table width="100%" border="0" cellpadding="4" cellspacing="0" class="contentstyle" style="text-align: center"> 
    <tr style="vertical-align: top" class="HeaderColor">       <td style="height: 364px"> 
        <asp:GridView runat="server" ID="gvCart" Width="95%" AutoGenerateColumns="False" AllowPaging="True" OnPageIndexChanging="gvCart_PageIndexChanging" OnRowEditing="gvCart_RowEditing" PageSize="5" OnRowCancelingEdit="gvCart_RowCancelingEdit" 
OnRowDeleting="gvCart_RowDeleting" OnRowDataBound="gvCart_RowDataBound" OnRowUpdating="gvCart_RowUpdating">             <Columns> 
                <asp:TemplateField HeaderText="图示">                     <ItemTemplate> 
                        <img runat="server" id="imgbook" src='<%# 
GetUrl(DataBinder.Eval(Container.DataItem,"ImageUrl").ToString()) %>' width="49" height="56"/> 
                    </ItemTemplate>                 </asp:TemplateField>  
                <asp:TemplateField HeaderText="书名">                                        <ItemTemplate> 
                        <asp:Label ID="lblBookName" runat="server" Text='<%# Bind("BookName") %>'></asp:Label>                     </ItemTemplate>                 </asp:TemplateField> 
                <asp:TemplateField HeaderText="数量">                     <EditItemTemplate> 
                        &nbsp;<asp:TextBox ID="txtNumber" runat="server" Text='<%# Bind("Number") %>'></asp:TextBox> 
                        <asp:RequiredFieldValidator ID="rfvNumber" 
runat="server" ControlToValidate="txtNumber" ErrorMessage="请输入数量" Text="*" 
                           ></asp:RequiredFieldValidator> 
                        <asp:RegularExpressionValidator ID="refNumber" runat="server" ControlToValidate="txtNumber" ErrorMessage="请输入非负整数" Text="*" 
ValidationExpression="^[0-9]*[1-9][0-9]*$"></asp:RegularExpressionValidator> 
                    </EditItemTemplate>                     <ItemTemplate> 
                        <asp:Label ID="Label1" runat="server" Text='<%# Bind("Number") %>'></asp:Label>                     </ItemTemplate>                 </asp:TemplateField> 
                <asp:TemplateField HeaderText="单价">                                         <ItemTemplate> 
                        <asp:Label ID="lblUnitPrice" runat="server" Text='<%# Bind("UnitPrice") %>'></asp:Label>                     </ItemTemplate>                 </asp:TemplateField> 
                <asp:CommandField ShowEditButton="True"/>                              <asp:TemplateField ShowHeader="False">                     <ItemTemplate> 
                        <asp:LinkButton ID="lnkbtnDelete" runat="server" CausesValidation="False" CommandName="Delete" 
                            Text="删除"></asp:LinkButton>                     </ItemTemplate>                 </asp:TemplateField> 
                 <asp:TemplateField Visible="False">                                        <ItemTemplate> 
                        <asp:Label ID="lblBookId" runat="server" Text='<%# Bind("BookId") %>'></asp:Label>                     </ItemTemplate> 
                </asp:TemplateField>                 </Columns>         </asp:GridView>       </td>     </tr>   </table> 
  <table width="100%" class="contentstyle">     <tr> 
      <td width="68%" align="right"> 
         <a href="BookList.aspx">继续挑选书籍</a>&nbsp;&nbsp;&nbsp;&nbsp;         书籍金额总计：￥<em><strong><asp:Literal runat="server" ID="ltrSalary"></asp:Literal></strong></em>       </td> 
      <td align="center"><asp:ImageButton runat="server" ID="imgbtnSalary" ImageUrl="images/balance.gif" OnClick="imgb_Salary_Click" /></td>     </tr>   </table> </form> </body> </html>

总结体会
经过这次的网上图书管理系统界面的设计和功能的实现，自己深有体会，其中虽然借鉴了不少别人的东西，但是从中学习到了好多自己之前没有学到的知识，增加了我学习软件技术的兴趣，虽然自身的能力还为达到一定水皮平，但从ASP.net程序设计这门课程开始到现在，已经在不断的编写代码中找到了乐趣，尤其是一个程序正确执行后的那种乐趣更是无法形容，让自身充满了成就感我这次课设的题目是“图书管理系统”，看到这个程序的时候，觉得自己编写还是有很大困难的，但是经过几周的不断努力，还是有点成果，虽然程序还不是很完善，但是在编写代码的过程中确使我对ASP.net语言的学习有了跟进一步的提高。
存在的不足和展望
在以后的上机中应更加注意，学会使用灵活，让自己的编写更简洁。 通过实际操作，学会A程序编程的基本步骤、基本方法，开发了自己的逻辑思维能力，培养了分析问题、解决问题的能力。在此希望以后应多进行这样的实训，加长时间，培养学生独立思考问题的能力，提高实际操作水平。

姓名：管金洋
2016.5.29