jeecgboot 字典编码前后端配置

JeecgBoot 是一个基于代码生成器的开发框架，可以快速搭建后台管理系统。如果要使用字典编码功能，需要进行前后端配置。

1. 后端配置

首先，需要在数据库中创建字典表，例如：

CREATE TABLE sys_dict (
  id varchar(36) NOT NULL COMMENT '主键',
  dict_code varchar(100) NOT NULL COMMENT '字典编码',
  dict_name varchar(100) NOT NULL COMMENT '字典名称',
  dict_type varchar(10) NOT NULL COMMENT '字典类型',
  description varchar(200) DEFAULT NULL COMMENT '描述',
  create_time datetime DEFAULT NULL COMMENT '创建时间',
  update_time datetime DEFAULT NULL COMMENT '更新时间',
  PRIMARY KEY (id)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='系统字典表';

然后，需要在后端代码中进行配置。在 `SysDictController` 类中，添加以下代码：

@ApiOperation(value = "查询字典数据", notes = "根据字典类型查询字典数据")
@GetMapping(value = "/getDictItems/{dictType}")
public Result<List<SysDictItemVO>> getDictItems(@PathVariable String dictType) {
    List<SysDictItemVO> dictItems = sysDictService.queryDictItemsByDictType(dictType);
    return Result.ok(dictItems);
}

这段代码会根据字典类型查询字典数据，并返回一个包含字典项的列表。

2. 前端配置

在前端代码中，需要进行如下配置：

首先，在 `src/api` 目录下创建 `dict.js` 文件，添加以下代码：

import request from '@/utils/request'

export function getDictItems(dictType) {
  return request({
    url: '/sys/dict/getDictItems/' + dictType,
    method: 'get'
  })
}

这段代码会调用后端接口，获取字典项列表。

然后，在需要使用字典编码的组件中，例如表单中的下拉框，添加如下代码：

<el-select v-model="form.dictCode">
  <el-option v-for="item in dictItems" :key="item.dictCode" :label="item.dictName" :value="item.dictCode"></el-option>
</el-select>

这段代码会绑定一个 `dictItems` 数组，其中包含了字典项列表。在组件初始化时，需要调用 `getDictItems` 方法获取字典项，并将返回结果赋值给 `dictItems` 数组：

import { getDictItems } from '@/api/dict'

export default {
  data() {
    return {
      dictItems: [],
      form: {
        dictCode: ''
      }
    }
  },
  created() {
    getDictItems('dict_type').then(response => {
      this.dictItems = response.data
    })
  }
}

这段代码会在组件创建时调用 `getDictItems` 方法，并将结果赋值给 `dictItems` 数组。其中，`dict_type` 是字典类型编码，可以根据实际情况修改。