Merge branch 'feature/chw' into 'master'

Feature/chw

See merge request product/kim3-web-vue/starter-web-vue!4

src/api/organization.js

+import { delReq, getReq, postReq, putReq } from '@/utils';
+
+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/components/FormMixin/index.js

+export default {
+    data() {
+        return {
+            type: 0,
+            form: {},
+        };
+    },
+    computed: {
+        isAdd() {
+            return this.type === 0;
+        },
+        isEdit() {
+            return this.type === 1;
+        },
+        isView() {
+            return this.type === 2;
+        },
+    },
+    methods: {
+        async submit() {
+            await this.$refs.DrawerForm.validate();
+            if (this.isAdd) {
+                return this?.add();
+            }
+            if (this.isEdit) {
+                return this?.edit();
+            }
+        },
+        setData(data, type) {
+            this.form = data;
+            this.type = type;
+        },
+    },
+};

src/components/table/index.vue

@@ -30,13 +30,12 @@
 
         <!-- 新增 -->
         <a-drawer
-            :title="addBtn.title || '新建'"
+            :title="title"
             placement="right"
             :visible="addVisible"
             @close="addDrawerClose"
             v-if="addBtn"
             :maskClosable="!!addBtn.maskClosable"
-            :closable="false"
             :drawerStyle="drawerStyle"
             :bodyStyle="bodyStyle"
             :width="addBtn.width || 600"
@@ -44,7 +43,7 @@
         >
             <div class="tw-overflow-y-hidden">
                 <div class="tw-overflow-y-auto tw-h-full">
-                    <slot name="add" />
+                    <slot name="drawer" />
                 </div>
             </div>
             <a-divider />
@@ -78,6 +77,7 @@ export default {
             pageSize: 10,
         };
         return {
+            title: '新增',
             data: [],
             queryForm: {
                 ...this.initQuery,
@@ -147,7 +147,19 @@ export default {
             }
             this.submitLoading = false;
         },
-        showAdd() {
+        show({ type, title } = {}) {
+            if (type === 0) {
+                this.title = '新增';
+            }
+            if (type === 1) {
+                this.title = '编辑';
+            }
+            if (type === 2) {
+                this.title = '查看';
+            }
+            if (title) {
+                this.title = title;
+            }
             this.addVisible = true;
         },
     },

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

+<template>
+    <my-table url="/api/v1/jobs" rowKey="jobId" :addBtn="addBtn" ref="table" noPage>
+        <template #drawer>
+            <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, 1)">编辑</a>
+                <a-divider type="vertical" />
+                <PopconfirmDelete :url="`/api/v1/jobs/${row.jobId}`" :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']?.show({ type });
+            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" ref="DrawerForm">
+        <a-form-model-item label="名称" prop="jobName">
+            <a-input v-model="form.jobName" :disabled="isView" />
+        </a-form-model-item>
+        <a-form-model-item label="描述" prop="jobDescription">
+            <a-textarea v-model="form.jobDescription" :disabled="isView" :rows="4" />
+        </a-form-model-item>
+    </a-form-model>
+</template>
+
+<script>
+import JobsApi from '@/api/organization';
+import FormMixin from '@/components/FormMixin';
+export default {
+    mixins: [FormMixin],
+    data() {
+        return {
+            rules: {
+                jobName: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
+                jobDescription: [
+                    { required: true, message: 'Please select Activity zone', trigger: 'change' },
+                ],
+            },
+        };
+    },
+    methods: {
+        add() {
+            return JobsApi.add({ ...this.form });
+        },
+        edit() {
+            return JobsApi.update({ ...this.form });
+        },
+    },
+};
+</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,
 };