- added validation for some settings releated to form fields;
This commit is contained in:
@@ -1,8 +1,9 @@
|
||||
import React from 'react';
|
||||
import { classNames } from 'primereact/utils';
|
||||
import { Controller } from 'react-hook-form';
|
||||
import { InputNumber } from 'primereact/inputnumber';
|
||||
import { is } from 'ramda';
|
||||
|
||||
import { InputNumber } from 'primereact/inputnumber';
|
||||
|
||||
const NumberInput = ({
|
||||
fieldName,
|
||||
@@ -25,7 +26,7 @@ const NumberInput = ({
|
||||
const input = <Controller
|
||||
name={fieldName}
|
||||
control={control}
|
||||
defaultValue={defaultValue}
|
||||
defaultValue={is(Number, defaultValue) ? defaultValue : 0}
|
||||
rules={config}
|
||||
render={({ field, fieldState }) => (
|
||||
<InputNumber inputId={field.name}
|
||||
@@ -36,8 +37,8 @@ const NumberInput = ({
|
||||
max={max}
|
||||
locale={locale}
|
||||
useGrouping={useGrouping}
|
||||
maxFractionDigits={maxFractionDigits}
|
||||
minFractionDigits={minFractionDigits}
|
||||
maxFractionDigits={!isNaN(parseInt(maxFractionDigits)) ? parseInt(maxFractionDigits) : 0}
|
||||
minFractionDigits={!isNaN(parseInt(minFractionDigits)) ? parseInt(minFractionDigits) : 0}
|
||||
className={classNames({ 'p-invalid': fieldState.invalid })}/>
|
||||
)}/>
|
||||
return (
|
||||
|
||||
@@ -64,6 +64,13 @@ const ElementSetting = ({ setting, changeFn, updateDataFn }) => {
|
||||
onTextChange={(e) => changeFn(e.htmlValue, setting.name)}
|
||||
style={{ height: 80 * 4 }}
|
||||
/>
|
||||
} else if (setting.name === 'step') {
|
||||
return <InputText id={setting.name}
|
||||
keyfilter="int"
|
||||
aria-describedby={`${setting.name}-help`}
|
||||
placeholder="0"
|
||||
value={setting.value}
|
||||
onChange={(e) => changeFn(e.target.value, setting.name)}/>
|
||||
} else if (setting.name === 'table_columns') {
|
||||
return <ElementSettingTableColumns
|
||||
value={is(Object, setting.value) ? setting.value : {}}
|
||||
|
||||
@@ -21,7 +21,7 @@ const BuilderElementSettings = ({ closeSettings }) => {
|
||||
const [activeElementData, setActiveElementData] = useState({});
|
||||
const [settings, setSettings] = useState([]);
|
||||
const [validators, setValidators] = useState({});
|
||||
const textBasedValidatorFields = ['min', 'max', 'minLength', 'maxLength', 'pattern'];
|
||||
const numberBasedValidatorFields = ['min', 'max', 'minLength', 'maxLength'];
|
||||
const customValidationOptions = [
|
||||
{ value: 'isPIVA', label: 'isPIVA' },
|
||||
{ value: 'isCodiceFiscale', label: 'isCodiceFiscale' },
|
||||
@@ -132,7 +132,7 @@ const BuilderElementSettings = ({ closeSettings }) => {
|
||||
onChange={(e) => toggleRequired(e.value, k)}/>
|
||||
</div>
|
||||
: null}
|
||||
{textBasedValidatorFields.includes(k) || 'custom' === k
|
||||
{numberBasedValidatorFields.includes(k) || 'pattern' === k || 'custom' === k
|
||||
? <div className="formElementSettings__field">
|
||||
<label htmlFor={`enable_${k}`}>{sprintf(__('Set %s', 'gepafin'), k)}</label>
|
||||
<InputSwitch
|
||||
@@ -153,13 +153,23 @@ const BuilderElementSettings = ({ closeSettings }) => {
|
||||
placeholder={__('Scegli', 'gepafin')}/>
|
||||
</div>
|
||||
: null}
|
||||
{textBasedValidatorFields.includes(k) && !isNil(validators[k])
|
||||
{'pattern' === k && !isNil(validators[k])
|
||||
? <div className="formElementSettings__field">
|
||||
<label htmlFor={k}>{k}</label>
|
||||
<InputText id={k} aria-describedby={`${k}-help`}
|
||||
value={validators[k]}
|
||||
onChange={(e) => onChangeValidator(e.target.value, k)}/>
|
||||
</div> : null}
|
||||
{numberBasedValidatorFields.includes(k) && !isNil(validators[k])
|
||||
? <div className="formElementSettings__field">
|
||||
<label htmlFor={k}>{k}</label>
|
||||
<InputText id={k}
|
||||
aria-describedby={`${k}-help`}
|
||||
value={validators[k]}
|
||||
keyfilter="int"
|
||||
placeholder="0"
|
||||
onChange={(e) => onChangeValidator(e.target.value, k)}/>
|
||||
</div> : null}
|
||||
</div>) : null}
|
||||
</TabPanel> : null}
|
||||
</TabView>
|
||||
|
||||
Reference in New Issue
Block a user