Browse Source

优化系统配置下拉框,radio等组件

wangwei 4 years ago
parent
commit
23b82e3a76

+ 13 - 0
src/api/sys/general.ts

@@ -5,12 +5,15 @@ import {
   AddConfigInfoParams,
   // EditConfigInfoParams,
   DeleteConfigInfoParams,
+  ConfigNameParams,
+  configNameExistModel,
 } from './model/generalModel';
 
 enum Api {
   GroupUrl = 'general/group/', // 系统配置分组
   ConfigUrl = 'general/config/', // 系统配置表
   FileUrl = 'general/file/', // 上传文件
+  ConfigNameExistUrl = 'general/exist', // 检测变量名是否已经存在
 }
 
 /**
@@ -59,6 +62,16 @@ export function deleteConfigInfo(params: DeleteConfigInfoParams) {
   return defHttp.request<CommonRowModel>({
     url: Api.ConfigUrl + params.id,
     method: 'DELETE',
+  });
+}
+
+/**
+ * @description: 检测变量名是否已经存在
+ */
+export function configNameExist(params: ConfigNameParams) {
+  return defHttp.request<configNameExistModel>({
+    url: Api.ConfigNameExistUrl,
+    method: 'POST',
     params,
   });
 }

+ 14 - 0
src/api/sys/model/generalModel.ts

