增加前端请求超时配置

用户部门优化（用户所属部门改为列表，增加是否同步配置项） switch组件支持自定义值基本表格可编辑字段组件增加onUpdate支持响应式
2024-11-28 15:47:59 +08:00
parent 4231f1dd6d
commit 020a0a20ee
12 changed files with 172 additions and 18 deletions
--- a/src/views/system/department/components/DeptDrawer.vue
+++ b/src/views/system/department/components/DeptDrawer.vue
@ -88,7 +88,7 @@
      label: '组织简称',
      component: 'Input',
      componentProps: {
-        placeholder: '请输入公司简称',
+        placeholder: '请输入组织简称',
      },
      colProps: { lg: 12, md: 12 },
    },
@ -129,6 +129,18 @@
              placeholder: '请选择行政区域'
          },
      },
+      {
+          field: 'isSync',
+          label: '同步',
+          component: 'Switch',
+          colProps: { span: 12 },
+          helpMessage: '开启同步则会自动修正与域里人员组织数据一致，域里不存在的组织和下级人员组织将被删除',
+          helpComponentProps: { maxWidth: '400px' },
+          componentProps: {
+              checkedValue: 'Y',
+              unCheckedValue: 'N',
+          }
+      },
  ];

  const companySchema: FormSchema[] = [
--- a/src/views/system/department/index.vue
+++ b/src/views/system/department/index.vue
@ -68,7 +68,7 @@
    import { useMessage } from '/@/hooks/web/useMessage';
    // import { useI18n } from 'vue-i18n';
    import { SelectMember } from '/@/components/SelectOrganizational/index';
-    import { deleteDepartment, getDepartmentEnabledTree, getDepartmentTrees, getDepartmentUserList, updateDepartmentUser } from '/@/api/system/department';
+    import { deleteDepartment, getDepartmentTrees, getDepartmentUserList, updateDepartmentUser } from '/@/api/system/department';
    import { useI18n } from '/@/hooks/web/useI18n';

    const { t } = useI18n();
--- a/src/views/system/user/components/OrganizationModal.vue
+++ b/src/views/system/user/components/OrganizationModal.vue
@ -7,7 +7,7 @@
    :fixedHeight="true"
    @ok="handleSubmit"
  >
-    <a-tabs v-model:activeKey="activeKey" @change="handleTabChange">
+    <a-tabs v-model:activeKey="activeKey" @change="handleTabChange" :class="{ 'h-full': ['1', '2'].includes(activeKey) }">
      <a-tab-pane key="1" tab="全部">
        <BasicTable @register="registerTableAll" />
      </a-tab-pane>
@ -63,7 +63,7 @@

  const emits = defineEmits(['success']);
  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
-    setModalProps({ confirmLoading: false });
+    setModalProps({ confirmLoading: false, fixedHeight: true });
    setSelectedRowKeys1(data.orgs?.map((x) => x.id) || []);
    reload();
  });
@ -138,8 +138,12 @@
  };
 </script>
 <style lang="less" scoped>
