Browse Source

完善岗位的增删改查

yanglzh 3 năm trước cách đây
mục cha
commit
eea4b409a7

+ 0 - 42
src/api/system/config/index.ts

@@ -1,42 +0,0 @@
-import request from '/@/utils/request';
-
-
-export function getConfigList(query:Object) {
-    return request({
-        url: '/common/config/list',
-        method: 'get',
-        params:query
-    })
-}
-
-export function getConfig(id:number) {
-    return request({
-        url: '/common/config/get',
-        method: 'get',
-        params:{id}
-    })
-}
-
-export function addConfig(data:any) {
-    return request({
-        url: '/common/config/add',
-        method: 'post',
-        data:data
-    })
-}
-
-export function editConfig(data:any) {
-    return request({
-        url: '/common/config/edit',
-        method: 'put',
-        data:data
-    })
-}
-
-export function deleteConfig(ids:number[]) {
-    return request({
-        url: '/common/config/delete',
-        method: 'delete',
-        data:{ids}
-    })
-}

+ 7 - 0
src/api/system/index.ts

@@ -20,6 +20,13 @@ export default {
     add: (data: object) => post('/system/dept/add', data),
     edit: (data: object) => put('/system/dept/edit', data),
   },
+  post: {
+    getList: (params: object) => get('/system/post/tree', params),
+    detail: (postId: number) => get('/system/post/detail', { postId }),
+    del: (postId: number) => del('/system/post/del', { postId }),
+    add: (data: object) => post('/system/post/add', data),
+    edit: (data: object) => put('/system/post/edit', data),
+  },
   user: {
     getList: (params: object) => get('/system/user/list', params),
     detail: (id: number) => get('/system/user/getInfoById', { id }),

+ 0 - 35
src/api/system/post/index.ts

@@ -1,35 +0,0 @@
-import request from '/@/utils/request';
-
-export function getPostList(query:Object) {
-    return request({
-        url: '/system/post/list',
-        method: 'get',
-        params:query
-    })
-}
-
-export function addPost(data:object) {
-    return request({
-        url: '/system/post/add',
-        method: 'post',
-        data:data
-    })
-}
-
-
-export function editPost(data:object) {
-    return request({
-        url: '/system/post/edit',
-        method: 'put',
-        data:data
-    })
-}
-
-
-export function deletePost(ids:number[]) {
-    return request({
-        url: '/system/post/delete',
-        method: 'delete',
-        data:{ids}
-    })
-}

+ 106 - 102
src/views/system/post/component/editPost.vue

@@ -1,16 +1,16 @@
 <template>
-	<div class="system-edit-post-container">
-		<el-dialog v-model="isShowDialog" width="769px">
+  <div class="system-edit-post-container">
+    <el-dialog v-model="isShowDialog" width="769px">
       <template #title>
         <div v-drag="['.system-edit-post-container .el-dialog', '.system-edit-post-container .el-dialog__header']">{{(formData.postId===0?'添加':'修改')+'岗位'}}</div>
       </template>
-			<el-form ref="formRef" :model="formData" :rules="rules" size="default" label-width="90px">
+      <el-form ref="formRef" :model="formData" :rules="rules" size="default" label-width="90px">
         <el-form-item label="岗位名称" prop="postName">
           <el-input v-model="formData.postName" placeholder="请输入岗位名称" />
         </el-form-item>
-        <el-form-item label="岗位编码" prop="postCode">
+        <!-- <el-form-item label="岗位编码" prop="postCode">
           <el-input v-model="formData.postCode" placeholder="请输入编码名称" />
-        </el-form-item>
+        </el-form-item> -->
         <el-form-item label="岗位顺序" prop="postSort">
           <el-input-number v-model="formData.postSort" controls-position="right" :min="0" />
         </el-form-item>
@@ -20,75 +20,75 @@
         <el-form-item label="备注" prop="remark">
           <el-input v-model="formData.remark" type="textarea" placeholder="请输入内容" />
         </el-form-item>
-			</el-form>
-			<template #footer>
-				<span class="dialog-footer">
-					<el-button @click="onCancel" size="default">取 消</el-button>
-					<el-button type="primary" @click="onSubmit" size="default" :loading="loading">{{formData.postId===0?'新 增':'修 改'}}</el-button>
-				</span>
-			</template>
-		</el-dialog>
-	</div>
+      </el-form>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="onCancel" size="default">取 消</el-button>
+          <el-button type="primary" @click="onSubmit" size="default" :loading="loading">{{formData.postId===0?'新 增':'修 改'}}</el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </div>
 </template>
 
 <script lang="ts">
-import { reactive, toRefs, defineComponent,ref,unref } from 'vue';
-import {addPost, editPost} from "/@/api/system/post";
-import {ElMessage} from "element-plus";
+import { reactive, toRefs, defineComponent, ref, unref } from 'vue';
+import api from '/@/api/system';
+import { ElMessage } from 'element-plus';
 
 interface DialogRow {
-  postId:number;
-  postCode:string;
-  postName:string;
-  postSort:number;
-  status:number;
-  remark:string;
+	postId?: number;
+	parentId: number;
+	// postCode:string;
+	postName: string;
+	postSort: number;
+	status: number;
+	remark: string;
 }
 interface PostState {
-  loading:boolean;
+	loading: boolean;
 	isShowDialog: boolean;
 	formData: DialogRow;
-  menuExpand:boolean;
-  menuNodeAll:boolean;
-  menuCheckStrictly:boolean;
+	menuExpand: boolean;
+	menuNodeAll: boolean;
+	menuCheckStrictly: boolean;
 	menuProps: {
 		children: string;
 		label: string;
 	};
-  rules: object;
+	rules: object;
 }
+const baseForm = {
+	parentId: -1,
+	// postCode:'',
+	postName: '',
+	postSort: 0,
+	status: 1,
+	remark: '',
+};
 
 export default defineComponent({
 	name: 'systemEditPost',
-	setup(props,{emit}) {
-    const formRef = ref<HTMLElement | null>(null);
-    const menuRef = ref();
+	setup(props, { emit }) {
+		const formRef = ref<HTMLElement | null>(null);
+		const menuRef = ref();
 		const state = reactive<PostState>({
-      loading:false,
+			loading: false,
 			isShowDialog: false,
 			formData: {
-        postId:0,
-        postCode:'',
-        postName:'',
-        postSort:0,
-        status:1,
-        remark:'',
+				...baseForm,
 			},
-      // 表单校验
-      rules: {
-        postName: [
-          { required: true, message: "岗位名称不能为空", trigger: "blur" }
-        ],
-        postCode: [
-          { required: true, message: "岗位编码不能为空", trigger: "blur" }
-        ],
-        postSort: [
-          { required: true, message: "岗位顺序不能为空", trigger: "blur" }
-        ]
-      },
-      menuExpand:false,
-      menuNodeAll:false,
-      menuCheckStrictly:false,
+			// 表单校验
+			rules: {
+				postName: [{ required: true, message: '岗位名称不能为空', trigger: 'blur' }],
+				// postCode: [
+				//   { required: true, message: "岗位编码不能为空", trigger: "blur" }
+				// ],
+				postSort: [{ required: true, message: '岗位顺序不能为空', trigger: 'blur' }],
+			},
+			menuExpand: false,
+			menuNodeAll: false,
+			menuCheckStrictly: false,
 			menuProps: {
 				children: 'children',
 				label: 'title',
@@ -96,10 +96,10 @@ export default defineComponent({
 		});
 		// 打开弹窗
 		const openDialog = (row?: DialogRow) => {
-      resetForm();
-      if(row) {
-        state.formData = row;
-      }
+			resetForm();
+			if (row) {
+				state.formData = row;
+			}
 			state.isShowDialog = true;
 		};
 		// 关闭弹窗
@@ -112,54 +112,58 @@ export default defineComponent({
 		};
 		// 新增
 		const onSubmit = () => {
-      const formWrap = unref(formRef) as any;
-      if (!formWrap) return;
-      formWrap.validate((valid: boolean) => {
-        if (valid) {
-          state.loading = true;
-          if(state.formData.postId===0){
-            //添加
-            addPost(state.formData).then(()=>{
-              ElMessage.success('岗位添加成功');
-              closeDialog(); // 关闭弹窗
-              emit('getPostList')
-            }).finally(()=>{
-              state.loading = false;
-            })
-          }else{
-            //修改
-            editPost(state.formData).then(()=>{
-              ElMessage.success('岗位修改成功');
-              closeDialog(); // 关闭弹窗
-              emit('getPostList')
-            }).finally(()=>{
-              state.loading = false;
-            })
-          }
-        }
-      });
+			const formWrap = unref(formRef) as any;
+			if (!formWrap) return;
+			formWrap.validate((valid: boolean) => {
+				if (valid) {
+					state.loading = true;
+					if (!state.formData.parentId) {
+						state.formData.parentId = -1;
+					}
+					if (!state.formData.postId) {
+						//添加
+						api.post
+							.add(state.formData)
+							.then(() => {
+								ElMessage.success('岗位添加成功');
+								closeDialog(); // 关闭弹窗
+								emit('getPostList');
+							})
+							.finally(() => {
+								state.loading = false;
+							});
+					} else {
+						//修改
+						api.post
+							.edit(state.formData)
+							.then(() => {
+								ElMessage.success('岗位修改成功');
+								closeDialog(); // 关闭弹窗
+								emit('getPostList');
+							})
+							.finally(() => {
+								state.loading = false;
+							});
+					}
+				}
+			});
+		};
+		const resetForm = () => {
+			state.menuCheckStrictly = false;
+			state.menuExpand = false;
+			state.menuNodeAll = false;
+			state.formData = {
+				...baseForm
+			};
 		};
-    const resetForm = ()=>{
-      state.menuCheckStrictly=false;
-      state.menuExpand = false;
-      state.menuNodeAll = false;
-      state.formData = {
-        postId:0,
-        postCode:'',
-        postName:'',
-        postSort:0,
-        status:1,
-        remark:'',
-      }
-    };
 
 		return {
 			openDialog,
 			closeDialog,
 			onCancel,
 			onSubmit,
-      menuRef,
-      formRef,
+			menuRef,
+			formRef,
 			...toRefs(state),
 		};
 	},
@@ -168,10 +172,10 @@ export default defineComponent({
 
 <style scoped lang="scss">
 .tree-border {
-  margin-top: 5px;
-  border: 1px solid #e5e6e7!important;
-  background: #fff none!important;
-  border-radius: 4px;
+	margin-top: 5px;
+	border: 1px solid #e5e6e7 !important;
+	background: #fff none !important;
+	border-radius: 4px;
 }
 .system-edit-post-container {
 	.menu-data-tree {

+ 81 - 102
src/views/system/post/index.vue

@@ -1,18 +1,19 @@
 <template>
-	<div class="system-post-container">
-		<el-card shadow="hover">
-			<div class="system-user-search mb15">
+  <div class="system-post-container">
+    <el-card shadow="hover">
+      <div class="system-user-search mb15">
         <el-form :inline="true">
           <el-form-item label="岗位名称">
-            <el-input size="default" v-model="tableData.param.postName" placeholder="请输入岗位名称" class="w-50 m-2" clearable/>
+            <el-input size="default" v-model="tableData.param.postName" placeholder="请输入岗位名称" class="w-50 m-2" clearable />
           </el-form-item>
           <el-form-item label="岗位编码">
-            <el-input size="default" v-model="tableData.param.postCode" placeholder="请输入岗位编码" class="w-50 m-2" clearable/>
+            <el-input size="default" v-model="tableData.param.postCode" placeholder="请输入岗位编码" class="w-50 m-2" clearable />
           </el-form-item>
           <el-form-item label="状态">
             <el-select size="default" placeholder="请选择状态" class="w-50 m-2" v-model="tableData.param.status" clearable>
-              <el-option label="启用"  value="1" />
-              <el-option label="禁用"  value="0" />
+              <el-option label="全部" :value="-1" />
+              <el-option label="启用" :value="1" />
+              <el-option label="禁用" :value="0" />
             </el-select>
           </el-form-item>
           <el-form-item>
@@ -28,113 +29,101 @@
               </el-icon>
               新增岗位
             </el-button>
-            <el-button size="default" type="danger" class="ml10" @click="onRowDel(null)">
+            <!-- <el-button size="default" type="danger" class="ml10" @click="onRowDel(null)">
               <el-icon>
                 <ele-Delete />
               </el-icon>
               删除岗位
-            </el-button>
+            </el-button> -->
           </el-form-item>
         </el-form>
-			</div>
-			<el-table :data="tableData.data" style="width: 100%" @selection-change="handleSelectionChange">
+      </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="postCode" label="岗位编码" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="postName" label="岗位名称" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="postSort" label="排序" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="status" label="岗位状态" show-overflow-tooltip>
-					<template #default="scope">
-						<el-tag type="success" v-if="scope.row.status===1">启用</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></el-table-column>
-				<el-table-column label="操作" width="100">
-					<template #default="scope">
-						<el-button size="small" type="text" @click="onOpenEditPost(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="postList"
-      />
-		</el-card>
-		<EditPost ref="editPostRef" @getPostList="postList"/>
-	</div>
+        <el-table-column type="index" label="序号" width="60" align="center" />
+        <el-table-column prop="postCode" label="岗位编码" width="180" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="postName" label="岗位名称" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="postSort" label="排序" width="60" align="center"></el-table-column>
+        <el-table-column prop="status" label="岗位状态" width="120" align="center">
+          <template #default="scope">
+            <el-tag type="success" v-if="scope.row.status===1">启用</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="创建时间" width="180" align="center"></el-table-column>
+        <el-table-column label="操作" width="100">
+          <template #default="scope">
+            <el-button size="small" text type="warning" @click="onOpenEditPost(scope.row)">修改</el-button>
+            <el-button size="small" text type="danger" @click="onRowDel(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <EditPost ref="editPostRef" @getPostList="postList" />
+  </div>
 </template>
 
 <script lang="ts">
-import {toRefs, reactive, onMounted, ref, defineComponent, toRaw} from 'vue';
+import { toRefs, reactive, onMounted, ref, defineComponent, toRaw } from 'vue';
 import { ElMessageBox, ElMessage } from 'element-plus';
 import EditPost from '/@/views/system/post/component/editPost.vue';
-import {deletePost, getPostList} from "/@/api/system/post";
+import api from '/@/api/system';
 // 定义接口来定义对象的类型
 interface TableData {
-  postId:number;
-  postCode:string;
-  postName:string;
-  postSort:number;
-  status:number;
-  remark:string;
-  createdAt:string;
+	postId: number;
+	postCode: string;
+	postName: string;
+	postSort: number;
+	status: number;
+	remark: string;
+	createdAt: string;
 }
 interface TableDataState {
-  ids:number[];
+	ids: number[];
 	tableData: {
 		data: Array<TableData>;
 		total: number;
 		loading: boolean;
 		param: {
-      postName:string;
-      status:string;
-      postCode:string;
-			pageNum: number;
-			pageSize: number;
+			postName: string;
+			status: number;
+			postCode?: string;
 		};
 	};
 }
 
 export default defineComponent({
 	name: 'apiV1SystemPostList',
-	components: {EditPost},
+	components: { EditPost },
 	setup() {
 		const addPostRef = ref();
 		const editPostRef = ref();
 		const state = reactive<TableDataState>({
-      ids:[],
+			ids: [],
 			tableData: {
 				data: [],
 				total: 0,
 				loading: false,
 				param: {
-          postName:'',
-          status:'',
-          postCode:'',
-					pageNum: 1,
-					pageSize: 10,
+					postName: '',
+					status: -1,
+					postCode: '',
 				},
 			},
 		});
 		// 初始化表格数据
 		const initTableData = () => {
-			postList()
+			postList();
+		};
+		const postList = () => {
+			api.post.getList(state.tableData.param).then((res: any) => {
+				state.tableData.data = res;
+			});
 		};
-    const postList = ()=>{
-      getPostList(state.tableData.param).then(res=>{
-        state.tableData.data = res.data.postList??[];
-        state.tableData.total = res.data.total;
-      })
-    };
 		// 打开新增岗位弹窗
 		const onOpenAddPost = () => {
-      editPostRef.value.openDialog();
+			editPostRef.value.openDialog();
 		};
 		// 打开修改岗位弹窗
 		const onOpenEditPost = (row: Object) => {
@@ -142,57 +131,47 @@ export default defineComponent({
 		};
 		// 删除岗位
 		const onRowDel = (row: any) => {
-      let msg = '你确定要删除所选岗位?';
-      let ids:number[] = [] ;
-      if(row){
-        msg = `此操作将永久删除岗位:“${row.postName}”,是否继续?`
-        ids = [row.postId]
-      }else{
-        ids = state.ids
-      }
-      if(ids.length===0){
-        ElMessage.error('请选择要删除的数据。');
-        return
-      }
+			let msg = '你确定要删除所选岗位?';
+			// let ids: number[] = [];
+			// if (row) {
+			msg = `此操作将永久删除岗位:“${row.postName}”,是否继续?`;
+			// ids = [row.postId];
+			// } else {
+			// 	ids = state.ids;
+			// }
+			// if (ids.length === 0) {
+			// 	ElMessage.error('请选择要删除的数据。');
+			// 	return;
+			// }
 			ElMessageBox.confirm(msg, '提示', {
 				confirmButtonText: '确认',
 				cancelButtonText: '取消',
 				type: 'warning',
 			})
 				.then(() => {
-          deletePost(ids).then(()=>{
-            ElMessage.success('删除成功');
-            postList();
-          })
+					api.post.del(row.postId).then(() => {
+						ElMessage.success('删除成功');
+						postList();
+					});
 				})
 				.catch(() => {});
 		};
-		// 分页改变
-		const onHandleSizeChange = (val: number) => {
-			state.tableData.param.pageSize = val;
-		};
-		// 分页改变
-		const onHandleCurrentChange = (val: number) => {
-			state.tableData.param.pageNum = val;
-		};
 		// 页面加载时
 		onMounted(() => {
 			initTableData();
 		});
-    // 多选框选中数据
-    const handleSelectionChange = (selection:Array<TableData>)=> {
-      state.ids = selection.map(item => item.postId)
-    };
+		// 多选框选中数据
+		const handleSelectionChange = (selection: Array<TableData>) => {
+			state.ids = selection.map((item) => item.postId);
+		};
 		return {
 			addPostRef,
 			editPostRef,
 			onOpenAddPost,
 			onOpenEditPost,
 			onRowDel,
-			onHandleSizeChange,
-			onHandleCurrentChange,
-      postList,
-      handleSelectionChange,
+			postList,
+			handleSelectionChange,
 			...toRefs(state),
 		};
 	},

+ 1 - 0
src/views/system/user/index.vue

@@ -21,6 +21,7 @@
               </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="1" />
                   <el-option label="禁用" :value="0" />
                 </el-select>