Merge pull request #57 from Jzow/master

Add department add update delete api and views CC #41

src/api/sys/dept.ts

@@ -1,21 +1,42 @@
 import {
+    addOrUpdateDeptReq,
     DeptListItem,
     GetDeptInfoModel,
 } from './model/dpetModel';
 
 import { defHttp } from '/@/utils/http/axios';
-import {BaseDataResp} from "@/api/model/baseModel";
+import {BaseDataResp, BaseResp} from "@/api/model/baseModel";
+import {ErrorMessageMode} from "#/axios";
 
 enum Api {
     DeptList = '/dept/list',
     UserBindDept = '/dept/userBindDept',
+    AddOrUpdateDept = '/dept/addOrUpdate',
+    DeleteDept = '/dept/delete',
 }
-
-
 export function getDeptList(params?: DeptListItem) {
     return defHttp.get<BaseDataResp<GetDeptInfoModel>>({url: Api.DeptList, params})
 }
-
-export function getUserBindDept(params?: DeptListItem) {
+export function getUserBindDept() {
     return defHttp.get<BaseDataResp<GetDeptInfoModel>>({url: Api.UserBindDept})
+}
+
+export function addOrUpdateDept(params: addOrUpdateDeptReq, mode: ErrorMessageMode = 'notice') {
+    return defHttp.post<BaseResp>({
+            url: Api.AddOrUpdateDept, params},
+        {
+            errorMessageMode: mode,
+            successMessageMode: mode,
+        }
+    )
+}
+
+export function deleteDept(id: number | string, mode: ErrorMessageMode = 'notice') {
+    return defHttp.post<BaseResp>({
+            url: `${Api.DeleteDept}?id=${id}`},
+        {
+            errorMessageMode: mode,
+            successMessageMode: mode,
+        }
+    )
 }

src/api/sys/model/dpetModel.ts

@@ -17,7 +17,15 @@ export interface GetDeptInfoModel {
     parentId: string;
     // 排序
     sort: number;
-  }
-
+}
 
-export type DeptListGetResultModel = BasicFetchResult<DeptListItem>;
+export interface addOrUpdateDeptReq {
+    id: number | string;
+    deptName: string;
+    parentId: number;
+    deptNumber: string;
+    leader: string;
+    status: number;
+    remark: string;
+    sort: string;
+}

src/views/sys/department/DeptModal.vue

@@ -1,8 +1,80 @@
 <template>
-
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 
 <script lang="ts">
+import { defineComponent, ref, computed, unref } from 'vue';
+import { BasicModal, useModalInner } from '/@/components/Modal';
+import { BasicForm, useForm } from '/@/components/Form/index';
+import { formSchema } from './dept.data';
+
+import { getDeptList, addOrUpdateDept } from '/@/api/sys/dept';
+import {addOrUpdateDeptReq} from "@/api/sys/model/dpetModel";
+
+export default defineComponent({
+  name: 'DeptModal',
+  components: { BasicModal, BasicForm },
+  emits: ['success', 'register'],
+  setup(_, { emit }) {
+    const isUpdate = ref(true);
+
+    const [registerForm, { resetFields, setFieldsValue, updateSchema, validate }] = useForm({
+      labelWidth: 100,
+      baseColProps: { span: 24 },
+      schemas: formSchema,
+      showActionButtonGroup: false,
+    });
+
+    const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+      resetFields();
+      setModalProps({ confirmLoading: false });
+      isUpdate.value = !!data?.isUpdate;
+
+      if (unref(isUpdate)) {
+        setFieldsValue({
+          ...data.record,
+        });
+      }
+      const treeData = await getDeptList();
+      updateSchema({
+        field: 'parentDept',
+        componentProps: { treeData },
+      });
+    });
+
+    const getTitle = computed(() => (!unref(isUpdate) ? '新增部门' : '编辑部门'));
+
+    async function handleSubmit() {
+      try {
+        const values = await validate();
+
+        const deptObject: addOrUpdateDeptReq = {
+          id: values.id,
+          deptName: values.deptName,
+          parentId: values.parentId,
+          deptNumber: values.deptNumber,
+          leader: values.leader,
+          status: values.status,
+          remark: values.remark,
+          sort: values.sort,
+        };
+        console.info(deptObject);
+
+        const result = await addOrUpdateDept(deptObject);
+        if(result.code === 'A0009' || result.code === 'A0010') {
+          closeModal();
+          emit('success');
+        }
+      } finally {
+        setModalProps({confirmLoading: false});
+      }
+    }
+
+    return { registerModal, registerForm, getTitle, handleSubmit };
+  },
+});
 </script >
 
 <style scoped lang="less">

