feat: 单位审批角色相关

fix: 合并冲突

src/pages/Project/Approval/index.tsx

@@ -1,11 +1,250 @@
-import React from 'react'
+import { queryAccountList } from '@/services/api/institution'
+import { ModalForm, ProFormSelect } from '@ant-design/pro-form'
+import { PageContainer } from '@ant-design/pro-layout'
+import ProTable from '@ant-design/pro-table'
+import { useRequest } from '@umijs/max'
+import { connect, useDispatch } from 'umi'
+import { Button, message, Tabs, Modal } from 'antd'
+import React, { useEffect, useRef, useState } from 'react'
+import {
+  addInstitutionRole,
+  delInstitutionRole,
+  getInstitutionRole,
+  updateInstitutionRole
+} from '@/services/api/project'
+import consts from '@/utils/consts'
+const { TabPane } = Tabs
+export enum ApprovalModalType {
+  ADD,
+  UPDATE
+}
+
+const Approval: React.FC = props => {
+  const { institutionList } = props
+  const dispatch = useDispatch()
+  const tRef = useRef<ActionType>(null)
+  const formRef = useRef<ProFormInstance>(null)
+  const [state, setState] = useState({
+    params: {},
+    visible: false,
+    modalType: 'add',
+    modalVisible: false,
+    staffList: [],
+    ID: ''
+  })
+
+  const { run: tryStaffList } = useRequest(
+    dataID => queryAccountList({ current: 1, pageSize: 214000, dataID }),
+    {
+      manual: true,
+      onSuccess(result) {
+        setState({
+          ...state,
+          staffList: result.items.map(item => ({ label: item.name, value: item.ID }))
+        })
+      }
+    }
+  )
+
+  const { run: tryAddInstitutionRole } = useRequest(addInstitutionRole, {
+    manual: true,
+    onSuccess: () => {
+      message.success('添加成功')
+      tRef.current?.reload()
+    }
+  })
+
+  const { run: tryUpdateInstitutionRole } = useRequest(updateInstitutionRole, {
+    manual: true,
+    onSuccess: () => {
+      message.success('编辑成功')
+      tRef.current?.reload()
+    }
+  })
+
+  const { run: tryDelInstitutionRole } = useRequest(delInstitutionRole, {
+    manual: true,
+    onSuccess: () => {
+      message.success('删除成功')
+      tRef.current?.reload()
+    }
+  })
+
+  const handleDel = (ID: string) => {
+    Modal.confirm({
+      title: '删除',
+      content: (
+        <div>
+          <div>确认删除该行数据？</div>
+          <div>该数据删除后不影响已审流程。</div>
+        </div>
+      ),
+      okButtonProps: {
+        danger: true
+      },
+      onOk: () => tryDelInstitutionRole({ ID })
+    })
+  }
+
+  useEffect(() => {
+    if (!institutionList.length) {
+      dispatch({
+        type: 'business/queryInstitution',
+        payload: { pageSize: 214000 }
+      })
+    }
+  }, [])
 
-const index = () => {
+  const columns: ProColumnType<API.InstitutionRoleParams>[] = [
+    {
+      dataIndex: 'institutionName',
+      title: '单位名称',
+      align: 'center',
+      onHeaderCell: () => ({ style: { textAlign: 'center' } })
+    },
+    {
+      dataIndex: 'name',
+      title: '审批人（账号/姓名）',
+      onHeaderCell: () => ({ style: { textAlign: 'center' } }),
+      render: (_, record) => (
+        <div>
+          <span className="mr-1">{record.approvalMember?.map(item => item.account)}</span>/
+          <span className="ml-1">{record.approvalMember?.map(item => item.name)}</span>
+        </div>
+      )
+    },
+    {
+      dataIndex: 'opreate',
+      title: '操作',
+      onHeaderCell: () => ({ style: { textAlign: 'center' } }),
+      render: (_, record) => (
+        <div className="divide-x divide-bg-gray-400 flex flex-row justify-center">
+          <span
+            className="pr-2 text-primary cursor-pointer hover:text-hex-967bbd"
+            onClick={() => {
+              setState({
+                ...state,
+                modalType: ApprovalModalType.UPDATE,
+                modalVisible: true,
+                ID: record.ID,
+                institutionID: record.institutionID
+              })
+              if (record.institutionID) {
+                tryStaffList(record.institutionID)
+                formRef.current?.resetFields([`accountID`], [])
+              }
+              setTimeout(() => {
+                formRef.current?.setFieldsValue({
+                  institutionID: record.institutionID,
+                  accountID: record.approvalMember?.map(item => item.ID)
+                })
+              }, 80)
+            }}>
+            编辑
+          </span>
+          <span
+            className={'pl-2 text-red-500 cursor-pointer hover:text-red-600'}
+            onClick={() => handleDel(record.ID)}>
+            删除
+          </span>
+        </div>
+      )
+    }
+  ]
   return (
-    <div>
-      <span>审批角色</span>
-    </div>
+    <PageContainer title={false}>
+      <div className="h-full w-full flex flex-row">
+        <div className="w-full h-full p-4 bg-white">
+          <Tabs defaultActiveKey="1">
+            <TabPane tab="单位审批角色" key="1">
+              <ProTable
+                rowKey="ID"
+                actionRef={tRef}
+                columns={columns}
+                search={false}
+                scroll={{ y: document.body.clientHeight - 315 }}
+                request={async params => {
+                  const { code = -1, data: { items = [], total = 0 } = {} } = await getInstitutionRole({
+                    ...params
+                  })
+                  return {
+                    data: items,
+                    success: code === consts.RET_CODE.SUCCESS,
+                    total
+                  }
+                }}
+                toolbar={{
+                  actions: [
+                    <Button
+                      type="primary"
+                      key="add_flow_btn"
+                      onClick={() => {
+                        setState({
+                          ...state,
+                          modalType: ApprovalModalType.ADD,
+                          modalVisible: true
+                        })
+                      }}>
+                      新建角色
+                    </Button>
+                  ]
+                }}
+              />
+              <ModalForm
+                visible={state.modalVisible}
+                isKeyPressSubmit
+                layout="horizontal"
+                labelCol={{ span: 4 }}
+                modalProps={{
+                  width: '30%'
+                }}
+                onVisibleChange={visible => {
+                  setState({ ...state, modalVisible: visible })
+                  setTimeout(() => {
+                    if (!visible) formRef.current?.resetFields()
+                  }, 80)
+                }}
+                title={`${state.modalType === ApprovalModalType.ADD ? '新建' : '编辑'}单位角色`}
+                formRef={formRef}
+                onFinish={async values => {
+                  try {
+                    if (state.modalType === ApprovalModalType.ADD) {
+                      await tryAddInstitutionRole(values)
+                    } else {
+                      await tryUpdateInstitutionRole({ ...values, ID: state.ID })
+                    }
+                    tRef.current?.reload()
+                    return true
+                  } catch (error) {
+                    message.error(error)
+                    return false
+                  }
+                }}>
+                <ProFormSelect
+                  label="单位名称"
+                  name="institutionID"
+                  className="w-full"
+                  options={institutionList?.items?.map(item => ({ value: item.ID, label: item.name }))}
+                  onChange={async value => {
+                    if (value) {
+                      await tryStaffList(value)
+                      formRef.current?.resetFields([`accountID`], [])
+                    }
+                  }}
+                />
+                <ProFormSelect label="审批人" name="accountID" className="w-full" options={state.staffList} />
+              </ModalForm>
+            </TabPane>
+            <TabPane tab="流程审批角色" key="2">
+              预留
+            </TabPane>
+          </Tabs>
+        </div>
+      </div>
+    </PageContainer>
   )
 }
 
-export default index
+export default connect(({ business }) => ({
+  institutionList: business.institutionList
+}))(Approval)

src/pages/Project/Approval/schema.ts

@@ -0,0 +1,57 @@
+export const schema = {
+  type: 'object',
+  properties: {
+    InstitutionRole: {
+      type: 'object',
+      'x-validator': [],
+      name: 'InstitutionRole',
+      'x-designable-id': 'a49wwssqyvh',
+      'x-index': 0,
+      properties: {
+        jkc1e8toiv5: {
+          type: 'void',
+          'x-component': 'FormGrid',
+          'x-validator': [],
+          'x-component-props': {},
+          'x-designable-id': 'jkc1e8toiv5',
+          'x-index': 0,
+          properties: {
+            jodrfe1z5sg: {
+              type: 'void',
+              'x-component': 'FormGrid.GridColumn',
+              'x-validator': [],
+              'x-component-props': {},
+              'x-designable-id': 'jodrfe1z5sg',
+              'x-index': 0,
+              properties: {
+                institutionID: {
+                  title: '单位名称',
+                  'x-decorator': 'FormItem',
+                  'x-component': 'Select',
+                  'x-validator': [],
+                  'x-component-props': {},
+                  'x-decorator-props': {},
+                  'x-designable-id': 'll2lr39bjx6',
+                  'x-index': 0,
+                  name: 'institutionID'
+                },
+                accountID: {
+                  title: '审批人',
+                  'x-decorator': 'FormItem',
+                  'x-component': 'Select',
+                  'x-validator': [],
+                  'x-component-props': {},
+                  'x-decorator-props': {},
+                  'x-designable-id': 'p3xdnjmcq31',
+                  'x-index': 1,
+                  name: 'accountID'
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  },
+  'x-designable-id': 'yfsruicsp46'
+}

src/services/api/project.ts

@@ -162,3 +162,35 @@ export async function publishApproval(params: { ID: string }) {
     data: params
   })
 }
+
+/** 新增单位审批角色 */
+export async function getInstitutionRole(params: API.InstitutionRoleParams) {
+  return request('/InstitutionRole/list', {
+    method: 'POST',
+    data: params
+  })
+}
+
+/** 新增单位审批角色 */
+export async function addInstitutionRole(params: API.AddInstitutionRoleParams) {
+  return request('/InstitutionRole/add', {
+    method: 'POST',
+    data: params
+  })
+}
+
+/** 编辑单位审批角色 */
+export async function updateInstitutionRole(params: API.UpdateInstitutionRoleParams) {
+  return request('InstitutionRole/update', {
+    method: 'POST',
+    data: params
+  })
+}
+
+/** 删除单位审批角色 */
+export async function delInstitutionRole(params: { ID: string }) {
+  return request('InstitutionRole/delete', {
+    method: 'POST',
+    data: params
+  })
+}

src/services/api/typings.d.ts

@@ -390,4 +390,28 @@ declare namespace API {
     position?: 'top' | 'bottom'
     children?: ProfileTemplateItem[]
   }
+
+  type InstitutionRoleParams = {
+    ID: string
+    acronym: string
+    approvalMember: any[]
+    created: string
+    createdID: string
+    createdTime: number
+    id: string
+    institutionAcountTotal: number
+    memberTotal: number
+    name: string
+  }
+
+  type AddInstitutionRoleParams = {
+    institutionID: string
+    accountID: string
+  }
+
+  type UpdateInstitutionRoleParams = {
+    ID: string
+    institutionID: string
+    accountID: string
+  }
 }