Skip to content

Commit ba768d0

Browse files
xlornexlorne
committed
add refresh
1 parent b09d85a commit ba768d0

14 files changed

Lines changed: 204 additions & 62 deletions

File tree

‎apps/app-mobile/src/pages/home.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ const HomePage = () => {
3333
validators={[
3434
{
3535
target:'name',
36-
validator:(instance:FormInstance,value:any)=>{
36+
validator:(_instance:FormInstance,value:any)=>{
3737
if(value){
3838
return true;
3939
}

‎apps/app-pc/src/components/string/index.tsx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,12 @@ import {type FormItemProps} from "@coding-form/form-view";
44

55
export const FormString: React.FC<FormItemProps> = (props) => {
66

7+
React.useEffect(()=>{
8+
if(props.version){
9+
console.log('refresh .... ');
10+
}
11+
},[props.version]);
12+
713
return (
814
<Form.Item
915
name={props.name}

‎apps/app-pc/src/config/form-register.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import {registerFormItems} from "@coding-form/form-view";
22
import {FormString} from "@/components/string";
33
import {Form} from "antd";
4-
import {LayoutFactory} from "@coding-form/form-view";
4+
import {LayoutRegister} from "@coding-form/form-view";
55
import {CardFormLayout} from "@/layout/card-form-layout.tsx";
66

77
export const registerForms = () => {
@@ -13,5 +13,5 @@ export const registerForms = () => {
1313
}
1414
]);
1515

16-
LayoutFactory.getInstance().register('card',CardFormLayout);
16+
LayoutRegister.getInstance().register('card',CardFormLayout);
1717
}

‎apps/app-pc/src/layout/card-form-layout.tsx‎

Lines changed: 33 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,39 @@
11
import React from "react";
2-
import type {FieldLayout, FormLayoutProps} from "@coding-form/form-view";
2+
import {type FormLayoutProps,type FormLayout} from "@coding-form/form-view";
33
import {FormItemFactory} from "@coding-form/form-view";
44
import {Col, Row} from "antd";
55

6-
export const CardFormLayout:React.FC<FormLayoutProps> = (props: FormLayoutProps) => {
6+
7+
/** 字段排版 **/
8+
export interface FieldLayout {
9+
/** 字段名称 **/
10+
code: string;
11+
/** 大小排版 **/
12+
span: number;
13+
}
14+
15+
/**
16+
* 卡片布局
17+
*/
18+
export interface CardLayout {
19+
/** 布局标题 **/
20+
title: string;
21+
/** 布局方向 **/
22+
layout: 'horizontal' | 'vertical';
23+
/** 展示字段 **/
24+
fields: FieldLayout[];
25+
/** 主要字段 **/
26+
mainFields: string[];
27+
}
28+
29+
30+
type CardFormLayoutProps = Omit<FormLayoutProps, 'layout'> & {
31+
layout: Omit<FormLayout, 'props'> & {
32+
props: CardLayout;
33+
};
34+
};
35+
36+
export const CardFormLayout:React.FC<CardFormLayoutProps> = (props: CardFormLayoutProps) => {
737

838
const layout = props.layout;
939
const review = props.review;
@@ -40,7 +70,7 @@ export const CardFormLayout:React.FC<FormLayoutProps> = (props: FormLayoutProps)
4070
{layout.props.title}
4171
</Col>
4272

43-
{fieldLayouts.map(item=>{
73+
{fieldLayouts.map((item)=>{
4474
return fieldRender(item);
4575
})}
4676

‎apps/app-pc/src/pages/home.tsx‎

Lines changed: 41 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import {createFormInstance, FormView} from "@coding-form/form-view";
22
import type {FormMeta} from "@coding-form/form-view";
33
import {Button, Space} from "antd";
44
import {FormInstance} from "@coding-form/form-view";
5+
import type {CardLayout} from "@/layout/card-form-layout.tsx";
56

67
const HomePage = () => {
78

@@ -26,6 +27,15 @@ const HomePage = () => {
2627
dataType: 'STRING',
2728
hidden: false,
2829
required: true,
30+
},
31+
{
32+
id: "name2",
33+
name: '姓名2',
34+
code: 'name2',
35+
type: "string",
36+
dataType: 'STRING',
37+
hidden: false,
38+
required: true,
2939
}
3040
],
3141
subForms: []
@@ -41,7 +51,7 @@ const HomePage = () => {
4151
validators={[
4252
{
4353
target:'name',
44-
validator:(instance:FormInstance,value:any)=>{
54+
validator:(_instance:FormInstance,value:any)=>{
4555
if(value){
4656
return true;
4757
}
@@ -68,12 +78,35 @@ const HomePage = () => {
6878
layout:'vertical',
6979
mainFields:[],
7080
fields:[
81+
{
82+
code:'id',
83+
span:0
84+
},
7185
{
7286
code:'name',
73-
span:12
87+
span:24
7488
}
7589
]
7690
}
91+
},
92+
{
93+
formCode:'leave',
94+
type:'card',
95+
props:{
96+
title:'测试',
97+
layout:'vertical',
98+
mainFields:[],
99+
fields:[
100+
{
101+
code:'name2',
102+
span:12
103+
},
104+
{
105+
code:'name2',
106+
span:12
107+
}
108+
]
109+
} as CardLayout
77110
}
78111
]}
79112
/>
@@ -85,6 +118,12 @@ const HomePage = () => {
85118
}}
86119
>submit</Button>
87120

121+
<Button
122+
onClick={() => {
123+
form.refreshFields('name');
124+
}}
125+
>refresh</Button>
126+
88127
<Button
89128
onClick={() => {
90129
const values = form.getFieldsValue();

‎packages/form-view/src/instance/index.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ import {FormRegistry} from "@/register";
33
import {FormControl} from "./control";
44
import {FormPresenter} from "@/presenters";
55

6-
76
export class FormInstance {
87

98
private readonly instanceList: FormControl[];
@@ -112,4 +111,8 @@ export class FormInstance {
112111
this.presenter?.requiredFields(required, nameList, formCode);
113112
}
114113

114+
public refreshFields(nameList: string[]|string, formCode?: string) {
115+
this.presenter?.refreshFields(nameList, formCode);
116+
}
117+
115118
}

‎packages/form-view/src/layout/default-layout.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,9 @@ import React from "react";
22
import {FormLayoutProps} from "@/types";
33
import {FormItemFactory} from "@/factory";
44

5-
export const DefaultLayout: React.FC<FormLayoutProps> = (props) => {
5+
type DefaultLayoutProps = Omit<FormLayoutProps, 'layout'>;
6+
7+
export const DefaultLayout: React.FC<DefaultLayoutProps> = (props) => {
68

79
const fields = props.fields;
810
const formCode = props.formCode;

‎packages/form-view/src/layout/index.tsx‎

Lines changed: 27 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
11
import {FormField, FormLayout} from "@/types";
22
import React from "react";
33
import {FormContextScope} from "@/context";
4-
import {LayoutFactory} from "@/layout/factory";
4+
import {LayoutRegister} from "@/register/layout";
55
import {DefaultLayout} from "@/layout/default-layout";
6-
export * from "./factory";
76

87
export class LayoutContext {
98

@@ -13,37 +12,44 @@ export class LayoutContext {
1312
this.layouts = layouts;
1413
}
1514

16-
public getLayout(formCode:string){
15+
public getLayouts(formCode:string){
16+
const layouts = [];
1717
for(const layout of this.layouts){
1818
if(layout.formCode === formCode){
19-
return layout;
19+
layouts.push(layout);
2020
}
2121
}
22-
return undefined;
22+
return layouts;
2323
}
2424

2525

2626
public render(formCode:string,fields:FormField[],review:boolean,context:FormContextScope){
27-
const layout = this.getLayout(formCode);
28-
29-
if(layout) {
30-
const LayoutComponent = LayoutFactory.getInstance().getLayoutComponent(layout.type);
31-
if (LayoutComponent) {
32-
return (
33-
<LayoutComponent
34-
layout={layout}
35-
fields={fields}
36-
review={review}
37-
context={context}
38-
formCode={formCode}
39-
/>
40-
)
41-
}
27+
const layouts = this.getLayouts(formCode);
28+
29+
if(layouts && layouts.length > 0) {
30+
return (
31+
<>
32+
{layouts.map((layout:FormLayout) => {
33+
const LayoutComponent = LayoutRegister.getInstance().getLayoutComponent(layout.type);
34+
console.log('LayoutComponent', layout);
35+
if (LayoutComponent) {
36+
return (
37+
<LayoutComponent
38+
layout={layout}
39+
fields={fields}
40+
review={review}
41+
context={context}
42+
formCode={formCode}
43+
/>
44+
)
45+
}
46+
})}
47+
</>
48+
)
4249
}
4350

4451
return (
4552
<DefaultLayout
46-
layout={layout as any}
4753
fields={fields}
4854
review={review}
4955
context={context}

‎packages/form-view/src/presenters/form-presenter.ts‎

Lines changed: 58 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {Dispatch, FormField, FormMeta, FormState} from "@/types";
1+
import {Dispatch, FormMeta, FormState, StateField} from "@/types";
22

33
export class FormPresenter {
44
private state: FormState;
@@ -51,6 +51,39 @@ export class FormPresenter {
5151
})
5252
}
5353

54+
55+
public refreshFields(nameList: string[]|string, formCode?: string){
56+
this.dispatch(prevState => {
57+
const subFormList = prevState.subForms || [];
58+
return {
59+
...prevState,
60+
fields:prevState.fields.map(item=>{
61+
if(formCode){
62+
if(formCode===prevState.code){
63+
return this.refreshMapFields(item,nameList);
64+
}
65+
}else {
66+
return this.refreshMapFields(item,nameList);
67+
}
68+
return item;
69+
}),
70+
subForms:subFormList.map(item=>{
71+
if(formCode){
72+
if(formCode===item.code){
73+
return {
74+
...item,
75+
fields:item.fields.map(item=>{
76+
return this.refreshMapFields(item,nameList);
77+
})
78+
}
79+
}
80+
}
81+
return item;
82+
})
83+
}
84+
})
85+
}
86+
5487
public requiredFields(required: boolean, nameList: string[]|string, formCode?: string) {
5588
this.dispatch(prevState => {
5689
const subFormList = prevState.subForms || [];
@@ -84,7 +117,7 @@ export class FormPresenter {
84117
}
85118

86119

87-
private hiddenMapFields(hidden: boolean,field:FormField,nameList: string[]|string) {
120+
private hiddenMapFields(hidden: boolean,field:StateField,nameList: string[]|string) {
88121
if(typeof nameList === 'string'){
89122
if(field.code ===nameList){
90123
return {
@@ -103,7 +136,29 @@ export class FormPresenter {
103136
return field;
104137
}
105138

106-
private requiredMapFields(required: boolean,field:FormField,nameList: string[]|string) {
139+
140+
private refreshMapFields(field:StateField,nameList: string[]|string) {
141+
if(typeof nameList === 'string'){
142+
if(field.code ===nameList){
143+
const version = field.version?field.version:0;
144+
return {
145+
...field,
146+
version:version+1
147+
}
148+
}
149+
}else {
150+
if(nameList.includes(field.code)){
151+
const version = field.version?field.version:0;
152+
return {
153+
...field,
154+
version:version+1
155+
}
156+
}
157+
}
158+
return field;
159+
}
160+
161+
private requiredMapFields(required: boolean,field:StateField,nameList: string[]|string) {
107162
if(typeof nameList === 'string'){
108163
if(field.code ===nameList){
109164
return {

‎packages/form-view/src/register/index.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
1-
export * from "./form";
1+
export * from "./form";
2+
export * from "./layout";

0 commit comments

Comments
 (0)