完善参数管理页面

src/api/system/index.ts

@@ -28,6 +28,13 @@ export default {
     del: (id: number) => del('/system/user/delInfoById', { id }),
     edit: (data: object) => put('/system/user/edit', data),
   },
+  config: {
+    getList: (params: object) => get('/common/config/list', params),
+    detail: (id: number) => get('/common/config/get', { id }),
+    add: (data: object) => post('/common/config/add', data),
+    del: (ids: number[]) => del('/common/config/delete', { ids }),
+    edit: (data: object) => put('/common/config/edit', data),
+  },
   dict: {
     getTypeList: (params: object) => get('/common/dict/type/list', params),
     getType: (dictId: number) => get('/common/dict/type/get', { dictId }),
@@ -35,9 +42,9 @@ export default {
     addData: (data: object) => post('/common/dict/data/add', data),
     editType: (data: object) => put('/common/dict/type/edit', data),
     editData: (data: object) => put('/common/dict/data/edit', data),
-    deleteType: (dictIds: object[]) => del('/common/dict/type/delete', { dictIds }),
+    deleteType: (dictIds: number[]) => del('/common/dict/type/delete', { dictIds }),
     getDataList: (params: object) => get('/common/dict/data/list', params),
     getData: (dictCode: string) => get('/common/dict/data/get', { dictCode }),
-    deleteData: (ids: object[]) => del('/common/dict/data/delete', { ids }),
+    deleteData: (ids: number[]) => del('/common/dict/data/delete', { ids }),
   }
 }

src/views/system/config/component/editConfig.vue

@@ -11,7 +11,7 @@
         <el-form-item label="参数键值" prop="configValue">
           <el-input v-model="ruleForm.configValue" placeholder="请输入参数键值" />
         </el-form-item>
-        <el-form-item label="系统内置" prop="configType">
+        <!-- <el-form-item label="系统内置" prop="configType">
           <el-radio-group v-model="ruleForm.configType">
             <el-radio
                 v-for="dict in sysYesNoOptions"
@@ -19,7 +19,7 @@
                 :label="dict.value"
             >{{dict.label}}</el-radio>
           </el-radio-group>
-        </el-form-item>
+        </el-form-item> -->
         <el-form-item label="备注" prop="remark">
           <el-input v-model="ruleForm.remark" type="textarea" placeholder="请输入内容" />
         </el-form-item>
@@ -37,7 +37,7 @@
 <script lang="ts">
 import { reactive, toRefs, defineComponent,ref, unref } from 'vue';
 import {ElMessage} from "element-plus";
