岗位管理

src/api/organization.js

+import { delReq, getReq, postReq, putReq } from '@/utils';
+
+// export function delMenuApi(id) {
+//     return delReq(`/api/v1/menus/${id}`);
+// }
+
+// export function getMenuDataApi() {
+//     return getReq('/api/v1/menus');
+// }
+
+// export function addMenuApi(data) {
+//     return postReq('/api/v1/menus', data);
+// }
+
+function addJobsApi(data) {
+    return postReq('/api/v1/jobs', data);
+}
+
+function updateJobsApi(data) {
+    return putReq('/api/v1/jobs', data);
+}
+
+export default {
+    add: addJobsApi,
+    update: updateJobsApi,
+};

src/pages/system/view/organization/jobmanagement/JobManagement.vue

+<template>
+    <my-table url="/api/v1/jobs" rowKey="jobId" :addBtn="addBtn" ref="table">
+        <template #add>
+            <Form ref="form" />
+        </template>
+        <template #search="{ query }">
+            <a-form-model-item label="名称">
+                <a-input v-model="query.jobName" />
+            </a-form-model-item>
+        </template>
+
+        <a-table-column title="名称" data-index="jobName" />
+        <a-table-column title="描述" data-index="jobDescription" />
+        <a-table-column title="操作">
+            <template #default="row">
+                <a @click="() => view(row)">编辑</a>
+                <a-divider type="vertical" />
+                <PopconfirmDelete :url="`/api/v1/roles/${row.roleId}`" :cb="refreshTable" />
+            </template>
+        </a-table-column>
+    </my-table>
+</template>
+<script>
+import Form from './form.vue';
+import PopconfirmDelete from '@/components/popconfirm_delete/index.vue';
+export default {
+    components: { Form, PopconfirmDelete },
+    data() {
+        return {
+            addBtn: { width: 600, onOk: () => this.$refs['form']?.submit() },
+        };
+    },
+    methods: {
+        refreshTable() {
+            this.$refs['table']?.getData();
+        },
+        view(data, type) {
+            this.$refs['table']?.showAdd();
+            this.$nextTick(() => {
+                this.$refs['form'].setData(data, type);
+            });
+        },
+    },
+};
+</script>
\ No newline at end of file

src/pages/system/view/organization/jobmanagement/form.vue

+<template>
+    <a-form-model layout="vertical" :model="form" :rules="rules">
+        <a-form-model-item label="名称">
+            <a-input v-model="form.jobName" :disabled="isView" />
+        </a-form-model-item>
+        <a-form-model-item label="描述">
+            <a-textarea v-model="form.jobDescription" :disabled="isView" :rows="4" />
+        </a-form-model-item>
+    </a-form-model>
+</template>
+
+<script>
+import JobsApi from '@/api/organization';
+export default {
+    data() {
+        return {
+            type: 0,
+            form: {},
+            rules: {},
+            checkedKeys: [],
+        };
+    },
+    computed: {
+        isAdd() {
+            return this.type === 0;
+        },
+        isEdit() {
+            return this.type === 1;
+        },
+        isView() {
+            return this.type === 2;
+        },
+    },
+    methods: {
+        submit() {
+            if (this.isEdit) {
+                return JobsApi.add({ ...this.form });
+            }
+            if (this.isAdd) {
+                return JobsApi.update({ ...this.form });
+            }
+        },
+        setData(data, type) {
+            this.form = data;
+            this.type = type;
+        },
+    },
+};
+</script>

src/pages/system/view/organization/jobmanagement/index.js

+import JobManagement from './JobManagement';
+
+export default JobManagement;

src/router/config.js

@@ -73,7 +73,14 @@ const options = {
                         {
                             path: 'organization_management',
                             name: '组织管理',
-                            component: () => import('@/pages/system/view/organization'),
+                            component: BlankTemplateView,
+                            children: [
+                                {
+                                    path: 'job_management',
+                                    name: '岗位管理',
+                                    component: () => import('@/pages/system/view/organization/jobmanagement'),
+                                },
+                            ],
                         },
                         {
                             path: 'user_management',

src/utils/requestUtil.js

@@ -145,6 +145,10 @@ function postReq(url, data, config) {
     return request(url, METHOD.POST, data, config);
 }
 
+function putReq(url, data, config) {
+    return request(url, METHOD.PUT, data, config);
+}
+
 export {
     METHOD,
     request,
@@ -156,4 +160,5 @@ export {
     delReq,
     getReq,
     postReq,
+    putReq,
 };