feat: 项目管理的项目名称详情+设置审批流程

src/pages/Institutions/Staff/components/StaffDrawer.tsx

@@ -236,7 +236,7 @@ const StaffDrawer: React.FC<StaffModalProps> = ({
           watch={watch}
         />
       )}
-      <div>
+      <div className="ml-120px">
         <Button type="primary" onClick={form.submit}>
           提交
         </Button>

src/pages/Institutions/Staff/index.tsx

@@ -74,7 +74,7 @@ const CompanyList: React.FC<ListProps> = ({ schema, dispatch, accountTypeList })
         <div
           className="text-primary cursor-pointer hover:text-hex-967bbd"
           onClick={() => {
-            setState({ ...state, visibles: true, staffDetail: record, readOnly: true })
+            setState({ ...state, visibles: true, staffDetail: record })
           }}>
           {name}
         </div>

src/pages/Project/Management/components/DetailModal.tsx

@@ -0,0 +1,144 @@
+import { connect, useRequest } from 'umi'
+import { useEffect, useRef, useState } from 'react'
+import { Drawer, message, Tabs } from 'antd'
+import { queryAcountList, getApprovalList, setApproval } from '@/services/api/institution'
+import { delay } from '@/utils/util'
+import FormRender, { useForm } from 'form-render'
+import { BaseMenuEnum } from '@/pages/Schema/Base'
+import type { SchemaBaseModelState } from '@/pages/Schema/Base/model'
+import type { ConnectProps } from 'umi'
+import type { ProjectModelState } from '../../model'
+import ProForm, { ProFormSelect } from '@ant-design/pro-form'
+
+export enum ModalType {
+  ADD = 0,
+  UPDATE = 1
+}
+
+type ProjectModalProps = ConnectProps & {
+  visibles: boolean
+  setVisible: (visibles: boolean) => void
+  readOnly: boolean
+  readOnly: boolean
+  type: ModalType
+  defaultFormData?: {
+    ID: string
+    name: string
+  }
+  reloadTable: () => void
+  schema?: Record<string, any> | null
+}
+const DetailModal: React.FC<ProjectModalProps> = ({
+  visibles,
+  setVisible,
+  readOnly,
+  dispatch,
+  schema,
+  defaultFormData,
+  pTypeList,
+  reloadTable
+}) => {
+  const form = useForm()
+  const ref = useRef<FormInstance>(null)
+  const { TabPane } = Tabs
+  const [state, setState] = useState({
+    acountList: [],
+    approvalList: []
+  })
+
+  const { run: tryAcountList } = useRequest(() => queryAcountList(), {
+    manual: true,
+    onSuccess: result => {
+      setState({ ...state, acountList: result.items })
+    }
+  })
+
+  const { run: tryApprovalList } = useRequest(() => getApprovalList(), {
+    manual: true,
+    onSuccess: result => {
+      setState({ ...state, approvalList: result.items })
+    }
+  })
+
+  const { run: trySetApproval } = useRequest(setApproval, {
+    manual: true,
+    onSuccess: () => {
+      message.success('提交成功')
+    }
+  })
+
+  useEffect(() => {
+    if (visibles && !schema) {
+      dispatch({
+        type: 'schemaBase/querySchema',
+        payload: {
+          columnType: BaseMenuEnum.PROJECT
+        }
+      })
+    }
+    tryAcountList()
+    tryApprovalList()
+  }, [visibles])
+
+  const onMount = () => {
+    form.setValues({ ...defaultFormData })
+    delay(80).then(() => {
+      // console.log(pTypeList)
+
+      form.setSchemaByPath('projectTypeID', {
+        enum: pTypeList.map(item => item.value),
+        enumNames: pTypeList.map(item => item.label)
+      })
+    })
+  }
+
+  const onFinish = async (formData, value) => {
+    await trySetApproval({ ...formData, ...value, ID: defaultFormData.ID })
+    setVisible(false)
+    reloadTable()
+  }
+  return (
+    <Drawer
+      width="50vw"
+      visible={visibles}
+      onClose={() => {
+        // ref.current?.resetFields()
+        setVisible(false)
+      }}
+      title={defaultFormData?.name}>
+      <Tabs>
+        <TabPane tab="项目信息" key="1">
+          {schema && (
+            <FormRender form={form} schema={schema} onMount={onMount} readOnly={readOnly} />
+          )}
+        </TabPane>
+        <TabPane tab="审批流程" key="2">
+          <ProForm
+            formRef={ref}
+            submitter={{ resetButtonProps: { style: { display: 'none' } } }}
+            onFinish={onFinish}>
+            <ProFormSelect
+              name="accountID"
+              label={'上报人'}
+              placeholder="请选择上报人"
+              options={state.acountList}
+            />
+            <ProFormSelect
+              name="approvalID"
+              label={'审批流程'}
+              placeholder="请选择审批流程"
+              options={state.approvalList}
+            />
+          </ProForm>
+        </TabPane>
+      </Tabs>
+    </Drawer>
+  )
+}
+
+export default connect(
+  ({ project, schemaBase }: { project: ProjectModelState; schemaBase: SchemaBaseModelState }) => ({
+    pTypeList: project.projectTypeList.map(item => ({ label: item.name, value: item.ID })),
+    schema: schemaBase.base[BaseMenuEnum.PROJECT]?.schema
+  })
+)(DetailModal)