@@ -13,6 +13,13 @@ export interface GroupModel {
 }
 
 /**
+ * @description: Get group information return value
+ */
+export interface configNameExistModel {
+  bool: boolean;
+}
+
+/**
  * @description: 添加系统配置参数
  */
 export interface AddConfigInfoParams {
@@ -38,3 +45,10 @@ export interface AddConfigInfoParams {
 export interface DeleteConfigInfoParams {
   id: number;
 }
+
+/**
+ * @description: 系统配置变量名参数
+ */
+export interface ConfigNameParams {
+  name: string;
+}

+ 0 - 1
src/views/general/config/customComponents/Input.vue

@@ -40,7 +40,6 @@
         reactData.tip = '';
         if (props.rules && props.rules[0]) {
           const res = validateType(props.rules, e.target.value);
-          console.log(`res`, res);
           reactData.error = res.errMsg;
         }
       }

+ 1 - 0
src/views/general/config/customComponents/TimePicker.vue

@@ -36,6 +36,7 @@
       }
 
       function onChange(val) {
+        console.log(`val`, val);
         emit('change', val);
       }
       return {

+ 51 - 35
src/views/general/config/data.ts

@@ -12,6 +12,7 @@ import Radio from './customComponents/Radio.vue';
 import DatePicker from './customComponents/DatePicker.vue';
 import TimePicker from './customComponents/TimePicker.vue';
 import Switch from './customComponents/Switch.vue';
+import { configNameExist } from '/@/api/sys/general';
 
 export const columns: BasicColumn[] = [
   {
@@ -29,7 +30,6 @@ export const columns: BasicColumn[] = [
       switch (record.type) {
         case 'string':
           const onchange = (val) => {
-            console.log(val);
             record.value = val;
           };
           return h(Input, {
@@ -53,35 +53,30 @@ export const columns: BasicColumn[] = [
             onChange: onNumberChange,
           });
         case 'select':
+          console.log(`record`, record);
           const onSelectChange = (val) => {
-            record.value = [val.toString()];
+            record.value = val;
           };
-          const opt: object[] = [];
-          record.content.map((item, index) => {
-            if (index) {
-              opt.push({ label: item, value: index });
-            }
-          });
           return h(Select, {
-            value: opt[record.value[0] - 1]['label'],
-            options: opt,
+            value: record.value,
+            options: record.content,
             tip: record.tip,
             mode: 'SECRET_COMBOBOX_MODE_DO_NOT_USE',
             placeholder: '没有选中任何项',
             onChange: onSelectChange,
           });
-        case 'MultipleSelect':
+        case 'selects':
           const onMultipleChange = (val) => {
             record.value = val;
           };
           return h(MultipleSelect, {
             value: record.value,
-            options: record.option,
+            options: record.content,
             tip: record.tip,
             placeholder: '没有选中任何项',
             onChange: onMultipleChange,
           });
-        case 'DatePicker':
+        case 'date':
           const onDatePickerChange = (val) => {
             record.value = val;
           };
@@ -91,7 +86,7 @@ export const columns: BasicColumn[] = [
             tip: record.tip,
             onChange: onDatePickerChange,
           });
-        case 'TimePicker':
+        case 'time':
           const onTimePickerChange = (val) => {
             record.value = val;
           };
@@ -103,7 +98,6 @@ export const columns: BasicColumn[] = [
           });
         case 'text':
           const onTextAreaChange = (val) => {
-            console.log(val);
             record.value = val;
           };
           return h(InputTextArea, {
@@ -114,7 +108,7 @@ export const columns: BasicColumn[] = [
             style: { width: '100%' },
             onChange: onTextAreaChange,
           });
-        case 'Switch':
+        case 'switch':
           const onSwitchChange = (val) => {
             record.value = val;
           };
@@ -123,24 +117,23 @@ export const columns: BasicColumn[] = [
             tip: record.tip,
             onChange: onSwitchChange,
           });
-        case 'Checkbox':
+        case 'checkbox':
           const onCheckboxChange = (val) => {
-            console.log(val);
             record.value = val;
           };
           return h(Checkbox, {
             value: record.value,
-            options: record.option,
+            options: record.content,
             tip: record.tip,
             onChange: onCheckboxChange,
           });
-        case 'Radio':
+        case 'radio':
           const onRadioChange = (val) => {
             record.value = val;
           };
           return h(Radio, {
             value: record.value,
-            options: record.option,
+            options: record.content,
             tip: record.tip,
             onChange: onRadioChange,
           });
@@ -150,7 +143,7 @@ export const columns: BasicColumn[] = [
           };
           return h(ArrayCom, {
             value: record.value,
-            // options: record.option,
+            // options: record.content,
             // style: { width: '65%' },
             onChange: onArrayChange,
           });
@@ -194,19 +187,19 @@ export const schemas: FormSchema[] = [
         },
         {
           label: '日期',
-          value: 'time',
+          value: 'date',
         },
         {
-          label: '日期时间',
-          value: 'Datetime',
+          label: '时间',
+          value: 'time',
         },
         {
           label: '列表',
-          value: 'list',
+          value: 'select',
         },
         {
           label: '列表多选',
-          value: 'mutipleList',
+          value: 'selects',
         },
         {
           label: '图片',
@@ -222,7 +215,7 @@ export const schemas: FormSchema[] = [
         },
         {
           label: '文件(多)',
-          value: 'MutipleFile',
+          value: 'multipleFile',
         },
         {
           label: '开关',
@@ -230,18 +223,18 @@ export const schemas: FormSchema[] = [
         },
         {
           label: '复选',
-          value: 'multipleSelect',
+          value: 'checkbox',
         },
         {
           label: '单选',
-          value: 'select',
+          value: 'radio',
         },
         {
           label: '数组',
           value: 'array',
         },
         {
-          label: '数组',
+          label: '自定义',
           value: 'custom',
         },
       ],
@@ -290,16 +283,15 @@ export const schemas: FormSchema[] = [
     rules: [
       {
         required: true,
-        validator: async (rule: any, value: any) => {
-          console.log(`rule`, rule);
-          console.log(`value`, value);
+        validator: async (_, value: any) => {
           if (!value) {
             return Promise.reject('请输入变量名');
           }
           if (value.length < 3 || value.lenght > 30) {
             return Promise.reject('请填写3到30个字符');
           }
-          if (value == 111) {
+          const isExit = await configNameExist({ name: value });
+          if (isExit.bool) {
             return Promise.reject('变量名已经存在');
           }
         },
@@ -326,6 +318,30 @@ export const schemas: FormSchema[] = [
     },
   },
   {
+    field: 'content',
+    component: 'InputTextArea',
+    label: '数据列表',
+    colProps: {
+      span: 20,
+    },
+    defaultValue: `label1|value1\nlabel2|value2`,
+    componentProps: {
+      placeholder: 'label1|value1\nlabel2|value2',
+    },
+    required: true,
+    show: ({ values }) => {
+      if (
+        values.type === 'radio' ||
+        values.type === 'checkbox' ||
+        values.type === 'selects' ||
+        values.type === 'select'
+      ) {
+        return true;
+      }
+      return false;
+    },
+  },
+  {
     field: 'tip',
     component: 'Input',
     label: '提示信息',

+ 3 - 1
src/views/general/config/index.vue

@@ -74,7 +74,6 @@
     name: 'Config',
     components: { CollapseContainer, BasicTable, BasicForm, TableAction },
     setup() {
-      console.log('==============init===========');
       const { t } = useI18n();
       const { createMessage } = useMessage();
       const { success /*, error */ } = createMessage;
@@ -165,6 +164,9 @@
         const data = getTableAction().getDataSource();
         let flag = true;
         data.map((item) => {
+          if (item.type === 'selects' || item.type === 'checkbox') {
+            item.value = item.value.toString();
+          }
           if (item.rule && item.type !== 'array') {
             const rule = item.rule.split(',');
             const res = validateType(rule, item.value);