diff --git a/src/assets/scss/components/flowBuilder.scss b/src/assets/scss/components/flowBuilder.scss index d4401fe..04e3e83 100644 --- a/src/assets/scss/components/flowBuilder.scss +++ b/src/assets/scss/components/flowBuilder.scss @@ -12,6 +12,22 @@ flex-direction: column; gap: 10px; + label { + font-size: 13px; + text-align: center; + } +} + +.nodeIntermediateForm { + padding: 10px 20px; + background-color: white; + border: 1px solid black; + border-radius: 4px; + display: flex; + flex-direction: column; + gap: 10px; + max-width: 180px; + label { font-size: 13px; text-align: center; diff --git a/src/assets/scss/components/layout.scss b/src/assets/scss/components/layout.scss index 79a50c0..e57c2d3 100644 --- a/src/assets/scss/components/layout.scss +++ b/src/assets/scss/components/layout.scss @@ -12,7 +12,8 @@ body { margin: 0; font-family: "Montserrat", sans-serif; - p, span:not(.p-button-label, .p-button-icon, .p-badge), input, label:not(.p-error), textarea, a, li, h1, h2, h3, h4, h5, h6, div, th, td { + p, span:not(.p-button-label, .p-button-icon, .p-badge, .p-message-detail), input, label:not(.p-error), + textarea, a, li, h1, h2, h3, h4, h5, h6, div, th, td { color: var(--global-textColor); } } diff --git a/src/assets/scss/components/misc.scss b/src/assets/scss/components/misc.scss index 8760b5c..f4de501 100644 --- a/src/assets/scss/components/misc.scss +++ b/src/assets/scss/components/misc.scss @@ -28,7 +28,7 @@ } .p-paginator-page { - color: var(--menuitem-active-color); + /*color: var(--menuitem-active-color);*/ } .p-datepicker-buttonbar .p-button { @@ -78,6 +78,10 @@ color: var(--primary-text); } +.p-toast-detail { + color: white; + margin: 0; +} .mb-2 { margin-bottom: 4px; diff --git a/src/components/FlowBuilder/components/NodeIntermediateForm/index.js b/src/components/FlowBuilder/components/NodeIntermediateForm/index.js index ea53143..a32ca5a 100644 --- a/src/components/FlowBuilder/components/NodeIntermediateForm/index.js +++ b/src/components/FlowBuilder/components/NodeIntermediateForm/index.js @@ -43,7 +43,7 @@ const NodeIntermediateForm = ({ data: { id, label = '' } }) => { }, [flowEdges, flowData]); return ( -
+
{ } useEffect(() => { - if (initialForm && finalForm && forms.length) { + if ( + (forms.length === 2 && initialForm) || + (forms.length > 2 && initialForm && finalForm) + ) { const total = (forms.length - 2) * (200 - 90); let coordinates = range(total * -1, total, 200); const initialNodes = forms.map(o => { + const formId = String(o.id); let obj; - if (o.id === initialForm) { + if (formId === String(initialForm)) { obj = { - id: String(o.id), + id: formId, type: 'initialForm', - data: { label: o.label, id: o.id }, + data: { label: o.label, id: formId }, position: { x: 0, y: 0 }, } - } else if (o.id === finalForm) { + } else if (formId === String(finalForm)) { obj = { - id: String(o.id), + id: formId, type: 'output', - data: { label: o.label, id: o.id }, + data: { label: o.label, id: formId }, position: { x: 0, y: 300 }, } } else { const x = coordinates.splice(0, 1); + console.log('x', x) obj = { - id: String(o.id), + id: formId, type: 'intermediateForm', - data: { label: o.label, id: o.id }, + data: { label: o.label, id: formId }, position: { x, y: 150 }, } } @@ -66,13 +71,18 @@ const FlowBuilder = ({ initialForm = 0, finalForm = 0 }) => { }); let edges = []; + // eslint-disable-next-line forms.map(o => { - if (o.id !== initialForm && o.id !== finalForm) { - edges.push({ id: `${initialForm}->${o.id}`, source: String(initialForm), target: String(o.id), type: 'smoothstep' }); - edges.push({ id: `${o.id}->${finalForm}`, source: String(o.id), target: String(finalForm), type: 'smoothstep' }); + const formId = String(o.id); + + if (formId !== String(initialForm) && formId !== String(finalForm)) { + edges.push({ id: `${initialForm}->${formId}`, source: String(initialForm), target: formId, type: 'smoothstep' }); + } + if (formId !== String(finalForm) && formId !== String(initialForm) && String(finalForm) !== '0') { + edges.push({ id: `${formId}->${finalForm}`, source: formId, target: String(finalForm), type: 'smoothstep' }); } }); - + console.log('edges', edges, initialNodes); setNodes(initialNodes); setEdges(edges); storeSet.main.flowEdges(edges); diff --git a/src/components/FormField/components/FileuploadAsync/index.js b/src/components/FormField/components/FileuploadAsync/index.js index 07ecc18..6291fb5 100644 --- a/src/components/FormField/components/FileuploadAsync/index.js +++ b/src/components/FormField/components/FileuploadAsync/index.js @@ -116,7 +116,9 @@ const FileuploadAsync = ({ }, [accept]); useEffect(() => { - inputRef.current.setUploadedFiles(stateFieldData); + if (inputRef.current) { + inputRef.current.setUploadedFiles(stateFieldData); + } setDataFn(fieldName, [...stateFieldData], { shouldValidate: true }); }, [stateFieldData]) diff --git a/src/components/FormFieldRepeater/index.js b/src/components/FormFieldRepeater/index.js index e237fa1..f4cdf49 100644 --- a/src/components/FormFieldRepeater/index.js +++ b/src/components/FormFieldRepeater/index.js @@ -1,14 +1,14 @@ import React, { useRef, useEffect, useState, useCallback } from 'react'; import { classNames } from 'primereact/utils'; import { __ } from '@wordpress/i18n'; -import { head, isEmpty, isNil } from 'ramda'; +import { head, isEmpty, isNil, pluck } from 'ramda'; +import { diff } from 'deep-object-diff'; // components import { InputText } from 'primereact/inputtext'; import { Button } from 'primereact/button'; import { Menu } from 'primereact/menu'; import { Dropdown } from 'primereact/dropdown'; -import { diff } from 'deep-object-diff'; const FormFieldRepeater = ({ data, @@ -39,7 +39,7 @@ const FormFieldRepeater = ({ setStateFieldData([...stateFieldData, { id: null, value: '', lookUpDataId: null }]); } } - ] + ]; const removeItem = (index) => { const newData = stateFieldData.toSpliced(index, 1); @@ -96,6 +96,11 @@ const FormFieldRepeater = ({ if (!isEmpty(diffData)) { const storeFieldData = data ?? []; setStateFieldData(storeFieldData); + setStateOptionsData(prevState => { + const ids = pluck('id', storeFieldData) + const objectsToAdd = storeFieldData.filter(o => ids.includes(o.id)); + return [...prevState, ...objectsToAdd]; + }); } }, [data]); @@ -105,7 +110,7 @@ const FormFieldRepeater = ({ useEffect(() => { setDataFn(fieldName, [...stateFieldData], { shouldValidate: true }); - }, [stateFieldData]) + }, [stateFieldData]); return (
diff --git a/src/components/FormFieldRepeaterFaq/index.js b/src/components/FormFieldRepeaterFaq/index.js index 2c7dc94..afcb600 100644 --- a/src/components/FormFieldRepeaterFaq/index.js +++ b/src/components/FormFieldRepeaterFaq/index.js @@ -61,8 +61,9 @@ const FormFieldRepeaterFaq = ({ const editItem = (e, index) => { e.stopPropagation(); - setQuestion(stateFieldData[index].title); - setAnswer(stateFieldData[index].value); + setTitle(stateFieldData[index].title); + setQuestion(stateFieldData[index].value); + setAnswer(stateFieldData[index].response); setEditDataIndex(index); setIsVisibleEditDialog(true); } @@ -71,6 +72,7 @@ const FormFieldRepeaterFaq = ({ setIsVisibleEditDialog(false); setQuestion(''); setAnswer(''); + setTitle(''); setEditDataIndex(null); } @@ -99,6 +101,7 @@ const FormFieldRepeaterFaq = ({ setIsVisibleEditDialog(false); setQuestion(''); setAnswer(''); + setTitle(''); setEditDataIndex(null); } @@ -172,7 +175,6 @@ const FormFieldRepeaterFaq = ({ offLabel="" checked={o.isVisible} onChange={(e) => { - console.log('e', e); e.preventDefault(); e.stopPropagation(); setChecked(e, i); @@ -181,9 +183,11 @@ const FormFieldRepeaterFaq = ({
diff --git a/src/components/UnsavedChangesDetector/index.js b/src/components/UnsavedChangesDetector/index.js index 5de82f0..41aa83d 100644 --- a/src/components/UnsavedChangesDetector/index.js +++ b/src/components/UnsavedChangesDetector/index.js @@ -10,7 +10,6 @@ const UnsavedChangesDetector = ({ getValuesFn }) => { const formData = getValuesFn(); const initial = storeGet.main.formInitialData(); const isEqual = equal(initial, formData); - console.log(initial, formData); if (!isEqual) { event.returnValue = __('You have unsaved changes. If you proceed, they will be lost.', 'gepafin'); diff --git a/src/pages/BandoEdit/components/BandoEditFormStep1/index.js b/src/pages/BandoEdit/components/BandoEditFormStep1/index.js index bfbeda2..3eab3a8 100644 --- a/src/pages/BandoEdit/components/BandoEditFormStep1/index.js +++ b/src/pages/BandoEdit/components/BandoEditFormStep1/index.js @@ -1,4 +1,4 @@ -import React, { forwardRef, useImperativeHandle, useEffect, useState, useMemo } from 'react'; +import React, { forwardRef, useImperativeHandle, useEffect, useState, useMemo, useRef } from 'react'; import { __ } from '@wordpress/i18n'; import { useNavigate } from 'react-router-dom'; import { useForm } from 'react-hook-form'; @@ -11,6 +11,9 @@ import FormFieldRepeater from '../../../../components/FormFieldRepeater'; import FormFieldRepeaterFaq from '../../../../components/FormFieldRepeaterFaq'; import BandoEditFormActions from '../BandoEditFormActions'; import UnsavedChangesDetector from '../../../../components/UnsavedChangesDetector'; +import { Toast } from 'primereact/toast'; + +// api import BandoService from '../../../../service/bando-service'; import LookupdataService from '../../../../service/lookupdata-service'; @@ -39,6 +42,7 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors }, }, [formInitialData]), mode: 'onChange' }); const values = getValues(); + const toast = useRef(null); const onSubmit = (formData) => { if (!isNil(formData.dates) && formData.dates.length) { @@ -54,6 +58,11 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors }, const createCallback = (data) => { if (data.status === 'SUCCESS') { + toast.current.show({ + severity: 'success', + summary: '', + detail: __('Il bando è stato aggiornato corretamente!', 'gepafin') + }); const values = getValues(); if (!values.id && data.data.id) { navigate(`/tenders/${data.data.id}`); @@ -84,7 +93,8 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors }, delete o.type; return { ...o, - lookUpDataId: o.id + lookUpDataId: o.id, + id: null }; }); setAimedToOptions(aimedTo); @@ -94,7 +104,8 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors }, delete o.type; return { ...o, - lookUpDataId: o.id + lookUpDataId: o.id, + id: null }; }); setFaqOptions(faqItems); @@ -290,6 +301,7 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors }, {__('Azioni', 'gepafin')}
+ { if (!isNil(formData.dates) && formData.dates.length) { @@ -55,6 +61,11 @@ const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors }, const createCallback = (data) => { if (data.status === 'SUCCESS') { + toast.current.show({ + severity: 'success', + summary: '', + detail: __('Il bando è stato aggiornato corretamente!', 'gepafin') + }); setFormInitialData(data.data); reset(); } @@ -73,7 +84,8 @@ const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors }, return { ...o, score: 0, - lookUpDataId: o.id + lookUpDataId: o.id, + id: null }; }); setCriteriaOptions(criteria); @@ -83,7 +95,8 @@ const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors }, delete o.type; return { ...o, - lookUpDataId: o.id + lookUpDataId: o.id, + id: null }; }); setChecklistOptions(checklist); @@ -215,6 +228,7 @@ const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors }, {__('Azioni', 'gepafin')}
+ diff --git a/src/pages/BandoFlowEdit/index.js b/src/pages/BandoFlowEdit/index.js index 0842861..654c497 100644 --- a/src/pages/BandoFlowEdit/index.js +++ b/src/pages/BandoFlowEdit/index.js @@ -1,4 +1,4 @@ -import React, { useEffect, useState, useCallback } from 'react'; +import React, { useEffect, useState, useCallback, useRef } from 'react'; import { __ } from '@wordpress/i18n'; import { useNavigate, useParams } from 'react-router-dom'; import { isEmpty } from 'ramda'; @@ -16,15 +16,18 @@ import set404FromErrorResponse from '../../helpers/set404FromErrorResponse'; import { Button } from 'primereact/button'; import { Dropdown } from 'primereact/dropdown'; import FlowBuilder from '../../components/FlowBuilder'; +import { Messages } from 'primereact/messages'; const BandoFlowEdit = () => { const { id } = useParams(); const navigate = useNavigate(); + const forms = useStore().main.flowForms(); const flowData = useStore().main.flowData(); const flowEdges = useStore().main.flowEdges(); const [formOptions, setFormOptions] = useState([]); const [initialForm, setInitialForm] = useState(0); const [finalForm, setFinalForm] = useState(0); + const flowMsgs = useRef(null); const getBandoId = () => { const parsed = parseInt(id) @@ -51,7 +54,7 @@ const BandoFlowEdit = () => { const getFormsCallback = (data) => { if (data.status === 'SUCCESS') { - const formOptions = data.data.map(o => ({label: o.label, value: o.id})) + const formOptions = data.data.map(o => ({ label: o.label, value: o.id })) storeSet.main.flowForms(data.data); setFormOptions(formOptions); } @@ -69,6 +72,20 @@ const BandoFlowEdit = () => { FormsService.getFormsForCall(bandoId, getFormsCallback, errGetFormsCallback); }, [id]); + useEffect(() => { + if (flowMsgs.current && forms.length < 2) { + flowMsgs.current.clear(); + flowMsgs.current.show([ + { + id: '1', + sticky: true, severity: 'info', summary: '', + detail: __('Devi creare almeno 2 form.', 'gepafin'), + closable: false + } + ]); + } + }, [forms]); + useEffect(() => { return () => { storeSet.main.flowForms([]); @@ -100,28 +117,31 @@ const BandoFlowEdit = () => { options={formOptions} optionLabel="label" optionValue="value" - placeholder={__('Scegli il form', 'gepafin')} /> + placeholder={__('Scegli il form', 'gepafin')}/> -
- - setFinalForm(e.value)} - optionDisabled={(opt) => initialForm === opt.value} - options={formOptions} - optionLabel="label" - optionValue="value" - placeholder={__('Scegli il form', 'gepafin')} /> -
+ {forms.length > 2 + ?
+ + setFinalForm(e.value)} + optionDisabled={(opt) => initialForm === opt.value} + options={formOptions} + optionLabel="label" + optionValue="value" + placeholder={__('Scegli il form', 'gepafin')}/> +
: null}
- + {forms.length >= 2 + ? + : }
diff --git a/src/pages/BandoFormsEdit/index.js b/src/pages/BandoFormsEdit/index.js index d736275..4499de3 100644 --- a/src/pages/BandoFormsEdit/index.js +++ b/src/pages/BandoFormsEdit/index.js @@ -57,7 +57,6 @@ const BandoFormsEdit = () => { if (data.status === 'SUCCESS') { storeSet.main.unsetAsyncRequest(); const bandoId = getBandoId(); - if (shouldRedirect) { navigate(`/tenders/${bandoId}/forms/${data.data.id}/preview`); return; @@ -198,7 +197,7 @@ const BandoFormsEdit = () => { outlined label={__('Indietro', 'gepafin')} icon="pi pi-arrow-left" iconPos="left"/>