fix: 组织架构bug修复

src/pages/Institutions/Company/Detail/components/Organization.tsx

@@ -1,4 +1,4 @@
-import { Button, Popconfirm, message, Table, Tooltip } from 'antd'
+import { Button, Popconfirm, message, Tooltip } from 'antd'
 import type { ActionType } from '@ant-design/pro-table'
 import ProTable from '@ant-design/pro-table'
 import React, { useState, useRef } from 'react'
@@ -16,33 +16,31 @@ import {
   moveSortOrganizationalStructure
 } from '@/services/api/institution'
 import OrganizationModal from './OrganizationModal'
-import { ModalType } from '@/utils/enum'
 
 type OrganizationProps = {
   dataID: string
   structureType: string
 }
+
+export enum OrganizationModalEnum {
+  ADD = 1,
+  ADDITEM = 2,
+  RENAME = 3,
+  DEL = 4,
+  MOVE = 5
+}
+
 const Organization: React.FC<OrganizationProps> = ({ dataID, structureType }) => {
   const tRef = useRef<ActionType>(null)
   const [state, setState] = useState({
     organizationList: [],
     visible: false,
     expandTreeIds: [],
-    currentModalType: ModalType.ADD,
     defaultFormData: null,
     parentID: '',
-    typeEum: '1',
-    up: 'up',
-    down: 'down',
+    modalType: OrganizationModalEnum.ADD,
     accountTotal: null
   })
-  const titleType = {
-    ADD: 1,
-    ADDITEM: 2,
-    RENAME: 3,
-    DEL: 4,
-    MOVE: 5
-  }
 
   const { run: tryOrganizationList } = useRequest(
     () => queryOrganizationalStructureList({ dataID, structureType }),
@@ -69,32 +67,6 @@ const Organization: React.FC<OrganizationProps> = ({ dataID, structureType }) =>
     }
   )
 
-  // const getData = () => {
-  //   // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  //   return new Promise((resolve, reject) => {
-  //     // setState(data)
-  //     const newExpandedKeys = []
-  //     const render = treeDatas => {
-  //       // 获取到所有可展开的父节点
-  //       treeDatas.map(item => {
-  //         if (item.children) {
-  //           newExpandedKeys.push(item.key)
-  //           render(item.children)
-  //         }
-  //       })
-  //       return newExpandedKeys
-  //     }
-  //     // setDefaultExpanded(render(newData))
-  //     resolve({
-  //       // data: newData
-  //     })
-  //   })
-  // }
-
-  // useEffect(() => {
-  //   getData()
-  // }, [])
-
   const { run: tryMoveOrganization } = useRequest(moveSortOrganizationalStructure, {
     manual: true,
     onSuccess: () => {
@@ -126,7 +98,8 @@ const Organization: React.FC<OrganizationProps> = ({ dataID, structureType }) =>
                 title="确认上移吗？"
                 okText="确认"
                 cancelText="取消"
-                onConfirm={() => tryMoveOrganization({ ID: record.ID, operation: state.up })}>
+                onConfirm={() => tryMoveOrganization({ ID: record.ID, operation: 'up' })}
+              >
                 <Tooltip placement="top" title="上移">
                   <ArrowUpOutlined />
                 </Tooltip>
@@ -139,7 +112,8 @@ const Organization: React.FC<OrganizationProps> = ({ dataID, structureType }) =>
                 title="确认下移吗？"
                 okText="确认"
                 cancelText="取消"
-                onConfirm={() => tryMoveOrganization({ ID: record.ID, operation: state.down })}>
+                onConfirm={() => tryMoveOrganization({ ID: record.ID, operation: 'down' })}
+              >
                 <Tooltip placement="top" title="下移">
                   <ArrowDownOutlined />
                 </Tooltip>
@@ -153,11 +127,11 @@ const Organization: React.FC<OrganizationProps> = ({ dataID, structureType }) =>
                 setState({
                   ...state,
                   visible: true,
-                  currentModalType: ModalType.MOVE,
                   defaultFormData: record,
-                  typeEum: titleType.MOVE
+                  modalType: OrganizationModalEnum.MOVE
                 })
-              }}>
+              }}
+            >
               <Tooltip placement="top" title="移动">
                 <SwapOutlined />
               </Tooltip>
