5。具体网页和功能的设计与实现

    本章主要介绍了系统的具体功能，并对部分功能进行了图文说明和代码分析。

5。1 网页的布局思路

    首先进入系统需要进行登录，而使用的用户中有普通用户学生，和管理员的区别。不同的用户登录后系统应该赋予不同的操作权限，所以首先设计登录界面时，应该考虑设计两个可切换的登录界面，一个用来给学生登录，一个给管理员登录。

    登录进去主系统后，系统的界面应该分为不同的部分，所以在程序中使用三个jsp分别对三个方位进行布局，然后在主界面中显示。

    在具体的功能界面，在上方显示查询框，有添加和修改功能的部分要加上相应的操作图标。在用户进行某些操作时，如果操作不能为空，或者操作方式有限制，应当提供相应的提示。

5。2 项目中包的结构

    com。soft。po包：实体类对象，里面是各个实体类的属性和相应的set，get方法。

    com。soft。system。controller：控制类。

    com。soft。system。mapper：数据库映射接口和配置文件。

    com。soft。system。service：可供控制类调用的服务类接口。

    com。soft。system。service。impl：服务类接口的实现类。

com。soft。util：工具类。来-自~优+尔=论.文,网www.youerw.com +QQ752018766-

5。3 系统登录模块的实现

（1）模块功能

登录系统时，不同身份的用户登录系统，会被赋予不同的操作权限，用户全部由后台添加进入数据库，并且赋予相应的权限。在登录时，不同身份的用户在不同的界面登录，学生在学生登录界面登录，管理员在管理员登录界面登录。为了安全起见，最终后台界面只能手动输入地址访问。

（2）登录界面如图5-3-1所示，可点击切换学生登录或管理员登录：

图5-3-1 登录界面

关键代码：

<p class="switch" id="switch">

<a class="switch_btn_focus" id="switch_qlogin"

href="javascript:void(0);" tabindex="7">学生登录</a>

              <a class="switch_btn" id="switch_login"                                     href="javascript:void(0);"tabindex="8">管理员登陆</a>

<p class="switch_bottom" id="switch_bottom"style="position: absolute;"></p>

@RequestMapping("login。do")

public String login(StudentInfo student, HttpSession session, Model model) {

StudentInfo studentInfo = studentInfoService。getStudentInfo(student);

List<MenuInfo> list = menuInfoService。getStudentMenuList();

if (null != studentInfo) {

session。setAttribute("studentInfo", studentInfo);

session。setAttribute("menulist", list);

return "index";

       } else {model。addAttribute("error", "帐号名密码错误");}

return "login";}

代码分析：class是指定这个p所使用的css样式，javascript:void(0)是为了保持原有的链接样式，但不做任何实际操作，交给点击处理，防止跳转到其他页面。点击登录时交给login。do方法处理，首先通过studentInfoService。getStudentInfo(student)方法查询出学生信息，然后通过menuInfoService。getStudentMenuList()方法查询出学生可以操作的菜单栏信息。如果查询出的学生信息在数据库中不存在，则显示“账号名密码错误”返回登录界面。否则，跳转到系统首页。