add:配置

cloudroam

2025-01-07 d74e45ef218e7cced6291d1bc88c5c72e68282e3

add:配置

 pages/regular/config-customer.vue

对比新文件
@@ -0,0 +1,92 @@
<template>
  <el-bus-crud v-bind="tableConfig"/>
</template>

<script>
export default {
  data() {
    return {
      tableConfig: {
        url: 'flower/api/configCustomer/list',
        newUrl: 'flower/api/configCustomer/new',
        editUrl: 'flower/api/configCustomer/edit',
        deleteUrl: 'flower/api/configCustomer/delete',
        columns: [
          {label: '序号', type: 'index'},
          {label: '名称', prop: 'name'},
          {label: '描述', prop: 'description'},
          {label: '图标内容', prop: 'iconContent'},
          {
            label: '图标地址',
            formatter: (row) =>
              row.iconUrl ? (
                <el-bus-image
                  src={row.iconUrl}
                  lazy={true}
                  style="width:50px;height:50px"
                ></el-bus-image>
              ) : null,
          },
          {label: '微信号', prop: 'weixin'},
        ],

        searchForm: [
          {
            type: 'row',
            items: [{label: '等级名称：', id: 'name', type: 'input'}],
          },
        ],
        form: [
          {
            label: '名称：',
            id: 'name',
            type: 'input',
            rules: {required: true, message: '请输入客服名称'},
          },
          {
            label: '描述：',
            id: 'description',
            type: 'input',
            rules: {required: true, message: '请输入客服描述'},
          },
          {
            label: '图标内容：',
            id: 'iconContent',
            type: 'input',
            rules: {required: true, message: '请输入客服图标内容'},
          },
          {
            label: '背景图片：',
            id: 'iconUrl',
            type: 'bus-upload',
            el: {
              listType: 'picture-card',
              limit: 1,
              limitSize: 2,
              tipText: '大小不超过2M',
              valueType: 'string',
            },
            forceDisabled: true,
            rules: {
              required: true,
              message: '请上传背景图片',
              trigger: 'blur',
            },
          },
          {
            label: '微信号',
            id: 'weixin',
            type: 'input',
            rules: {required: true, message: '请输入客服关联微信号'},
          },
        ],
      },
    }
  },
  head() {
    return {
      title: '客服电话',
    }
  },
}
</script>

 pages/regular/config-param-group.vue

对比新文件
@@ -0,0 +1,64 @@
<template>
  <el-bus-crud v-bind="tableConfig"/>
</template>

<script>
export default {
  data() {
    return {
      tableConfig: {
        url: 'flower/v2/config-param-group/group/list',
        newUrl: 'flower/v2/config-param-group/new',
        editUrl: 'flower/v2/config-param-group/edit',
        deleteUrl: 'flower/v2/config-param-group/delete',
        columns: [
          {label: '序号', type: 'index'},
          {label: '变量分组', prop: 'paramGroup'},
          {label: '变量分组名', prop: 'paramGroupName'},
          {label: '变量排序号', prop: 'paramOrder'},
        ],

        searchForm: [
          {
            type: 'row',
            items: [
              {label: '变量分组名：', id: 'paramGroupName', type: 'input'}],
          },
        ],
        form: [
          {
            label: '变量分组：',
            id: 'paramGroup',
            type: 'input',
            rules: {
              required: true,
              pattern: /^[a-z]+$/,
              message: '请输入变量分组，只允许小写英文字母'
            },
          },
          {
            label: '变量分组名：',
            id: 'paramGroupName',
            type: 'input',
            rules: {required: true, message: '请输入变量分组名'},
          },
          {
            label: '变量排序号：',
            id: 'paramOrder',
            type: 'input',
            rules: {
              required: true,
              pattern: /^\d+$/,
              message: '请输入变量排序号，只允许非负整数'},
          },
        ],
      },
    }
  },
  head() {
    return {
      title: '配置系统参数组',
    }
  },
}
</script>

 pages/regular/config-param.vue

对比新文件
@@ -0,0 +1,139 @@
<template>
  <el-bus-crud v-bind="tableConfig"/>
</template>