+  :deep(.ant-tabs-content),
  :deep(.vben-basic-table .ant-table-wrapper) {
-    height: auto;
+    height: 100%;
+  }
+  :deep(.vben-basic-table .ant-table) {
+      height: calc(100% - 40px);
  }

  :deep(.ant-tabs-nav-wrap) {
--- a/src/views/system/user/components/UserModal.vue
+++ b/src/views/system/user/components/UserModal.vue
@ -2,7 +2,7 @@
  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
    <a-tabs
      v-model:activeKey="activeKey"
-      :class="{ 'h-full': ['3', '4', '5'].includes(activeKey) }"
+      :class="{ 'h-full': ['3', '4', '5', '6'].includes(activeKey) }"
    >
      <a-tab-pane key="1" tab="基础信息">
        <BasicForm @register="registerForm1" :style="{ 'margin-right': '10px' }">
@ -79,10 +79,24 @@
          </template>
        </BasicTable>
      </a-tab-pane>
+        <a-tab-pane key="6" tab="所属部门" force-render>
+            <BasicTable @register="registerTable4">
+                <template #headerCell="{ column }">
+                    <template v-if="column.flag === 'INDEX'">
+                        <plus-outlined :style="{ color: '#5E95FF' }" @click="handleDeptCreate" />
+                    </template>
+                    <template v-else>{{ column.customTitle }}</template>
+                </template>
+                <template #action="{ index }">
+                    <a-button type="link" danger @click="handleDelete(index, 4)">删除</a-button>
+                </template>
+            </BasicTable>
+        </a-tab-pane>
    </a-tabs>
    <RoleModal @register="registerRoleModal" @success="handleRoleSuccess" />
    <PostModal @register="registerPostModal" @success="handlePostSuccess" />
    <OrganizationModal @register="registerOrgModal" @success="handleOrgSuccess" />
+      <OrganizationModal @register="registerDeptModal" @success="handleDeptSuccess" />
  </BasicModal>
 </template>
 <script lang="ts" setup>
@ -138,7 +152,7 @@
      label: t('所属机构'),
      component: 'Dept',
      componentProps: {
-        placeholder: '请选择所属机构',
+        placeholder: '请从所属部门进行修改',
        fieldNames: {
          label: 'name',
          key: 'id',
@ -147,8 +161,9 @@
        isArray: true,
        multiple: true,
        getPopupContainer: () => document.body,
+          disabled:true
      },
-      required: true,
+      //required: true,
      colProps: { span: 12 },
    },
    {
@ -258,6 +273,18 @@
        placeholder: '请输入排序',
      },
    },
+      {
+          field: 'isSync',
+          label: '同步',
+          component: 'Switch',
+          colProps: { span: 12 },
+          helpMessage: '开启同步则会自动修正与域里人员组织数据一致，域里不存在的用户将被删除',
+          helpComponentProps: { maxWidth: '400px' },
+          componentProps: {
+              checkedValue: 'Y',
+              unCheckedValue: 'N',
+          }
+      },
    {
      label: t('备注'),
      field: 'remark',
@ -426,6 +453,62 @@
      align: 'left',
    },
  ];
+  const deptColumns: BasicColumn[] = [
+      {
+          title: t('组织编码'),
+          dataIndex: 'code',
+          align: 'left',
+          width:120
+      },
+      {
+          title: t('组织名称'),
+          dataIndex: 'name',
+          align: 'left',
+          width:120
+      },
+      {
+          title: t('组织路径'),
+          dataIndex: 'hierarchy',
+          align: 'left',
+      },
+      {
+          dataIndex: 'isSync',
+          title: '是否同步',
+          width:100,
+          edit:true,
+          editComponent: 'Switch',
+          //editRule:false,
+          helpMessage: '开启同步则会自动修正与域里人员组织数据一致，域里不存在的组织和下级人员组织将被删除',
+          editComponentProps: {
+              checkedValue: 'Y',
+              unCheckedValue: 'N',
+          },
+          editValueMap: (value) => {
+              return value=='Y' ? '是' : '否';
+          },
+      },
+      {
+          dataIndex: 'isMain',
+          title: '是否主部门',
+          width:100,
+          edit:true,
+          editComponent: 'Switch',
+          editComponentProps: {
+              checkedValue: 'Y',
+              unCheckedValue: 'N',
+          },
+          editValueMap: (value) => {
+              return value=='Y' ? '是' : '否';
+          },
+      },
+      {
+          dataIndex: 'sortCode',
+          title: '排序',
+          width:120,
+          edit:true,
+          editComponent: 'InputNumber'
+      },
+  ];
  const emit = defineEmits(['success', 'register']);
  const { notification } = useMessage();
  const isUpdate = ref(true);
@ -438,6 +521,7 @@
  const roleDatasource = ref<any[]>([]);
  const postDatasource = ref<any[]>([]);
  const orgDatasource = ref<any[]>([]);
