fix: 业务审批模块下表格高度调整

src/global.less

@@ -82,8 +82,8 @@ ol {
 }
 
 .ant-pro-table {
-  .ant-card-body {
-    padding-bottom: 0;
+  .ant-pro-card-body {
+    padding-bottom: 0 !important;
   }
 }
 

src/pages/Business/Inventory/index.tsx

@@ -32,7 +32,6 @@ interface IState {
 }
 
 const Inventory = () => {
-  const contentHeight = document.body.clientHeight - 122
   const [modal, ModalDOM] = useModal()
   const [state, setState] = useState<IState>({
     subjectParams: {
@@ -120,8 +119,9 @@ const Inventory = () => {
     <PageContainer title={false}>
       <div className="h-full w-full flex flex-row">
         <LeftMenu title="业务列表" onChange={key => handleMenuOnChange(key)} />
-        <div style={{ height: `${contentHeight}px` }} className="bg-white w-6/7 ml-8 rounded-20px">
+        <div className="bg-white ml-8 rounded-20px" style={{ width: 'calc(100% - 216px)' }}>
           <ProTable
+            scroll={{ y: document.body.clientHeight - 259 }}
             search={false}
             rowKey="ID"
             headerTitle={

src/pages/Business/Matter/index.tsx

@@ -18,7 +18,6 @@ interface IState {
 
 const Matter: React.FC = () => {
   const [drawer, DrawerDom] = useDrawer()
-  const contentHeight = document.body.clientHeight - 122
   const [modal, ModalDOM] = useModal()
   const {
     query,
@@ -110,10 +109,12 @@ const Matter: React.FC = () => {
     <PageContainer title={false}>
       <div className="h-full w-full flex flex-row">
         <LeftMenu title="业务列表" onChange={key => handleMenuOnChange(key)} />
-        <div style={{ height: `${contentHeight}px` }} className="bg-white w-6/7 ml-8 rounded-20px">
+        <div className="bg-white ml-8 rounded-20px" style={{ width: 'calc(100% - 216px)' }}>
           <ProTable
             search={false}
             rowKey="ID"
+            pagination={false}
+            scroll={{ y: document.body.clientHeight - 259 }}
             headerTitle={
               <div className="flex flex-nowrap justify-start items-center">
                 <div className="children:mx-1 px-1 py-2 ">
@@ -139,7 +140,6 @@ const Matter: React.FC = () => {
             columns={columns}
             dataSource={treeList}
             bordered
-            pagination={false}
             size="small"
             // expandable={{ defaultExpandAllRows: true }}
             expandable={{

src/pages/Business/Process/hooks/useScripts.tsx

@@ -1,18 +1,23 @@
 import MemberItem from '../components/MemberItem'
 import consts from '@/utils/consts'
-import { useState } from 'react'
 import { useRequest } from 'ahooks'
 import {
   addExecutor,
   delExecutor,
   queryExecutorList,
-  queryMatterList,
+  queryMatterTree,
   updateExecutor
 } from '@/services/api/business'
 import { ExecutorSetType } from '@/enums/gc'
 import { QuestionCircleFilled } from '@ant-design/icons'
-import { Form, message, Tooltip } from 'antd'
-import ProForm, { ProFormDependency, ProFormRadio, ProFormSelect, ProFormText } from '@ant-design/pro-form'
+import { Form, message, Tooltip, TreeNodeProps } from 'antd'
+import ProForm, {
+  ProFormDependency,
+  ProFormRadio,
+  ProFormSelect,
+  ProFormText,
+  ProFormTreeSelect
+} from '@ant-design/pro-form'
 
 import type { ModalAction } from '@/components/Modal'
 import { useDispatch } from '@umijs/max'
@@ -42,15 +47,19 @@ const setTypeOptions = [
   }
 ]
 
-type iState = {
-  total: number
+function transformMatterTree(tree: API.MatterTreeItem[]): TreeNodeProps[] {
+  return tree.map(item => {
+    const newItem: TreeNodeProps = { key: item.ID, title: item.name, value: item.ID, isLeaf: true }
+    if (item.children) {
+      newItem.isLeaf = false
+      newItem.disabled = true
+      newItem.children = transformMatterTree(item.children)
+    }
+    return newItem
+  })
 }
-
 export default function useScripts(modal: ModalAction, subject: string) {
   const dispatch = useDispatch()
-  const [state, seState] = useState<iState>({
-    total: 0
-  })
   const {
     run: query,
     refresh,
@@ -59,7 +68,6 @@ export default function useScripts(modal: ModalAction, subject: string) {
     manual: true,
     onSuccess: (result, params) => {
       const { gatherID, businessType } = params[0]
-      seState({ total: result.data.total })
       dispatch({
         type: 'business/updateExecutorMap',
         payload: {
@@ -70,82 +78,80 @@ export default function useScripts(modal: ModalAction, subject: string) {
     }
   })
 
-  const { data: { data: { items: matters = [] } = {} } = {} } = useRequest(
-    () => {
-      if (!subject) return
-      const [gatherID, businessType] = subject.split('_')
-
-      return queryMatterList({ gatherID, businessType, pageSize: 214000, matterType: 'matter' })
-    },
-    { refreshDeps: [subject] }
-  )
+  const addOrEdit = async (mode: 'add' | 'edit', initialValues?: API.ExecutorItem) => {
+    const [gatherID, businessType] = subject.split('_')
+    console.log(subject)
 
-  const addOrEdit = (mode: 'add' | 'edit', initialValues?: API.ExecutorItem) => {
-    const text = mode === 'add' ? '新增执行者' : '编辑执行者'
-    modal.open({
-      title: text,
-      okText: '确定',
-      cancelText: '取消',
-      type: 'form',
-      initialValues: initialValues ?? {
-        setType: ExecutorSetType.PERSET
-      },
-      children: (
-        <ProForm submitter={false} layout="horizontal" labelCol={{ span: 5 }} isKeyPressSubmit>
-          <ProFormText hidden name="ID" />
-          <ProFormText
-            label="执行者名称"
-            name="name"
-            rules={[{ required: true, message: '请输入' }]}
-            placeholder="请输入"
-          />
-          <ProFormRadio.Group
-            label="配置方式"
-            name="setType"
-            options={setTypeOptions}
-            rules={[{ required: true, message: '请选择' }]}
-          />
-          <ProFormDependency name={['setType']}>
-            {({ setType }) => {
-              if (setType === ExecutorSetType.PERSET)
+    const { code = -1, data } = await queryMatterTree({ gatherID, businessType, pageSize: 214000 })
+    if (code === consts.RET_CODE.SUCCESS) {
+      const matterTree = transformMatterTree(data || [])
+      console.log(matterTree)
+      const text = mode === 'add' ? '新增执行者' : '编辑执行者'
+      modal.open({
+        title: text,
+        okText: '确定',
+        cancelText: '取消',
+        type: 'form',
+        initialValues: initialValues ?? {
+          setType: ExecutorSetType.PERSET
+        },
+        children: (
+          <ProForm submitter={false} layout="horizontal" labelCol={{ span: 5 }} isKeyPressSubmit>
+            <ProFormText hidden name="ID" />
+            <ProFormText
+              label="执行者名称"
+              name="name"
+              rules={[{ required: true, message: '请输入' }]}
+              placeholder="请输入"
+            />
+            <ProFormRadio.Group
+              label="配置方式"
+              name="setType"
+              options={setTypeOptions}
+              rules={[{ required: true, message: '请选择' }]}
+            />
+            <ProFormDependency name={['setType']}>
+              {({ setType }) => {
+                if (setType === ExecutorSetType.PERSET)
+                  return (
+                    <Form.Item label="成员" name="members" rules={[{ required: true, message: '请选择' }]}>
+                      <MemberItem />
+                    </Form.Item>
+                  )
                 return (
-                  <Form.Item label="成员" name="members" rules={[{ required: true, message: '请选择' }]}>
-                    <MemberItem />
-                  </Form.Item>
+                  <ProFormSelect name="scope" label="范围选择" options={[{ label: '全部', value: 'all' }]} />
                 )
-              return (
-                <ProFormSelect name="scope" label="范围选择" options={[{ label: '全部', value: 'all' }]} />
-              )
-            }}
-          </ProFormDependency>
-          <ProFormSelect
-            name="approvaledPermission"
-            label="事项权限"
-            placeholder="请选择"
-            rules={[{ required: true, message: '请选择' }]}
-            fieldProps={{ mode: 'multiple' }}
-            options={matters.map(item => ({ label: item.name, value: item.ID }))}
-          />
-        </ProForm>
-      ),
-      onOk: async (values: API.ExecutorItem) => {
-        const [gatherID, businessType] = subject.split('_')
-        values.gatherID = gatherID
-        values.businessType = businessType
-        let requestFn: Nullable<() => Promise<viod>> = null
-        if (mode === 'add') {
-          requestFn = addExecutor
-        } else {
-          requestFn = updateExecutor
+              }}
+            </ProFormDependency>
+            <ProFormTreeSelect
+              name="approvaledPermission"
+              label="事项权限"
+              placeholder="请选择"
+              rules={[{ required: true, message: '请选择' }]}
+              fieldProps={{ multiple: true }}
+              request={() => matterTree}
+            />
+          </ProForm>
+        ),
+        onOk: async (values: API.ExecutorItem) => {
+          const [gatherID, businessType] = subject.split('_')
+          values.gatherID = gatherID
+          values.businessType = businessType
+          let requestFn: Nullable<() => Promise<viod>> = null
+          if (mode === 'add') {
+            requestFn = addExecutor
+          } else {
+            requestFn = updateExecutor
+          }
+          try {
+            await requestFn?.(values)
+            refresh()
+            modal.close()
+            message.success(text + '成功')
+          } catch (error) {}
         }
-        try {
-          await requestFn?.(values)
-          refresh()
-          modal.close()
-          message.success(text + '成功')
-        } catch (error) {}
-      }
-    })
+      })
+    }
   }
 
   const del = (ID: string) => {
@@ -166,5 +172,5 @@ export default function useScripts(modal: ModalAction, subject: string) {
       }
     })
   }
-  return { query, total: state.total, loading, addOrEdit, del }
+  return { query, loading, addOrEdit, del }
 }

src/pages/Business/Process/index.tsx

@@ -1,5 +1,5 @@
 import useModal from '@/components/Modal'
-import { startTransition, useMemo, useState } from 'react'
+import { useMemo, useState } from 'react'
 import { PageContainer } from '@ant-design/pro-layout'
 import { BusinessType, ExecutorSetType } from '@/enums/gc'
 import useScripts from './hooks/useScripts'
@@ -23,7 +23,7 @@ const Process: React.FC<ProcessProps> = ({ executorMap }) => {
   })
 
   const [modal, ModalDOM] = useModal()
-  const { total, query, loading, addOrEdit, del } = useScripts(modal, state.activeKey)
+  const { query, loading, addOrEdit, del } = useScripts(modal, state.activeKey)
 
   const list = useMemo(() => {
     if (!state.activeKey) return []
@@ -86,16 +86,16 @@ const Process: React.FC<ProcessProps> = ({ executorMap }) => {
   const handleMenuOnChange = (key: string) => {
     const [gatherID, businessType] = key.split('_')
     setState({ ...state, activeKey: key })
-    startTransition(() => {
-      !executorMap?.[state.activeKey] && query({ gatherID, businessType, pageSize: 214000 })
-    })
+    !executorMap?.[state.activeKey] && query({ gatherID, businessType, pageSize: 214000 })
   }
   return (
     <PageContainer title={false}>
       <div className="h-full w-full flex flex-row">
         <LeftMenu title="业务列表" onChange={key => handleMenuOnChange(key)} />
-        <div className="w-6/7 ml-8 bg-white rounded-20px">
+        <div className="ml-8 bg-white rounded-20px" style={{ width: 'calc(100% - 216px)' }}>
           <ProTable
+            scroll={{ y: document.body.clientHeight - 259 }}
+            pagination={false}
             toolbar={{
               actions: [
                 <Button key="add_executor" type="primary" onClick={() => addOrEdit('add')}>
@@ -108,7 +108,6 @@ const Process: React.FC<ProcessProps> = ({ executorMap }) => {
             columns={columns}
             dataSource={list}
             loading={loading}
-            pagination={{ total }}
           />
         </div>
       </div>

src/pages/Business/Step/index.tsx

@@ -115,12 +115,14 @@ const Step: React.FC<StepProps> = ({ executorMap, matterMap, conditionSchema, di
   }
   return (
     <PageContainer title={false}>
-      <div className="h-full w-full flex flex-row">
+      <div className="w-full flex flex-row">
         <LeftMenu title="业务主体" onChange={handleMenuChange} />
-        <div className="w-6/7 ml-8 bg-white rounded-20px">
+        <div className="ml-8 bg-white rounded-20px" style={{ width: 'calc(100% - 216px)' }}>
           <ProTable
             columns={columns}
             search={false}
+            pagination={false}
+            scroll={{ y: document.body.clientHeight - 259 }}
             rowKey="ID"
             dataSource={state.process.list}
             toolbar={{