表设计
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsICM38FdsYkRGZkRG9lcvx2bjxiNx8VZ6l2cs0TPB1UMVpWTwcGVNBDOsJGcohVYsR2MMBjVtJWd0ckW65UbM5WOHJWa5kHT20ESjBjUIF2X0hXZ0xCMx81dvRWYoNHLrdEZwZ1Rh5WNXp1bwNjW1ZUba9VZwlHdssmch1mclRXY39CXldWYtlWPzNXZj9mcw1ycz9WL49zZuBnL0UDO5ADNzATM0IDOwEjMwIzLc52YucWbp5GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.png)
字典列表页面加载
前端页面:ruoyi-ui/src/views/system/dict/index.vue
该页面加载时,调用的方法为
getList -----> http://localhost:8080/system/dict/type/list?pageNum=1&pageSize=10
后台方法 :com.ruoyi.web.controller.system.SysDictTypeController#list
getDicts-----> http://localhost:8080/system/dict/data/type/sys_normal_disable
后台方法:com.ruoyi.web.controller.system.SysDictDataController#dictType
界面渲染逻辑:getList 查询的表为sys_dict_type,获取字典类型列表信息。getDicts查询的表为sys_dict_data,获取的是字典类型为sys_normal_disable数据(状态:0正常,1停用)。将字典类型状态1替换为停用,0替换为正常
字典数据页面加载
前端页面:(ruoyi-ui/src/views/system/dict/data.vue)
在字典列表页面,点击字典类型为sys_user_sex的链接,进入到字典数据页面。
该页面加载时调用的方法为
getType
对应的后台方法为com.ruoyi.web.controller.system.SysDictTypeController#getInfo, 通过字典类型的id,查询sys_dict_type表获取字典类型信息。如性别字典类型详情。
this.getList
getType请求完成后,会回调this.getList函数,再次发起请求。getList调用的是getDicts方法。
getDicts对应的后台方法为com.ruoyi.web.controller.system.SysDictDataController#dictType
通过字典类型查询sys_dict_data表获取字典数据。(字典类型已经通过getType获取到了)
listType
后台方法:com.ruoyi.web.controller.system.SysDictTypeController#list
查询该表的所有数据sys_dict_type,(用于字典名称查询使用)
this.getDicts("sys_normal_disable")
后台方法: com.ruoyi.web.controller.system.SysDictDataController#dictType
通过字典类型sys_normal_disable查询sys_dict_data表后去,字典数据。
渲染逻辑:通过字典id,获取到字典类型信息,再通过字典类型在字典数据表中获取数据。获取到的字典数据的状态字段为0和1。使用获取到的状态信息数据,将1替换为停用,0替换为正常。