来访~193884 文章~82 评论~21
2024年6月24日 作者 张临志

jeecgboot Vue3数据字典将配置的颜色应用到_dictText列表显示中

jeecgboot框架开发组一如既往的偷懒,数据字典可以配置颜色,但是颜色任何位置也没有用到,现改造后端

org.jeecg.common.aspect.annotation.Dict的33行添加String dicColor() default "";
org.jeecg.common.aspect.DictAspect的195行添加String colorValue = this.translDictColor(dictModels, value);
206行添加record.put(field.getName() + CommonConstant.DICT_COLOR_SUFFIX, colorValue);
270行添加String colorString = String.format("sys:cache:dict::%s:%s:%s", dictCode, data, "color");
274行添加String color = oConvertUtils.getString(redisTemplate.opsForValue().get(colorString));
276行修改list.add(new DictModel(data, text, color));
318行添加String redisColorKey = String.format("sys:cache:dictTable::SimpleKey [%s,%s,%s]", dictCode, dict.getValue(),"color");
323行添加redisTemplate.opsForValue().set(redisColorKey, dict.getColor(), 300, TimeUnit.SECONDS);
356行添加
redisKey = String.format("sys:cache:dict::%s:%s:%s", dictCode, dict.getValue(),"color");
try {
    redisTemplate.opsForValue().set(redisKey, dict.getColor());
} catch (Exception e) {
    log.warn(e.getMessage(), e);
}
393行添加
private String translDictColor(List<DictModel> dictModels, String values) {
    List<String> result = new ArrayList<>();

    // 允许多个逗号分隔,允许传数组对象
    String[] splitVal = values.split(",");
    for (String val : splitVal) {
        String dictText = val;
        for (DictModel dict : dictModels) {
            if (val.equals(dict.getValue())) {
                dictText = dict.getColor();
                break;
            }
        }
        result.add(dictText);
    }
    return String.join(",", result);
}
org.jeecg.modules.system.service.impl的207行修改dictItemList.add(new DictModel(dict.getValue(), dict.getText(), dict.getColor()));
上述后端修改是redis存储中添加颜色相关的数据,后端查询列表数据加载时不仅会有_dictText,还会新增_dictColor字段。
前端data.ts需引用
import { ref, h } from 'vue';
import { Tag } from 'ant-design-vue';
对应字典字段增加 
customRender:function (text) {
// @ts-ignore
return h(Tag, { color: text.record[text.column.dataIndex.toString().replace("dictText","dictColor")] }, text.value)
}
这样就可以使用tag标签灵活使用字典配置的颜色显示相应数据。