lu-lowcode-package-form 0.9.29 → 0.9.31
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 +3 -3
- package/dist/index.es.js +3656 -3635
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/src/App.jsx +43 -22
- package/src/components/field/base.jsx +1 -1
- package/src/components/field/select/select.jsx +44 -19
- package/src/components/form-container/index.jsx +1 -1
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}.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}.
|
|
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}.fgap-y-2{row-gap:.5rem}.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}.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
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { FormContainer, Field, FormContainerWrapper, Layout, Setter, EditorQuill, EditorWang } from './components';
|
|
2
2
|
import './App.css';
|
|
3
|
-
import { Button
|
|
3
|
+
import { Button, Input, Select } from 'antd';
|
|
4
4
|
import React, { useState } from 'react';
|
|
5
5
|
import Draggable from 'react-draggable';
|
|
6
6
|
|
|
@@ -61,18 +61,19 @@ function App() {
|
|
|
61
61
|
}
|
|
62
62
|
// 验证
|
|
63
63
|
const validateFields = async () => {
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
console.log("error",error)
|
|
72
|
-
|
|
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
|
+
console.log(error.errorFields[0].errors[0])
|
|
73
|
+
}
|
|
73
74
|
}
|
|
74
75
|
const setFormFields = () => {
|
|
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 })
|
|
76
|
+
formRef?.current?.formRef?.setFieldsValue({ "userselect": "1213131","DeptSelect":["leaf11"],"PostSelect":'["parent 1-1","leaf11"]', "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 })
|
|
76
77
|
}
|
|
77
78
|
const handleCols = () => {
|
|
78
79
|
setCols(cols - 1)
|
|
@@ -88,22 +89,22 @@ function App() {
|
|
|
88
89
|
<EditorQuill value={"[{\"insert\":\"sdfsd\"}]"} />
|
|
89
90
|
</div>
|
|
90
91
|
<div className='fw-full fp-4'>
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
92
|
+
<Select
|
|
93
|
+
mode="tags"
|
|
94
|
+
style={{ width: '100%' }}
|
|
95
|
+
placeholder="Tags Mode"
|
|
96
|
+
options={[{ label: '标签1', value: '1' }, { label: '标签2', value: '2' }]}
|
|
97
|
+
/>
|
|
97
98
|
<Setter.OptionSetter />
|
|
98
99
|
</div>
|
|
99
100
|
<div className='fw-[960px] frounded fbg-slate-50 fflex fflex-col fitems-center fpb-10'>
|
|
100
101
|
|
|
101
|
-
|
|
102
|
+
|
|
102
103
|
<FormContainerWrapper cols={cols} className="" ref={formRef} >
|
|
103
104
|
<Layout.FormGroupTitle title={"基本信息"} />
|
|
104
105
|
<Layout.FormRow layout={'1'}>
|
|
105
106
|
<Field.Table label="子表格" __id="table" >
|
|
106
|
-
<Field.Input isRequired={true}
|
|
107
|
+
<Field.Input isRequired={true} label="商品价格" __id="product_price1" />
|
|
107
108
|
<Field.Input label="商品总价" __id="product_sum1"
|
|
108
109
|
withIds={["table.product_price1", "table.product_num1"]}
|
|
109
110
|
withFill={{
|
|
@@ -177,11 +178,31 @@ function App() {
|
|
|
177
178
|
}}
|
|
178
179
|
/>
|
|
179
180
|
<Field.UserSelect label="选择用户" __id="userselect" customComponent={Input} />
|
|
181
|
+
<Field.DeptSelect label="DeptSelect" __id="DeptSelect" treeData={[{
|
|
182
|
+
value: 'parent 1-1',
|
|
183
|
+
title: 'parent 1-1',
|
|
184
|
+
children: [
|
|
185
|
+
{
|
|
186
|
+
value: 'leaf11',
|
|
187
|
+
title: <b style={{ color: '#08c' }}>leaf11</b>,
|
|
188
|
+
},
|
|
189
|
+
],
|
|
190
|
+
},]}></Field.DeptSelect>
|
|
191
|
+
<Field.PostSelect multiple={true} label="PostSelect" __id="PostSelect" treeData={[{
|
|
192
|
+
value: 'parent 1-1',
|
|
193
|
+
title: 'parent 1-1',
|
|
194
|
+
children: [
|
|
195
|
+
{
|
|
196
|
+
value: 'leaf11',
|
|
197
|
+
title: <b style={{ color: '#08c' }}>leaf11</b>,
|
|
198
|
+
},
|
|
199
|
+
],
|
|
200
|
+
},]}></Field.PostSelect>
|
|
180
201
|
<Field.SearchSelect isRequired={true} label="搜组件" __id="searchuser" option_search="username" option_label="username" setValue={() => { }} option_value="id"></Field.SearchSelect>
|
|
181
|
-
<Field.Input
|
|
182
|
-
<Field.Input
|
|
202
|
+
<Field.Input rules={"^(1[3-9]\\d{9})$"} isRequired={true} label="商品价格" __id="product_price" />
|
|
203
|
+
<Field.Input label="商品数量" __id="product_num" />
|
|
183
204
|
<Field.NumberRange label="数量范围" __id="product_num_range" />
|
|
184
|
-
<Field.Input
|
|
205
|
+
<Field.Input rules={["^(1[3-9]\\d{9})$", "^\\d+$"]} label="商品总价" __id="product_sum"
|
|
185
206
|
withIds={["product_price", "product_num"]}
|
|
186
207
|
withFill={{
|
|
187
208
|
"value": [
|
|
@@ -23,7 +23,7 @@ export const BaseWrapper = function BaseWrapper({
|
|
|
23
23
|
}) {
|
|
24
24
|
if (!addWrapper) return children;
|
|
25
25
|
const formWarpper = (
|
|
26
|
-
<div className={`frelative
|
|
26
|
+
<div className={`frelative`}>
|
|
27
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
28
|
<div className={`fw-full fflex fitems-stretch ftext-gray-900 frelative`}>
|
|
29
29
|
{readonly && <div className="fw-full fh-full fbg-gray-100 fopacity-5 fcursor-not-allowed fabsolute fleft-0 ftop-0 fz-10"></div>}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Select as OriginalSelect, Tree } from "antd";
|
|
1
|
+
import { Select as OriginalSelect, Tree, Input } from "antd";
|
|
2
2
|
|
|
3
3
|
import { BaseWrapper } from "../base"
|
|
4
4
|
import React, { useEffect, useState } from 'react';
|
|
@@ -30,35 +30,35 @@ const Select = ({ request, option_label = "label", option_value = "id", disabled
|
|
|
30
30
|
|
|
31
31
|
// setFirstLoad(true)
|
|
32
32
|
}
|
|
33
|
-
return addWrapper ?(
|
|
33
|
+
return addWrapper ? (
|
|
34
34
|
<BaseWrapper {...props}>
|
|
35
35
|
<OriginalSelect {...props} options={nOptions} style={{ width: '100%' }} />
|
|
36
36
|
</BaseWrapper>
|
|
37
37
|
) : <OriginalSelect {...props} options={nOptions} style={{ width: '100%' }} />
|
|
38
38
|
}
|
|
39
39
|
|
|
40
|
-
const SingleSelect =
|
|
40
|
+
const SingleSelect = ({ ...props }) => {
|
|
41
41
|
return (
|
|
42
42
|
<Select {...props} mode="single" />
|
|
43
43
|
)
|
|
44
44
|
}
|
|
45
45
|
|
|
46
|
-
const MultipleSelect =
|
|
46
|
+
const MultipleSelect = ({ onChange, value, ...props }) => {
|
|
47
47
|
const [nValue, setNValue] = React.useState([])
|
|
48
48
|
|
|
49
|
-
useEffect(()=>{
|
|
49
|
+
useEffect(() => {
|
|
50
50
|
if (value && typeof value === "string") {
|
|
51
51
|
try {
|
|
52
52
|
value = JSON.parse(value)
|
|
53
53
|
onChange(value)
|
|
54
54
|
} catch (error) {
|
|
55
|
-
|
|
55
|
+
|
|
56
56
|
}
|
|
57
57
|
}
|
|
58
|
-
|
|
59
|
-
if(value) setNValue(value)
|
|
60
|
-
},[value])
|
|
61
|
-
|
|
58
|
+
|
|
59
|
+
if (value) setNValue(value)
|
|
60
|
+
}, [value])
|
|
61
|
+
|
|
62
62
|
return (
|
|
63
63
|
<Select {...props} onChange={onChange} mode="multiple" value={nValue} />
|
|
64
64
|
)
|
|
@@ -80,7 +80,7 @@ const WithSingleSelect = ({ onChange, value, ...props }) => {
|
|
|
80
80
|
|
|
81
81
|
}
|
|
82
82
|
}
|
|
83
|
-
if(value) setNValue(value)
|
|
83
|
+
if (value) setNValue(value)
|
|
84
84
|
}, [value])
|
|
85
85
|
|
|
86
86
|
|
|
@@ -111,7 +111,7 @@ const WithMultipleSelect = ({ onChange, value, ...props }) => {
|
|
|
111
111
|
|
|
112
112
|
}
|
|
113
113
|
}
|
|
114
|
-
|
|
114
|
+
|
|
115
115
|
if (Array.isArray(value)) setNValue(value)
|
|
116
116
|
}, [value])
|
|
117
117
|
|
|
@@ -126,17 +126,42 @@ const WithMultipleSelect = ({ onChange, value, ...props }) => {
|
|
|
126
126
|
}
|
|
127
127
|
|
|
128
128
|
// 选择用户组件
|
|
129
|
-
const UserSelect = ({customComponent:CustomComponent
|
|
130
|
-
if (!CustomComponent) return
|
|
129
|
+
const UserSelect = ({ customComponent: CustomComponent, ...props }) => {
|
|
130
|
+
if (!CustomComponent) return <BaseWrapper {...props}><Input {...props} /></BaseWrapper>
|
|
131
131
|
else return <BaseWrapper {...props}><CustomComponent {...props} /></BaseWrapper>
|
|
132
132
|
}
|
|
133
|
+
const ArrayTreeSelect = ( {onChange, value, multiple, ...props} )=>{
|
|
134
|
+
const [nValue, setNValue] = React.useState()
|
|
135
|
+
useEffect(() => {
|
|
136
|
+
if (value && typeof value === "string") {
|
|
137
|
+
try {
|
|
138
|
+
value = JSON.parse(value)
|
|
139
|
+
onChange(value)
|
|
140
|
+
return
|
|
141
|
+
}
|
|
142
|
+
catch (error) { }
|
|
143
|
+
}
|
|
144
|
+
if (multiple) {
|
|
145
|
+
if (Array.isArray(value)) setNValue(value)
|
|
146
|
+
} else {
|
|
147
|
+
if (Array.isArray(value))
|
|
148
|
+
value = value[0]
|
|
149
|
+
setNValue(value)
|
|
150
|
+
}
|
|
151
|
+
}, [value])
|
|
152
|
+
const handleChange = (_value)=>{
|
|
153
|
+
if (!Array.isArray(_value)) _value = [_value]
|
|
154
|
+
onChange && typeof onChange == "function" && onChange(_value)
|
|
155
|
+
}
|
|
156
|
+
return <TreeSelect {...props} onChange={handleChange} value={nValue} multiple={multiple} />
|
|
157
|
+
}
|
|
133
158
|
// 选择部门组件
|
|
134
|
-
const DeptSelect = ({FetchDeptList,...props})=>{
|
|
135
|
-
return <
|
|
159
|
+
const DeptSelect = ({ FetchDeptList,...props }) => {
|
|
160
|
+
return <ArrayTreeSelect {...props} title={"deptName"} request={FetchDeptList} />
|
|
136
161
|
}
|
|
137
162
|
// 选择岗位组件
|
|
138
|
-
const PostSelect = ({FetchPostList
|
|
139
|
-
return <
|
|
163
|
+
const PostSelect = ({ FetchPostList, ...props }) => {
|
|
164
|
+
return <ArrayTreeSelect {...props} title={"postName"} request={FetchPostList} />
|
|
140
165
|
}
|
|
141
166
|
|
|
142
|
-
export { WithSingleSelect, WithMultipleSelect, MultipleSelect, SingleSelect, Select,UserSelect,DeptSelect,PostSelect };
|
|
167
|
+
export { WithSingleSelect, WithMultipleSelect, MultipleSelect, SingleSelect, Select, UserSelect, DeptSelect, PostSelect };
|
|
@@ -281,7 +281,7 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
|
|
|
281
281
|
};
|
|
282
282
|
|
|
283
283
|
return (
|
|
284
|
-
<Form form={form} className={"form-container fp-0 fw-full fh-full box-border" + (mode == "desgin" ? " fp-6" : "")} onFieldsChange={handleFieldsChange}>
|
|
284
|
+
<Form form={form} className={"form-container fp-0 fw-full fh-full box-border fflex fflex-col fgap-y-2" + (mode == "desgin" ? " fp-6" : "")} onFieldsChange={handleFieldsChange}>
|
|
285
285
|
{formContent}
|
|
286
286
|
</Form>
|
|
287
287
|
);
|