src/views/sys/department/dept.data.ts

@@ -1,6 +1,7 @@
 import {BasicColumn, FormSchema} from "@/components/Table";
 import { h } from 'vue';
 import { Tag } from 'ant-design-vue';
+import {getDeptList} from "@/api/sys/dept";
 
 export const columns: BasicColumn[] = [
     {
@@ -14,6 +15,11 @@ export const columns: BasicColumn[] = [
         dataIndex: 'deptNumber',
         width: 160,
     },
+    {
+        title: '部门负责人',
+        dataIndex: 'leader',
+        width: 160,
+    },
     {
         title: '状态',
         dataIndex: 'status',
@@ -45,4 +51,66 @@ export const searchFormSchema: FormSchema[] = [
         component: 'Input',
         colProps: { span: 8 },
     }
-]
+]
+
+export const formSchema: FormSchema[] = [
+    {
+        field: 'id',
+        label: '部门ID',
+        component: 'Input',
+        show: false,
+    },
+    {
+        field: 'deptName',
+        label: '部门名称',
+        component: 'Input',
+        required: true,
+    },
+    {
+        field: 'deptNumber',
+        label: '部门编号',
+        component: 'Input',
+    },
+    {
+        field: 'parentId',
+        label: '上级部门',
+        component: 'ApiTreeSelect',
+        helpMessage: ['如果不填写，则默认为父级部门'],
+        componentProps: {
+            api: getDeptList,
+            resultField: 'data',
+            labelField: 'deptName',
+            valueField: 'id',
+            childrenField: 'children',
+        },
+    },
+    {
+        field: 'leader',
+        label: '部门负责人',
+        component: 'Input',
+    },
+    {
+        field: 'status',
+        label: '状态',
+        component: 'RadioButtonGroup',
+        defaultValue: 0,
+        componentProps: {
+            options: [
+                { label: '启用', value: 0 },
+                { label: '停用', value: 1 },
+            ],
+        },
+        required: true,
+    },
+
+    {
+        field: 'sort',
+        label: '排序',
+        component: 'InputNumber',
+    },
+    {
+        label: '备注',
+        field: 'remark',
+        component: 'InputTextArea',
+    },
+];

src/views/sys/department/index.vue

@@ -36,6 +36,7 @@ import {getDeptList} from '/@/api/sys/dept'
 import {useModal} from '/@/components/Modal'
 import DeptModal from './DeptModal.vue';
 import {columns, searchFormSchema} from './dept.data';
+import { deleteDept } from "@/api/sys/dept";
 
 export default defineComponent({
   name: 'DeptManagement',
@@ -79,8 +80,11 @@ export default defineComponent({
       });
     }
 
-    function handleDelete(record: Recordable) {
-      console.log(record);
+    async function handleDelete(record: Recordable) {
+      const result = await deleteDept(record.id);
+      if (result.code === 'A0011') {
+        await reload();
+      }
     }
 
     function handleSuccess() {

src/views/sys/user/account.data.ts

@@ -4,7 +4,7 @@ import { h } from 'vue';
 import { Switch } from 'ant-design-vue';
 import { useMessage } from '/@/hooks/web/useMessage';
 import { updateStatus } from "@/api/sys/user";
-import {getDeptList, getUserBindDept} from "@/api/sys/dept";
+import {getDeptList} from "@/api/sys/dept";
 import { getRoleList } from "@/api/sys/role";
 
 const { t } = useI18n();