From a5b817e999cdf404779eaebabd1376ae28c8a3e2 Mon Sep 17 00:00:00 2001 From: Vitalii Kiiko Date: Tue, 15 Oct 2024 12:42:10 +0200 Subject: [PATCH 1/5] - updated form element settings; --- .../BuilderElementSettings/index.js | 72 +++++++++++++++++-- 1 file changed, 67 insertions(+), 5 deletions(-) diff --git a/src/pages/BandoFormsEdit/components/BuilderElementSettings/index.js b/src/pages/BandoFormsEdit/components/BuilderElementSettings/index.js index 9ade547..2e91fd9 100644 --- a/src/pages/BandoFormsEdit/components/BuilderElementSettings/index.js +++ b/src/pages/BandoFormsEdit/components/BuilderElementSettings/index.js @@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react'; import { head, isEmpty, isNil } from 'ramda'; import { __, sprintf } from '@wordpress/i18n'; import { klona } from 'klona'; +import { wrap } from 'object-path-immutable'; // store import { storeSet, useStore } from '../../../../store'; @@ -21,6 +22,7 @@ const BuilderElementSettings = ({ closeSettings }) => { const [activeElementData, setActiveElementData] = useState({}); const [settings, setSettings] = useState([]); const [validators, setValidators] = useState({}); + const [dynamicData, setDynamicData] = useState({}); const textBasedValidatorFields = ['min', 'max', 'minLength', 'maxLength', 'pattern']; const customValidationOptions = [ { value: 'isPIVA', label: 'isPIVA' }, @@ -63,9 +65,11 @@ const BuilderElementSettings = ({ closeSettings }) => { } const saveSettings = () => { - activeElementData.settings = settings; - activeElementData.validators = validators; - const newElements = elements.map(o => o.id === activeElementData.id ? activeElementData : o); + let newActiveElementData = klona(activeElementData); + newActiveElementData = wrap(newActiveElementData).set(['settings'], settings).value(); + newActiveElementData = wrap(newActiveElementData).set(['validators'], validators).value(); + newActiveElementData = wrap(newActiveElementData).set(['dynamicData'], dynamicData).value(); + const newElements = elements.map(o => o.id === newActiveElementData.id ? newActiveElementData : o); storeSet.main.formElements(newElements); closeSettings(); } @@ -92,17 +96,49 @@ const BuilderElementSettings = ({ closeSettings }) => { setValidators(newValidators); } + const dynamicDataOptions = (type) => { + switch (type) { + case 'datepicker' : + return [ + {label: 'user dateOfBirth', value: 'user.dateOfBirth'} + ] + default : + return [ + {label: 'company name', value: 'company.companyName'}, + {label: 'company vatNumber', value: 'company.vatNumber'}, + {label: 'company codiceFiscale', value: 'company.codiceFiscale'}, + {label: 'company address', value: 'company.address'}, + {label: 'company phoneNumber', value: 'company.phoneNumber'}, + {label: 'company city', value: 'company.city'}, + {label: 'company province', value: 'company.province'}, + {label: 'company cap', value: 'company.cap'}, + {label: 'company country', value: 'company.country'}, + {label: 'company pec', value: 'company.pec'}, + {label: 'company email', value: 'company.email'}, + {label: 'company contactName', value: 'company.contactName'}, + {label: 'company contactEmail', value: 'company.contactEmail'}, + {label: 'user email', value: 'user.email'}, + {label: 'user firstName', value: 'user.firstName'}, + {label: 'user lastName', value: 'user.lastName'}, + {label: 'user phoneNumber', value: 'user.phoneNumber'}, + {label: 'user codiceFiscale', value: 'user.codiceFiscale'} + ] + } + } + useEffect(() => { const chosen = head(elements.filter(o => o.id === activeElement)); if (chosen) { setActiveElementData(klona(chosen)); setSettings(klona(chosen.settings)); - setValidators(klona(chosen.validators)) + setValidators(klona(chosen.validators)); + setDynamicData(chosen.dynamicData ? chosen.dynamicData : ''); } else { setActiveElementData({}); setSettings([]); - setValidators({}) + setValidators({}); + setDynamicData(''); } }, [activeElement]); @@ -118,6 +154,18 @@ const BuilderElementSettings = ({ closeSettings }) => { changeFn={onChange} updateDataFn={onUpdateOptions}/>) : null} + {['textinput', 'datepicker'].includes(activeElementData.name) + ?
+ + setDynamicData(e.value)} + options={dynamicDataOptions(activeElementData.name)} + optionLabel="label" + optionValue="value" + placeholder={__('Scegli', 'gepafin')}/> +
: null} {!isEmpty(validators) ? @@ -162,6 +210,20 @@ const BuilderElementSettings = ({ closeSettings }) => { : null} ) : null} : null} + {/*{['textinput', 'datepicker'].includes(activeElementData.name) + ? +
+ + onChangeDynamicData(e.value, 'dynamicData')} + options={customValidationOptions} + optionLabel="label" + optionValue="value" + placeholder={__('Scegli', 'gepafin')}/> +
+
: null}*/}