diff --git a/src/assets/scss/components/flowBuilder.scss b/src/assets/scss/components/flowBuilder.scss index 4689c85..c66987e 100644 --- a/src/assets/scss/components/flowBuilder.scss +++ b/src/assets/scss/components/flowBuilder.scss @@ -39,6 +39,7 @@ flex-direction: column; gap: 60px; width: 100%; + margin-top: 30px; overflow-x: auto; } @@ -47,7 +48,7 @@ justify-content: center; gap: 20px; padding: 10px 0; - min-height: 240px; + /*min-height: 240px;*/ margin: 0 auto; } @@ -85,11 +86,12 @@ > label { display: flex; justify-content: center; - padding: 10px 0; + padding: 10px; font-size: 14px; font-style: normal; font-weight: 400; line-height: 18px; + text-align: center; } } diff --git a/src/pages/BandoFlowEdit/index.js b/src/pages/BandoFlowEdit/index.js index 4c4cb10..d317aff 100644 --- a/src/pages/BandoFlowEdit/index.js +++ b/src/pages/BandoFlowEdit/index.js @@ -179,6 +179,72 @@ const BandoFlowEdit = () => { const field = form ? head(form.content.filter(o => o.id === mainField)) : null; let options = []; + if (field) { + options = head(field.settings.filter(o => o.name === 'options')); + } + + if (field && options.value && options.value.length === flowForms.length - 2) { + setIsFlowAllowed(true); + const data = { + formId: String(initialForm), + chosenField: mainField, + chosenValue: '' + } + storeSet.main.addFlowData(data); + } else { + setIsFlowAllowed(false); + let msg = 'Non è possibile creare il flusso. Il campo principale deve avere esattamente %s opzioni.'; + + if (flowForms.length - 2 === 1) { + msg = 'Non è possibile creare il flusso. Il campo principale deve avere esattamente %s opzione.'; + } + + if (flowMsgs.current && !isEmpty(mainField)) { + flowMsgs.current.clear(); + flowMsgs.current.show([ + { + id: '1', + sticky: true, severity: 'error', summary: '', + detail: sprintf( + __(msg, 'gepafin'), + flowForms.length - 2 + ), + closable: false + } + ]); + } + } + }, [mainField]); + + useEffect(() => { + setMainField(''); + setMainFieldOptions([]); + const flowForms = storeGet.main.flowForms(); + const form = head(flowForms.filter(o => String(o.id) === String(initialForm))) + const relevantFields = form + ? form.content + .filter(o => ['radio', 'select'].includes(o.name)) + .map(o => { + const label = head(o.settings.filter(o => o.name === 'label')); + return { value: o.id, label: label ? label.value : o.label }; + }) + : []; + setMainFieldOptions([ + {label: isEmpty(relevantFields) ? __('Nessun scelta', 'gepafin') : '', value: ''}, + ...relevantFields] + ); + + if (flowForms.length === 2) { + setIsFlowAllowed(true) + } + }, [initialForm]); + + /*useEffect(() => { + const flowForms = storeGet.main.flowForms(); + const form = head(flowForms.filter(o => String(o.id) === String(initialForm))) + const field = form ? head(form.content.filter(o => o.id === mainField)) : null; + let options = []; + if (initialForm === 0) { return; } @@ -278,7 +344,7 @@ const BandoFlowEdit = () => { storeSet.main.flowEdges([edge]); } - /*lines.forEach(line => line.remove()); + /!*lines.forEach(line => line.remove()); // Create new lines between consecutive items const newLines = []; @@ -300,7 +366,7 @@ const BandoFlowEdit = () => { } } - setLines(newLines);*/ + setLines(newLines);*!/ }, [initialForm]); useEffect(() => { @@ -343,7 +409,7 @@ const BandoFlowEdit = () => { return () => { lines.forEach(line => line.remove()); }; - }, [lines]); + }, [lines]);*/ useEffect(() => { const bandoId = getBandoId(); @@ -382,9 +448,12 @@ const BandoFlowEdit = () => { } }, []); + const initialFormData = head(forms.filter(o => o.id === initialForm)); + const finalFormData = head(forms.filter(o => o.id === finalForm)); const levelForms = forms.filter(o => o.id !== initialForm && o.id !== finalForm); - console.log('isFlowAllowed', isFlowAllowed, flowData, flowEdges) + console.log('isFlowAllowed', isFlowAllowed, flowData, flowEdges); + console.log('mainField', mainField) return (
@@ -396,7 +465,7 @@ const BandoFlowEdit = () => {
- {/*
+
@@ -442,7 +511,7 @@ const BandoFlowEdit = () => { placeholder={__('Scegli il form', 'gepafin')}/>
: null}
-
*/} +
{/*
@@ -460,14 +529,17 @@ const BandoFlowEdit = () => {
- {forms.length >= 2 + {forms.length >= 2 && initialForm && finalForm ?
initialForm ? setItemRef(initialForm, el) : null}>
- -
+ + {/*
{ optionValue="value" placeholder={__('Scegli il campo', 'gepafin')}/>
: null} -
+
*/}
- {initialForm && finalForm && levelForms.length + {levelForms.length && initialForm && finalForm ?
{levelForms.map(o =>
setItemRef(o.id, el)} @@ -511,13 +583,16 @@ const BandoFlowEdit = () => {
)}
: null} - {forms.length >= 2 && initialForm + {forms.length >= 2 && initialForm && finalForm ?
finalForm ? setItemRef(finalForm, el) : null}>
- -
+ + {/*
{ optionLabel="label" optionValue="value" placeholder={__('Scegli il form', 'gepafin')}/> -
+
*/}