当前位置: 首页 > article >正文

5.人员管理模块(以及解决运行Bug)——帝可得管理系统

目录

  • 前言
  • 一、页面修改
    • 表单展示修改
  • 二、新增对话框修改
  • 三、修改对话框修改
    • 修改时展示创建时间
  • 四、解决页面展示错误
  • 五 、 解决【java.lang.NullPointerException: null】 Bug

前言

提示:本篇完成人员管理模块的开发,具体需求、修改代码的路径和最终效果不展示了,可参考文章
4.人员管理模块(开始预备工作)——帝可得管理系统

一、页面修改

表单展示修改

    <el-table v-loading="loading" :data="empList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="序号" type="index" width="50" align="center" prop="id" />
      <el-table-column label="人员名称" align="center" prop="userName" />
      <el-table-column label="归属区域" align="center" prop="regionName" />
      <el-table-column label="角色名称" align="center" prop="roleName" />
      <el-table-column label="联系电话" align="center" prop="mobile" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
          <el-button link type="primary"  @click="handleUpdate(scope.row)" v-hasPermi="['manage:emp:edit']">修改</el-button>
          <el-button link type="primary"  @click="handleDelete(scope.row)" v-hasPermi="['manage:emp:remove']">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

二、新增对话框修改

将角色与负责区域改为下拉框

  <el-dialog :title="title" v-model="open" width="500px" append-to-body>
      <el-form ref="empRef" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="人员名称" prop="userName">
          <el-input v-model="form.userName" placeholder="请输入人员名称" />
        </el-form-item>
        <el-form-item label="角色" prop="roleId">
          <!-- <el-input v-model="form.roleId" placeholder="请输入角色id" /> -->
           <el-select v-model="form.roleId" placeholder="请选择角色">
            <el-option
              v-for="item in roleList"
              :key="item.roleId"
              :label="item.roleName"
              :value="item.roleId"
            />
           </el-select>
        </el-form-item>
        <el-form-item label="联系电话" prop="mobile">
          <el-input v-model="form.mobile" placeholder="请输入联系电话" />
        </el-form-item>
        <el-form-item label="创建时间" prop="mobile" v-if="form.id!=null">
          {{form.createTime}}
        </el-form-item>
        <el-form-item label="负责区域" prop="regionId">
          <!-- <el-input v-model="form.regionId" placeholder="请输入所属区域Id" /> -->
           <el-select v-model="form.regionId" placeholder="请选择负责区域">
            <el-option
              v-for="item in regionList"
              :key="item.id"
              :label="item.regionName"
              :value="item.id"
            />
           </el-select>
        </el-form-item>
        <el-form-item label="员工头像" prop="image">
          <image-upload v-model="form.image"/>
        </el-form-item>
        <el-form-item label="是否启用" prop="status">
          <el-radio-group v-model="form.status">
            <el-radio
              v-for="dict in emp_status"
              :key="dict.value"
              :label="parseInt(dict.value)"
            >{{dict.label}}</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </template>
    </el-dialog>
import{listRole} from "@/api/manage/role";
import{loadAllParams} from "@/api/page";
import{listRegion} from "@/api/manage/region";
/* 查询区域列表 */
const regionList=ref([]);
function getRegionList() {
  listRegion(loadAllParams).then(response => {
    regionList.value = response.rows;
  });
  /* 查询角色列表 */
const roleList=ref([]);
function getRoleList() {
  listRole(loadAllParams).then(response => {
    roleList.value = response.rows;
  });
}
}

三、修改对话框修改

