4 在线投票系统详细设计与实现

在线投票系统的详细设计与实现主要是根据前面的在线投票系统的需求分析和在线投票系统的总体设计来设计页面并实现业务逻辑。主要从在线投票系统界面实现、业务逻辑实现这两部分进行介绍。

4.1前台功能模块

4.1.1 前台首页界面

当进入在线投票系统的时候,系统以上中下的布局进行展示,首先映入眼帘的是系统的导航栏,下面是轮播图,再往下是投票资讯,其主界面展示如下图4-1所示。

图4-1 前台首页界面图

4.2普通用户功能模块

4.2.1 用户注册界面

在线投票系统的游客和租客用户时可以进行注册登录,当用户右上角“注册”按钮的时候,当填写上自己的账号+密码+确认密码+昵称+邮箱+手机号等后再点击“注册”按钮后将会先验证输入的有没有空数据,再次验证密码和确认密码是否是一样的,最后验证输入的账户名和数据库表中已经注册的账户名是否重复,只有都验证没问题后即可用户注册成功。其用用户注册界面展示如下图4-2所示。

图4-2注册界面图

注册关键代码如下:

/**

* 注册

* @param user

* @return

*/

@PostMapping("register")

public Map signUp(@RequestBody User user) {

// 查询用户

Map query = new HashMap<>();

Map map = JSON.parseObject(JSON.toJSONString(user));

query.put("username",user.getUsername());

List list = service.selectBaseList(service.select(query, new HashMap<>()));

if (list.size()>0){

return error(30000, "用户已存在");

}

map.put("password",service.encryption(String.valueOf(map.get("password"))));

service.insert(map);

return success(1);

}

4.2.2 用户登录界面

在线投票系统中的前台上注册后的用户是可以通过自己的账户名和密码进行登录的,当租客用户输入完整的自己的账户名和密码信息并点击“登录”按钮后,将会首先验证输入的有没有空数据,再次验证输入的账户名+密码和数据库中当前保存的用户信息是否一致,只有在一致后将会登录成功并自动跳转到在线投票系统的首页中;否则将会提示相应错误信息,用户登录界面如下图4-3所示。

图4-3用户登录界面图

登录的逻辑代码如下所示。

/**

* 登录

* @param data

* @param httpServletRequest

* @return

*/

@PostMapping("login")