<script>
export default {
  data() {
    return {
      tableConfig: {
        url: 'flower/v2/config-param/config/list',
        newUrl: 'flower/v2/config-param/new',
        editUrl: 'flower/v2/config-param/edit',
        deleteUrl: 'flower/v2/config-param/delete',
        columns: [
          {label: '序号', type: 'index'},
          {label: '变量分组名', prop: 'paramGroupName'},
          {label: '变量名', prop: 'paramName'},
          {label: '变量键', prop: 'paramKey'},
          {label: '变量值', prop: 'paramValue'},
          {label: '变量规则', prop: 'paramPlaceholder'},
          {label: '变量提示', prop: 'paramTip'},
          {label: '变量排序号', prop: 'paramOrder'},
          {label: '变量值类型', prop: 'paramValueType'},
          {label: '变量字典', prop: 'paramDict'},
          {label: '控件类型', prop: 'paramControlType'},
          {label: '是否是必填', prop: 'paramRequire'},
          {label: '参数限制数量', prop: 'paramLimit'},
        ],

        searchForm: [
          {
            type: 'row',
            items: [{label: '变量分组：', id: 'paramGroup', type: 'input'},
              {label: '变量分组名：', id: 'paramGroupName', type: 'input'}],
          },
        ],
        form: [
          {
            label: '变量分组名：',
            id: 'paramGroupId',
            type: 'bus-select',
            el: {
              interfaceUri: 'flower/v2/config-param-group/group/list',
              props: {
                label: 'paramGroupName',
                value: 'id',
                dataPath: 'records',
              },
              extraQuery: {
                current: 1,
                size: 2000,
              },
              filterable: true,
              style: 'width:100%',
            },
            rules: { required: true, message: '请选择变量分组' },
          },
          {
            label: '变量名：',
            id: 'paramName',
            type: 'input',
            rules: {required: true, message: '请输入变量名'},
          },
          {
            label: '变量键',
            id: 'paramKey',
            type: 'input',
            rules: {required: true, message: '请输入变量键'},
          },
          {
            label: '变量值',
            id: 'paramValue',
            type: 'input',
            rules: {required: true, message: '请输入变量值'},
          },
          {
            label: '变量规则',
            id: 'paramPlaceholder',
            type: 'input',
            rules: {required: true, message: '请输入变量规则'},
          },{
            label: '变量提示',
            id: 'paramTip',
            type: 'input',
            rules: {required: true, message: '请输入变量提示'},
          },
          {
            label: '变量排序号',
            id: 'paramOrder',
            type: 'input',
            rules: {
              required: true,
              pattern: /^\d+$/,
              message: '请输入变量排序号，只允许非负整数'},
          },
          {
            label: '变量值类型',
            id: 'paramValueType',
            type: 'input',
          },{
            label: '变量字典',
            id: 'paramDict',
            type: 'input',
          },
          {
            label: '控件类型',
            id: 'paramControlType',
            type: 'input',
            rules: {required: true, message: '请输入控件类型'},
          },
          {
            label: '是否是必填',
            id: 'paramRequire',
            type: 'bus-select-dict',
            el: {
              code: 'IS_REQUIRED',
              style: 'width:100%',
            },
            rules: {required: true, message: '请输入是否是必填'},
          },
          {
            label: '参数限制数量',
            id: 'paramLimit',
            type: 'input',
            rules: {required: true, message: '请输入参数限制数量'},
          },


        ],
      },
    }
  },
  head() {
    return {
      title: '配置系统参数',
    }
  },
}
</script>

 pages/regular/sys.vue

@@ -22,12 +22,24 @@

                            <el-upload v-if="param.paramControlType === 'image'" :action="uploadUrl"
                                list-type="picture-card" :file-list="formModels[item.id][param.paramKey]"
                                :limit="param.paramLimit" 
                                :limit="param.paramLimit"
                                :on-preview="handlePictureCardPreview"
                                :on-remove="(file) => handleRemove(file, param)"
                                :on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList, param)">
                                <i class="el-icon-plus"></i>
                            </el-upload>
                          <el-switch v-if="param.paramControlType === 'switch'" v-model="formModels[item.id][param.paramKey]"
                                     active-text="启用" inactive-text="禁用"></el-switch>
                          <el-radio-group v-if="param.paramControlType === 'radio'"
                                          v-model="formModels[item.id][param.paramValue]">
                            <el-radio v-for="option in dictOptions[param.paramDict]" :key="option.value"
                                      :label="option.value">
                              {{ option.label }}
                            </el-radio>
                          </el-radio-group>
                          <el-checkbox-group v-if="param.paramControlType === 'checkbox'" v-model="formModels[item.id][param.paramKey]">
                            <el-checkbox v-for="option in dictOptions[param.paramDict]" :key="option.value" :label="option.value">{{ option.label }}</el-checkbox>
                          </el-checkbox-group>
                        </el-form-item>

                        <el-form-item v-if="item.paramList && item.paramList.length > 0">
@@ -64,6 +76,7 @@
            formModels: {}, // 存储每个 tab 的 formModel
            srcFormModels: {}, // 原始表单数据
            formRules: {}, // 存储每个 tab 的 formRules
            dictOptions: [], // 存储字典选项
        };
    },

@@ -73,6 +86,7 @@
    },
    async mounted() {
        await this.getConfigParamGroup();
        await this.getDictOptions(); // 获取字典选项
    },

    methods: {
@@ -334,6 +348,10 @@
            this.activeName = this.tabList[index]?.paramGroup

        },
      getDictOptions() {
        // 模拟 API 调用获取字典选项
        this.dictOptions = { radioDict: [{ value: '1', label: 'Option 1' }, { value: '2', label: 'Option 2' }] };
      },
    },
};
</script>