lu-lowcode-package-form 0.9.24 → 0.9.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +2 -2
- package/dist/index.es.js +3388 -3378
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/src/App.jsx +20 -8
- package/src/components/field/base.jsx +6 -5
- package/src/components/field/table/index.jsx +10 -9
- package/src/components/form-container/index.jsx +7 -3
package/dist/style.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.fabsolute{position:absolute}.frelative{position:relative}.fleft-0{left:0}.ftop-0{top:0}.fz-10{z-index:10}.fmy-2{margin-top:.5rem;margin-bottom:.5rem}.fmt-2{margin-top:.5rem}.
|
|
1
|
+
*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.fabsolute{position:absolute}.frelative{position:relative}.fleft-0{left:0}.ftop-0{top:0}.fz-10{z-index:10}.fmy-2{margin-top:.5rem;margin-bottom:.5rem}.fmt-2{margin-top:.5rem}.fbox-border{box-sizing:border-box}.fflex{display:flex}.fhidden{display:none}.fh-11{height:2.75rem}.fh-12{height:3rem}.fh-24{height:6rem}.fh-5{height:1.25rem}.fh-8{height:2rem}.fh-full{height:100%}.fmax-h-full{max-height:100%}.fmin-h-20{min-height:5rem}.fmin-h-5{min-height:1.25rem}.fw-24{width:6rem}.fw-5{width:1.25rem}.fw-\[960px\]{width:960px}.fw-full{width:100%}.fmin-w-36{min-width:9rem}.fmin-w-full{min-width:100%}.fmax-w-full{max-width:100%}.fflex-1{flex:1 1 0%}.fcursor-not-allowed{cursor:not-allowed}.fcursor-pointer{cursor:pointer}.fflex-col{flex-direction:column}.fflex-wrap{flex-wrap:wrap}.fflex-nowrap{flex-wrap:nowrap}.fitems-center{align-items:center}.fitems-stretch{align-items:stretch}.fjustify-center{justify-content:center}.fjustify-between{justify-content:space-between}.fgap-1{gap:.25rem}.fgap-2{gap:.5rem}.fgap-3{gap:.75rem}.fgap-x-1{column-gap:.25rem}.foverflow-hidden{overflow:hidden}.foverflow-x-auto{overflow-x:auto}.ftext-nowrap{text-wrap:nowrap}.frounded{border-radius:.25rem}.fborder{border-width:1px}.fborder-b{border-bottom-width:1px}.fborder-l-4{border-left-width:4px}.fborder-dashed{border-style:dashed}.fborder-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.fborder-red-500{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity))}.fborder-slate-300{--tw-border-opacity: 1;border-color:rgb(203 213 225 / var(--tw-border-opacity))}.fbg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.fbg-gray-50{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity))}.fbg-gray-900{--tw-bg-opacity: 1;background-color:rgb(17 24 39 / var(--tw-bg-opacity))}.fbg-red-500{--tw-bg-opacity: 1;background-color:rgb(239 68 68 / var(--tw-bg-opacity))}.fbg-slate-50{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))}.fbg-transparent{background-color:transparent}.fbg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.fbg-opacity-50{--tw-bg-opacity: .5}.fobject-contain{object-fit:contain}.fp-0{padding:0}.fp-2{padding:.5rem}.fp-4{padding:1rem}.fp-6{padding:1.5rem}.fpx-2{padding-left:.5rem;padding-right:.5rem}.fpb-10{padding-bottom:2.5rem}.fpl-2{padding-left:.5rem}.fpt-2{padding-top:.5rem}.ftext-lg{font-size:1.125rem;line-height:1.75rem}.ftext-sm{font-size:.875rem;line-height:1.25rem}.ftext-xs{font-size:.75rem;line-height:1rem}.ffont-bold{font-weight:700}.ffont-medium{font-weight:500}.ffont-semibold{font-weight:600}.ftext-gray-300{--tw-text-opacity: 1;color:rgb(209 213 219 / var(--tw-text-opacity))}.ftext-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.ftext-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.ftext-red-500{--tw-text-opacity: 1;color:rgb(239 68 68 / var(--tw-text-opacity))}.ftext-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.fopacity-5{opacity:.05}.hover\:fborder-\[\#3e92f8\]:hover{--tw-border-opacity: 1;border-color:rgb(62 146 248 / var(--tw-border-opacity))}.hover\:ftext-\[\#3e92f8\]:hover{--tw-text-opacity: 1;color:rgb(62 146 248 / var(--tw-text-opacity))}.hover\:ftext-gray-200:hover{--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity))}.fgroup:hover .group-hover\:fflex{display:flex}.fgroup:hover .group-hover\:fbg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity))}/*!
|
|
2
2
|
* Quill Editor v1.3.7
|
|
3
3
|
* https://quilljs.com/
|
|
4
4
|
* Copyright (c) 2014, Jason Chen
|
package/package.json
CHANGED
package/src/App.jsx
CHANGED
|
@@ -59,8 +59,20 @@ function App() {
|
|
|
59
59
|
const formData = formRef?.current?.formRef?.getFieldsValue();
|
|
60
60
|
console.log("formData", JSON.stringify(formData));
|
|
61
61
|
}
|
|
62
|
+
// 验证
|
|
63
|
+
const validateFields = async () => {
|
|
64
|
+
try {
|
|
65
|
+
var values = await formRef?.current?.formRef?.validateFields({
|
|
66
|
+
validateOnly: false,
|
|
67
|
+
})
|
|
68
|
+
console.log("values", values)
|
|
69
|
+
|
|
70
|
+
} catch (error) {
|
|
71
|
+
console.log("error",error)
|
|
72
|
+
}
|
|
73
|
+
}
|
|
62
74
|
const setFormFields = () => {
|
|
63
|
-
formRef?.current?.formRef?.setFieldsValue({"table":[{"product_price1":"12","product_num1":"123","product_sum1":"1476","node_oclxmzswzti":"","select2":""},{"product_price1":"123","product_num1":"213","product_sum1":"26199","node_oclxmzswzti":"","select2":""}],"product_total_price":"0.00","product_price":"213","product_num":"21","product_num_range":[1,22],"product_sum":"4473","switch":false})
|
|
75
|
+
formRef?.current?.formRef?.setFieldsValue({ "table": [{ "product_price1": "12", "product_num1": "123", "product_sum1": "1476", "node_oclxmzswzti": "", "select2": "" }, { "product_price1": "123", "product_num1": "213", "product_sum1": "26199", "node_oclxmzswzti": "", "select2": "" }], "product_total_price": "0.00", "product_price": "213", "product_num": "21", "product_num_range": [1, 22], "product_sum": "4473", "switch": false })
|
|
64
76
|
}
|
|
65
77
|
const handleCols = () => {
|
|
66
78
|
setCols(cols - 1)
|
|
@@ -85,8 +97,7 @@ function App() {
|
|
|
85
97
|
<Layout.FormGroupTitle title={"基本信息"} />
|
|
86
98
|
<Layout.FormRow layout={'1'}>
|
|
87
99
|
<Field.Table label="子表格" __id="table" >
|
|
88
|
-
<Field.Input
|
|
89
|
-
<Field.Input readonly={true} label="商品数量" __id="product_num1" />
|
|
100
|
+
<Field.Input isRequired={true} label="商品价格" __id="product_price1" />
|
|
90
101
|
<Field.Input label="商品总价" __id="product_sum1"
|
|
91
102
|
withIds={["table.product_price1", "table.product_num1"]}
|
|
92
103
|
withFill={{
|
|
@@ -159,11 +170,11 @@ function App() {
|
|
|
159
170
|
]
|
|
160
171
|
}}
|
|
161
172
|
/>
|
|
162
|
-
<Field.SearchSelect label="搜组件" option_search="username" option_label="username" setValue={() => { }} option_value="id"></Field.SearchSelect>
|
|
163
|
-
<Field.Input
|
|
164
|
-
<Field.Input
|
|
173
|
+
<Field.SearchSelect isRequired={true} label="搜组件" __id="searchuser" option_search="username" option_label="username" setValue={() => { }} option_value="id"></Field.SearchSelect>
|
|
174
|
+
<Field.Input rules={"^(1[3-9]\\d{9})$"} isRequired={true} label="商品价格" __id="product_price" />
|
|
175
|
+
<Field.Input label="商品数量" __id="product_num" />
|
|
165
176
|
<Field.NumberRange label="数量范围" __id="product_num_range" />
|
|
166
|
-
<Field.Input label="商品总价" __id="product_sum"
|
|
177
|
+
<Field.Input rules={"^(1[3-9]\\d{9})$"} label="商品总价" __id="product_sum"
|
|
167
178
|
withIds={["product_price", "product_num"]}
|
|
168
179
|
withFill={{
|
|
169
180
|
"value": [
|
|
@@ -204,7 +215,7 @@ function App() {
|
|
|
204
215
|
<Field.SingleSelect readonly={true} mode="single" label="测试单选" __id="select1" options={[{ label: '选项1', value: '1' }, { label: '选项2', value: '2' }]}></Field.SingleSelect>
|
|
205
216
|
<Field.MultipleSelect readonly={true} mode="multiple" label="测多选" __id="select2" options={[{ label: '选项1', value: '1' }, { label: '选项2', value: '2' }]}></Field.MultipleSelect>
|
|
206
217
|
<Field.TreeSelect readonly={true} label="分组名" __id="title11"></Field.TreeSelect>
|
|
207
|
-
<Field.Switch
|
|
218
|
+
<Field.Switch label="开关" __id="switch"></Field.Switch>
|
|
208
219
|
<Layout.FormGroupTitle title={"嘟嘟嘟嘟嘟"} />
|
|
209
220
|
<Field.CodeMachine readonly={true} label="角色编号" prompt="" __id="code"
|
|
210
221
|
withIds={["switch"]}
|
|
@@ -242,6 +253,7 @@ function App() {
|
|
|
242
253
|
Hover over me or my parent!
|
|
243
254
|
</div>
|
|
244
255
|
</div>
|
|
256
|
+
<Button type="primary" onClick={validateFields}>validateFields</Button>
|
|
245
257
|
<Button type="primary" onClick={getFormFields}>GetValues</Button>
|
|
246
258
|
<Button type="primary" onClick={setFormFields}>SetValues</Button>
|
|
247
259
|
<Button type="primary" onClick={handleCols}>UpdateCol</Button>
|
|
@@ -18,24 +18,25 @@ export const BaseWrapper = function BaseWrapper({
|
|
|
18
18
|
subTableIndex,
|
|
19
19
|
addWrapper = true,
|
|
20
20
|
readonly,
|
|
21
|
+
isRequired,
|
|
21
22
|
...otherProps
|
|
22
23
|
}) {
|
|
23
24
|
if (!addWrapper) return children;
|
|
24
25
|
const formWarpper = (
|
|
25
|
-
<div className=
|
|
26
|
-
{label && <div className='fh-8 ftext-gray-500 ftext-sm fflex
|
|
27
|
-
<div className=
|
|
26
|
+
<div className={`frelative ${!hidePrompt && prompt ? "" : "fpt-2"}`}>
|
|
27
|
+
{label && <div className='fh-8 ftext-gray-500 ftext-sm fflex fitems-center'>{label}{ isRequired && <span className="ftext-red-500 ffont-bold">*</span>}</div>}
|
|
28
|
+
<div className={`fw-full fflex fitems-stretch ftext-gray-900 frelative`}>
|
|
28
29
|
{readonly && <div className="fw-full fh-full fbg-gray-100 fopacity-5 fcursor-not-allowed fabsolute fleft-0 ftop-0 fz-10"></div>}
|
|
29
30
|
{/* <FieldLable value={otherProps?.value} /> */}
|
|
30
31
|
{children}
|
|
31
32
|
</div>
|
|
32
|
-
{!hidePrompt && <div className="ftext-xs ftext-gray-500 fmin-h-5 fflex fitems-center">{prompt}</div>}
|
|
33
|
+
{!hidePrompt && prompt && <div className="ftext-xs ftext-gray-500 fmin-h-5 fflex fitems-center">{prompt}</div>}
|
|
33
34
|
</div>
|
|
34
35
|
)
|
|
35
36
|
|
|
36
37
|
const tableWarpper = (
|
|
37
38
|
<div className="frelative fw-full">
|
|
38
|
-
{label && subTableIndex === 0 && <div className='fh-12 ffont-semibold fbg-gray-100 ftext-sm fflex
|
|
39
|
+
{label && subTableIndex === 0 && <div className='fh-12 ffont-semibold fbg-gray-100 ftext-sm fflex fitems-center fpx-2 fborder-b'>{label}{ isRequired && <span className="ftext-red-500">*</span>}</div>}
|
|
39
40
|
<div className="fw-full fflex fitems-stretch fp-2 frelative">
|
|
40
41
|
{readonly && <div className="fw-full fh-full fbg-gray-50 fopacity-5 fcursor-not-allowed fabsolute fleft-0 ftop-0 fz-10"></div>}
|
|
41
42
|
{/* <FieldLable value={otherProps?.value} /> */}
|
|
@@ -15,10 +15,10 @@ const TableCol = ({ children, width, ...props }) => {
|
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
const TableAction = ({ label, subTableIndex, children, ...props }) => {
|
|
18
|
-
return <div className="
|
|
19
|
-
<div className="frelative fw-full fh-full fflex fflex-col">
|
|
20
|
-
{label && subTableIndex === 0 && <div className='fh-12 ffont-semibold fbg-gray-100 ftext-sm fflex fjustify-between fitems-center fpx-2 fborder-b'>{label}</div>}
|
|
21
|
-
<div className="fw-full fflex-1 fflex fitems-center fjustify-center fp-2 ">
|
|
18
|
+
return <div className="">
|
|
19
|
+
<div className="frelative fw-full fh-full fflex fflex-col foverflow-hidden">
|
|
20
|
+
{label && subTableIndex === 0 && <div className='fh-12 ffont-semibold fbg-gray-100 ftext-sm fflex fflex-nowrap ftext-nowrap fjustify-between fitems-center fpx-2 fborder-b'>{label}</div>}
|
|
21
|
+
<div className="fw-full fflex-1 fflex fitems-center fjustify-center fp-2 fbox-border ">
|
|
22
22
|
{children}
|
|
23
23
|
</div>
|
|
24
24
|
</div>
|
|
@@ -189,11 +189,11 @@ const Table = ({ children, value, onChange, ...props }) => {
|
|
|
189
189
|
|
|
190
190
|
|
|
191
191
|
const handleInputChange = useCallback((rowIndex, childIndex, e) => {
|
|
192
|
-
|
|
192
|
+
console.log(e)
|
|
193
193
|
const newRows = [...rows];
|
|
194
194
|
newRows[rowIndex] = {
|
|
195
195
|
...newRows[rowIndex],
|
|
196
|
-
[childIndex]: e?.target?.value || '',
|
|
196
|
+
[childIndex]: e?.target?.value || e || '',
|
|
197
197
|
};
|
|
198
198
|
console.log("handleInputChange setRows")
|
|
199
199
|
setPrevRows(newRows);
|
|
@@ -236,13 +236,14 @@ const Table = ({ children, value, onChange, ...props }) => {
|
|
|
236
236
|
|
|
237
237
|
return (
|
|
238
238
|
<>
|
|
239
|
-
<div className="fw-full fmin-h-20 foverflow-x-auto">
|
|
239
|
+
<div className="fw-full frelative fmin-h-20 foverflow-x-auto">
|
|
240
|
+
|
|
240
241
|
{rows.map((row, rowIndex) => (
|
|
241
|
-
<div className="fborder-b
|
|
242
|
+
<div className="fborder-b fflex flex-nowrap fmin-w-full" key={rowIndex}>
|
|
242
243
|
{React.Children.map(children, (child, childIndex) => {
|
|
243
244
|
const col_id = child?.props?.__id || childIndex;
|
|
244
245
|
if (row?.[col_id] === undefined) row[col_id] = "";
|
|
245
|
-
return <TableCol width={
|
|
246
|
+
return <TableCol width={150} key={`row_${rowIndex}_col_${childIndex}`}>
|
|
246
247
|
{React.cloneElement(child, {
|
|
247
248
|
key: `row_${rowIndex}_child_${childIndex}`,
|
|
248
249
|
subTable: true,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { forwardRef, useEffect } from "react";
|
|
2
|
-
import { Form, Row, Col } from "antd";
|
|
2
|
+
import { Form, Row, Col, message } from "antd";
|
|
3
3
|
|
|
4
4
|
import { debounce } from 'lodash';
|
|
5
5
|
import { evalFormula } from '../../utils/formula'
|
|
@@ -248,7 +248,11 @@ const FormContainer = forwardRef(({ cols = 1, children , mode="view" }, ref) =>
|
|
|
248
248
|
const componentName = child.type?.displayName || _componentName;
|
|
249
249
|
const identifier = componentId || __id;
|
|
250
250
|
const isLayoutComponent = componentName && componentName.startsWith('Layout.');
|
|
251
|
-
|
|
251
|
+
const rules = []
|
|
252
|
+
if (props.isRequired)
|
|
253
|
+
rules.push({ required: true, message: `${props.label}必须填写` });
|
|
254
|
+
if (props.rules)
|
|
255
|
+
rules.push ({ pattern:new RegExp(props.rules), message: props.rulesFailMessage? props.rulesFailMessage : `${props.label}格式错误` })
|
|
252
256
|
return (
|
|
253
257
|
<Col key={identifier || `col-${index}`} span={isLayoutComponent ? 24 : 24 / group.length} style={{ marginBottom: 0 }}>
|
|
254
258
|
{isLayoutComponent ? (
|
|
@@ -258,7 +262,7 @@ const FormContainer = forwardRef(({ cols = 1, children , mode="view" }, ref) =>
|
|
|
258
262
|
style={{ marginBottom: 0 }}
|
|
259
263
|
label=""
|
|
260
264
|
name={identifier}
|
|
261
|
-
rules={
|
|
265
|
+
rules={rules}
|
|
262
266
|
>
|
|
263
267
|
{child}
|
|
264
268
|
</Form.Item>
|