计算机毕业设计 ssm知了堂财务报账管理系统hsg4282B6 毕设

本文详细描述了一个基于Java、JavaScript、VUE.js和MySQL5.7的系统实现,涉及登录验证、用户子系统(包括首页、账单和员工管理)、管理员权限(用户管理、密码修改、员工和公告管理)等功能的开发和流程。

第5章系统实现

一、技术路线:

开发语言:Java

前端技术:JavaScript、VUE.js(2.X)、css3

数据库:MySQL 5.7

数据库管理工具:Navicat或sqlyog

开发工具:IDEA或Ecplise

二、项目介绍:

https://www.bilibili.com/video/BV11a4y1m7p7/

三、运行截图:


3.1登录模块的实现

系统的登录窗口是用户的入口,用户只有在登录成功后才可以进入访问。通过在登录提交表单,后台处理判断是否为合法用户,进行页面跳转,进入系统中去。

登录合法性判断过程:用户输入账号和密码后,系统首先确定输入输入数据合法性,其不能为空,然后调用数据库查找alluser表中数据,进行匹配查看此账号是否存在和密码是否正确。

在主页中切入登录窗口页面,调用设计好的CSS、JS和IMAGES等文件对页面进行整体设计,创建表单,在login.jsp页面发送登录请求,通过applicationContext.xmll文件来指定所要执行的DispacherServlet分发器,分发器找到控制层下的hsgloginController文件。当系统判定账号密码都正确,系统会跳转到系统的首页。

用户登录模块的IPO如下所示:

输入:用户名和密码。

处理:

1)检验用户是否满足输入的要求,即检验用户名和密码文本框是否为空,若为空,则提示用户输入用户名和密码。

2)检验是否存在用户输入的用户名,并且密码是否正确。

3)从数据库中提取记录,并储存在本地的session中(timeout默认=30min)。

4)根据用户名,将其显示在系统首页上。

5)关闭窗口。

输出:是否成功的信息。

登录流程图如下所示。

157f9a0663965ae6c155aace480002f9.jpeg

图3-1登录流程图

系统登录界面如下所示。

e707ce472dd8dd435ca4578301fb0021.jpeg

图3-2系统登录

用户登录的逻辑代码如下:

@RequestMapping("hsglogin.do")

