From 68f2d756ce1a2794c738eeb9c02eea74044daa7c Mon Sep 17 00:00:00 2001
From: Vitalii Kiiko <mr.psiho@gmail.com>
Date: Fri, 11 Oct 2024 16:22:39 +0200
Subject: [PATCH] - added confirmation dialog; - refactored form validation;

---
 src/pages/Applications/index.js               |   4 +-
 .../components/AllBandiAccordion/index.js     |   4 +-
 src/pages/BandoApplication/index.js           | 155 +++++++++++++++++-
 src/pages/BandoForms/index.js                 |   4 +-
 src/pages/BandoView/index.js                  |   6 +-
 src/pages/BandoViewBeneficiario/index.js      |   6 +-
 src/pages/DashboardBeneficiario/index.js      |   2 +-
 7 files changed, 159 insertions(+), 22 deletions(-)

diff --git a/src/pages/Applications/index.js b/src/pages/Applications/index.js
index da855d3..08b1012 100644
--- a/src/pages/Applications/index.js
+++ b/src/pages/Applications/index.js
@@ -36,12 +36,12 @@ const Applications = () => {
                     <Button
                         onClick={gotToBandiDisponibili}
                         label={__('Bandi disponibili', 'gepafin')} icon="pi pi-bookmark" iconPos="right"/>
-                    <Button
+                    {/*<Button
                         disabled={true}
                         outlined
                         onClick={() => {
                         }}
-                        label={__('Contatta assistenza', 'gepafin')} icon="pi pi-envelope" iconPos="right"/>
+                        label={__('Contatta assistenza', 'gepafin')} icon="pi pi-envelope" iconPos="right"/>*/}
                 </div>
             </div>
         </div>
diff --git a/src/pages/BandiBeneficiario/components/AllBandiAccordion/index.js b/src/pages/BandiBeneficiario/components/AllBandiAccordion/index.js
index d0c1160..3cdf8ba 100644
--- a/src/pages/BandiBeneficiario/components/AllBandiAccordion/index.js
+++ b/src/pages/BandiBeneficiario/components/AllBandiAccordion/index.js
@@ -146,8 +146,8 @@ const AllBandiAccordion = () => {
                 <Column field="status" header={__('Stato', 'gepafin')} filterMenuStyle={{ width: '14rem' }}
                         style={{ width: '120px' }} body={statusBodyTemplate} filter sortable
                         filterElement={statusFilterTemplate}/>
-                <Column header={__('Azioni', 'gepafin')}
-                        body={actionsBodyTemplate}/>
+                {/*<Column header={__('Azioni', 'gepafin')}
+                        body={actionsBodyTemplate}/>*/}
             </DataTable>
         </div>
     )
diff --git a/src/pages/BandoApplication/index.js b/src/pages/BandoApplication/index.js
index b9bb11e..79ca21e 100644
--- a/src/pages/BandoApplication/index.js
+++ b/src/pages/BandoApplication/index.js
@@ -32,6 +32,8 @@ import FormField from '../../components/FormField';
 import { Toast } from 'primereact/toast';
 import { Messages } from 'primereact/messages';
 import ApplicationSteps from './ApplicationSteps';
+import BlockingOverlay from '../../components/BlockingOverlay';
+import { Dialog } from 'primereact/dialog';
 
 const BandoApplication = () => {
     const { id } = useParams();
@@ -41,6 +43,7 @@ const BandoApplication = () => {
     const [formId, setFormId] = useState('');
     const [totalSteps, setTotalSteps] = useState(0);
     const [completedSteps, setCompletedSteps] = useState(0);
+    const [visibleConfirmation, setVisibleConfirmation] = useState(false);
     const [applicationStatus, setApplicationStatus] = useState('');
     const [activeStep, setActiveStep] = useState(1);
     const isAsyncRequest = useStore().main.isAsyncRequest();
@@ -77,6 +80,7 @@ const BandoApplication = () => {
     const onSubmit = () => {
         const applId = getApplicationId();
         storeSet.main.setAsyncRequest();
+        formMsgs.current.clear();
 
         ApplicationService.updateStatusApplication(applId, {}, submitApplicationCallback, errSubmitApplicationCallback, [
             ['status', 'SUBMIT']
@@ -85,16 +89,17 @@ const BandoApplication = () => {
 
     const submitApplicationCallback = (data) => {
         if (data.status === 'SUCCESS') {
-            if (toast.current) {
+            /*if (toast.current) {
                 toast.current.show({
                     severity: 'success',
                     summary: '',
                     detail: __('La domanda è stata presentata!', 'gepafin')
                 });
-            }
+            }*/
             if (data.data.applicationStatus) {
-                setApplicationStatus(data.data.applicationStatus);
+                setApplicationStatus(data.data.status);
             }
+            setVisibleConfirmation(true);
         }
         storeSet.main.unsetAsyncRequest();
     }
@@ -123,6 +128,22 @@ const BandoApplication = () => {
                     }
                 ]);
             }
+        } else if (data.status === 'BAD_REQUEST') {
+            if (formMsgs.current) {
+                formMsgs.current.show([
+                    {
+                        id: '99',
+                        sticky: true, severity: 'error', summary: '',
+                        detail: data.message,
+                        closable: true
+                    }
+                ]);
+                toast.current.show({
+                    severity: 'error',
+                    summary: '',
+                    detail: data.message
+                });
+            }
         } else {
             set404FromErrorResponse(data);
         }
@@ -286,6 +307,36 @@ const BandoApplication = () => {
         set404FromErrorResponse(data);
     }
 
+    const actionBtns = <div className="appPageSection__actions">
+        {activeStep > 1 && activeStep <= totalSteps
+            ? <Button
+                type="button"
+                disabled={'SUBMIT' === applicationStatus}
+                onClick={goBackward}
+                label={__('Vai indietro', 'gepafin')}
+                icon="pi pi-arrow-left"
+                iconPos="left"/> : null}
+        <Button
+            type="button"
+            disabled={isAsyncRequest || 'SUBMIT' === applicationStatus}
+            onClick={saveDraft}
+            outlined
+            label={__('Salva bozza', 'gepafin')} icon="pi pi-save" iconPos="right"/>
+        {activeStep < totalSteps
+            ? <Button
+                type="button"
+                disabled={'SUBMIT' === applicationStatus}
+                onClick={goForward}
+                label={__('Vai avanti', 'gepafin')}
+                icon="pi pi-arrow-right"
+                iconPos="right"/> : null}
+        <Button
+            disabled={'SUBMIT' === applicationStatus}
+            label={__('Invia', 'gepafin')}
+            icon="pi pi-check"
+            iconPos="right"/>
+    </div>
+
     useEffect(() => {
         if (formInitialData) {
             reset();
@@ -321,9 +372,96 @@ const BandoApplication = () => {
 
             <Messages ref={formMsgs}/>
             <Toast ref={toast}/>
-            {!isAsyncRequest
+            <Dialog header={__('Conferma', 'gepafin')}
+                    visible={visibleConfirmation}
+                    style={{ width: '50vw' }}
+                    onHide={() => {if (!visibleConfirmation) return; setVisibleConfirmation(false); }}>
+                <p>
+                    {__('Grazie, la tua domanda è stata inviata correttamente. Entro 24 ore riceverai una pec con data, ora e numero di protocollo.', 'gepafin')}
+                </p>
+            </Dialog>
+
+            <div className="appPage__content">
+                <BlockingOverlay shouldDisplay={isAsyncRequest}/>
+                <form className="appForm" onSubmit={handleSubmit(onSubmit)}>
+                    <div className="appPageSection">
+                        {actionBtns}
+                    </div>
+
+                    {formData.map(o => {
+                        const label = head(o.settings.filter(o => o.name === 'label'));
+                        const text = head(o.settings.filter(o => o.name === 'text'));
+                        const placeholder = head(o.settings.filter(o => o.name === 'placeholder'));
+                        const options = head(o.settings.filter(o => o.name === 'options'));
+                        const tableColumns = head(o.settings.filter(o => o.name === 'table_columns'));
+                        const step = head(o.settings.filter(o => o.name === 'step'));
+                        const mime = head(o.settings.filter(o => o.name === 'mime'));
+                        let mimeValue = '';
+
+                        if (mime) {
+                            mimeValue = mime.value.map(o => o.code ? o.code : o.ext);
+                        }
+
+                        const validations = Object.keys(o.validators).reduce((acc, cur) => {
+                            if (o.validators[cur]) {
+                                if (['min', 'max', 'minLength', 'maxLength', 'maxSize'].includes(cur)) {
+                                    acc[cur] = parseInt(o.validators[cur]);
+                                } else if ('pattern' === cur) {
+                                    acc[cur] = new RegExp(o.validators[cur]);
+                                } else if ('isRequired' === cur) {
+                                    //acc[cur] = o.validators[cur];
+                                    acc['required'] = true;
+                                } else if ('custom' === cur && validationFns[o.validators[cur]]) {
+                                    if (!acc.validate) {
+                                        acc.validate = {};
+                                    }
+                                    acc.validate[o.validators[cur]] = validationFns[o.validators[cur]];
+                                }
+                            }
+
+                            return acc;
+                        }, {});
+                        //console.log('validations', validations, o.name)
+
+                        return ['paragraph'].includes(o.name) && text
+                            ? <div className="appForm__content" key={o.id}>{renderHtmlContent(text.value)}</div>
+                            : <FormField
+                                key={o.id}
+                                type={o.name}
+                                fieldName={o.id}
+                                label={label ? label.value : ''}
+                                placeholder={placeholder ? placeholder.value : ''}
+                                control={control}
+                                register={register}
+                                errors={errors}
+                                defaultValue={values[o.id] ? values[o.id] : ''}
+                                maxFractionDigits={step ? step.value : 0}
+                                accept={mimeValue}
+                                config={validations}
+                                options={options ? options.value : []}
+                                setDataFn={setValue}
+                                saveFormCallback={saveDraft}
+                                sourceId={getApplicationId()}
+                                useGrouping={false}
+                                tableColumns={tableColumns ? tableColumns.value : {}}
+                            />
+                    })}
+
+                    <div className="appPage__spacer"></div>
+
+                    <div className="appPageSection__hr">
+                        <span>{__('Azioni rapide', 'gepafin')}</span>
+                    </div>
+
+                    <div className="appPageSection">
+                        {actionBtns}
+                    </div>
+                </form>
+            </div>
+
+            {/*{!isAsyncRequest
                 ? <div className="appPage__content">
-                    <form className="appForm" onSubmit={handleSubmit(onSubmit)}>
+                    <form className="appForm" ref={formRef} onSubmit={handleSubmit(onSubmit)}>
                         <div className="appPageSection">
                             <div className="appPageSection__actions">
                                 {activeStep > 1 && activeStep <= totalSteps
@@ -357,8 +495,6 @@ const BandoApplication = () => {
                             </div>
                         </div>
 
-
-
                         {formInitialData
                             ? formData.map(o => {
                                 const label = head(o.settings.filter(o => o.name === 'label'));
@@ -387,12 +523,13 @@ const BandoApplication = () => {
                                             if (!acc.validate) {
                                                 acc.validate = {};
                                             }
-                                            acc.validate[cur] = validationFns[o.validators[cur]];
+                                            acc.validate[o.validators[cur]] = validationFns[o.validators[cur]];
                                         }
                                     }
 
                                     return acc;
                                 }, {});
+                                //console.log('validations', validations, o.name)
 
                                 return ['paragraph'].includes(o.name) && text
                                     ? <div className="appForm__content" key={o.id}>{renderHtmlContent(text.value)}</div>
@@ -467,7 +604,7 @@ const BandoApplication = () => {
                     <Skeleton width="100%" height="2rem" className="mb-8"></Skeleton>
                     <Skeleton width="20%" height="1rem" className="mb-2"></Skeleton>
                     <Skeleton width="100%" height="4rem"></Skeleton>
-                </>}
+                </>}*/}
         </div>
     )
 
diff --git a/src/pages/BandoForms/index.js b/src/pages/BandoForms/index.js
index 3fd712b..da67894 100644
--- a/src/pages/BandoForms/index.js
+++ b/src/pages/BandoForms/index.js
@@ -99,7 +99,7 @@ const BandoForms = () => {
 
             <div className="appPage__content">
 
-                <div className="appPageSection__withBorder disabled">
+                {/*<div className="appPageSection__withBorder disabled">
                     <h2>{__('Usa un template', 'gepafin')}</h2>
                     <div className="row">
                         <p>{__('Scegli tra i template predefiniti e personalizzali', 'gepafin')}</p>
@@ -119,7 +119,7 @@ const BandoForms = () => {
                             label={__('Crea', 'gepafin')}
                             icon="pi pi-plus" iconPos="right"/>
                     </div>
-                </div>
+                </div>*/}
 
                 <div className="appPageSection__withBorder">
                     <h2>{__('Crea un nuovo Form da Zero', 'gepafin')}</h2>
diff --git a/src/pages/BandoView/index.js b/src/pages/BandoView/index.js
index c776734..6ee42e1 100644
--- a/src/pages/BandoView/index.js
+++ b/src/pages/BandoView/index.js
@@ -237,14 +237,14 @@ const BandoView = () => {
                                 onClick={() => {}}
                                 label={__('Presenta Domanda', 'gepafin')}
                                 icon="pi pi-save" iconPos="right"/>
-                            <Button
+                            {/*<Button
                                 type="button"
                                 outlined
                                 rounded
                                 disabled={true}
                                 onClick={() => {}}
-                                label={__('Aggiungi a Preferiti', 'gepafin')}
-                                icon="pi pi-heart" iconPos="left"/>
+                                label={__('Aggiungi a preferiti', 'gepafin')}
+                                icon="pi pi-heart" iconPos="left"/>*/}
                         </div>
                     </div>
 
diff --git a/src/pages/BandoViewBeneficiario/index.js b/src/pages/BandoViewBeneficiario/index.js
index dda7d44..e59c8c3 100644
--- a/src/pages/BandoViewBeneficiario/index.js
+++ b/src/pages/BandoViewBeneficiario/index.js
@@ -372,14 +372,14 @@ const BandoViewBeneficiario = () => {
                                 onClick={submitApplication}
                                 label={__('Presenta Domanda', 'gepafin')}
                                 icon="pi pi-save" iconPos="right"/>
-                            <Button
+                            {/*<Button
                                 type="button"
                                 outlined
                                 rounded
                                 disabled={true}
                                 onClick={saveToFavourites}
-                                label={__('Aggiungi a Preferiti', 'gepafin')}
-                                icon="pi pi-heart" iconPos="left"/>
+                                label={__('Aggiungi a preferiti', 'gepafin')}
+                                icon="pi pi-heart" iconPos="left"/>*/}
                         </div>
                     </div>
 
diff --git a/src/pages/DashboardBeneficiario/index.js b/src/pages/DashboardBeneficiario/index.js
index 3514702..af1a9ac 100644
--- a/src/pages/DashboardBeneficiario/index.js
+++ b/src/pages/DashboardBeneficiario/index.js
@@ -11,7 +11,7 @@ const DashboardBeneficiario = () => {
     const navigate = useNavigate();
 
     const goToAllSubmissions = () => {
-        navigate('/bids');
+        navigate('/bandi');
     }
 
     return(