feat: 1

src/pages/Schema/Base/index.tsx

@@ -22,7 +22,6 @@ import {
   TimePicker,
   TreeSelect
 } from '@formily/antd'
-import 'antd/dist/antd.less'
 import { projectSchema, institutionSchema, staffSchema } from '@/utils/schema'
 import type { ConnectProps } from '@umijs/max'
 import { Button } from 'antd'

src/pages/Schema/Budget/index.tsx

@@ -2,8 +2,31 @@ import { queryTemplateList } from '@/services/api/schema'
 import { PageContainer } from '@ant-design/pro-layout'
 import React, { useState } from 'react'
 import { useRequest } from '@umijs/max'
-import LeftMenu from './Components/LeftMenu'
+import LeftMenu from './components/LeftMenu'
+import { createForm, onFieldReact } from '@formily/core'
+import { createSchemaField } from '@formily/react'
+import {
+  FormItem,
+  Input,
+  Switch,
+  Select,
+  FormGrid,
+  FormLayout,
+  Form,
+  Radio,
+  Checkbox,
+  NumberPicker,
+  Password,
+  DatePicker,
+  TimePicker,
+  TreeSelect,
+  FormButtonGroup,
+  Submit
+} from '@formily/antd'
 
+import { schema } from './schema'
+import { queryOrganizationalMembersList } from '@/services/api/institution'
+import consts from '@/utils/consts'
 type iState = {
   menuData: API.TemplateListItem[]
   activeID: Nullable<string>
@@ -25,11 +48,64 @@ const Budget = () => {
   const onSelect = (key: string) => {
     setState({ ...state, activeID: key })
   }
+
+  const form = createForm({
+    initialValues: {},
+    effects() {
+      onFieldReact('receiver.receiverInstitutionID', async field => {
+        if (!field.dataSource?.length) {
+          // 将企事业列表直接赋予当前字段
+          field.dataSource = []
+          return
+        }
+        // 收件人企事业id
+        const institutionID = field.value
+        if (institutionID) {
+          const { code = -1, data } = await queryOrganizationalMembersList({ institutionID })
+          if (code === consts.RET_CODE.SUCCESS) {
+            form.setFieldState('receiver.receiverAccountIDs', field => {
+              field.dataSource = data.map(item => ({ label: item.name, value: item.ID }))
+            })
+          }
+        }
+      })
+    }
+  })
+  const SchemaField = createSchemaField({
+    components: {
+      FormLayout,
+      FormItem,
+      FormGrid,
+      Input,
+      Switch,
+      Select,
+      Radio,
+      Checkbox,
+      NumberPicker,
+      Password,
+      DatePicker,
+      TimePicker,
+      TreeSelect
+    }
+  })
+
+  const onFinish = values => {
+    console.log(values)
+  }
   return (
     <PageContainer title={false}>
       <div className="h-full w-full flex flex-row">
         <LeftMenu onSelect={onSelect} options={state.menuData} initFn={() => tryFetchTemplateList()} />
-        <div className="w-6/7 ml-8 bg-white p-4  rounded-20px shadow-hex-3e2c5a relative">表单详情</div>
+        <div className="w-6/7 ml-8 bg-white p-4  rounded-20px shadow-hex-3e2c5a relative">
+          <div className="w-600px">
+            <Form form={form} labelCol={12}>
+              <SchemaField schema={schema} />
+              <FormButtonGroup>
+                <Submit onSubmit={onFinish}>提交</Submit>
+              </FormButtonGroup>
+            </Form>
+          </div>
+        </div>
       </div>
     </PageContainer>
   )

src/pages/Schema/Budget/schema.ts

@@ -0,0 +1,264 @@
+export const schema = {
+  type: 'object',
+  properties: {
+    receiver: {
+      type: 'object',
+      'x-validator': [],
+      name: 'receiver',
+      'x-designable-id': 'uzrnxyxj8l2',
+      'x-index': 0,
+      properties: {
+        j6t9tp83i49: {
+          type: 'void',
+          'x-component': 'FormGrid',
+          'x-validator': [],
+          'x-component-props': {
+            minColumns: 2
+          },
+          'x-designable-id': 'j6t9tp83i49',
+          'x-index': 0,
+          properties: {
+            receiverInstitutionID: {
+              title: '收件员',
+              'x-decorator': 'FormItem',
+              'x-component': 'Select',
+              'x-validator': [],
+              'x-component-props': {},
+              'x-decorator-props': {},
+              name: 'receiverInstitutionID',
+              required: true,
+              'x-designable-id': 'ggfc3yhph1q',
+              'x-index': 0
+            },
+            receiverAccountIDs: {
+              title: '',
+              'x-decorator': 'FormItem',
+              'x-component': 'TreeSelect',
+              'x-validator': [],
+              'x-component-props': {
+                treeCheckable: true,
+                treeDefaultExpandAll: true,
+                showSearch: true,
+                showArrow: true,
+                labelInValue: false,
+                autoFocus: false,
+                allowClear: true
+              },
+              'x-decorator-props': {},
+              required: true,
+              name: 'receiverAccountIDs',
+              'x-designable-id': 'h3lybqrqozk',
+              'x-index': 1
+            }
+          }
+        }
+      }
+    },
+    fgLeader: {
+      type: 'object',
+      'x-validator': [],
+      name: 'fgLeader',
+      'x-designable-id': 'h2winr4c2sl',
+      'x-index': 1,
+      properties: {
+        ctp8nw51qvl: {
+          type: 'void',
+          'x-component': 'FormGrid',
+          'x-validator': [],
+          'x-component-props': {
+            minColumns: 2
+          },
+          'x-designable-id': 'ctp8nw51qvl',
+          'x-index': 0,
+          properties: {
+            fgLeaderInstitutionID: {
+              title: '分管领导',
+              'x-decorator': 'FormItem',
+              'x-component': 'Select',
+              'x-validator': [],
+              'x-component-props': {},
+              'x-decorator-props': {},
+              name: 'fgLeaderInstitutionID',
+              required: true,
+              'x-designable-id': 'lv362lk8zoh',
+              'x-index': 0
+            },
+            fgLeaderAccountIDs: {
+              title: '',
+              'x-decorator': 'FormItem',
+              'x-component': 'TreeSelect',
+              'x-validator': [],
+              'x-component-props': {
+                allowClear: true,
+                showArrow: true,
+                showSearch: true,
+                treeDefaultExpandAll: true,
+                treeCheckable: true
+              },
+              'x-decorator-props': {},
+              name: 'fgLeaderAccountIDs',
+              required: true,
+              'x-designable-id': 'kosbw33j1wy',
+              'x-index': 1
+            }
+          }
+        }
+      }
+    },
+    zxLeader: {
+      type: 'object',
+      'x-validator': [],
+      name: 'zxLeader',
+      'x-designable-id': 'ls0xboaj8sc',
+      'x-index': 2,
+      properties: {
+        v0qrosfsw3p: {
+          type: 'void',
+          'x-component': 'FormGrid',
+          'x-validator': [],
+          'x-component-props': {
+            minColumns: 2
+          },
+          'x-designable-id': 'v0qrosfsw3p',
+          'x-index': 0,
+          properties: {
+            zxLeaderInstitutionID: {
+              title: '中心领导',
+              'x-decorator': 'FormItem',
+              'x-component': 'Select',
+              'x-validator': [],
+              'x-component-props': {},
+              'x-decorator-props': {},
+              name: 'zxLeaderInstitutionID',
+              'x-designable-id': 'p31hkjixl16',
+              'x-index': 0,
+              required: true
+            },
+            zxLeaderAccounts: {
+              title: '',
+              'x-decorator': 'FormItem',
+              'x-component': 'TreeSelect',
+              'x-validator': [],
+              'x-component-props': {
+                allowClear: true,
+                labelInValue: false,
+                showArrow: true,
+                showSearch: true,
+                treeCheckable: true,
+                treeDefaultExpandAll: true
+              },
+              'x-decorator-props': {},
+              name: 'zxLeaderAccounts',
+              required: true,
+              'x-designable-id': 'vbu2agjbkia',
+              'x-index': 1
+            }
+          }
+        }
+      }
+    },
+    post: {
+      type: 'object',
+      'x-validator': [],
+      name: 'post',
+      'x-designable-id': '7jrdrzcwl4z',
+      'x-index': 3,
+      properties: {
+        nxombc1rrjd: {
+          type: 'void',
+          'x-component': 'FormGrid',
+          'x-validator': [],
+          'x-component-props': {
+            minColumns: 2
+          },
+          'x-designable-id': 'nxombc1rrjd',
+          'x-index': 0,
+          properties: {
+            postInstitutionID: {
+              title: '发文',
+              'x-decorator': 'FormItem',
+              'x-component': 'Select',
+              'x-validator': [],
+              'x-component-props': {},
+              'x-decorator-props': {},
+              name: 'postInstitutionID',
+              'x-designable-id': '1sohvz4sbw5',
+              'x-index': 0,
+              required: true
+            },
+            postAccountIDs: {
+              title: '',
+              'x-decorator': 'FormItem',
+              'x-component': 'TreeSelect',
+              'x-validator': [],
+              'x-component-props': {
+                labelInValue: false,
+                showArrow: true,
+                showSearch: true,
+                treeCheckable: true,
+                treeDefaultExpandAll: true
+              },
+              'x-decorator-props': {},
+              name: 'postAccountIDs',
+              required: true,
+              'x-designable-id': 'lw5p0zkp266',
+              'x-index': 1
+            }
+          }
+        }
+      }
+    },
+    archive: {
+      type: 'object',
+      'x-validator': [],
+      name: 'archive',
+      'x-designable-id': '8ou2kur3tku',
+      'x-index': 4,
+      properties: {
+        archive: {
+          type: 'void',
+          'x-component': 'FormGrid',
+          'x-validator': [],
+          'x-component-props': {
+            minColumns: 2
+          },
+          name: 'archive',
+          'x-designable-id': 'fle7qp5yshx',
+          'x-index': 0,
+          properties: {
+            archiveInstitutionID: {
+              title: '归档',
+              'x-decorator': 'FormItem',
+              'x-component': 'Select',
+              'x-validator': [],
+              'x-component-props': {},
+              'x-decorator-props': {},
+              name: 'archiveInstitutionID',
+              'x-designable-id': 'gfbvoofphoo',
+              'x-index': 0,
+              required: true
+            },
+            archiveAccountIDs: {
+              title: '',
+              'x-decorator': 'FormItem',
+              'x-component': 'TreeSelect',
+              'x-validator': [],
+              'x-component-props': {
+                showArrow: true,
+                showSearch: true,
+                treeCheckable: true,
+                treeDefaultExpandAll: true
+              },
+              'x-decorator-props': {},
+              required: true,
+              name: 'archiveAccountIDs',
+              'x-designable-id': 'ynu0ga6cip0',
+              'x-index': 1
+            }
+          }
+        }
+      }
+    }
+  },
+  'x-designable-id': 'khexddrjzg0'
+}

src/pages/Schema/Option/index.tsx

@@ -1,5 +1,5 @@
 import { Button, message, Tooltip } from 'antd'
-import LeftMenu from './Components/LeftMenu'
+import LeftMenu from './components/LeftMenu'
 import { SortableContainer, SortableElement, SortableHandle } from 'react-sortable-hoc'
 import { arrayMoveImmutable } from 'array-move'
 import type { ColumnsType } from 'antd/lib/table'