注:展示部分文档内容和系统截图,需要完整的视频、代码、文章和安装调试环境请私信up主。
4.3系统的工作原理
系统工作原理时序图,如图4-3所示。
4.4系统功能操作流程
4.4.1个人中心模块
该模块的基本作用是信息管理。
个人中心模块时序图,如图4-2所示。
4.4.2 管理员大学生兼职信息管理模块
该模块的是实现增删改查的基本操作功能,如图4-3所示。
4.4.3管理员模块时序图
管理员模块时序图如图4-4所示。
4.6.2 数据库物理设计
数据库的物理设计,根据数据库逻辑设计进一步实际实现得到的物理设计。
表4-1 用户表
字段 | 类型 | 备注 | 字段说明 |
Id | Int | 自增 | 主键 |
Username | Varchar(50) | 非空 | 用户名 |
Pass | Varchar(30) | 非空 | 密码 |
Sex | Varchar(1) | 默认为1 | 性别 |
addtime | Date | 跟随系统时间 | 添加时间 |
age | Char | 年龄 | |
phonenumber | Varchar(50) | 电话 |
表4-2 配置表
字段 | 类型 | 备注 | 字段说明 |
Id | Int | 自增 | 主键 |
Name | Varchar(50) | 非空 | 名称 |
value | Varchar(30) | 参数值 |
、
表4-3 大学生兼职表
字段 | 类型 | 备注 | 字段说明 |
Id | Int | 自增 | 主键 |
Addtime | Date | 非空 | 添加时间 |
name | Varchar(30) | 非空 | 名称 |
picture | Varchar(30) | 图片 | |
number | Varchar(30) | 非空 | 编号 |
classification | Char | 非空 | 类别 |
表4-4 token表
字段 | 类型 | 备注 | 字段说明 |
Id | bigint | 自增 | 主键 |
userid | bigint | 非空 | 用户id |
username | varchar(50) | 非空 | 用户名 |
tablename | varchar(50) | 表名 | |
role | varchar(50) | 非空 | 角色 |
token | varchar(50) | 非空 | 密码 |
addtime | Date | 非空 | 添加时间 |
expiratedtime | Date | 非空 | 过期时间 |
表4-5 管理员表
字段 | 类型 | 备注 | 字段说明 |
Id | bigint | 自增 | 主键 |
username | varchar(50) | 非空 | 姓名 |
password | varchar(50) | 密码 | |
role | varchar(50) | 非空 | 角色 |
addtime | Date | 非空 | 添加时间 |
5.1.1 前台端登录功能的实现
其登录成功页面如图5-1所示。
在大学生兼职信息系统登录成功后,跳转到大学生兼职信息系统的首页页面,有首页、招聘信息、论坛交流、网站公告、个人中心、后台管理、投诉举报按钮滑动框构成,具体展示步骤如下:
步骤一:用户进入首页页面,使用elementui组件库中的menu组件展示导航栏内容,然后使用carousel组件,展示轮播图内容。
步骤二:进入页面触发Vue生命周期函数created中的getList函数和getNewsList函数,获取招聘信息、论坛交流、网站公告、个人中心、后台管理、投诉举报内容。具体代码如下:
getNewsList() {
this.$http.get('news/list', {params: {
page: 1,
limit: 5,
order: 'desc'}}).then(res => {
if (res.data.code == 0) {
this.newsList = res.data.data.list;
}
});
},
vue.baseurl = http.baseurl;
// 获取轮播图 数据
http.request('config/list', 'get', {
page: 1,
limit: 5
}, function(res) {
if (res.data.list.length > 0) {
let swiperList = [];
res.data.list.forEach(element => {
if (element.value != null) {
swiperList.push({
img: http.baseurl+element.value
});
}
});
vue.swiperList = swiperList;
用户可在当前页面自行选择需要浏览的功能,招聘信息功能提供了企业近阶段大量的招聘信息,里面包含岗位名称、基本信息、以及求职要求。在论坛交流界面,用户可自行与网友交流沟通最近意见与看法,分享用户心得体会或者推荐的兼职工作。
网站公告则为兼职信息系统近阶段来发布的一系列有关招聘信息的通知或者网站维护通告。功能代码:
@RequestMapping("/lists")
public R list( NewsEntity news){
EntityWrapper<NewsEntity> ew = new EntityWrapper<NewsEntity>();
ew.allEq(MPUtil.allEQMapPre( news, "news"));
return R.ok().put("data", newsService.selectListView(ew));
}
在个人中心界面,用户则可以管理自己的个人信息,进行个性化修改并保存。该修改功能的实现由修改完成后点击提交,前端通过model将修改的数据提交到后端,后端通过update语句将修改写入数据库,完成个性化内容的修改。功能代码如下:
@RequestMapping("/update")
public R update(@RequestBody NewsEntity news, HttpServletRequest request){
//ValidatorUtils.validateEntity(news);
newsService.updateById(news);//全部更新
return R.ok();
}
其用户登录过程的的流程图如图5-2所示。
目 录