feat: 流程用户设置

src/pages/Business/ProcessUser/index.tsx

@@ -1,10 +1,11 @@
 import { PageContainer } from '@ant-design/pro-layout'
 import { useDispatch, connect } from 'umi'
-import { Button, Form, Select, TreeSelect } from 'antd'
+import { Form, message, Select, TreeSelect } from 'antd'
 import React, { useState, useEffect } from 'react'
 import LeftMenu from './components/LeftMenu'
 import { queryOrganizationalMembersList } from '@/services/api/institution'
 import { useRequest } from '@umijs/max'
+import { saveApprovalAccount } from '@/services/api/schema'
 
 export enum LeftMenuEnum {
   BUDGET = '1'
@@ -18,9 +19,9 @@ const ProcessUser = props => {
   const dispatch = useDispatch()
   const [state, setState] = useState({
     activeKey: LeftMenuEnum.BUDGET,
+    name: null,
     organizationListNew: []
   })
-  console.log(state.organizationListNew)
 
   const { run: tryOrganizationList } = useRequest(queryOrganizationalMembersList, {
     manual: true,
@@ -29,10 +30,39 @@ const ProcessUser = props => {
     }
   })
 
+  const { run: trysaveApprovalAccount } = useRequest(
+    (params: Partial<API.UpdateRoleParams>) => saveApprovalAccount(params),
+    {
+      manual: true,
+      onSuccess: () => {
+        message.success('编辑成功')
+        initFn()
+      }
+    }
+  )
+
   const handleInstitutionChange = ID => {
+    setState({ ...state, name: ID })
     tryOrganizationList({ institutionID: ID })
   }
 
+  const renderTreeNodes = data =>
+    data.map(item => {
+      const newItem = { ...item }
+      if (newItem.children) {
+        newItem.disabled = true
+        newItem.children = renderTreeNodes(newItem.children)
+        return newItem
+      }
+      return newItem
+    })
+
+  const handleApprovalonChange = async value => {
+    if (value) {
+      await trysaveApprovalAccount({ accountIDs: value, name: state.name })
+    }
+  }
+
   useEffect(() => {
     if (!institutionList.length) {
       dispatch({
@@ -50,13 +80,105 @@ const ProcessUser = props => {
           onChange={key => setState({ ...state, activeKey: key })}
         />
         <div className="w-6/7 ml-8 bg-white p-4 rounded-20px">
-          {/* <div className="flex flex-row-reverse mb-4 w-full">
-            <Button type="primary">编辑</Button>
-          </div> */}
+          <div className="flex flex-row mb-5 w-full text-xl">流程用户设置</div>
           <div className="max-w-800px">
             <Form labelCol={{ span: 4 }} wrapperCol={{ span: 20 }} layout="horizontal" form={form}>
               <Form.Item label="收件员">
-                <Form.Item name="aa" style={{ display: 'inline-block', margin: '0' }}>
+                <Form.Item name="receiver" style={{ display: 'inline-block', margin: '0' }}>
+                  <Select
+                    style={{ width: 250 }}
+                    placeholder="请选择单位"
+                    onChange={handleInstitutionChange}
+                    onClick={() => {
+                      setState({ ...state, name: 'receiver' })
+                    }}
+                    options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
+                  />
+                </Form.Item>
+                <Form.Item name="accountIDs" style={{ display: 'inline-block', margin: '0 8px' }}>
+                  <TreeSelect
+                    style={{ width: 250 }}
+                    placeholder="请选择用户"
+                    treeDefaultExpandAll
+                    treeNodeFilterProp="label"
+                    multiple
+                    maxTagCount="responsive"
+                    onChange={handleApprovalonChange}
+                    treeData={renderTreeNodes(state.organizationListNew).filter(
+                      item => item.children?.length
+                    )}
+                  />
+                </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="请选择单位"
@@ -64,18 +186,20 @@ const ProcessUser = props => {
                     options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
                   />
                 </Form.Item>
-                <Form.Item name="bb" style={{ display: 'inline-block', margin: '0 8px' }}>
+                <Form.Item name="j" style={{ display: 'inline-block', margin: '0 8px' }}>
                   <TreeSelect
                     style={{ width: 250 }}
                     placeholder="请选择用户"
                     treeDefaultExpandAll
                     treeNodeFilterProp="label"
                     multiple
-                    treeData={state.organizationListNew}
+                    treeData={renderTreeNodes(state.organizationListNew).filter(
+                      item => item.children?.length
+                    )}
                   />
                 </Form.Item>
               </Form.Item>
-              <Form.Item wrapperCol={{ offset: 4, span: 20 }}>
+              {/* <Form.Item wrapperCol={{ offset: 4, span: 20 }}>
                 <Button
                   type="primary"
                   onClick={() => {
@@ -85,7 +209,7 @@ const ProcessUser = props => {
                   }}>
                   提交
                 </Button>
-              </Form.Item>
+              </Form.Item> */}
             </Form>
           </div>
         </div>

src/services/api/schema.ts

@@ -50,3 +50,11 @@ export async function delDataSourceID(params: API.DelRoleParams) {
     data: params
   })
 }
+
+/** 保存流程用户-审批 */
+export async function saveApprovalAccount(params: API.SaveApprovalParams) {
+  return request('/form/v1/approval/account/save', {
+    method: 'POST',
+    data: params
+  })
+}

src/services/api/typings.d.ts

@@ -364,4 +364,9 @@ declare namespace API {
     action?: string
     name?: string
   }
+
+  type SaveApprovalParams = {
+    name?: string
+    accountIDs?: AccountListItem[]
+  }
 }