public Map login(@RequestBody Map data, HttpServletRequest httpServletRequest) {

log.info("[执行登录接口]");

String username = data.get("username");

String email = data.get("email");

String phone = data.get("phone");

String password = data.get("password");

List resultList = null;

Map map = new HashMap<>();

if(username != null && "".equals(username) == false){

map.put("username", username);

resultList = service.select(map, new HashMap<>()).getResultList();

}

else if(email != null && "".equals(email) == false){

map.put("email", email);

resultList = service.select(map, new HashMap<>()).getResultList();

4.2.3 投票资讯界面

当用户点击在线投票系统中导航栏上的“投票资讯”后将会进入到该“投票资讯”列表的界面,可以选择想要的投票资讯,点击进入到详细界面,在详细界面可以收藏+赞+评论、投票等操作,投票资讯界面如下图4-4所示。

图4-4投票资讯界面图

4.2.4 投票中心界面

当用户点击“投票中心”这一菜单按钮,会显示管理员在后台发布的所有的投票信息,支持通过关键词:投票标题或投票分类对投票信息进行搜索,选择需要的投票信息点击可以进入到投票信息详细的介绍界面,在详细界面可以查看到投票编号、投票标题、投票分类、已投数量投票标签,下一步点出“投票”即投票成功。投票中心界面如下图4-5所示。

图4-5 投票中心界面图

4.2.5个人中心界面

当用户点击右上角“我的账户”这个按钮,会出现子菜单,点击“个人中心”可以对个人首页、投票信息、收藏进行查看及管理,个人中心界面如下图4-6所示。

图4-6普能用户个人中心界面图

4.2.6投票信息界面

当用户在个人中心里的投票信息界面查看详情,就会跳转到投票信息详细内容,包话:投票编号、投票标题、投票分类、普通用户、用户姓名、投票时间、投票数量。投票信息界面如下图4-7所示。

图4-7投票信息界面图

4.3管理员功能模块

4.3.1管理首页功能界面

管理员进入首页,能通过透视图标查看投票中心统计数据。界面如下图4-8所示。

图4-8用户管理界面图

关键代码如下:

List resultList = null;

Map map = new HashMap<>();

if(username != null && "".equals(username) == false){

map.put("username", username);

resultList = service.selectBaseList(service.select(map, new HashMap<>()));

}

else if(email != null && "".equals(email) == false){

map.put("email", email);

resultList = service.selectBaseList(service.select(map, new HashMap<>()));

}

else if(phone != null && "".equals(phone) == false){

4.3.2用户管理界面

管理员点击“用户管理”这一菜单会显示管理员、管理员和租客用户这三个子菜单,管理员可以对这三个角色的信息进行增删改查操作。界面如下图4-9所示。

图4-9用户管理界面图

4.3.3投票中心管理界面

管理员点击“投票中心管理”这一菜单会显示出两个子菜单:投票中心列表和投票中心添加。管理员可以通过“投票中心列表”进行增删改查操作;点击“投票中心添加”进行添加投票信息。界面如下图4-10所示。

图4-10投票中心管理界面图

关键代码如下:

if (resultList.size()<=0){

return error(30000,"用户不存在");

}

User byUsername = (User) resultList.get(0);

Map groupMap = new HashMap<>();

groupMap.put("name",byUsername.getUserGroup());

List groupList = userGroupService.selectBaseList(userGroupService.select(groupMap, new HashMap<>()));

if (groupList.size()<1){

4.3.4资源管理界面

管理员点击“资源管理”这一菜单会显示出两个子菜单:投票资讯和资讯分类。管理员可以对“投票资讯”进行增删改查操作;对投票资讯进行分类操作。界面如下图4-11所示。

图4-11资源管理界面图

5系统测试

5.1 系统测试用例

系统测试包括:用户登录功能测试、投票信息展示功能测试、投票信息添加、投票信息搜索、密码修改、预约看房功能测试,如表5-1、5-2、5-3、5-4、5-5、5-6所示:

用户登录功能测试:

表5-1 用户登录功能测试表

用例名称

用户登录系统

目的

测试用户通过正确的用户名和密码可否登录功能

前提

未登录的情况下

测试流程

1) 进入登录页面

2) 输入正确的用户名和密码

预期结果

用户名和密码正确的时候,跳转到登录成功界面,反之则显示错误信息,提示重新输入

实际结果

实际结果与预期结果一致

投票信息查看功能测试:

表5-2 投票信息查看功能测试表

用例名称

投票信息查看

目的

测试投票信息查看功能

前提

用户登录

测试流程

点击投票信息列表

预期结果

可以查看到所有投票信息

实际结果

实际结果与预期结果一致

管理员添加投票信息界面测试:

表5-3 管理员添加投票信息界面测试表

用例名称

添加投票信息测试用例

目的

测试投票信息添加功能

前提

管理员正常登录情况下

测试流程

1)管理员点击投票信息,然后点击添加后并填写信息。

2)点击进行提交。

预期结果

提交以后,页面首页会显示新的投票信息

实际结果

实际结果与预期结果一致

投票信息搜索功能测试:

表5-4投票信息搜索功能测试表

用例名称

投票信息搜索测试

目的

测试投票信息搜索功能

前提

测试流程

1)在搜索框填入搜索关键字。

2)点击搜索按钮。

预期结果

页面显示包含有搜索关键字的投票信息

实际结果

实际结果与预期结果一致

密码修改搜索功能测试:

表5-5 密码修改功能测试表

用例名称

密码修改测试用例

目的

测试管理员密码修改功能

前提

管理员用户正常登录情况下

测试流程

1)管理员密码修改并完成填写。

2)点击进行提交。

预期结果

使用新的密码可以登录

实际结果

实际结果与预期结果一致

投票功能测试:

表5-6投票功能测试表

用例名称

投票测试用例

目的

测试用户投票功能

前提

用户正常登录情况下

测试流程

1)搜索查看投票信息,点击投票。

2)填写投票信息,点击进行提交。

预期结果

投票成功

实际结果

实际结果与预期结果一致

5.2 系统测试结果

通过编写在线投票系统的测试用例,已经检测完毕用户登录模块、投票信息展示模块、投票信息添加模块、投票信息搜索模块、密码修改模块、投票模块功能测试,通过这6大模块为在线投票系统的后期推广运营提供了强力的技术支撑。

top
Copyright © 2088 足球世界杯预选赛_荷兰世界杯 - twllb.com All Rights Reserved.
友情链接