public String checkAllusersLogin(Allusers allusers, HttpSession session) {

Map u=new HashMap();

System.out.println("name===" + allusers.getUsername());

u.put("username",allusers.getUsername());

//u.put("utype", "用户");

//Md3.MD5HexEncode(user.getPassword())

u.put("pwd",allusers.getPwd());

allusers = allusersService.allusersLogin(u);

if (allusers != null) {

session.setAttribute("username", allusers);

System.out.println("username=" + allusers);

session.removeAttribute("suc");

return "redirect:index.do";

} else {

System.out.println("usernafwfwwme=");

session.setAttribute("suc", "登录失败!用户名或密码错误!");

return "login";

}

3.2用户子系统模块的实现

3.2.1用户首页的实现

本系统的首页使用多个jsp页面组成,通过设置页面的长度和高度限制显示区域的大小,整个系统首页以图片为背景。在一个jsp页面中,使用css指定字体大小和字体类型以及其位置,水平排列菜单栏,通过设置超链接的样式去掉下划线和鼠标移动到该选项时变颜色等等,编写javascript脚本在导航栏显示系统的当前日期,首先定义一个数组d存放周一至周日,创建一个获取时间的对象time后通过该对象的方法获取年月日,(time.getDay())%7计算得到的结果是数组的下标,通过数组下标就获取了数组的值,利用字符窜连接把年月日和星期转换成字符窜,通过document.getElementById("date")获取标签后使用innerHTML把该字符窜显示在jsp页面。利用标签包含设计好的头部和左边部分的网页。

如下图所示为系统的首页界面。

697fe95cb6f1f633f89996027241ff75.jpeg

图3-3系统首页

其中载入前台页面的主要代码如下:

3.2.2账单模块的实现

员工点击账单报销,使用getmap(id,"xinxi"),通过员工ID得到员工信息,将员工信息赋值给账单信息,添加账单则发出名为baoxiaozhangdan_add.jsp的action请求,找到BaoxiaozhangdanController控制层的addBaoxiaozhangdan()方法,然后调用业务逻辑层下的baoxiaozhangdanService类,将账单内容插入账单表中。

员工账单流程图如下所示。

329e3bf6fc76d123390cb41fc6a6da62.jpeg

图3-12员工账单流程图

员工账单界面如图所示。

89b3d3c52257361f8498e6b29e366f1f.jpeg

图3-13员工账单

账单管理界面如图所示。

94b1b4210d3f783a607ee3217351381b.jpeg

图3-14账单管理

账单添加关键代码为:

@RequestMapping("addBaoxiaozhangdan.do")

public String addBaoxiaozhangdan(HttpServletRequest request,Baoxiaozhangdanbaoxiaozhangdan,HttpSession session) throws SQLException{

Timestamp time=new Timestamp(System.currentTimeMillis());

baoxiaozhangdan.setAddtime(time.toString().substring(0, 19));

baoxiaozhangdanService.add(baoxiaozhangdan);

session.setAttribute("backxx", "添加成功");

session.setAttribute("backurl", request.getHeader("Referer"));

//session.setAttribute("backurl", "baoxiaozhangdanList.do");

return "redirect:postback.jsp";

//return "redirect:baoxiaozhangdanList.do";

}

3.3管理员子系统模块的实现

3.3.1用户管理模块的实现

用户在yhzhgl查看用户信息,先使用sql语句查询出所有用户表的数据,然后调用PageManager.getPages(url,4,sql, request ),返回一个ArrayList的对象,在for循环里,使用jsp得到每个ArrayList对象的数据,然后放入页面模板中,添加用户则将添加的用户数据封装在HashMap,中然后调用action包下Action类的insert方法将用户内容插入用户表中。

系统用户管理界面如下图所示。

1755dbd3c66d0f12f94589fad0db2e91.jpeg

图3-17系统用户管理

员工管理界面如下图所示。

图3-18员工管理

系统用户管理关键代码为:

@RequestMapping("allusersList.do")

public String goodList(@RequestParam(value="page",required=false)String page,

ModelMap map,HttpSession session,Allusers allusers, String username, String pwd, String cx){

/*if(session.getAttribute("user")==null){

return "login";

}*/

if(page==null||page.equals("")){

page="1";

}

PageBean pageBean=new PageBean(Integer.parseInt(page), 15);

Map pmap=new HashMap();

pmap.put("pageno", pageBean.getStart());

pmap.put("pageSize", 15);

Map bmap=new HashMap();

Map cmap=new HashMap();

/*pmap.put("uid", ((Users)session.getAttribute("user")).getId());

bmap.put("uid", ((Users)session.getAttribute("user")).getId());*/

if(username==null||username.equals("")){pmap.put("username", null);cmap.put("username", null);}else{pmap.put("username", username);cmap.put("username", username);}

if(pwd==null||pwd.equals("")){pmap.put("pwd", null);cmap.put("pwd", null);}else{pmap.put("pwd", pwd);cmap.put("pwd", pwd);}

if(cx==null||cx.equals("")){pmap.put("cx", null);cmap.put("cx", null);}else{pmap.put("cx", cx);cmap.put("cx", cx);}

int total=allusersService.getCount(bmap);

pageBean.setTotal(total);

List list=allusersService.getByPage(pmap);

map.put("page", pageBean);

map.put("list", list);

session.setAttribute("p", 1);

return "allusers_list";

}

3.3.2密码修改模块的实现

修改用户密码是将用户的原密码用新密码替换,用户在原密码输入正确的情况下,更新用户信息表中的密码以及确认密码字段,密码修改成功之后页面跳转到密码修改界面,下次登录使用新密码。

密码修改流程图如下所示。

3731cb7f8c3ae5d8cd1938ffe356fe55.jpeg

图3-19密码修改流程图

密码修改关键代码为:

if(ac.equals("uppass"))

{

String olduserpass = request.getParameter("ymm");

String userpass = request.getParameter("xmm1");

String copyuserpass = request.getParameter("xmm2");

HashMap m = dao.getmaps("yonghuming",(String)request.getSession().getAttribute("username"), "yonghuzhuce");

if(!(((String)m.get("mima")).equals(olduserpass)))

{

request.setAttribute("error", "");

go("mod2.jsp", request, response);

}else{

//String id = (String)user.get("id");

String sql = "update yonghuzhuce set mima='"+userpass+"' where yonghuming='"+(String)request.getSession().getAttribute("username")+"'";

dao.commOper(sql);

request.setAttribute("suc", "");

go("mod2.jsp", request, response);

}

}

3.3.3员工管理模块的实现

用户在yuangongxinxi_list查看员工信息,先使用sql语句查询出所有员工表的数据,然后调用PageManager.getPages(url,4,sql, request ),返回一个ArrayList的对象,在for循环里,使用jsp得到每个ArrayList对象的数据,然后放入页面模板中。

用户点击添加员工则跳转至yuangongxinxi_add.jsp,添加员工则将添加的员工数据封装在HashMap,中然后调用action包下Action类的insert方法将员工内容插入员工表中。

员工管理流程图如下所示。

7bbe9042f88c0cb2d64e43285a27e62e.jpeg

图3-21员工管理流程图

员工添加如下图所示:

eb0a402db8a8e25505e4d4a4c8e19401.jpeg

图3-22员工添加

员工查询如下图所示:

7527b0a8468b106e391938bb51fd0c28.jpeg

图3-23员工查询

员工信息添加关键代码为:

@RequestMapping("addYuangongxinxi.do")

public String addYuangongxinxi(HttpServletRequest request,Yuangongxinxiyuangongxinxi,HttpSession session) throws SQLException{

Timestamp time=new Timestamp(System.currentTimeMillis());

yuangongxinxi.setAddtime(time.toString().substring(0, 19));

yuangongxinxiService.add(yuangongxinxi);

session.setAttribute("backxx", "添加成功");

session.setAttribute("backurl", request.getHeader("Referer"));

//session.setAttribute("backurl", "yuangongxinxiList.do");

return "redirect:postback.jsp";

//return "redirect:yuangongxinxiList.do";

}

3.3.4公告管理模块的实现

管理员发布新的公告信息,系统前台显示公告信息,公告信息添加功能主要指对其编号等一些基本信息的添加、删除和修改。公告查询能根据公告编号等多种条件对公告信息进行查询。

公告管理流程图如下所示。

83d24cac0d3077c53b65e5005e419e44.jpeg

图3-24公告管理流程图

公告添加如下图所示:

cc86f744d73d4604a66ddb020dc42a2d.jpeg

图3-25公告添加

公告查询如下图所示:

9d5258a6857570a1d2bfb92a28ff33ad.jpeg

图3-26公告查询

公告信息添加关键代码为:

@RequestMapping("addHuodongxinxi.do")

public String addHuodongxinxi(HttpServletRequest request,Huodongxinxihuodongxinxi,HttpSession session) throws SQLException{

Timestamp time=new Timestamp(System.currentTimeMillis());

huodongxinxi.setAddtime(time.toString().substring(0, 19));

huodongxinxiService.add(huodongxinxi);

session.setAttribute("backxx", "添加成功");

session.setAttribute("backurl", request.getHeader("Referer"));

//session.setAttribute("backurl", "huodongxinxiList.do");

return "redirect:postback.jsp";

//return "redirect:huodongxinxiList.do";

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值