增加字典接口，修复字典跳转

src/api/system/index.ts

@@ -27,5 +27,9 @@ export default {
     resetPassword: (data: object) => post('/system/user/resetPassword', data),
     del: (id: number) => del('/system/user/delInfoById', { id }),
     edit: (data: object) => put('/system/user/edit', data),
+  },
+  dict: {
+    getTypeList: (params: object) => get('/common/dict/type/list', params),
+    deleteType: (dictIds: object) => del('/common/dict/type/delete', { dictIds }),
   }
 }

src/utils/request.ts

@@ -44,6 +44,7 @@ service.interceptors.response.use(
 			// 分页的数据
 			if (res.data?.Total !== undefined) {
 				return {
+					...res.data,
 					list: res.data.Data,
 					total: res.data.Total,
 					page: res.data.currentPage,

src/views/common/dict/dataList.vue

@@ -1,231 +0,0 @@
-<template>
-  <div class="system-dic-container">
-    <el-card shadow="hover">
-      <div class="system-user-search mb15">
-        <el-form :model="tableData.param" ref="queryRef" :inline="true" label-width="68px">
-          <el-form-item label="字典类型" prop="dictType">
-            <el-input
-                v-model="tableData.param.dictType"
-                placeholder="请输入字典类型"
-                clearable
-                size="default"
-                @keyup.enter.native="dataList"
-            />
-          </el-form-item>
-          <el-form-item label="字典标签" prop="dictLabel">
-            <el-input
-                v-model="tableData.param.dictLabel"
-                placeholder="请输入字典标签"
-                clearable
-                size="default"
-                @keyup.enter.native="dataList"
-            />
-          </el-form-item>
-          <el-form-item label="状态" prop="status" style="width: 200px;">
-            <el-select
-                v-model="tableData.param.status"
-                placeholder="字典状态"
-                clearable
-                size="default"
-                style="width: 240px"
-            >
-              <el-option label="启用"  :value="1"/>
-              <el-option label="禁用"  :value="0"/>
-            </el-select>
-          </el-form-item>
-          <el-form-item>
-            <el-button size="default" type="primary" class="ml10" @click="dataList">
-              <el-icon>
-                <ele-Search />
-              </el-icon>
-              查询
-            </el-button>
-            <el-button size="default" @click="resetQuery(queryRef)">
-              <el-icon>
-                <ele-Refresh />
-              </el-icon>
-              重置
-            </el-button>
-            <el-button size="default" type="success" class="ml10" @click="onOpenAddDic">
-              <el-icon>
-                <ele-FolderAdd />
-              </el-icon>
-              新增字典
-            </el-button>
-            <el-button size="default" type="danger" class="ml10" @click="onRowDel(null)">
-              <el-icon>
-                <ele-Delete />
-              </el-icon>
-              删除字典
-            </el-button>
-          </el-form-item>
-        </el-form>
-      </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="dictCode" />
-        <el-table-column label="字典标签" align="center" prop="dictLabel" />
-        <el-table-column label="字典键值" align="center" prop="dictValue" />
-        <el-table-column label="字典排序" align="center" prop="dictSort" />
-        <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 prop="status" label="字典状态" show-overflow-tooltip>
-          <template #default="scope">
-            <el-tag type="success" v-if="scope.row.status">启用</el-tag>
-            <el-tag type="info" v-else>禁用</el-tag>
-          </template>
-        </el-table-column>
-        <el-table-column label="操作" width="100">
-          <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>
-          </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"
-      />
-    </el-card>
-    <EditDic ref="editDicRef" @dataList="dataList" :dict-type="tableData.param.dictType"/>
-  </div>
-</template>
-
-<script lang="ts">
-import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue';
-import { ElMessageBox, ElMessage,FormInstance} from 'element-plus';
-import EditDic from '/@/views/common/dict/component/editDicData.vue';
-import {getDataList,deleteData} from "/@/api/common/dict/data";
-import { useRoute } from 'vue-router';
-
-
-
-// 定义接口来定义对象的类型
-interface TableDataRow {
-  dictCode: number;
-  dictSort: number;
-  dictLabel: string;
-  dictValue: string;
-  dictType: string;
-  status: number,
-  remark: string;
-  createdAt: string
-}
-interface TableDataState {
-  ids:number[];
-  tableData: {
-    data: Array<TableDataRow>;
-    total: number;
-    loading: boolean;
-    param: {
-      pageNum: number;
-      pageSize: number;
-      dictType: string;
-      dictLabel:string;
-      status: string;
-    };
-  };
-}
-
-export default defineComponent({
-  name: 'apiV1SystemDictDataList',
-  components: { EditDic },
-  setup() {
-    const route = useRoute();
-    const addDicRef = ref();
-    const editDicRef = ref();
-    const queryRef = ref();
-    const state = reactive<TableDataState>({
-      ids:[],
-      tableData: {
-        data: [],
-        total: 0,
-        loading: false,
-        param: {
-          pageNum: 1,
-          pageSize: 10,
-          dictLabel:'',
-          dictType:'',
-          status:''
-        },
-      },
-    });
-    // 初始化表格数据
-    const initTableData = () => {
-      dataList()
-    };
-    const dataList=()=>{
-      getDataList(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.dictLabel}”，是否继续?`
-        ids = [row.dictCode]
-      }else{
-        ids = state.ids
-      }
-      if(ids.length===0){
-        ElMessage.error('请选择要删除的数据。');
-        return
-      }
-      ElMessageBox.confirm(msg, '提示', {
-        confirmButtonText: '确认',
-        cancelButtonText: '取消',
-        type: 'warning',
-      })
-          .then(() => {
-            deleteData(ids).then(()=>{
-              ElMessage.success('删除成功');
-              dataList();
-            })
-          })
-          .catch(() => {});
-    };
-    // 页面加载时
-    onMounted(() => {
-      const dictType = route.params && route.params.dictType;
-      state.tableData.param.dictType = <string>dictType
-      initTableData();
-    });
-    /** 重置按钮操作 */
-    const resetQuery = (formEl: FormInstance | undefined) => {
-      if (!formEl) return
-      formEl.resetFields()
-      dataList()
-    };
-    // 多选框选中数据
-    const handleSelectionChange = (selection:TableDataRow[])=> {
-      state.ids = selection.map(item => item.dictCode)
-    };
-    return {
-      addDicRef,
-      editDicRef,
-      queryRef,
-      onOpenAddDic,
-      onOpenEditDic,
-      onRowDel,
-      dataList,
-      resetQuery,
-      handleSelectionChange,
-      ...toRefs(state),
-    };
-  },
-});
-</script>

src/views/common/dict/index.vue

@@ -1,245 +0,0 @@
-<template>
-	<div class="system-dic-container">
-		<el-card shadow="hover">
-			<div class="system-user-search mb15">
-        <el-form :model="tableData.param" ref="queryRef" :inline="true" label-width="68px">
-          <el-form-item label="字典名称" prop="dictName">
-            <el-input
-                v-model="tableData.param.dictName"
-                placeholder="请输入字典名称"
-                clearable
-                size="default"
-                style="width: 240px"
-                @keyup.enter.native="typeList"
-            />
-          </el-form-item>
-          <el-form-item label="字典类型" prop="dictType">
-            <el-input
-                v-model="tableData.param.dictType"
-                placeholder="请输入字典类型"
-                clearable
-                size="default"
-                style="width: 240px"
-                @keyup.enter.native="typeList"
-            />
-          </el-form-item>
-          <el-form-item label="状态" prop="status" style="width: 200px;">
-            <el-select
-                v-model="tableData.param.status"
-                placeholder="字典状态"
-                clearable
-                size="default"
-                style="width: 240px"
-            >
-              <el-option label="启用"  :value="1"/>
-              <el-option label="禁用"  :value="0"/>
-            </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-form-item>
-          <el-form-item>
-            <el-button size="default" type="primary" class="ml10" @click="typeList">
-              <el-icon>
-                <ele-Search />
-              </el-icon>
-              查询
-            </el-button>
-            <el-button size="default" @click="resetQuery(queryRef)">
-              <el-icon>
-                <ele-Refresh />
-              </el-icon>
-              重置
-            </el-button>
-            <el-button size="default" type="success" class="ml10" @click="onOpenAddDic">
-              <el-icon>
-                <ele-FolderAdd />
-              </el-icon>
-              新增字典
-            </el-button>
-            <el-button size="default" type="danger" class="ml10" @click="onRowDel(null)">
-              <el-icon>
-                <ele-Delete />
-              </el-icon>
-              删除字典
-            </el-button>
-          </el-form-item>
-        </el-form>
-			</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="字典ID" align="center" prop="dictId" width="120"/>
-        <el-table-column label="字典名称" align="center" prop="dictName" :show-overflow-tooltip="true" />
-        <el-table-column label="字典类型" align="center" :show-overflow-tooltip="true">
-          <template #default="scope">
-            <router-link :to="'/common/dict/data/list/' + scope.row.dictType" class="link-type">
-              <span>{{ scope.row.dictType }}</span>
-            </router-link>
-          </template>
-        </el-table-column>
-				<el-table-column prop="status" label="字典状态" show-overflow-tooltip>
-					<template #default="scope">
-						<el-tag type="success" v-if="scope.row.status">启用</el-tag>
-						<el-tag type="info" v-else>禁用</el-tag>
-					</template>
-				</el-table-column>
-				<el-table-column prop="remark" label="字典描述" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="createdAt" label="创建时间" show-overflow-tooltip width="180"></el-table-column>
-				<el-table-column label="操作" width="100">
-					<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>
-					</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="typeList"
-      />
-		</el-card>
-		<EditDic ref="editDicRef" @typeList="typeList"/>
-	</div>
-</template>
-
-<script lang="ts">
-import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue';
-import { ElMessageBox, ElMessage,FormInstance} from 'element-plus';
-import EditDic from '/@/views/common/dict/component/editDic.vue';
-import {deleteType, getTypeList} from "/@/api/common/dict/type";
-
-
-// 定义接口来定义对象的类型
-interface TableDataRow {
-  dictId:number;
-  dictName: string;
-  dictType: string;
-  status: number;
-  remark:string;
-  createdAt:string;
-}
-interface TableDataState {
-  ids:number[];
-	tableData: {
-		data: Array<TableDataRow>;
-		total: number;
-		loading: boolean;
-		param: {
-			pageNum: number;
-			pageSize: number;
-      dictName: string;
-      dictType: string;
-      status: string;
-      dateRange:string[];
-		};
-	};
-}
-
-export default defineComponent({
-	name: 'systemDic',
-	components: { EditDic },
-	setup() {
-		const addDicRef = ref();
-		const editDicRef = ref();
-    const queryRef = ref();
-		const state = reactive<TableDataState>({
-      ids:[],
-			tableData: {
-				data: [],
-				total: 0,
-				loading: false,
-				param: {
-					pageNum: 1,
-					pageSize: 10,
-          dictName:'',
-          dictType:'',
-          status:'',
-          dateRange:[],
-				},
-			},
-		});
-		// 初始化表格数据
-		const initTableData = () => {
-      typeList()
-		};
-    const typeList=()=>{
-      getTypeList(state.tableData.param).then((res:any)=>{
-        state.tableData.data = res.data.dictTypeList;
-        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.dictName}”，是否继续?`
-        ids = [row.dictId]
-      }else{
-        ids = state.ids
-      }
-      if(ids.length===0){
-        ElMessage.error('请选择要删除的数据。');
-        return
-      }
-			ElMessageBox.confirm(msg, '提示', {
-				confirmButtonText: '确认',
-				cancelButtonText: '取消',
-				type: 'warning',
-			})
-				.then(() => {
-          deleteType(ids).then(()=>{
-            ElMessage.success('删除成功');
-            typeList();
-          })
-				})
-				.catch(() => {});
-		};
-		// 页面加载时
-		onMounted(() => {
-			initTableData();
-		});
-    /** 重置按钮操作 */
-    const resetQuery = (formEl: FormInstance | undefined) => {
-      if (!formEl) return
-      formEl.resetFields()
-      typeList()
-    };
-    // 多选框选中数据
-    const handleSelectionChange = (selection:TableDataRow[])=> {
-      state.ids = selection.map(item => item.dictId)
-    };
-		return {
-			addDicRef,
-			editDicRef,
-      queryRef,
-			onOpenAddDic,
-			onOpenEditDic,
-			onRowDel,
-      typeList,
-      resetQuery,
-      handleSelectionChange,
-			...toRefs(state),
-		};
-	},
-});
-</script>

src/views/system/dict/dataList.vue

@@ -0,0 +1,206 @@
+<template>
+  <div class="system-dic-container">
+    <el-card shadow="hover">
+      <div class="system-user-search mb15">
+        <el-form :model="tableData.param" ref="queryRef" :inline="true" label-width="68px">
+          <el-form-item label="字典类型" prop="dictType">
+            <el-input v-model="tableData.param.dictType" placeholder="请输入字典类型" clearable size="default" @keyup.enter.native="dataList" />
+          </el-form-item>
+          <el-form-item label="字典标签" prop="dictLabel">
+            <el-input v-model="tableData.param.dictLabel" placeholder="请输入字典标签" clearable size="default" @keyup.enter.native="dataList" />
+          </el-form-item>
+          <el-form-item label="状态" prop="status" style="width: 200px;">
+            <el-select v-model="tableData.param.status" placeholder="字典状态" clearable size="default" style="width: 240px">
+              <el-option label="启用" :value="1" />
+              <el-option label="禁用" :value="0" />
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-button size="default" type="primary" class="ml10" @click="dataList">
+              <el-icon>
+                <ele-Search />
+              </el-icon>
+              查询
+            </el-button>
+            <el-button size="default" @click="resetQuery(queryRef)">
+              <el-icon>
+                <ele-Refresh />
+              </el-icon>
+              重置
+            </el-button>
+            <el-button size="default" type="success" class="ml10" @click="onOpenAddDic">
+              <el-icon>
+                <ele-FolderAdd />
+              </el-icon>
+              新增字典
+            </el-button>
+            <el-button size="default" type="danger" class="ml10" @click="onRowDel(null)">
+              <el-icon>
+                <ele-Delete />
+              </el-icon>
+              删除字典
+            </el-button>
+          </el-form-item>
+        </el-form>
+      </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="dictCode" />
+        <el-table-column label="字典标签" align="center" prop="dictLabel" />
+        <el-table-column label="字典键值" align="center" prop="dictValue" />
+        <el-table-column label="字典排序" align="center" prop="dictSort" />
+        <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 prop="status" label="字典状态" show-overflow-tooltip>
+          <template #default="scope">
+            <el-tag type="success" v-if="scope.row.status">启用</el-tag>
+            <el-tag type="info" v-else>禁用</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" width="100">
+          <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>
+          </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" />
+    </el-card>
+    <EditDic ref="editDicRef" @dataList="dataList" :dict-type="tableData.param.dictType" />
+  </div>
+</template>
+
+<script lang="ts">
+import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue';
+import { ElMessageBox, ElMessage, FormInstance } from 'element-plus';
+import EditDic from './component/editDicData.vue';
+import { getDataList, deleteData } from '/@/api/common/dict/data';
+import { useRoute } from 'vue-router';
+
+// 定义接口来定义对象的类型
+interface TableDataRow {
+	dictCode: number;
+	dictSort: number;
+	dictLabel: string;
+	dictValue: string;
+	dictType: string;
+	status: number;
+	remark: string;
+	createdAt: string;
+}
+interface TableDataState {
+	ids: number[];
+	tableData: {
+		data: Array<TableDataRow>;
+		total: number;
+		loading: boolean;
+		param: {
+			pageNum: number;
+			pageSize: number;
+			dictType: string;
+			dictLabel: string;
+			status: string;
+		};
+	};
+}
+
+export default defineComponent({
+	name: 'apiV1SystemDictDataList',
+	components: { EditDic },
+	setup() {
+		const route = useRoute();
+		const addDicRef = ref();
+		const editDicRef = ref();
+		const queryRef = ref();
+		const state = reactive<TableDataState>({
+			ids: [],
+			tableData: {
+				data: [],
+				total: 0,
+				loading: false,
+				param: {
+					pageNum: 1,
+					pageSize: 10,
+					dictLabel: '',
+					dictType: '',
+					status: '',
+				},
+			},
+		});
+		// 初始化表格数据
+		const initTableData = () => {
+			dataList();
+		};
+		const dataList = () => {
+			getDataList(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.dictLabel}”，是否继续?`;
+				ids = [row.dictCode];
+			} else {
+				ids = state.ids;
+			}
+			if (ids.length === 0) {
+				ElMessage.error('请选择要删除的数据。');
+				return;
+			}
+			ElMessageBox.confirm(msg, '提示', {
+				confirmButtonText: '确认',
+				cancelButtonText: '取消',
+				type: 'warning',
+			})
+				.then(() => {
+					deleteData(ids).then(() => {
+						ElMessage.success('删除成功');
+						dataList();
+					});
+				})
+				.catch(() => {});
+		};
+		// 页面加载时
+		onMounted(() => {
+      const dictType = route.params && route.params.dictType;
+      console.log(dictType)
+			state.tableData.param.dictType = <string>dictType;
+			initTableData();
+		});
+		/** 重置按钮操作 */
+		const resetQuery = (formEl: FormInstance | undefined) => {
+			if (!formEl) return;
+			formEl.resetFields();
+			dataList();
+		};
+		// 多选框选中数据
+		const handleSelectionChange = (selection: TableDataRow[]) => {
+			state.ids = selection.map((item) => item.dictCode);
+		};
+		return {
+			addDicRef,
+			editDicRef,
+			queryRef,
+			onOpenAddDic,
+			onOpenEditDic,
+			onRowDel,
+			dataList,
+			resetQuery,
+			handleSelectionChange,
+			...toRefs(state),
+		};
+	},
+});
+</script>

src/views/system/dict/index.vue

@@ -0,0 +1,209 @@
+<template>
+  <div class="system-dic-container">
+    <el-card shadow="hover">
+      <div class="system-user-search mb15">
+        <el-form :model="tableData.param" ref="queryRef" :inline="true" label-width="68px">
+          <el-form-item label="字典名称" prop="dictName">
+            <el-input v-model="tableData.param.dictName" placeholder="请输入字典名称" clearable size="default" style="width: 240px" @keyup.enter.native="typeList" />
+          </el-form-item>
+          <el-form-item label="字典类型" prop="dictType">
+            <el-input v-model="tableData.param.dictType" placeholder="请输入字典类型" clearable size="default" style="width: 240px" @keyup.enter.native="typeList" />
+          </el-form-item>
+          <el-form-item label="状态" prop="status" style="width: 200px;">
+            <el-select v-model="tableData.param.status" placeholder="字典状态" clearable size="default" style="width: 240px">
+              <el-option label="启用" :value="1" />
+              <el-option label="禁用" :value="0" />
+            </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-form-item>
+          <el-form-item>
+            <el-button size="default" type="primary" class="ml10" @click="typeList">
+              <el-icon>
+                <ele-Search />
+              </el-icon>
+              查询
+            </el-button>
+            <el-button size="default" @click="resetQuery(queryRef)">
+              <el-icon>
+                <ele-Refresh />
+              </el-icon>
+              重置
+            </el-button>
+            <el-button size="default" type="success" class="ml10" @click="onOpenAddDic">
+              <el-icon>
+                <ele-FolderAdd />
+              </el-icon>
+              新增字典
+            </el-button>
+            <el-button size="default" type="danger" class="ml10" @click="onRowDel(null)">
+              <el-icon>
+                <ele-Delete />
+              </el-icon>
+              删除字典
+            </el-button>
+          </el-form-item>
+        </el-form>
+      </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="字典ID" align="center" prop="dictId" width="120" />
+        <el-table-column label="字典名称" align="center" prop="dictName" :show-overflow-tooltip="true" />
+        <el-table-column label="字典类型" align="center" :show-overflow-tooltip="true">
+          <template #default="scope">
+            <router-link :to="'/system/dict/data/list/' + scope.row.dictType" class="link-type">
+              <span>{{ scope.row.dictType }}</span>
+            </router-link>
+          </template>
+        </el-table-column>
+        <el-table-column prop="status" label="字典状态" show-overflow-tooltip>
+          <template #default="scope">
+            <el-tag type="success" v-if="scope.row.status">启用</el-tag>
+            <el-tag type="info" v-else>禁用</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column prop="remark" label="字典描述" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="createdAt" label="创建时间" show-overflow-tooltip width="180"></el-table-column>
+        <el-table-column label="操作" width="100">
+          <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>
+          </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="typeList" />
+    </el-card>
+    <EditDic ref="editDicRef" @typeList="typeList" />
+  </div>
+</template>
+
+<script lang="ts">
+import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue';
+import { ElMessageBox, ElMessage, FormInstance } from 'element-plus';
+import EditDic from './component/editDic.vue';
+import api from '/@/api/system';
+
+// 定义接口来定义对象的类型
+interface TableDataRow {
+	dictId: number;
+	dictName: string;
+	dictType: string;
+	status: number;
+	remark: string;
+	createdAt: string;
+}
+interface TableDataState {
+	ids: number[];
+	tableData: {
+		data: Array<TableDataRow>;
+		total: number;
+		loading: boolean;
+		param: {
+			pageNum: number;
+			pageSize: number;
+			dictName: string;
+			dictType: string;
+			status: string;
+			dateRange: string[];
+		};
+	};
+}
+
+export default defineComponent({
+	name: 'systemDic',
+	components: { EditDic },
+	setup() {
+		const addDicRef = ref();
+		const editDicRef = ref();
+		const queryRef = ref();
+		const state = reactive<TableDataState>({
+			ids: [],
+			tableData: {
+				data: [],
+				total: 0,
+				loading: false,
+				param: {
+					pageNum: 1,
+					pageSize: 10,
+					dictName: '',
+					dictType: '',
+					status: '',
+					dateRange: [],
+				},
+			},
+		});
+		// 初始化表格数据
+		const initTableData = () => {
+			typeList();
+		};
+		const typeList = () => {
+			api.dict.getTypeList(state.tableData.param).then((res: any) => {
+				state.tableData.data = res.dictTypeList;
+				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.dictName}”，是否继续?`;
+				ids = [row.dictId];
+			} else {
+				ids = state.ids;
+			}
+			if (ids.length === 0) {
+				ElMessage.error('请选择要删除的数据。');
+				return;
+			}
+			ElMessageBox.confirm(msg, '提示', {
+				confirmButtonText: '确认',
+				cancelButtonText: '取消',
+				type: 'warning',
+			})
+				.then(() => {
+					api.dict.deleteType(ids).then(() => {
+						ElMessage.success('删除成功');
+						typeList();
+					});
+				})
+				.catch(() => {});
+		};
+		// 页面加载时
+		onMounted(() => {
+			initTableData();
+		});
+		/** 重置按钮操作 */
+		const resetQuery = (formEl: FormInstance | undefined) => {
+			if (!formEl) return;
+			formEl.resetFields();
+			typeList();
+		};
+		// 多选框选中数据
+		const handleSelectionChange = (selection: TableDataRow[]) => {
+			state.ids = selection.map((item) => item.dictId);
+		};
+		return {
+			addDicRef,
+			editDicRef,
+			queryRef,
+			onOpenAddDic,
+			onOpenEditDic,
+			onRowDel,
+			typeList,
+			resetQuery,
+			handleSelectionChange,
+			...toRefs(state),
+		};
+	},
+});
+</script>

src/views/system/user/component/editUser.vue

@@ -14,8 +14,8 @@
             </el-form-item>
           </el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="用户昵称" prop="nickName">
-							<el-input v-model="ruleForm.nickName" placeholder="请输入用户昵称" clearable></el-input>
+						<el-form-item label="用户昵称" prop="userNickname">
+							<el-input v-model="ruleForm.userNickname" placeholder="请输入用户昵称" clearable></el-input>
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
@@ -34,7 +34,7 @@
 						<el-form-item label="部门" prop="deptId">
 							<el-cascader
 								:options="deptData"
-								:props="{ checkStrictly: true,emitPath: false, value: 'deptId', label: 'deptName' }"
+								:props="{ checkStrictly: true,emitPath: false, value: 'deptId', label: 'name' }"
 								placeholder="请选择部门"
 								clearable
 								class="w100"
@@ -142,7 +142,7 @@ export default defineComponent({
         userId: 0,
         deptId: 0,
         userName: '',
-        nickName: '',
+        userNickname: '',
         password: '',
         mobile:'',
         email: '',
@@ -158,7 +158,7 @@ export default defineComponent({
         userName: [
           { required: true, message: "用户名称不能为空", trigger: "blur" }
         ],
-        nickName: [
+        userNickname: [
           { required: true, message: "用户昵称不能为空", trigger: "blur" }
         ],
         deptId: [
@@ -194,7 +194,7 @@ export default defineComponent({
             userId: user.id,
             deptId: user.deptId,
             userName: user.userName,
-            nickName: user.userNickname,
+            userNickname: user.useruserNickname,
             password: '-',
             mobile:user.mobile,
             email: user.userEmail,
@@ -258,7 +258,7 @@ export default defineComponent({
         userId: 0,
         deptId: 0,
         userName: '',
-        nickName: '',
+        userNickname: '',
         password: '',
         mobile:'',
         email: '',

src/views/system/user/index.vue

@@ -60,14 +60,14 @@
             <el-table-column type="selection" width="55" align="center" />
             <el-table-column type="index" label="序号" width="60" align="center" />
             <el-table-column prop="userName" label="账户名称" min-width="120" show-overflow-tooltip></el-table-column>
-            <el-table-column prop="userNickname" label="用户昵称"  min-width="160" show-overflow-tooltip></el-table-column>
+            <el-table-column prop="userNickname" label="用户昵称" min-width="160" show-overflow-tooltip></el-table-column>
             <el-table-column prop="dept.deptName" label="部门" show-overflow-tooltip></el-table-column>
             <el-table-column label="角色" align="center" prop="roleInfo" :show-overflow-tooltip="true">
               <template #default="scope">
                 <span v-for="(item,index) of scope.row.roleInfo" :key="'role-'+index"> {{item.name+'   '}} </span>
               </template>
             </el-table-column>
-            <el-table-column prop="mobile" label="手机号"  width="120" align="center"></el-table-column>
+            <el-table-column prop="mobile" label="手机号" width="120" align="center"></el-table-column>
             <el-table-column prop="userStatus" label="用户状态" width="120" align="center">
               <template #default="scope">
                 <el-switch v-model="scope.row.userStatus" inline-prompt :active-value="1" :inactive-value="0" active-text="启" inactive-text="禁" @change="handleStatusChange(scope.row)">
@@ -77,9 +77,9 @@
             <el-table-column prop="createdAt" label="创建时间" width="180" align="center"></el-table-column>
             <el-table-column label="操作" width="150" align="center" fixed="right">
               <template #default="scope">
-                <el-button size="small" type="text" @click="onOpenEditUser(scope.row)">修改</el-button>
-                <el-button size="small" type="text" @click="onRowDel(scope.row)">删除</el-button>
-                <el-button size="small" type="text" @click="handleResetPwd(scope.row)">重置</el-button>
+                <el-button size="small" text type="warning" @click="onOpenEditUser(scope.row)">修改</el-button>
+                <el-button size="small" text type="danger" @click="onRowDel(scope.row)">删除</el-button>
+                <el-button size="small" text type="success" @click="handleResetPwd(scope.row)">重置</el-button>
               </template>
             </el-table-column>
           </el-table>
@@ -96,7 +96,7 @@ import { toRefs, reactive, onMounted, ref, defineComponent, watch, getCurrentIns
 import { ElMessageBox, ElMessage, ElTree, FormInstance } from 'element-plus';
 import { Search } from '@element-plus/icons-vue';
 import EditUser from '/@/views/system/user/component/editUser.vue';
-import { getUserList, resetUserPwd, changeUserStatus, deleteUser } from '/@/api/system/user/index';
+import { resetUserPwd, changeUserStatus, deleteUser } from '/@/api/system/user/index';
 import api from '/@/api/system';
 import useCommon from '/@/hooks/useCommon';