src/pages/Project/Management/components/ProjectModal.tsx

@@ -17,6 +17,7 @@ export enum ModalType {
 type ProjectModalProps = ConnectProps & {
   visible: boolean
   setVisible: (visible: boolean) => void
+  readOnly: boolean
   type: ModalType
   defaultFormData?: {
     ID: string

src/pages/Project/Management/index.tsx

@@ -4,7 +4,7 @@ import type { ProColumnType, ActionType } from '@ant-design/pro-table'
 import { Button, Popconfirm } from 'antd'
 import consts from '@/utils/consts'
 import { useRef, useState, useEffect } from 'react'
-import { connect, useRequest, history } from 'umi'
+import { connect, useRequest } from 'umi'
 import type { ConnectProps } from 'umi'
 import type { ProjectModelState } from '../model'
 import { DeleteOutlined } from '@ant-design/icons'
@@ -14,6 +14,7 @@ import { PageContainer } from '@ant-design/pro-layout'
 import type { SchemaBaseModelState } from '@/pages/Schema/Base/model'
 import { BaseMenuEnum } from '@/pages/Schema/Base'
 import { generateColumns } from '@/utils/util'
+import DetailModal from './components/DetailModal'
 
 type ListProps = ConnectProps & {
   pTypeList: { label: string; value: string }[]
@@ -41,6 +42,8 @@ const List: React.FC<ListProps> = ({ schema, dispatch, pTypeList }) => {
       search: null
     },
     visible: false,
+    visibles: false,
+    readOnly: true,
     currentModalType: ModalType.ADD,
     defaultFormData: null
   })
@@ -55,7 +58,25 @@ const List: React.FC<ListProps> = ({ schema, dispatch, pTypeList }) => {
     },
     {
       dataIndex: 'name',
-      title: '项目名称'
+      title: '项目名称',
+      render: (name, record) => (
+        <div
+          className="text-primary cursor-pointer hover:text-hex-967bbd"
+          onClick={() => {
+            setState({
+              ...state,
+              visibles: true,
+              readOnly: true,
+              defaultFormData: {
+                ID: record.ID,
+                name: record.name,
+                projectTypeID: record.projectType.ID
+              }
+            })
+          }}>
+          {name}
+        </div>
+      )
     },
     {
       dataIndex: 'createdTime',
@@ -78,9 +99,22 @@ const List: React.FC<ListProps> = ({ schema, dispatch, pTypeList }) => {
     },
     {
       dataIndex: 'created',
+      key: 'created',
       title: '创建人'
     },
     {
+      dataIndex: 'reportAccount',
+      key: 'reportAccount',
+      title: '数据上报',
+      renderText: (_, record) => record.reportAccount?.name
+    },
+    {
+      dataIndex: 'approval',
+      key: 'approval',
+      title: '审批流程',
+      renderText: (_, record) => record.approval?.name
+    },
+    {
       title: '操作',
       dataIndex: 'operation',
       render: (_, record) => (
@@ -140,6 +174,7 @@ const List: React.FC<ListProps> = ({ schema, dispatch, pTypeList }) => {
           actions: [
             // <Button onClick={() => history.push('/project/management/add')}>新建项目</Button>
             <Button
+              type="primary"
               onClick={() =>
                 setState({ ...state, visible: true, currentModalType: ModalType.ADD })
               }>
@@ -158,6 +193,15 @@ const List: React.FC<ListProps> = ({ schema, dispatch, pTypeList }) => {
         reloadTable={() => tRef.current?.reload()}
         setVisible={(visible: boolean) => setState({ ...state, visible })}
       />
+
+      <DetailModal
+        defaultFormData={state.defaultFormData}
+        pTypeList={pTypeList}
+        visibles={state.visibles}
+        readOnly={state.readOnly}
+        reloadTable={() => tRef.current?.reload()}
+        setVisible={(visibles: boolean) => setState({ ...state, visibles })}
+      />
     </PageContainer>
   )
 }

src/services/api/institution.ts

@@ -117,3 +117,18 @@ export async function delOrganizationalStructure(params: API.OrganizationalStruc
     data: params
   })
 }
+
+/** 获得审批流程列表 */
+export async function getApprovalList() {
+  return request('/approval/list', {
+    method: 'GET'
+  })
+}
+
+/** 设置审批信息 */
+export async function setApproval(params: API.ApprovalSetParams) {
+  return request('/project/set/approval', {
+    method: 'POST',
+    data: params
+  })
+}

src/services/api/typings.d.ts

@@ -184,4 +184,19 @@ declare namespace API {
   type SchemaParams = {
     columnType: number
   }
+
+  type ApprovalListParams = {
+    ID: string
+    name: string
+    created: string
+    createdID: string
+    createdTime: number
+    id: string
+  }
+
+  type ApprovalSetParams = {
+    ID: string
+    accountID: string
+    approvalID: string
+  }
 }