fix: 111

src/pages/Business/ProcessUser/index.tsx

@@ -1,6 +1,6 @@
 import { PageContainer } from '@ant-design/pro-layout'
 import { useDispatch, connect } from 'umi'
-import { Form, message, Select, TreeSelect } from 'antd'
+import { message, Select, TreeSelect } from 'antd'
 import React, { useState, useEffect } from 'react'
 import LeftMenu from './components/LeftMenu'
 import { queryOrganizationalMembersList } from '@/services/api/institution'
@@ -13,15 +13,30 @@ export enum LeftMenuEnum {
 
 export const menuOptions = [{ label: '预算业务审批', value: LeftMenuEnum.BUDGET }]
 
+export enum InstitutionEnum {
+  RECEIVER = 'receiver', // 收件员
+  FGLEADER = 'fgLeader', // 分管领导
+  ZXLEADER = 'zxLeader', // 中心领导
+  POST = 'post', // 发文
+  ARCHIVE = 'archive' // 归档
+}
+
+type ProcessUserProps = {
+  name: Nullable<string>
+  institutionID: Nullable<string>
+  organizationListNew: API.OrganizationalStructureListItem[]
+}
+
 const ProcessUser = props => {
   const { institutionList } = props
-  const [form] = Form.useForm()
   const dispatch = useDispatch()
-  const [state, setState] = useState({
+  const [state, setState] = useState<ProcessUserProps>({
     activeKey: LeftMenuEnum.BUDGET,
     name: null,
+    institutionID: null,
     organizationListNew: []
   })
+  console.log(state.institutionID)
 
   const { run: tryOrganizationList } = useRequest(queryOrganizationalMembersList, {
     manual: true,
@@ -36,14 +51,15 @@ const ProcessUser = props => {
       manual: true,
       onSuccess: () => {
         message.success('编辑成功')
-        initFn()
       }
     }
   )
 
-  const handleInstitutionChange = ID => {
-    setState({ ...state, name: ID })
-    tryOrganizationList({ institutionID: ID })
+  const handleInstitutionSelect = value => {
+    // console.log(value)
+    // debugger
+    setState({ ...state, institutionID: value })
+    // tryOrganizationList({ institutionID: value })
   }
 
   const renderTreeNodes = data =>
@@ -59,7 +75,11 @@ const ProcessUser = props => {
 
   const handleApprovalonChange = async value => {
     if (value) {
-      await trysaveApprovalAccount({ accountIDs: value, name: state.name })
+      await trysaveApprovalAccount({
+        accountIDs: value,
+        name: state.name,
+        institutionID: state.institutionID
+      })
     }
   }
 
@@ -68,6 +88,7 @@ const ProcessUser = props => {
       dispatch({
         type: 'business/queryInstitution'
       })
+      // tryOrganizationList(state.institutionID)
     }
   }, [])
   return (
@@ -79,18 +100,19 @@ const ProcessUser = props => {
           value={state.activeKey}
           onChange={key => setState({ ...state, activeKey: key })}
         />
-        <div className="w-6/7 ml-8 bg-white p-4 rounded-20px">
+        <div className="w-6/7 ml-8 bg-white p-6 rounded-20px">
           <div className="flex flex-row mb-5 w-full text-xl">流程用户设置</div>
           <div className="max-w-800px">
-            <div className="flex justify-start items-center">
-              <div>收件员：</div>
+            <div className="flex justify-start items-center mb-4">
+              <div className="w-20">收件员：</div>
               <div>
                 <Select
                   style={{ width: 250 }}
                   placeholder="请选择单位"
-                  onChange={handleInstitutionChange}
+                  // defaultValue={{ value: '56b9fc0f-02d8-446e-be13-ad705be31d11' }}
+                  onSelect={handleInstitutionSelect}
                   onClick={() => {
-                    setState({ ...state, name: 'receiver' })
+                    setState({ ...state, name: InstitutionEnum.RECEIVER })
                   }}
                   options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
                 />
@@ -103,121 +125,116 @@ const ProcessUser = props => {
                   treeNodeFilterProp="label"
                   multiple
                   maxTagCount="responsive"
+                  // defaultValue={[{ title: 'ceshixinjian1', value: '14db339b-3675-4a47-a23d-ecacbc9e0385' }]}
                   onChange={handleApprovalonChange}
                   treeData={renderTreeNodes(state.organizationListNew).filter(item => item.children?.length)}
                 />
               </div>
             </div>
-            <Form labelCol={{ span: 4 }} wrapperCol={{ span: 20 }} layout="horizontal" form={form}>
-              {/* <Form.Item label="收件员">
-                <Form.Item name="receiver" style={{ display: 'inline-block', margin: '0' }}>
-
-                </Form.Item>
-                <Form.Item name="accountIDs" style={{ display: 'inline-block', margin: '0 8px' }}>
-
-                </Form.Item>
-              </Form.Item> */}
-              {/* <Form.Item label="分管领导">
-                <Form.Item name="cc" style={{ display: 'inline-block', margin: '0' }}>
-                  <Select
-                    style={{ width: 250 }}
-                    placeholder="请选择单位"
-                    onChange={handleInstitutionChange}
-                    options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
-                  />
-                </Form.Item>
-                <Form.Item name="dd" style={{ display: 'inline-block', margin: '0 8px' }}>
-                  <TreeSelect
-                    style={{ width: 250 }}
-                    placeholder="请选择用户"
-                    treeDefaultExpandAll
-                    treeNodeFilterProp="label"
-                    multiple
-                    maxTagCount="responsive"
-                    treeData={renderTreeNodes(state.organizationListNew).filter(
-                      item => item.children?.length
-                    )}
-                  />
-                </Form.Item>
-              </Form.Item>
-              <Form.Item label="中心领导">
-                <Form.Item name="e" style={{ display: 'inline-block', margin: '0' }}>
-                  <Select
-                    style={{ width: 250 }}
-                    placeholder="请选择单位"
-                    onChange={handleInstitutionChange}
-                    options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
-                  />
-                </Form.Item>
-                <Form.Item name="f" style={{ display: 'inline-block', margin: '0 8px' }}>
-                  <TreeSelect
-                    style={{ width: 250 }}
-                    placeholder="请选择用户"
-                    treeDefaultExpandAll
-                    treeNodeFilterProp="label"
-                    multiple
-                    treeData={renderTreeNodes(state.organizationListNew).filter(
-                      item => item.children?.length
-                    )}
-                  />
-                </Form.Item>
-              </Form.Item>
-              <Form.Item label="发文">
-                <Form.Item name="g" style={{ display: 'inline-block', margin: '0' }}>
-                  <Select
-                    style={{ width: 250 }}
-                    placeholder="请选择单位"
-                    onChange={handleInstitutionChange}
-                    options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
-                  />
-                </Form.Item>
-                <Form.Item name="h" style={{ display: 'inline-block', margin: '0 8px' }}>
-                  <TreeSelect
-                    style={{ width: 250 }}
-                    placeholder="请选择用户"
-                    treeDefaultExpandAll
-                    treeNodeFilterProp="label"
-                    multiple
-                    treeData={renderTreeNodes(state.organizationListNew).filter(
-                      item => item.children?.length
-                    )}
-                  />
-                </Form.Item>
-              </Form.Item>
-              <Form.Item label="归档">
-                <Form.Item name="i" style={{ display: 'inline-block', margin: '0' }}>
-                  <Select
-                    style={{ width: 250 }}
-                    placeholder="请选择单位"
-                    onChange={handleInstitutionChange}
-                    options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
-                  />
-                </Form.Item>
-                <Form.Item name="j" style={{ display: 'inline-block', margin: '0 8px' }}>
-                  <TreeSelect
-                    style={{ width: 250 }}
-                    placeholder="请选择用户"
-                    treeDefaultExpandAll
-                    treeNodeFilterProp="label"
-                    multiple
-                    treeData={renderTreeNodes(state.organizationListNew).filter(
-                      item => item.children?.length
-                    )}
-                  />
-                </Form.Item>
-              </Form.Item> */}
-              {/* <Form.Item wrapperCol={{ offset: 4, span: 20 }}>
-                <Button
-                  type="primary"
+            <div className="flex justify-start items-center mb-4">
+              <div className="w-20">分管领导：</div>
+              <div>
+                <Select
+                  style={{ width: 250 }}
+                  placeholder="请选择单位"
+                  onChange={handleInstitutionSelect}
+                  onClick={() => {
+                    setState({ ...state, name: InstitutionEnum.FGLEADER })
+                  }}
+                  options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
+                />
+              </div>
+              <div className="ml-2">
+                <TreeSelect
+                  style={{ width: 250 }}
+                  placeholder="请选择用户"
+                  treeDefaultExpandAll
+                  treeNodeFilterProp="label"
+                  multiple
+                  maxTagCount="responsive"
+                  onChange={handleApprovalonChange}
+                  treeData={renderTreeNodes(state.organizationListNew).filter(item => item.children?.length)}
+                />
+              </div>
+            </div>
+            <div className="flex justify-start items-center mb-4">
+              <div className="w-20">中心领导：</div>
+              <div>
+                <Select
+                  style={{ width: 250 }}
+                  placeholder="请选择单位"
+                  onChange={handleInstitutionSelect}
+                  onClick={() => {
+                    setState({ ...state, name: InstitutionEnum.ZXLEADER })
+                  }}
+                  options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
+                />
+              </div>
+              <div className="ml-2">
+                <TreeSelect
+                  style={{ width: 250 }}
+                  placeholder="请选择用户"
+                  treeDefaultExpandAll
+                  treeNodeFilterProp="label"
+                  multiple
+                  maxTagCount="responsive"
+                  onChange={handleApprovalonChange}
+                  treeData={renderTreeNodes(state.organizationListNew).filter(item => item.children?.length)}
+                />
+              </div>
+            </div>
+            <div className="flex justify-start items-center mb-4">
+              <div className="w-20">发文：</div>
+              <div>
+                <Select
+                  style={{ width: 250 }}
+                  placeholder="请选择单位"
+                  onChange={handleInstitutionSelect}
                   onClick={() => {
-                    form.validateFields().then(async values => {
-                      await console.log(values)
-                    })
-                  }}>
-                  提交
-                </Button>
-              </Form.Item> */}
-            </Form>
+                    setState({ ...state, name: InstitutionEnum.POST })
+                  }}
+                  options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
+                />
+              </div>
+              <div className="ml-2">
+                <TreeSelect
+                  style={{ width: 250 }}
+                  placeholder="请选择用户"
+                  treeDefaultExpandAll
+                  treeNodeFilterProp="label"
+                  multiple
+                  maxTagCount="responsive"
+                  onChange={handleApprovalonChange}
+                  treeData={renderTreeNodes(state.organizationListNew).filter(item => item.children?.length)}
+                />
+              </div>
+            </div>
+            <div className="flex justify-start items-center mb-4">
+              <div className="w-20">归档：</div>
+              <div>
+                <Select
+                  style={{ width: 250 }}
+                  placeholder="请选择单位"
+                  onChange={handleInstitutionSelect}
+                  onClick={() => {
+                    setState({ ...state, name: InstitutionEnum.ARCHIVE })
+                  }}
+                  options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
+                />
+              </div>
+              <div className="ml-2">
+                <TreeSelect
+                  style={{ width: 250 }}
+                  placeholder="请选择用户"
+                  treeDefaultExpandAll
+                  treeNodeFilterProp="label"
+                  multiple
+                  maxTagCount="responsive"
+                  onChange={handleApprovalonChange}
+                  treeData={renderTreeNodes(state.organizationListNew).filter(item => item.children?.length)}
+                />
+              </div>
+            </div>
           </div>
         </div>
       </div>
@@ -229,4 +246,3 @@ export default connect(({ business }) => ({
   institutionList: business.institutionList,
   organizationList: business.organizationalMembersList
 }))(ProcessUser)
-// export default ProcessUser