Skip to content

Commit 815a02f

Browse files
xlornexlorne
committed
fix form
1 parent cd25b9c commit 815a02f

17 files changed

+184
-57
lines changed

‎admin-pro-ui/src/components/form/captcha.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,8 @@ const Captcha:React.FC<FormItemProps> = (props)=>{
3131
value={props.value}
3232
addonAfter={props.addonAfter}
3333
addonBefore={props.addonBefore}
34+
prefix={props.prefix}
35+
suffix={props.suffix}
3436
placeholder={props.placeholder}
3537
onChange={(value) => {
3638
const currentValue = value.target.value;
@@ -61,6 +63,7 @@ const FormCaptcha: React.FC<FormItemProps> = (props) => {
6163
required={props.required}
6264
hidden={props.hidden}
6365
help={props.help}
66+
tooltip={props.tooltip}
6467
>
6568
<Captcha
6669
{...props}

‎admin-pro-ui/src/components/form/cascader.tsx

Lines changed: 38 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
import React, {useEffect} from "react";
22
import {FormItemProps} from "@/components/form/types";
3-
import {Cascader, Form} from "antd";
3+
import {Cascader, Form, Space} from "antd";
44
import formFieldInit from "@/components/form/common";
55
import "./form.scss";
6+
import {FormAction} from "@/components/form/index";
67

78
const valueToForm = (value: string) => {
89
if (value && value.length > 0) {
@@ -18,9 +19,37 @@ const formToValue = (value: string[]) => {
1819
return value;
1920
}
2021

22+
interface $CascaderProps extends FormItemProps{
23+
formAction?:FormAction;
24+
}
25+
26+
const $Cascader:React.FC<$CascaderProps> = (props)=>{
27+
const formAction = props.formAction;
28+
return (
29+
<Space.Compact
30+
style={{
31+
width:"100%"
32+
}}
33+
>
34+
{props.addonBefore}
35+
<Cascader
36+
disabled={props.disabled}
37+
value={props.value}
38+
suffixIcon={props.suffix}
39+
prefix={props.prefix}
40+
options={props.options}
41+
onChange={(value) => {
42+
formAction?.setFieldValue(props.name, formToValue(value as string[]));
43+
props.onChange && props.onChange(value, formAction);
44+
}}
45+
/>
46+
{props.addonAfter}
47+
</Space.Compact>
48+
)
49+
}
50+
2151
const FormCascader: React.FC<FormItemProps> = (props) => {
2252

23-
const [visible, setVisible] = React.useState(false);
2453
const [options, setOptions] = React.useState(props.options);
2554

2655
const {formAction} = formFieldInit(props, () => {
@@ -39,11 +68,6 @@ const FormCascader: React.FC<FormItemProps> = (props) => {
3968
reloadOptions();
4069
}, []);
4170

42-
useEffect(() => {
43-
if (visible) {
44-
reloadOptions();
45-
}
46-
}, [visible]);
4771

4872
return (
4973
<Form.Item
@@ -52,6 +76,7 @@ const FormCascader: React.FC<FormItemProps> = (props) => {
5276
required={props.required}
5377
hidden={props.hidden}
5478
help={props.help}
79+
tooltip={props.tooltip}
5580

5681
getValueProps={(value) => {
5782
if (value) {
@@ -62,17 +87,12 @@ const FormCascader: React.FC<FormItemProps> = (props) => {
6287
return value
6388
}}
6489
>
65-
<Cascader
66-
disabled={props.disabled}
67-
value={props.value}
68-
options={options || []}
69-
onChange={(value) => {
70-
formAction?.setFieldValue(props.name, formToValue(value as string[]));
71-
props.onChange && props.onChange(value, formAction);
72-
setVisible(false);
73-
}}
74-
>
75-
</Cascader>
90+
<$Cascader
91+
{...props}
92+
options={options}
93+
formAction={formAction}
94+
/>
95+
7696
</Form.Item>
7797
)
7898
}

‎admin-pro-ui/src/components/form/checkbox.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ const FormCheckbox: React.FC<FormItemProps> = (props) => {
4444
required={props.required}
4545
hidden={props.hidden}
4646
help={props.help}
47+
tooltip={props.tooltip}
4748
getValueProps={(value) => {
4849
if (value) {
4950
return {

‎admin-pro-ui/src/components/form/code.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ const FormCode: React.FC<FormItemProps> = (props) => {
1717
hidden={props.hidden}
1818
help={props.help}
1919
required={props.required}
20+
tooltip={props.tooltip}
2021
>
2122
<CodeEditor
2223
readonly={props.disabled}

‎admin-pro-ui/src/components/form/color.tsx

Lines changed: 35 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import React from "react";
22
import {FormItemProps} from "@/components/form/types";
3-
import {ColorPicker, Form} from "antd";
3+
import {ColorPicker, Form, Space} from "antd";
44
import formFieldInit from "@/components/form/common";
55
import "./form.scss";
66
import type {AggregationColor} from "antd/es/color-picker/color";
7+
import {FormAction} from "@/components/form/index";
78

89
const formToValue = (value: AggregationColor) => {
910
if (value) {
@@ -12,6 +13,34 @@ const formToValue = (value: AggregationColor) => {
1213
return value;
1314
}
1415

16+
interface $ColorPickerProps extends FormItemProps{
17+
formAction?:FormAction;
18+
}
19+
20+
const $ColorPicker:React.FC<$ColorPickerProps> = (props)=>{
21+
const formAction = props.formAction;
22+
23+
return (
24+
<Space.Compact
25+
style={{
26+
width:"100%"
27+
}}
28+
>
29+
{props.addonBefore}
30+
<ColorPicker
31+
disabled={props.disabled}
32+
value={props.value}
33+
onChange={(value) => {
34+
const currentValue = formToValue(value);
35+
formAction?.setFieldValue(props.name, currentValue);
36+
props.onChange && props.onChange(currentValue, formAction);
37+
}}
38+
/>
39+
{props.addonAfter}
40+
</Space.Compact>
41+
)
42+
}
43+
1544
const FormColor: React.FC<FormItemProps> = (props) => {
1645

1746
const {formAction} = formFieldInit(props);
@@ -23,16 +52,13 @@ const FormColor: React.FC<FormItemProps> = (props) => {
2352
hidden={props.hidden}
2453
help={props.help}
2554
required={props.required}
55+
tooltip={props.tooltip}
2656
>
27-
<ColorPicker
28-
disabled={props.disabled}
29-
value={props.value}
30-
onChange={(value) => {
31-
const currentValue = formToValue(value);
32-
formAction?.setFieldValue(props.name, currentValue);
33-
props.onChange && props.onChange(currentValue, formAction);
34-
}}
57+
<$ColorPicker
58+
{...props}
59+
formAction={formAction}
3560
/>
61+
3662
</Form.Item>
3763
)
3864
}

‎admin-pro-ui/src/components/form/date.tsx

Lines changed: 44 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import React from "react";
22
import {FormItemProps} from "@/components/form/types";
3-
import {DatePicker, Form} from "antd";
3+
import {DatePicker, Form, Space} from "antd";
44
import dayjs from "dayjs";
55
import formFieldInit from "@/components/form/common";
66
import "./form.scss";
7+
import {FormAction} from "@/components/form/index";
78

89
const datePrecisionConverter = (precision?: string) => {
910
if (precision === "day") {
@@ -62,14 +63,49 @@ const showTime = (precision?: string) => {
6263
return null;
6364
}
6465

65-
const FormDate: React.FC<FormItemProps> = (props) => {
66+
interface $DatePicker extends FormItemProps{
67+
formAction?:FormAction;
68+
}
6669

67-
const {formAction} = formFieldInit(props);
70+
const $DatePicker:React.FC<$DatePicker> = (props)=>{
71+
72+
const formAction = props.formAction;
6873

6974
const format = props.dateFormat || 'YYYY-MM-DD';
7075
const precision = datePrecisionConverter(props.datePrecision) || "date";
7176
const showTimeConfig = showTime(props.datePrecision);
7277

78+
return (
79+
<Space.Compact
80+
style={{
81+
width:"100%"
82+
}}
83+
>
84+
{props.addonBefore}
85+
<DatePicker
86+
style={{
87+
width:"100%"
88+
}}
89+
disabled={props.disabled}
90+
value={props.value}
91+
prefix={props.prefix}
92+
suffixIcon={props.suffix}
93+
picker={precision}
94+
showTime={showTimeConfig?{format: showTimeConfig.format}:false}
95+
onChange={(date, dateString) => {
96+
const currentDate = dayjs(date).format(format);
97+
formAction?.setFieldValue(props.name, currentDate);
98+
props.onChange && props.onChange(currentDate, formAction);
99+
}}
100+
/>
101+
{props.addonAfter}
102+
</Space.Compact>
103+
)
104+
}
105+
106+
const FormDate: React.FC<FormItemProps> = (props) => {
107+
108+
const {formAction} = formFieldInit(props);
73109

74110
return (
75111
<Form.Item
@@ -78,6 +114,7 @@ const FormDate: React.FC<FormItemProps> = (props) => {
78114
hidden={props.hidden}
79115
help={props.help}
80116
required={props.required}
117+
tooltip={props.tooltip}
81118
getValueProps={(value) => {
82119
if (value) {
83120
return {
@@ -87,20 +124,11 @@ const FormDate: React.FC<FormItemProps> = (props) => {
87124
return value;
88125
}}
89126
>
90-
<DatePicker
91-
style={{
92-
width:"100%"
93-
}}
94-
disabled={props.disabled}
95-
value={props.value}
96-
picker={precision}
97-
showTime={showTimeConfig?{format: showTimeConfig.format}:false}
98-
onChange={(date, dateString) => {
99-
const currentDate = dayjs(date).format(format);
100-
formAction?.setFieldValue(props.name, currentDate);
101-
props.onChange && props.onChange(currentDate, formAction);
102-
}}
127+
<$DatePicker
128+
{...props}
129+
formAction={formAction}
103130
/>
131+
104132
</Form.Item>
105133
)
106134
}

‎admin-pro-ui/src/components/form/input.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ const FormInput: React.FC<FormItemProps> = (props) => {
1616
hidden={props.hidden}
1717
help={props.help}
1818
required={props.required}
19+
tooltip={props.tooltip}
1920
>
2021
<Input
2122
disabled={props.disabled}

‎admin-pro-ui/src/components/form/password.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,15 @@ const FormPassword: React.FC<FormItemProps> = (props) => {
1515
hidden={props.hidden}
1616
help={props.help}
1717
required={props.required}
18+
tooltip={props.tooltip}
1819
>
1920
<Input.Password
2021
disabled={props.disabled}
2122
value={props.value}
2223
addonAfter={props.addonAfter}
2324
addonBefore={props.addonBefore}
25+
prefix={props.prefix}
26+
suffix={props.suffix}
2427
placeholder={props.placeholder}
2528
onChange={(value) => {
2629
const currentValue = value.target.value;

‎admin-pro-ui/src/components/form/radio.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ const FormRadio: React.FC<FormItemProps> = (props) => {
3030
hidden={props.hidden}
3131
help={props.help}
3232
required={props.required}
33+
tooltip={props.tooltip}
3334
>
3435
<Radio.Group
3536
disabled={props.disabled}

‎admin-pro-ui/src/components/form/rate.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ const FormRate: React.FC<FormItemProps> = (props) => {
1414
hidden={props.hidden}
1515
help={props.help}
1616
required={props.required}
17+
tooltip={props.tooltip}
1718
>
1819
<Rate
1920
disabled={props.disabled}

0 commit comments

Comments
 (0)