+  const deptDatasource = ref<any[]>([]);

  const [
    registerForm1,
@ -507,17 +591,30 @@
    },
  });

+  const [registerTable4, { setTableData: setTableData4 }] = useTable({
+      rowKey: 'id',
+      dataSource: deptDatasource.value,
+      columns: deptColumns,
+      striped: false,
+      actionColumn: {
+          width: 80,
+          title: t('操作'),
+          dataIndex: 'action',
+          slots: { customRender: 'action' },
+      },
+  });
+
  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
    resetFields1();
    resetFields2();
-    setModalProps({ confirmLoading: false, width: 800, fixedHeight: true, destroyOnClose: true });
+    setModalProps({ confirmLoading: false, width: 1000, fixedHeight: true, destroyOnClose: true });
    activeKey.value = '1';
    isUpdate.value = !!data?.isUpdate;
    roleDatasource.value = [];
    if (unref(isUpdate)) {
      rowId.value = data.id;
      const record = await getUser(data.id);
-      const departmentIds = record.departmentIds.split(',');
+      const departmentIds = record.departmentIds?.split(',')||[];
      setFieldsValue1({
        ...record,
        departmentIds,
@ -528,10 +625,12 @@
      roleDatasource.value = record.roles || [];
      postDatasource.value = record.posts || [];
      orgDatasource.value = record.chargeDepartments || [];
+        deptDatasource.value = record.departments || [];

      setTableData1(roleDatasource.value);
      setTableData2(postDatasource.value);
      setTableData3(orgDatasource.value);
+        setTableData4(deptDatasource.value);
    }
    const treeData = await getDepartmentTree();

@ -549,6 +648,7 @@
  const [registerRoleModal, { openModal: openRoleModal }] = useModal();
  const [registerPostModal, { openModal: openPostModal }] = useModal();
  const [registerOrgModal, { openModal: openOrgModal }] = useModal();
+  const [registerDeptModal, { openModal: openDeptModal }] = useModal();

  const getTitle = computed(() => (!unref(isUpdate) ? t('新增用户') : t('编辑用户')));

@ -588,6 +688,11 @@
      orgs: orgDatasource.value,
    });
  };
+  const handleDeptCreate = () => {
+      openDeptModal(true, {
+          orgs: deptDatasource.value,
+      });
+  };
  const handleDelete = (index, type) => {
    switch (type) {
      case 1:
@ -599,6 +704,9 @@
      case 3:
        orgDatasource.value.splice(index, 1);
        break;
+      case 4:
+        deptDatasource.value.splice(index, 1);
+        break;
    }
  };

@ -614,6 +722,20 @@
    orgDatasource.value = data;
    setTableData3(orgDatasource.value);
  };
+  const handleDeptSuccess = (data) => {
+      //重复的保留列表中的值
+      data.forEach(item=>{
+         const exitsItem=deptDatasource.value.find(x=>x.id==item.id);
+         if(exitsItem){
+             item.hierarchy=exitsItem.hierarchy;
+             item.isMain=exitsItem.isMain;
+             item.isSync=exitsItem.isSync;
+             item.sortCode=exitsItem.sortCode;
+         }
+      });
+      deptDatasource.value = data;
+      setTableData4(deptDatasource.value);
+  };
  async function handleSubmit() {
    try {
      const values = await validate1();
@ -621,13 +743,15 @@
      const roleIds = roleDatasource.value?.map((x) => x.id);
      const postIds = postDatasource.value?.map((x) => x.id);
      const chargeDepartmentIds = orgDatasource.value?.map((x) => x.id);
+      const departments=deptDatasource.value;
      const data = {
        ...values,
        ...values2,
-        departmentIds: values.departmentIds.toString(),
+        departmentIds: values.departmentIds?.toString(),
        roleIds,
        postIds,
        chargeDepartmentIds,
+          departments
      };
      setModalProps({ confirmLoading: true });