文章目录
- 一、快速开始
- 二、任务概述
- 2.1 基本功能
- 2.2 信息管理
- 三、分析设计
- 四、功能展示
- 4.1 用户登录
- 4.2 用户注册
- 4.3 重置密码
- 4.4 主界面
- 4.5 个人资料
- 4.6 修改密码
- 4.6 数据分页
- 4.7 用户检索
- 4.8 信息编辑
- 4.9 退出登录
开发时间 | Spring | MyBatis | 工程文件 |
---|---|---|---|
22/04/01 - 22/04/18 | 5.3.1 | 3.5.7 | uims |
一、快速开始
-
项目下载:点击下载 uims(User Information Management System) 工程压缩包到您的计算机来获取源代码。
-
打开工程:使用 IntelliJ IDEA 开发工具打开解压的工程文件,而后使用 Maven 项目构建工具更新工程模块依赖。
-
创建数据库并导入数据:登录 MySQL 控制台,创建一个名为 uims 的数据库,并将 document/sql/uims.sql 脚本中的建表语句和数据导入到 uims 数据库中。
-
修改配置:修改 src/main/resources/jdbc.properties 文件中的数据库连接信息,设置你自己的数据库用户名和密码。
-
部署访问:在 IntelliJ IDEA 中部署 Tomcat 并启动即可访问用户信息管理系统首页,需注意必须配置 Tomcat 的工程上下文路径为 uims。
-
登录系统:系统的默认用户名和密码均为 admin。
二、任务概述
基于 Spring、Spring MVC 和 MyBatis 框架实现一个基于 Web 的用户信息管理系统,需要包含以下两个模块功能。
2.1 基本功能
提供用户注册、修改个人资料、修改密码、以及登陆和注销等功能,具体的界面设计可参考下图。页面需要实现响应式布局,当屏幕的分辨率小于 800px 时,左侧的 left 栏菜单自动隐藏。
-
用户注册
-
用户登录
-
主界面
-
个人资料
-
密码修改
2.2 信息管理
实现用户信息管理,包括所有用户的信息列表展示、查询、编辑和删除,具体的界面设计参考下图。
-
信息列表
-
信息检索
-
编辑信息
-
删除用户
三、分析设计
基于 SSM 框架的用户信息管理系统,需要实现用户登录、用户注册、密码修改、个人信息修改、学生信息管理(增、删、改、查)功能,前端显示页面需要实响应式布局以给各种设备用户友好体验,需实现主题风格的切换。
系统请求响应流程描述如下:
- 用户通过视图层(View)及前端页面发送请求到服务器,在服务器中请求被前端控制器拦截并与 Controller 中方法匹配路径进行匹配(如请求未匹配则交由默认 Servlet 处理)。
- Controller 调用相应的 Service 层处理请求,处理完毕将结果返回到 Controller。
- Controller 再根据请求处理的结果找到相应的 View 视图,交由视图解析器渲染数据后最终响应给浏览器。
具体请求响应流程见下图:
四、功能展示
4.1 用户登录
请求服务器验证用户名及密码存在性,错误则友好提示用户,成功跳转到主页面(自适应响应式布局)。
4.2 用户注册
使用正则表达式验证各表单项格式是否符合要求,不正确则提示用户,前端验证通过后请求服务器保存用户注册信息。
4.3 重置密码
根据用户名及密码修改密码,若原密码错误、两次输入的新密码不一致则提示用户。
4.4 主界面
-
深蓝风格主题主页面。
-
橘黄风格主题主页面。
-
4.5 个人资料
个人资料查看及登录密码修改(修改密码时需输入原密码)。
4.6 修改密码
4.6 数据分页
默认分页展示所有用户信息,可根据信息下方分页条信息跳转到指定页面。
4.7 用户检索
根据用户名搜索用户信息并展示 。
4.8 信息编辑
修改用户信息,修改后提交服务器保存及用户信息删除。
4.9 退出登录
点击注销登录后请求服务器删除用户的登录信息,而后跳转到登录页面。