-import {addConfig, editConfig, getConfig} from "/@/api/system/config";
+import api from "/@/api/system";
 interface RuleFormState {
   configId: number;
   configName: string;
@@ -88,7 +88,7 @@ export default defineComponent({
 		const openDialog = (row: RuleFormState|null) => {
       resetForm();
       if (row){
-        getConfig(row.configId).then((res:any)=>{
+        api.config.detail(row.configId).then((res:any)=>{
           const data:RuleFormState = res.data.data
           data.configType = String(data.configType)
           state.ruleForm = data
@@ -123,14 +123,14 @@ export default defineComponent({
         if (valid) {
           if(state.ruleForm.configId!==0){
             //修改
-            editConfig(state.ruleForm).then(()=>{
+            api.config.edit(state.ruleForm).then(()=>{
               ElMessage.success('参数修改成功');
               closeDialog(); // 关闭弹窗
               emit('dataList')
             })
           }else{
             //添加
-            addConfig(state.ruleForm).then(()=>{
+            api.config.add(state.ruleForm).then(()=>{
               ElMessage.success('参数添加成功');
               closeDialog(); // 关闭弹窗
               emit('dataList')

src/views/system/config/index.vue

@@ -4,48 +4,18 @@
       <div class="system-user-search mb15">
         <el-form :model="tableData.param" ref="queryRef" :inline="true" label-width="68px">
           <el-form-item label="参数名称" prop="configName">
-            <el-input
-                v-model="tableData.param.configName"
-                placeholder="请输入参数名称"
-                clearable
-                size="default"
-                @keyup.enter.native="dataList"
-            />
+            <el-input v-model="tableData.param.configName" placeholder="请输入参数名称" clearable size="default" @keyup.enter.native="dataList" />
           </el-form-item>
           <el-form-item label="参数键名" prop="configKey">
-            <el-input
-                v-model="tableData.param.configKey"
-                placeholder="请输入参数键名"
-                clearable
-                size="default"
-                @keyup.enter.native="dataList"
-            />
+            <el-input v-model="tableData.param.configKey" placeholder="请输入参数键名" clearable size="default" @keyup.enter.native="dataList" />
           </el-form-item>
           <el-form-item label="系统内置" prop="configType" style="width: 200px;">
-            <el-select
-                v-model="tableData.param.configType"
-                placeholder="系统内置"
-                clearable
-                size="default"
-                style="width: 240px"
-            >
-              <el-option v-for="dict in sys_yes_no"
-                 :key="dict.value"
-                 :label="dict.label"
-                 :value="dict.value"/>
+            <el-select v-model="tableData.param.configType" placeholder="系统内置" clearable size="default" style="width: 240px">
+              <el-option v-for="dict in sys_yes_no" :key="dict.value" :label="dict.label" :value="dict.value" />
             </el-select>
           </el-form-item>
           <el-form-item label="创建时间" prop="dateRange">
-            <el-date-picker
-                v-model="tableData.param.dateRange"
-                size="default"
-                style="width: 240px"
-                value-format="YYYY-MM-DD"
-                type="daterange"
-                range-separator="-"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"
-            ></el-date-picker>
+            <el-date-picker v-model="tableData.param.dateRange" size="default" style="width: 240px" value-format="YYYY-MM-DD" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
           </el-form-item>
           <el-form-item>
             <el-button size="default" type="primary" class="ml10" @click="dataList">
@@ -77,169 +47,164 @@
       </div>
       <el-table :data="tableData.data" style="width: 100%" @selection-change="handleSelectionChange">
         <el-table-column type="selection" width="55" align="center" />
-        <el-table-column label="参数主键" align="center" prop="configId" />
-        <el-table-column label="参数名称" align="center" prop="configName" :show-overflow-tooltip="true" />
-        <el-table-column label="参数键名" align="center" prop="configKey" :show-overflow-tooltip="true" />
-        <el-table-column label="参数键值" align="center" prop="configValue" />
-        <el-table-column label="系统内置" align="center" prop="configType" :formatter="typeFormat" />
-        <el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
-        <el-table-column label="创建时间" align="center" prop="createdAt" width="180" />
-        <el-table-column label="操作" width="100">
+        <el-table-column label="ID" align="center" prop="configId" width="60" />
+        <el-table-column label="参数名称" prop="configName" :show-overflow-tooltip="true" />
+        <el-table-column label="参数键名" prop="configKey" :show-overflow-tooltip="true" />
+        <el-table-column label="参数键值" prop="configValue" />
+        <el-table-column label="备注" prop="remark" :show-overflow-tooltip="true" />
+        <el-table-column label="创建时间" prop="createdAt" width="180" align="center" />
+        <!-- <el-table-column label="系统内置" align="center" prop="configType" width="100">
+          <template #default="{row}">
+            {{row.configType?'是':'否'}}
+          </template>
+        </el-table-column> -->
+        <el-table-column label="操作" width="100" align="center" fixed="right">
           <template #default="scope">
-            <el-button size="small" type="text" @click="onOpenEditDic(scope.row)">修改</el-button>
-            <el-button size="small" type="text" @click="onRowDel(scope.row)">删除</el-button>
+            <el-button size="small" text type="warning" @click="onOpenEditDic(scope.row)">修改</el-button>
+            <el-button size="small" text type="danger" @click="onRowDel(scope.row)">删除</el-button>
           </template>
         </el-table-column>
       </el-table>
-      <pagination
-          v-show="tableData.total>0"
-          :total="tableData.total"
-          v-model:page="tableData.param.pageNum"
-          v-model:limit="tableData.param.pageSize"
-          @pagination="dataList"
-      />
+      <pagination v-show="tableData.total>0" :total="tableData.total" v-model:page="tableData.param.pageNum" v-model:limit="tableData.param.pageSize" @pagination="dataList" />
     </el-card>
-    <EditConfig ref="editDicRef" @dataList="dataList" :sysYesNoOptions="sys_yes_no"/>
+    <EditConfig ref="editDicRef" @dataList="dataList" :sysYesNoOptions="sys_yes_no" />
   </div>
 </template>
 
 <script lang="ts">
-import {toRefs,reactive,onMounted,ref,defineComponent,unref,getCurrentInstance} from 'vue';
-import { ElMessageBox, ElMessage,FormInstance} from 'element-plus';
+import { toRefs, reactive, onMounted, ref, defineComponent, unref, getCurrentInstance } from 'vue';
+import { ElMessageBox, ElMessage, FormInstance } from 'element-plus';
 import EditConfig from '/@/views/system/config/component/editConfig.vue';
-import {deleteConfig, getConfigList} from "/@/api/system/config";
-
-
+import api from '/@/api/system';
 
 // 定义接口来定义对象的类型
 interface TableDataRow {
-  configId: number;
-  configName: string;
-  configKey: string;
-  configValue: string,
-  configType: number,
-  remark: string,
-  createdAt: string,
+	configId: number;
+	configName: string;
+	configKey: string;
+	configValue: string;
+	configType: number;
+	remark: string;
+	createdAt: string;
 }
 interface TableDataState {
-  ids:number[];
-  tableData: {
-    data: Array<TableDataRow>;
-    total: number;
-    loading: boolean;
-    param: {
-      pageNum: number;
-      pageSize: number;
-      configName:string;
-      configKey:string;
-      configType:string;
-      dateRange:string[];
-    };
-  };
+	ids: number[];
+	tableData: {
+		data: Array<TableDataRow>;
+		total: number;
+		loading: boolean;
+		param: {
+			pageNum: number;
+			pageSize: number;
+			configName: string;
+			configKey: string;
+			configType: string;
+			dateRange: string[];
+		};
+	};
 }
 
 export default defineComponent({
-  name: 'apiV1SystemDictDataList',
-  components: { EditConfig },
-  setup() {
-    const {proxy} = getCurrentInstance() as any;
-    const addDicRef = ref();
-    const editDicRef = ref();
-    const queryRef = ref();
-    const {sys_yes_no} = proxy.useDict('sys_yes_no')
-    const state = reactive<TableDataState>({
-      ids:[],
-      tableData: {
-        data: [],
-        total: 0,
-        loading: false,
-        param: {
-          dateRange:[],
-          pageNum: 1,
-          pageSize: 10,
-          configName:'',
-          configKey:'',
-          configType:''
-        },
-      },
-    });
-    // 初始化表格数据
-    const initTableData = () => {
-      dataList()
-    };
-    const dataList=()=>{
-      getConfigList(state.tableData.param).then((res:any)=>{
-        state.tableData.data = res.data.list;
-        state.tableData.total = res.data.total;
-      });
-    };
-    // 打开新增字典弹窗
-    const onOpenAddDic = () => {
-      editDicRef.value.openDialog();
-    };
-    // 打开修改字典弹窗
-    const onOpenEditDic = (row: TableDataRow) => {
-      editDicRef.value.openDialog(row);
-    };
-    // 删除字典
-    const onRowDel = (row: TableDataRow) => {
-      let msg = '你确定要删除所选数据？';
-      let ids:number[] = [] ;
-      if(row){
-        msg = `此操作将永久删除用户：“${row.configName}”，是否继续?`
-        ids = [row.configId]
-      }else{
-        ids = state.ids
-      }
-      if(ids.length===0){
-        ElMessage.error('请选择要删除的数据。');
-        return
-      }
-      ElMessageBox.confirm(msg, '提示', {
-        confirmButtonText: '确认',
-        cancelButtonText: '取消',
-        type: 'warning',
-      })
-          .then(() => {
-            deleteConfig(ids).then(()=>{
-              ElMessage.success('删除成功');
-              dataList();
-            })
-          })
-          .catch(() => {});
-    };
-    // 页面加载时
-    onMounted(() => {
-      initTableData();
-    });
-    /** 重置按钮操作 */
-    const resetQuery = (formEl: FormInstance | undefined) => {
-      if (!formEl) return
-      formEl.resetFields()
-      dataList()
-    };
-    // 多选框选中数据
-    const handleSelectionChange = (selection:TableDataRow[])=> {
-      state.ids = selection.map(item => item.configId)
-    };
+	name: 'apiV1SystemDictDataList',
+	components: { EditConfig },
+	setup() {
+		const { proxy } = getCurrentInstance() as any;
+		const addDicRef = ref();
+		const editDicRef = ref();
+		const queryRef = ref();
+		const { sys_yes_no } = proxy.useDict('sys_yes_no');
+		const state = reactive<TableDataState>({
+			ids: [],
+			tableData: {
+				data: [],
+				total: 0,
+				loading: false,
+				param: {
+					dateRange: [],
+					pageNum: 1,
+					pageSize: 10,
+					configName: '',
+					configKey: '',
+					configType: '',
+				},
+			},
+		});
+		// 初始化表格数据
+		const initTableData = () => {
+			dataList();
+		};
+		const dataList = () => {
+			api.config.getList(state.tableData.param).then((res: any) => {
+				state.tableData.data = res.list;
+				state.tableData.total = res.total;
+			});
+		};
+		// 打开新增字典弹窗
+		const onOpenAddDic = () => {
+			editDicRef.value.openDialog();
+		};
+		// 打开修改字典弹窗
+		const onOpenEditDic = (row: TableDataRow) => {
+			editDicRef.value.openDialog(row);
+		};
+		// 删除字典
+		const onRowDel = (row: TableDataRow) => {
+			let msg = '你确定要删除所选数据？';
+			let ids: number[] = [];
+			if (row) {
+				msg = `此操作将永久删除用户：“${row.configName}”，是否继续?`;
+				ids = [row.configId];
+			} else {
+				ids = state.ids;
+			}
+			if (ids.length === 0) {
+				ElMessage.error('请选择要删除的数据。');
+				return;
+			}
+			ElMessageBox.confirm(msg, '提示', {
+				confirmButtonText: '确认',
+				cancelButtonText: '取消',
+				type: 'warning',
+			})
+				.then(() => {
+					api.config.del(ids).then(() => {
+						ElMessage.success('删除成功');
+						dataList();
+					});
+				})
+				.catch(() => {});
+		};
+		// 页面加载时
+		onMounted(() => {
+			initTableData();
+		});
+		/** 重置按钮操作 */
+		const resetQuery = (formEl: FormInstance | undefined) => {
+			if (!formEl) return;
+			formEl.resetFields();
+			dataList();
+		};
+		// 多选框选中数据
+		const handleSelectionChange = (selection: TableDataRow[]) => {
+			state.ids = selection.map((item) => item.configId);
+		};
     // 参数系统内置字典翻译
     const typeFormat=(row:TableDataRow) => {
       return proxy.selectDictLabel(unref(sys_yes_no), row.configType);
     };
-    return {
-      addDicRef,
-      editDicRef,
-      queryRef,
-      sys_yes_no,
-      onOpenAddDic,
-      onOpenEditDic,
-      onRowDel,
-      dataList,
-      resetQuery,
-      handleSelectionChange,
-      typeFormat,
-      ...toRefs(state),
-    };
-  },
+		return {
+			addDicRef,
+			editDicRef,
+			queryRef,
+			sys_yes_no,
+			onOpenAddDic,
+			onOpenEditDic,
+			onRowDel,
+			dataList,
+			resetQuery,
+			handleSelectionChange,
+			...toRefs(state),
+		};
+	},
 });
 </script>