jsp课程项目（一）·后台管理系统设计与实现

1、功能设计

       后台系统作为管理人员控制web后台的重要手段之一，最主要的功能（相对于较简陋的后台管理系统而言）即是实现与数据库的交互。作为模板的手机商城有一库四表，其中比较重要的是user（用户表）、mobileForm（商品表）和outForm（订单表）这三个表，在反复斟酌之后我的设计思路如下：

1. 用户管理：增删改查，以及用户权限的设置，比如用户禁用、启用等。
2. 商品管理：增删改查。
3. 订单管理：增删改查，以及编号（优先级）变动等。

       对于用户、商品和订单管理，实质上就是对表的操作，由于临近考试，还需抽出时间复习，因此我只实现了三种增删改查的功能，见谅！

 

2、功能实现

1. 使用什么方式实现，其实这之前我使用过ssh做过类似的功能实现，但考虑到不允许使用框架以及时间限制，我选择使用jsp实现。
2. 首先建立一个后台管理主界面home.html，主页面使用框架分成三个部分（头部标题、左部目录，右部操作），树形目录部分使用操作简单的dtree实现，在d.add（）的第六个参数部分给定节点链接所打开的目标framename指定右部实现页面跳转。

   

   树形目录实现：

   
       
       
   
           全部打开
           or
           关闭
       
       
   

   主页面：

    

3. 由于对三个表的操作类似，此处就只介绍用户管理。

   

   用户管理有四个功能（crud）首先是查看功能，查看功能是通过jsp连接数据库

    String driverClass = "com.mysql.cj.jdbc.Driver";
           String sql = "select * from user";
   
           //读取JDBC
           Class.forName(driverClass);
           //链接数据库
           Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/phone?serverTimezone=UTC","root","123456");

   在查看功能里，我还加入了模糊查询的功能

   //使用action将表单里的值传递给自己
   
       
   
           请输入要查询的的名字（LogName）：">
           
       
   

    //在查询时加入判断，如果selectment不为空，则进行模糊查询
   //如果为空，代表当前的状态不是查询，而是查询所有的内容
           PreparedStatement ps ;
           if(selectName == null){
               //判断查询文本框里面是否有内容，如果没有则执行查询全部信息
               ps = con.prepareStatement(sql);
           }else{
               //如果有，则根据文本框的里面的内容在数据库根据姓名查询
               ps = con.prepareStatement("select * from user where logname like ?");
               ps.setString(1,'%'+selectName+'%');
           }
   
   
           //ResultSet是一个指向数据库的变量，本质上是不保存任何数据的，执行查询
           ResultSet rs = ps.executeQuery();
           //boolean flag = rs.next();   //判断返回指针是否还能继续往下移动
           //显示序号
           int i = 1;
           while( rs.next()){

   将输出后的值使用表格进行输出，并显示记录数

   
           <%out.print(i++);%>
           <%=rs.getString("logname") %>
           <%=rs.getString("password")%>
           <%=rs.getString("phone")%>
           <%=rs.getString("address") %>
           <%=rs.getString("realname") %>
       
       <%
           }
       %>
   
   
   共计<%=i-1%>条记录
   <%
       ps.close();
       con.close();
   %>
   

   最后的查看结果（普通查询和模糊查询）

   

   

    

4. 修改操作的大部分语句与查询一样，最大的不同是sql语句（Update）的不同，执行完毕后页面重定向跳转到查看页面方便管理人员查看修改结果。首先是输入修改信息页面，这里稍微偷了懒使用了整体修改。

   //通过表单输入修改信息
   
       
   修改会员信息
   
       
   
           
   
               
   输入要修改的用户名：
               
   
           
           
   
               
   地址：
               
   
               
   密码：
               
   
           
           
   
               
   联系方式：
               
   
               
   真实姓名：
               
   
           
           
   
               
   
           
       
   

   //修改user表的语句和通过response.sendRedirect方法重定向到look界面
     String sql ="update user set password=?, phone=?, address=?, realname=? where logname=?";
       PreparedStatement ps = con.prepareStatement(sql);
       ps.setString(5,logname);
       ps.setString(1,password);
       ps.setString(2,phone);
       ps.setString(3,address);
       ps.setString(4,realname);
   
       ps.executeUpdate();
   
       con.close();
       response.sendRedirect("look_user.jsp");

   

   修改后的重定向页面

   

    

5. 添加操作的大部分语句与修改一样，最大的不同是sql语句（insert）的不同，执行完毕后页面重定向跳转到查看页面方便管理人员查看修改结果。

   Class.forName(driverClass);
           Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/phone?serverTimezone=UTC","root","123456");
           String sql ="insert into user(logname, password, phone, address, realname) values(?,?,?,?,?)";
           PreparedStatement ps = con.prepareStatement(sql);
           ps.setString(1,logname);
           ps.setString(2,password);
           ps.setString(3,phone);
           ps.setString(4,address);
           ps.setString(5,realname);
   
           ps.executeUpdate();
   
           con.close();
           response.sendRedirect("look_user.jsp");

   

    

6. 删除操作的大部分语句与修改一样，最大的不同是sql语句（Delete）的不同，执行完毕后页面重定向跳转到查看页面方便管理人员查看修改结果。

   

    

7. 商品的查看功能，在数据库返回集合中插入img标签实现图片展示功能（等大方形）

     
           <%out.print(i++);%>
           <%=rs.getString("mobile_version") %>
           <%=rs.getString("mobile_name") %>
           <%=rs.getString("mMobile_made")%>
           <%=rs.getString("mobile_price")%>
           <%=rs.getString("mobile_mess")%>
           " width="150" height="150">
           <%=rs.getString("id") %>
       

    

8. 

    

三、实验总结

此次课程项目是对本学期web开发课程知识点的一个总结和升华，是对我编程能力的一次小测试。这种类型的课程作业我已经完成过多次，因此此次的课程项目，从功能设计到实现的进度，是一条有条不紊的曲线，之前的开发经验帮助我在一天内完成了这个后台管理系统。

dtree相较于之前学过的viewtree，其优缺点都比较明显，比如在实现树形方面，dtree的简易是其最大的优势，而在动态生成树方面，viewtree则有更大的优势。优缺点其实是相对的，在不同的情景下，如何选择好相应的实现工具是我们需要仔细思考的问题。

作为开发者，功能的实用性和用户体验是需要侧重考虑的两点，并不是说连接完mysql执行几条sql语句就能潦草定义功能的，比如在此次的课程项目中，我限制了管理者对订单的修改权限，管理者能在后台修改的只有订单的id（优先级），而订单的信息和客户都是管理者无权修改的内容，我认为这样保障了客户的权益，而管理者无权涉及这方面的变动。

由于时间限制，在页面设计和功能设计上存在着不少缺陷，包括用户权限的管理和订单的审核等功能在此次课程设计中没有实现，这一点我将在日后慢慢补全。