@@ -170,15 +144,15 @@ const Organization: React.FC<OrganizationProps> = ({ dataID, structureType }) =>
               setState({
                 ...state,
                 visible: true,
-                currentModalType: ModalType.ADD,
                 defaultFormData: {
                   dataID: dataID,
                   structureType: structureType,
                   parentID: record.ID
                 },
-                typeEum: titleType.ADDITEM
+                modalType: OrganizationModalEnum.ADDITEM
               })
-            }}>
+            }}
+          >
             <Tooltip placement="top" title="添加子项">
               <PlusSquareOutlined />
             </Tooltip>
@@ -189,11 +163,11 @@ const Organization: React.FC<OrganizationProps> = ({ dataID, structureType }) =>
               setState({
                 ...state,
                 visible: true,
-                currentModalType: ModalType.UPDATE,
                 defaultFormData: record,
-                typeEum: titleType.RENAME
+                modalType: OrganizationModalEnum.RENAME
               })
-            }}>
+            }}
+          >
             <Tooltip placement="top" title="重命名">
               <EditOutlined />
             </Tooltip>
@@ -206,9 +180,8 @@ const Organization: React.FC<OrganizationProps> = ({ dataID, structureType }) =>
                     setState({
                       ...state,
                       visible: true,
-                      currentModalType: ModalType.DEL,
                       defaultFormData: record,
-                      typeEum: titleType.DEL,
+                      modalType: OrganizationModalEnum.DEL,
                       accountTotal: record.accountTotal
                     })
                   }}
@@ -256,15 +229,15 @@ const Organization: React.FC<OrganizationProps> = ({ dataID, structureType }) =>
                 setState({
                   ...state,
                   visible: true,
-                  currentModalType: ModalType.ADD,
-                  typeEum: titleType.ADD,
+                  modalType: OrganizationModalEnum.ADD,
                   defaultFormData: {
                     dataID: dataID,
                     structureType: structureType,
                     parentID: state.parentID
                   }
                 })
-              }>
+              }
+            >
               添加组织
             </Button>
           ]
@@ -288,7 +261,7 @@ const Organization: React.FC<OrganizationProps> = ({ dataID, structureType }) =>
                     ...state,
                     visible: true,
                     currentModalType: ModalType.ADD,
-                    typeEum: titleType.ADD,
+                    modalType: titleType.ADD,
                     defaultFormData: {
                       dataID: dataID,
                       structureType: structureType,
@@ -303,8 +276,7 @@ const Organization: React.FC<OrganizationProps> = ({ dataID, structureType }) =>
         />
       ) : null} */}
       <OrganizationModal