修改时展示创建时间

  <el-dialog :title="title" v-model="open" width="500px" append-to-body>
      <el-form ref="empRef" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="人员名称" prop="userName">
          <el-input v-model="form.userName" placeholder="请输入人员名称" />
        </el-form-item>
        <el-form-item label="角色" prop="roleId">
          <!-- <el-input v-model="form.roleId" placeholder="请输入角色id" /> -->
           <el-select v-model="form.roleId" placeholder="请选择角色">
            <el-option
              v-for="item in roleList"
              :key="item.roleId"
              :label="item.roleName"
              :value="item.roleId"
            />
           </el-select>
        </el-form-item>
        <el-form-item label="联系电话" prop="mobile">
          <el-input v-model="form.mobile" placeholder="请输入联系电话" />
        </el-form-item>
        <el-form-item label="创建时间" prop="mobile" v-if="form.id!=null">
          {{form.createTime}}
        </el-form-item>
        <el-form-item label="负责区域" prop="regionId">
          <!-- <el-input v-model="form.regionId" placeholder="请输入所属区域Id" /> -->
           <el-select v-model="form.regionId" placeholder="请选择负责区域">
            <el-option
              v-for="item in regionList"
              :key="item.id"
              :label="item.regionName"
              :value="item.id"
            />
           </el-select>
        </el-form-item>
        <el-form-item label="员工头像" prop="image">
          <image-upload v-model="form.image"/>
        </el-form-item>
        <el-form-item label="是否启用" prop="status">
          <el-radio-group v-model="form.status">
            <el-radio
              v-for="dict in emp_status"
              :key="dict.value"
              :label="parseInt(dict.value)"
            >{{dict.label}}</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </template>
    </el-dialog>

四、解决页面展示错误

添加时归属区域、角色名称为空:
在这里插入图片描述
具体代码修改参考文档:参考

五 、 解决【java.lang.NullPointerException: null】 Bug

  1. 当我修改人员管理信息时:前端显示如下信息;当F12后,响应显示500的错误;
    ![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/53b42872345c4df2a0f0894d53b0d579.png

且后端服务器报错:

java.lang.NullPointerException: null 
at com.dkd.manage.service.impl.EmpServiceImpl.updateEmp(EmpServiceImpl.java:82) 
at com.dkd.manage.controller.EmpController.edit(EmpController.java:85)
at com.dkd.manage.controller.EmpController$$FastClassBySpringCGLIB$$90f7e0dd.invoke(<generated>)
at org.springframework.cglib.proxy.MethodProxy.invoke(MethodProxy.java:218) 
at org.springframework.aop.framework.CglibAopProxy$CglibMethodInvocation.invokeJoinpoint(CglibAopProxy.java:792)...
...

错误显示了空指针异常:

java.lang.NullPointerException: null
at com.dkd.manage.service.impl.EmpServiceImpl.updateEmp(EmpServiceImpl.java:82)

  • 不清楚为什么?难道是前端修改后的数据没有传过来,于是打了断点,运行后:发现数据已经传到了后端,也就是前端没问题。
    在这里插入图片描述
  • 那么既然错误显示EmpServiceImpl.updateEmp有问题,就看代码,代码没什么问题。
  • 那是什么问题呢?它说roleMapper.selectRoleByRoleId(emp.getRoleId()); 处异常,且指明了是roleMapper是空指针?那就是说没有没有这个对象;
  • 好,往上翻,难道是没有注入,最终看了一下代码:
    @Autowired
    private EmpMapper empMapper;
    private RegionMapper regionMapper;
    private RoleMapper roleMapper;

好家伙,RegionMapper、RoleMapper并没有注入;

修改代码:

    @Autowired
    private EmpMapper empMapper;
    @Autowired
    private RegionMapper regionMapper;
    @Autowired
    private RoleMapper roleMapper;

重启后再次修改,修改成功。


http://www.kler.cn/news/336695.html

相关文章:

  • 谱减法和维纳滤波的关系
  • SpringCloud学习记录|day1
  • Cocos_鼠标滚轮放缩地图
  • [运维]6.github 本地powershell登录及设置ssh连接
  • Golang 进阶4—— 网络编程
  • ASK, PSK, FSK, DPSK
  • 代码随想录--字符串--重复的子字符串
  • 今日指数day8实战补充(上)
  • Git 下载及安装超详教程(2024)
  • 算法专题四: 前缀和
  • 关于PyCharm【常见问题、解决方案等】
  • 磁盘存储、B树、B+树
  • 路由器的工作机制
  • helm 测试升级与回滚
  • 重学SpringBoot3-集成Redis(六)之消息队列
  • 解决 OpenCloudOS 中 yum 安装 yum-utils 命令报错的问题
  • RK3568笔记六十四:SG90驱动测试
  • Linux复习--Linux服务管理类(SSH服务、DHCP+FTP、DNS服务、Apache服务、Nginx服务、HTTP状态码)
  • D - Connect the Dots Codeforces Round 976 (Div. 2)
  • 基于SSM的高校勤工助学管理系统的设计与实现(源码+定制+参考文档)