From d74e45ef218e7cced6291d1bc88c5c72e68282e3 Mon Sep 17 00:00:00 2001
From: cloudroam <cloudroam>
Date: 星期二, 07 一月 2025 10:35:48 +0800
Subject: [PATCH] add:配置
---
pages/regular/config-param-group.vue | 64 ++++++++++
pages/regular/config-customer.vue | 92 +++++++++++++++
pages/regular/sys.vue | 20 +++
pages/regular/config-param.vue | 139 +++++++++++++++++++++++
4 files changed, 314 insertions(+), 1 deletions(-)
diff --git a/pages/regular/config-customer.vue b/pages/regular/config-customer.vue
new file mode 100644
index 0000000..7bba8e4
--- /dev/null
+++ b/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>
diff --git a/pages/regular/config-param-group.vue b/pages/regular/config-param-group.vue
new file mode 100644
index 0000000..fa12bca
--- /dev/null
+++ b/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>
diff --git a/pages/regular/config-param.vue b/pages/regular/config-param.vue
new file mode 100644
index 0000000..012f51c
--- /dev/null
+++ b/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>
diff --git a/pages/regular/sys.vue b/pages/regular/sys.vue
index 6c79517..47b35bb 100644
--- a/pages/regular/sys.vue
+++ b/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>
--
Gitblit v1.9.3