-        type={state.currentModalType}
-        typeEum={state.typeEum}
+        type={state.modalType}
         visible={state.visible}
         setVisible={(visible: boolean) => setState({ ...state, visible })}
         reload={() => {

src/pages/Institutions/Company/Detail/components/OrganizationModal.tsx

@@ -10,6 +10,7 @@ import {
   moveOrganizationalStructure,
   queryOrganizationalStructureList
 } from '@/services/api/institution'
+import type { OrganizationModalEnum } from './Organization'
 
 export enum ModalType {
   ADD = 0,
@@ -21,8 +22,7 @@ export enum ModalType {
 type OrganizationModalProps = {
   visible: boolean
   setVisible: (visible: boolean) => void
-  type: ModalType
-  typeEum: string
+  type: OrganizationModalEnum
   reload: () => void
   defaultFormData?: {
     structureType?: string
@@ -37,7 +37,6 @@ type OrganizationModalProps = {
 const OrganizationModal: React.FC<OrganizationModalProps> = ({
   visible,
   type,
-  typeEum,
   dataID,
   structureType,
   setVisible,
@@ -95,6 +94,8 @@ const OrganizationModal: React.FC<OrganizationModalProps> = ({
     {
       manual: true,
       onSuccess: result => {
+        console.log(result)
+
         setState({ ...state, organizationList: result })
       }
     }
@@ -106,7 +107,9 @@ const OrganizationModal: React.FC<OrganizationModalProps> = ({
     }
   })
   useEffect(() => {
-    tryOrganizationList()
+    if (!state.organizationList?.length) {
+      tryOrganizationList()
+    }
     visible && defaultFormData && ref.current?.setFieldsValue({ ...defaultFormData })
   }, [defaultFormData, visible])
 
@@ -138,63 +141,66 @@ const OrganizationModal: React.FC<OrganizationModalProps> = ({
       width="35vw"
       visible={visible}
       // title={type === ModalType.ADD ? '添加父级组织' : '重命名'}
-      title={titleTypeEunm[typeEum].name}
+      title={titleTypeEunm[type].name}
       onCancel={() => {
         ref.current?.resetFields()
         setVisible(false)
       }}
-      onOk={() => handleOnFinish()}>
-      {type === ModalType.ADD ? (
-        <ProForm formRef={ref} submitter={{ render: false }}>
-          <ProFormText
-            name="name"
-            label="组织架构名称"
-            rules={[{ required: true, message: '请输入组织架构名称' }]}
-          />
-        </ProForm>
-      ) : null}
-      {type === ModalType.UPDATE ? (
-        <ProForm formRef={ref} submitter={{ render: false }}>
-          <ProFormText name="ID" hidden />
-          <ProFormText
-            name="name"
-            label="组织架构名称"
-            rules={[{ required: true, message: '请输入组织架构名称' }]}
-          />
-        </ProForm>
-      ) : null}
-      {type === ModalType.DEL ? (
-        <ProForm formRef={ref} submitter={{ render: false }}>
-          <ProFormText name="ID" hidden />
-          <p>确认删除？</p>
-          {accountTotal !== 0 ? (
-            <div>
-              <p>请设置包含人员至新的组织架构中：</p>
-              <Form.Item label="目标架构" name="moveID">
-                <TreeSelect
-                  style={{ width: '100%' }}
-                  placeholder="请选择目标架构"
-                  treeDefaultExpandAll
-                  treeData={state.organizationList}
-                />
-              </Form.Item>
-            </div>
-          ) : null}
-        </ProForm>
-      ) : null}
-      {type === ModalType.MOVE ? (
-        <ProForm formRef={ref} submitter={{ render: false }}>
-          <ProFormText name="ID" hidden />
-          <Form.Item label="目标架构" name="moveID">
-            <TreeSelect
-              style={{ width: '100%' }}
-              placeholder="请选择目标架构"
-              treeDefaultExpandAll
-              treeData={state.organizationList}
+      onOk={() => handleOnFinish()}
+    >
+      <ProForm formRef={ref} submitter={{ render: false }}>
+        {type === ModalType.ADD ? (
+          <>
+            <ProFormText
+              name="name"
+              label="组织架构名称"
+              rules={[{ required: true, message: '请输入组织架构名称' }]}
+            />
+          </>
+        ) : null}
+        {type === ModalType.UPDATE ? (
+          <>
+            <ProFormText name="ID" hidden />
+            <ProFormText
+              name="name"
+              label="组织架构名称"
+              rules={[{ required: true, message: '请输入组织架构名称' }]}
             />
-          </Form.Item>
-        </ProForm>
-      ) : null}
+          </>
+        ) : null}
+        {type === ModalType.DEL ? (
+          <>
+            <ProFormText name="ID" hidden />
+            <p>确认删除？</p>
+            {accountTotal ? (
+              <div>
+                <p>请设置包含人员至新的组织架构中：</p>
+                <Form.Item label="目标架构" name="moveID">
+                  <TreeSelect
+                    style={{ width: '100%' }}
+                    placeholder="请选择目标架构"
+                    treeDefaultExpandAll
+                    treeData={state.organizationList}
+                  />
+                </Form.Item>
+              </div>
+            ) : null}
+          </>
+        ) : null}
+        {type === ModalType.MOVE ? (
+          <>
+            <ProFormText name="ID" hidden />
+            <Form.Item label="目标架构" name="moveID">
+              <TreeSelect
+                style={{ width: '100%' }}
+                placeholder="请选择目标架构"
+                treeDefaultExpandAll
+                treeData={state.organizationList}
+              />
+            </Form.Item>
+          </>
+        ) : null}
+      </ProForm>
     </Modal>
   )
 }