前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >黑马瑞吉外卖之新增员工

黑马瑞吉外卖之新增员工

作者头像
兰舟千帆
发布2022-08-03 18:22:16
3320
发布2022-08-03 18:22:16
举报

上一篇主要进行了员工信息的分页查询的功能完善,下面我们就可以实现一个员工的添加功能。 所以这里做的还是后台管理的功能。其实可以先看一个前端传过来的请求,先不用启动程序,直接打开页面先看一下。

当我们点击这个添加按钮的时候,我们可以捕捉到这些信息,图片的资源数据和一个html。

在这里插入图片描述
在这里插入图片描述

打开看一下。

在这里插入图片描述
在这里插入图片描述

那我们就到这个页面去看。这样我们可以很快找到这个页面、

在这里插入图片描述
在这里插入图片描述

打开的话其实是这样的一个表单

在这里插入图片描述
在这里插入图片描述

分析一个这个页面做了那些事情。首先调到这个页面肯定是是有一个表单的展示。像这样的部分都是一个展示框,要填写新增的信息的。然后呢!一定有一个保存的按钮,保存的按钮绑定到具体的方法,然后在这个方法里面我们就可以找到我们去具体处理数据的逻辑。

在这里插入图片描述
在这里插入图片描述

其实一定还会有一个取消的按钮,就是取消添加信息了,那么这个时候就会进行一个回退。我们去找找保存和回退的按钮。可以看到下面这里,其实还有一个保存和继续添加,很好理解

在这里插入图片描述
在这里插入图片描述

我们往下面看,下面会有具体的绑定的方法。这里是我们具体的保存的方法逻辑。这个方法还做了一些表单的验证。方法中嵌套着另一个方法,addEmployee。

在这里插入图片描述
在这里插入图片描述

我们点进去看这个链接。你看这里其实调到了一个js。在这里我们可以看到具体的提交路径,参数params是我们的提交的参数。这个参数是ruleForm。ruleForm是上方页面的数据绑定,里面就是我们员工的信息,这里的知识点就是vue的数据模型的双向绑定。我们在表单上进行的数据修改或者添加也会同步到我们的数据模型,所以我们实际上就是将自己填写的用户数据进行了一个分账类型的提交。没错,就是json类型的。

在这里插入图片描述
在这里插入图片描述

这里是回退,回退到我们原来的链接

在这里插入图片描述
在这里插入图片描述

所以在整个逻辑理清后,这里就是我们最终要取到的前端请求路径以及请求参数和提交方式。。

在这里插入图片描述
在这里插入图片描述

现在我们就可以写后端代码了。 其实还是在这个Controller类里面,这里的路径已经写上了一个employee

在这里插入图片描述
在这里插入图片描述

所以我们在这里写方法就行了。其他的类的准备我们在上一篇文章都已经准备好了. 那么现在我们开始写方法,方法的话真的很简单,只是需要注意一些细节,但是我认为这里面还是有我们去巩固学习的知识点。

来看,接收参数自然是没有问题的,我们用employee这个实体类去接收。

这个实体类有哪些字段呢?其实我们之前都看过,但是表单自然是不会去展示密码的,以及像修改时间,修改者这些等等,密码我们做成糊另外的处理,其他的其实属于我们上文提到的公共字段,所以我们让它自动填充了。

在这里插入图片描述
在这里插入图片描述
代码语言:javascript
复制
@PostMapping
    public R_<String>save(HttpServletRequest request ,@RequestBody  Employee employee)
    {
        log.info("新增员工,员工信息:{}",employee.toString());
//        设置初始密码123456,然后进行md5加密处理
        employee.setPassword(DigestUtils.md5DigestAsHex("123456".getBytes()));
//        employee.setCreateTime(LocalDateTime.now());
//        employee.setUpdateTime(LocalDateTime.now());
//      获得登录用户的id
//        long empid = (long)request.getSession().getAttribute("employee");
//        employee.setCreateUser(empid);
//        employee.setUpdateUser(empid);
        employService.save(employee);
        return  R_.success("新增员工成功");

    }

这里我们对密码进行了一个md5加密,其实的话自己也可以去处理的,这里其实考虑到只要一个超级管理员吧,所以初始密码之后就进行md5加密了。 系统是把用户输入的密码计算成MD5值

代码语言:javascript
复制
  //字符串密码md5加密
  String md5Pass = DigestUtils.md5DigestAsHex(password.getBytes());
在这里插入图片描述
在这里插入图片描述

这个工具类依赖什么呢?就是这个依赖。依赖于这个依赖。

在这里插入图片描述
在这里插入图片描述

所以我们在使用工具和依赖的时候必须明白它到底是干嘛的。

最后调用了一个save方法,这个是mybatisplus的保存的一个方法。 如果进行insert操作的时候,不进行id的设置,也不传入id,这时它会给你自动添加一个id值,最奇怪的是这个id值默认好像是使用雪花算法生成的。其实我这里还在配置这里设置了主键的生成策略。雪花算法,

在这里插入图片描述
在这里插入图片描述

如果你想要主键比较整齐的话,可以采用自增策略。

在这里插入图片描述
在这里插入图片描述

我们最终的方法返回是R_类型,里面的泛型是String类型。

在这里插入图片描述
在这里插入图片描述

R_类的封装。

在这里插入图片描述
在这里插入图片描述

然后前端,所以我们后端返回什么样的数据一定程度上取决于前端的需求。

在这里插入图片描述
在这里插入图片描述

这样的分析基本就是一个闭环的分析,理清整个逻辑。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2022-07-25,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档