Browse Source

对接用户管理用户列表接口及部门列表,适配后端返回列表数据,优化表格显示

yanglzh 3 năm trước cách đây
mục cha
commit
eb5f77b0a7
3 tập tin đã thay đổi với 42 bổ sung44 xóa
  1. 12 4
      src/api/system/index.ts
  2. 14 1
      src/utils/request.ts
  3. 16 39
      src/views/system/user/index.vue

+ 12 - 4
src/api/system/index.ts

@@ -11,13 +11,21 @@ export default {
   org: {
     getList: (params: object) => get('/system/organization/tree', params),
     del: (id: number) => del('/system/organization/del', { id }),
-    add: (data: object) => post('/system/organization/add',data),
-    edit: (data: object) => put('/system/organization/edit',data),
+    add: (data: object) => post('/system/organization/add', data),
+    edit: (data: object) => put('/system/organization/edit', data),
   },
   dept: {
     getList: (params: object) => get('/system/dept/tree', params),
     del: (deptId: number) => del('/system/dept/del', { deptId }),
-    add: (data: object) => post('/system/dept/add',data),
-    edit: (data: object) => put('/system/dept/edit',data),
+    add: (data: object) => post('/system/dept/add', data),
+    edit: (data: object) => put('/system/dept/edit', data),
+  },
+  user: {
+    getList: (params: object) => get('/system/user/list', params),
+    detail: (id: number) => get('/system/user/getInfoById', { id }),
+    add: (data: object) => post('/system/user/add', data),
+    resetPassword: (data: object) => post('/system/user/resetPassword', data),
+    del: (id: number) => del('/system/user/delInfoById', { id }),
+    edit: (data: object) => put('/system/user/edit', data),
   }
 }

+ 14 - 1
src/utils/request.ts

@@ -41,7 +41,20 @@ service.interceptors.response.use(
 			ElMessage.error(res.message)
 			return Promise.reject(new Error(res.message))
 		} else {
-			return res.data?.Data || (res.data?.Data === undefined ? res.data : res.data.Data)
+			// 分页的数据
+			if (res.data?.Total !== undefined) {
+				return {
+					list: res.data.Data,
+					total: res.data.Total,
+					page: res.data.currentPage,
+				}
+			}
+			if (res.data?.Data) {
+				return res.data.Data 
+			}
+			if (res.data?.Data === undefined) {
+				return res.data
+			}
 		}
 	},
 	(error) => {

+ 16 - 39
src/views/system/user/index.vue

@@ -5,7 +5,7 @@
         <el-card shadow="hover">
           <el-scrollbar>
             <el-input :prefix-icon="search" v-model="filterText" placeholder="请输入部门名称" clearable size="default" style="width: 100%;" />
-            <el-tree ref="treeRef" class="filter-tree mt-4"  :data="deptData" :props="deptProps" default-expand-all :filter-node-method="deptFilterNode" @node-click="handleNodeClick" />
+            <el-tree ref="treeRef" class="filter-tree mt-4" :data="deptData" :props="deptProps" default-expand-all :filter-node-method="deptFilterNode" @node-click="handleNodeClick" />
           </el-scrollbar>
         </el-card>
       </el-col>
@@ -58,24 +58,24 @@
           </div>
           <el-table :data="tableData.data" style="width: 100%" @selection-change="handleSelectionChange">
             <el-table-column type="selection" width="55" align="center" />
-            <el-table-column type="index" label="序号" width="60" />
-            <el-table-column prop="userName" label="账户名称" show-overflow-tooltip></el-table-column>
-            <el-table-column prop="userNickname" label="用户昵称" show-overflow-tooltip></el-table-column>
+            <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="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="手机号" show-overflow-tooltip></el-table-column>
-            <el-table-column prop="userStatus" label="用户状态" show-overflow-tooltip>
+            <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)">
                 </el-switch>
               </template>
             </el-table-column>
-            <el-table-column prop="createdAt" label="创建时间" show-overflow-tooltip></el-table-column>
-            <el-table-column label="操作" width="150">
+            <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>
@@ -112,9 +112,8 @@ interface TableDataState {
 			pageNum: number;
 			pageSize: number;
 			deptId: string;
-			mobile: string;
-			status: string;
-			keyWords: string;
+			userNickname: string;
+			userName: string;
 			dateRange: string[];
 		};
 	};
@@ -139,27 +138,7 @@ export default defineComponent({
 				children: 'children',
 				label: 'deptName',
 			},
-			deptData: [
-				{
-					label: '集团总部',
-					children: [
-						{
-							label: '曲靖分部',
-							children: [
-								{
-									label: '总经办',
-								},
-								{
-									label: '市场部',
-								},
-								{
-									label: '研发部',
-								},
-							],
-						},
-					],
-				},
-			],
+			deptData: [],
 			tableData: {
 				data: [],
 				total: 0,
@@ -168,25 +147,23 @@ export default defineComponent({
 					pageNum: 1,
 					pageSize: 10,
 					deptId: '',
-					mobile: '',
-					status: '',
-					keyWords: '',
+					userNickname: '',
+					userName: '',
 					dateRange: [],
 				},
 			},
 		});
 		// 初始化表格数据
 		const initTableData = () => {
-			console.log(statusParams);
 			api.dept.getList(statusParams).then((res: any) => {
 				state.deptData = res;
 			});
 			userList();
 		};
 		const userList = () => {
-			getUserList(state.tableData.param).then((res: any) => {
-				state.tableData.data = res.data.userList ?? [];
-				state.tableData.total = res.data.total;
+			api.user.getList(state.tableData.param).then((res: any) => {
+				state.tableData.data = res.list;
+				state.tableData.total = res.total;
 			});
 		};
 		// 打开新增用户弹窗