BFLOWS/bflows-bandi-fe
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- added FLOW_ID env variable;

Browse Source 
- implemented two types of evaluation flow;
- refactored component related to communication messages;
- fixed displaying elements based on evaluation status;
- fixed some styles;
This commit is contained in:
Vitalii Kiiko
2024-11-22 16:37:59 +01:00
parent 9465cbd55a
commit fdda72b617
10 changed files with 294 additions and 363 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.env
View File

@@ -4,3 +4,4 @@ REACT_APP_API_ADDRESS=https://api-dev-gepafin.memento.credit
REACT_APP_LOGO_FILENAME=gepafin-logo.svg
REACT_APP_FAVICON_FILENAME=gepafin-favicon.ico
REACT_APP_HUB_ID=p4lk3bcx1RStqTaIVVbXs
REACT_APP_EVALUATION_FLOW_ID=1

1
environments/dev/dev.env
View File

@@ -4,3 +4,4 @@ REACT_APP_API_ADDRESS=https://api-dev-gepafin.memento.credit
REACT_APP_LOGO_FILENAME=gepafin-logo.svg
REACT_APP_FAVICON_FILENAME=gepafin-favicon.ico
REACT_APP_HUB_ID=p4lk3bcx1RStqTaIVVbXs
REACT_APP_EVALUATION_FLOW_ID=1

1
environments/prod/prod.env
View File

@@ -4,3 +4,4 @@ REACT_APP_API_ADDRESS=https://bandi-api.gepafin.it
REACT_APP_LOGO_FILENAME=gepafin-logo.svg
REACT_APP_FAVICON_FILENAME=gepafin-favicon.ico
REACT_APP_HUB_ID=p4lk3bcx1RStqTaIVVbXs
REACT_APP_EVALUATION_FLOW_ID=1

11
src/assets/scss/components/appPage.scss
View File

@@ -208,10 +208,18 @@
column-count: 2;
column-width: 4em;
display: block;
padding-bottom: 0;
/*padding-bottom: 0;*/
.appPageSection__pMeta {
margin-bottom: 1em;
span:nth-of-type(1) {
max-width: 30%;
}
span:nth-of-type(2) {
max-width: 60%;
text-align: right;
}
}
}
}
@@ -221,6 +229,7 @@
flex-direction: column;
padding: 0;
width: 100%;
list-style: inside;
}
.appPageSection__listItem {

3
src/assets/scss/components/myTable.scss
View File

@@ -23,6 +23,9 @@
border-width: 0 0 1px 0;
padding: 1rem 1rem;
}
tr.outgoing {
background-color: #DAF0C3B2;
}
}
.myTfoot {

2
src/pages/DashboardBeneficiario/index.js
View File

@@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react';
import { __, sprintf } from '@wordpress/i18n';
import { __ } from '@wordpress/i18n';
import { Link, useNavigate } from 'react-router-dom';
import { head, isEmpty, pathOr } from 'ramda';
import NumberFlow from '@number-flow/react';

184
src/pages/DomandaBeneficiario/index.js
View File

@@ -1,35 +1,30 @@
import React, { useState, useEffect, useRef, useMemo } from 'react';
import { __, sprintf } from '@wordpress/i18n';
import { useNavigate, useParams } from 'react-router-dom';
import { is, isEmpty, isNil } from 'ramda';
import { wrap } from 'object-path-immutable';
import { is, isEmpty } from 'ramda';
import { useForm } from 'react-hook-form';
import { klona } from 'klona';
// store
import { storeSet, useStore } from '../../store';
// api
import AmendmentsService from '../../service/amendments-service';
import CommunicationService from '../../service/communication-service';
import ApplicationService from '../../service/application-service';
// tools
import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
import getBandoLabel from '../../helpers/getBandoLabel';
import getDateFromISOstring from '../../helpers/getDateFromISOstring';
import renderHtmlContent from '../../helpers/renderHtmlContent';
import uniqid from '../../helpers/uniqid';
// components
import { Button } from 'primereact/button';
import BlockingOverlay from '../../components/BlockingOverlay';
import { Toast } from 'primereact/toast';
import { classNames } from 'primereact/utils';
import { Dialog } from 'primereact/dialog';
import { InputText } from 'primereact/inputtext';
import { InputTextarea } from 'primereact/inputtextarea';
import ApplicationService from '../../service/application-service';
import FormField from '../../components/FormField';
import { useForm } from 'react-hook-form';
import { klona } from 'klona';
import SoccorsoComunications from '../SoccorsoEditPreInstructor/components/SoccorsoComunications';
const DomandaBeneficiario = () => {
const isAsyncRequest = useStore().main.isAsyncRequest();
@@ -37,10 +32,6 @@ const DomandaBeneficiario = () => {
const navigate = useNavigate();
const [data, setData] = useState({});
const [dataAppl, setDataAppl] = useState({});
const [comms, setComms] = useState([]);
const [isVisibleNewCommDialog, setIsVisibleNewCommDialog] = useState(false);
const [newCommData, setNewCommData] = useState({});
const [isLoadingCommunication, setIsLoadingCommunication] = useState(false);
const [isVisibleEmailDialog, setIsVisibleEmailDialog] = useState(false);
const toast = useRef(null);
const [formInitialData, setFormInitialData] = useState({});
@@ -83,7 +74,6 @@ const DomandaBeneficiario = () => {
return acc;
}, {});
setFormInitialData(formDataInitial);
CommunicationService.getCommsByAmendmentId(amendmentObj.id, getCommsCallback, errGetCommsCallback);
storeSet.main.unsetAsyncRequest();
} else {
ApplicationService.getApplication(id, getApplCallback, errGetCallback)
@@ -110,25 +100,6 @@ const DomandaBeneficiario = () => {
storeSet.main.unsetAsyncRequest();
}
const getCommsCallback = (data) => {
if (data.status === 'SUCCESS') {
setComms(data.data.commentsList.map(o => getFormattedCommsData(o)));
}
storeSet.main.unsetAsyncRequest();
}
const errGetCommsCallback = (data) => {
if (toast.current && data.message) {
toast.current.show({
severity: 'error',
summary: '',
detail: data.message
});
}
set404FromErrorResponse(data);
storeSet.main.unsetAsyncRequest();
}
const getFormattedData = (data) => {
data.submissionDate = is(String, data.submissionDate) ? new Date(data.submissionDate) : (data.submissionDate ? data.submissionDate : '');
data.startDate = is(String, data.startDate) ? new Date(data.startDate) : (data.startDate ? data.startDate : '');
@@ -136,81 +107,6 @@ const DomandaBeneficiario = () => {
return data;
};
const getFormattedCommsData = (data) => {
data.id = isNil(data.id) ? uniqid('id') : data.id;
data.commentedDate = is(String, data.commentedDate) ? new Date(data.commentedDate) : (data.commentedDate ? data.commentedDate : '');
data.createdDate = is(String, data.createdDate) ? new Date(data.createdDate) : (data.createdDate ? data.createdDate : '');
data.updatedDate = is(String, data.updatedDate) ? new Date(data.updatedDate) : (data.updatedDate ? data.updatedDate : '');
return data;
};
const headerNewComDialog = () => {
return <span>{__('Aggiungi comunicazione', 'gepafin')}</span>
}
const hideNewComDialog = () => {
setIsVisibleNewCommDialog(false);
setNewCommData({
title: '',
comment: ''
});
}
const footerNewComDialog = () => {
return <div>
<Button type="button" label={__('Anulla', 'gepafin')} onClick={hideNewComDialog} outlined/>
<Button
type="button"
disabled={isLoadingCommunication || isEmpty(newCommData.title) || isEmpty(newCommData.comment)}
label={__('Invia', 'gepafin')} onClick={createCommunication}/>
</div>
}
const openNewCommDialog = () => {
setIsVisibleNewCommDialog(true);
setNewCommData({
title: '',
comment: ''
});
}
const updateNewCommData = (value, path) => {
const newData = wrap(newCommData).set(path.split('.'), value).value();
setNewCommData(newData);
}
const createCommunication = () => {
setIsLoadingCommunication(true);
CommunicationService.createCommunication(data.id, newCommData, createCommunicationCallback, errCreateCommunicationCallback);
}
const createCommunicationCallback = (data) => {
if (data.status === 'SUCCESS') {
if (toast.current) {
toast.current.show({
severity: 'success',
summary: '',
detail: data.message
});
}
setComms([...comms, getFormattedCommsData(data.data)])
setIsVisibleNewCommDialog(false);
}
setIsLoadingCommunication(false);
}
const errCreateCommunicationCallback = (data) => {
if (toast.current && data.message) {
toast.current.show({
severity: 'error',
summary: '',
detail: data.message
});
}
set404FromErrorResponse(data);
setIsLoadingCommunication(false);
}
const onSubmit = () => {
};
@@ -354,7 +250,7 @@ const DomandaBeneficiario = () => {
<h2>{__('Dettagli Richiesta', 'gepafin')}</h2>
<h3>{__('Note e spiegazioni', 'gepafin')}</h3>
<div className="appPageSection__withBorder grey ql-editor"
style={{ minHeight: '200px' }}>
style={{ minHeight: '100px' }}>
{renderHtmlContent(data.note)}
</div>
</div> : null}
@@ -365,9 +261,6 @@ const DomandaBeneficiario = () => {
<form className="appForm" onSubmit={handleSubmit(onSubmit)}>
{data.formFields
? data.formFields.map((o, i) => {
/*const thisField = head(test.updatedFormFields.filter(j => j.fieldId === o.fieldId));
const value = pathOr({}, ['fieldValue'], thisField);
console.log('value', value, o.fieldId);*/
return <FormField
key={o.fieldId}
disabled={data.status === 'CLOSE'}
@@ -400,38 +293,7 @@ const DomandaBeneficiario = () => {
{data.id
? <div className="appPageSection">
<h2>{__('Comunicazioni', 'gepafin')}</h2>
<table className="myTable">
<thead className="myThead">
<tr>
<th style={{ width: 250 }}>{__('Data', 'gepafin')}</th>
<th>{__('Comunicazione', 'gepafin')}</th>
</tr>
</thead>
<tbody className="myTbody">
{!isNil(comms) && !isEmpty(comms)
? comms.map((o, i) => <tr key={o.id}>
<td valign="top">
{getDateFromISOstring(o.commentedDate)}
</td>
<td>
<h3>{o.title}</h3>
<p>{o.comment}</p>
</td>
</tr>)
: <tr>
<td>-</td>
<td>-</td>
</tr>}
</tbody>
</table>
<Button
style={{ marginTop: 30 }}
onClick={openNewCommDialog}
disabled={data.status === 'CLOSE'}
type="button"
label={__('Aggiungi Comunicazione', 'gepafin')}
icon="pi pi-plus" iconPos="right"/>
<SoccorsoComunications amendmentId={data.id} soccorsoStatus={data.status}/>
</div> : null}
{data.id
@@ -459,40 +321,8 @@ const DomandaBeneficiario = () => {
icon="pi pi-times" iconPos="right"/>
</div>
</div>
</div>
<Dialog
visible={isVisibleNewCommDialog}
modal
header={headerNewComDialog}
footer={footerNewComDialog}
style={{ maxWidth: '600px', width: '100%' }}
onHide={hideNewComDialog}>
<div className="appForm__field">
<label
className={classNames({ 'p-error': isEmpty(newCommData.title) })}>
{__('Titolo', 'gepafin')}*
</label>
<InputText value={newCommData.title}
disabled={data.status === 'CLOSE'}
invalid={isEmpty(newCommData.title)}
onChange={(e) => updateNewCommData(e.target.value, 'title')}/>
<label
className={classNames({ 'p-error': isEmpty(newCommData.comment) })}>
{__('Contenuto', 'gepafin')}*
</label>
<InputTextarea
value={newCommData.comment}
disabled={data.status === 'CLOSE'}
rows={5} cols={30}
invalid={isEmpty(newCommData.comment)}
onChange={(e) => updateNewCommData(e.target.value, 'comment')}/>
</div>
</Dialog>
<Dialog
header={__('Invia documenti via PEC', 'gepafin')}
visible={isVisibleEmailDialog}

55
src/pages/DomandaEditPreInstructor/index.js
View File

@@ -28,8 +28,8 @@ import BlockingOverlay from '../../components/BlockingOverlay';
import { Toast } from 'primereact/toast';
import HelpIcon from '../../icons/HelpIcon';
import { Dialog } from 'primereact/dialog';
import { classNames } from 'primereact/utils';
import { Dropdown } from 'primereact/dropdown';
const APP_EVALUATION_FLOW_ID = process.env.REACT_APP_EVALUATION_FLOW_ID;
const DomandaEditPreInstructor = () => {
const isAsyncRequest = useStore().main.isAsyncRequest();
@@ -63,6 +63,7 @@ const DomandaEditPreInstructor = () => {
const getCallback = (data) => {
if (data.status === 'SUCCESS') {
setData(getFormattedData(data.data));
setMotivation(data.data.motivation);
}
storeSet.main.unsetAsyncRequest();
}
@@ -158,8 +159,10 @@ const DomandaEditPreInstructor = () => {
criteria: klona(data.criteria),
checklist: klona(data.checklist),
files: klona(data.files),
note: data.note
note: data.note,
motivation
}
ApplicationEvaluationService.updateEvaluation(data.assignedApplicationId, formData, updateStatusCallback, errUpdateStatusCallback);
}
@@ -169,8 +172,10 @@ const DomandaEditPreInstructor = () => {
criteria: klona(data.criteria),
checklist: klona(data.checklist),
files: klona(data.files),
note: data.note
note: data.note,
motivation
}
ApplicationEvaluationService.updateEvaluation(data.assignedApplicationId, formData, updateStatusCallback, errUpdateStatusCallback);
}
@@ -273,7 +278,8 @@ const DomandaEditPreInstructor = () => {
}
const shouldDisableField = (fieldName) => {
return !['EVALUATION', 'OPEN'].includes(data.status) || (['ADMISSIBLE'].includes(data.status) && fieldName !== 'criteria')
return !['EVALUATION'].includes(data.applicationStatus)
|| (['ADMISSIBLE'].includes(data.applicationStatus) && fieldName !== 'criteria')
}
const headerCompleteDialog = () => {
@@ -285,6 +291,7 @@ const DomandaEditPreInstructor = () => {
const hideCompleteDialog = () => {
setIsVisibleCompleteDialog(false);
setOperationType('');
setMotivation('');
}
const footerCompleteDialog = () => {
@@ -304,10 +311,18 @@ const DomandaEditPreInstructor = () => {
}
const initiateRejecting = () => {
setOperationType('approve');
setOperationType('reject');
setIsVisibleCompleteDialog(true);
}
const doCreateAppointment = () => {
// TODO
}
const doMakeAdmisible = () => {
// TODO
}
useEffect(() => {
const maxScore = pathOr(0, ['minScore'], data);
const criteria = pathOr([], ['criteria'], data);
@@ -565,18 +580,21 @@ const DomandaEditPreInstructor = () => {
<div className="appPageSection">
<div className="appPageSection__actions">
<Button
{['EVALUATION', 'SOCCORSO', 'CLOSE'].includes(data.applicationStatus)
? <Button
type="button"
disabled={!data.id || data.status === 'CLOSE'}
onClick={doNewSoccorso}
outlined
label={<>
{__('Richiedi Soccorso Istruttorio', 'gepafin')}
{data.applicationStatus === 'EVALUATION'
? __('Richiedi Soccorso Istruttorio', 'gepafin')
: __('Apri Soccorso Istruttorio', 'gepafin')}
<i style={{ marginLeft: 7 }}>
<HelpIcon/>
</i>
</>}
/>
/> : null}
{data.id
? <Button
type="button"
@@ -590,17 +608,32 @@ const DomandaEditPreInstructor = () => {
onClick={doSaveDraft}
label={__('Crea valutazione', 'gepafin')}
icon="pi pi-save" iconPos="right"/>}
{APP_EVALUATION_FLOW_ID === '1' && ['EVALUATION'].includes(data.applicationStatus)
? <Button
type="button"
disabled={!data.id}
onClick={doCreateAppointment}
label={__('Crea l\'appuntamento', 'gepafin')}
/> : null}
{APP_EVALUATION_FLOW_ID === '1' && ['APPOINTMENT'].includes(data.applicationStatus)
? <Button
type="button"
disabled={!data.id}
onClick={doMakeAdmisible}
label={__('Ammissibile', 'gepafin')}
/> : null}
{data.id
? <Button
type="button"
disabled={!isAdmissible || ['CLOSE', 'SOCCORSO'].includes(data.status)}
disabled={!isAdmissible
|| (APP_EVALUATION_FLOW_ID === '1' && !['ADMISSIBLE', 'APPOINTMENT'].includes(data.applicationStatus))}
onClick={initiateApproving}
label={__('Approva Domanda', 'gepafin')}
icon="pi pi-check" iconPos="right"/> : null}
{data.id
? <Button
type="button"
disabled={['CLOSE', 'SOCCORSO'].includes(data.status)}
disabled={APP_EVALUATION_FLOW_ID === '1' && !['ADMISSIBLE', 'APPOINTMENT'].includes(data.applicationStatus)}
onClick={initiateRejecting}
label={__('Respingi Domanda', 'gepafin')}
icon="pi pi-times" iconPos="right"/> : null}

218
src/pages/SoccorsoEditPreInstructor/components/SoccorsoComunications/index.js Normal file
View File

@@ -0,0 +1,218 @@
import React, { useEffect, useRef, useState } from 'react';
import { __ } from '@wordpress/i18n';
import { is, isEmpty, isNil } from 'ramda';
import { wrap } from 'object-path-immutable';
// tools
import getDateFromISOstring from '../../../../helpers/getDateFromISOstring';
import set404FromErrorResponse from '../../../../helpers/set404FromErrorResponse';
import uniqid from '../../../../helpers/uniqid';
// store
import { storeGet } from '../../../../store';
// api
import CommunicationService from '../../../../service/communication-service';
// components
import { Button } from 'primereact/button';
import { classNames } from 'primereact/utils';
import { InputText } from 'primereact/inputtext';
import { InputTextarea } from 'primereact/inputtextarea';
import { Dialog } from 'primereact/dialog';
import { Toast } from 'primereact/toast';
const SoccorsoComunications = ({ amendmentId, soccorsoStatus }) => {
const [comms, setComms] = useState([]);
const [isVisibleNewCommDialog, setIsVisibleNewCommDialog] = useState(false);
const [newCommData, setNewCommData] = useState({});
const [isLoadingCommunication, setIsLoadingCommunication] = useState(false);
const toast = useRef(null);
useEffect(() => {
if (amendmentId && amendmentId !== 0) {
setIsLoadingCommunication(true);
CommunicationService.getCommsByAmendmentId(amendmentId, getCommsCallback, errGetCommsCallback);
}
}, [amendmentId]);
const getCommsCallback = (data) => {
if (data.status === 'SUCCESS') {
setComms(data.data.commentsList.map(o => getFormattedCommsData(o)));
}
setIsLoadingCommunication(false);
}
const errGetCommsCallback = (data) => {
if (toast.current && data.message) {
toast.current.show({
severity: 'error',
summary: '',
detail: data.message
});
}
setIsLoadingCommunication(false);
}
const getFormattedCommsData = (data) => {
data.id = isNil(data.id) ? uniqid('id') : data.id;
data.commentedDate = is(String, data.commentedDate) ? new Date(data.commentedDate) : (data.commentedDate ? data.commentedDate : '');
data.createdDate = is(String, data.createdDate) ? new Date(data.createdDate) : (data.createdDate ? data.createdDate : '');
data.updatedDate = is(String, data.updatedDate) ? new Date(data.updatedDate) : (data.updatedDate ? data.updatedDate : '');
return data;
};
const headerNewComDialog = () => {
return <span>{__('Aggiungi comunicazione', 'gepafin')}</span>
}
const hideNewComDialog = () => {
setIsVisibleNewCommDialog(false);
setNewCommData({
title: '',
comment: ''
});
}
const footerNewComDialog = () => {
return <div>
<Button type="button" label={__('Anulla', 'gepafin')} onClick={hideNewComDialog} outlined/>
<Button
type="button"
disabled={isLoadingCommunication || isEmpty(newCommData.title) || isEmpty(newCommData.comment)}
label={__('Invia', 'gepafin')} onClick={createCommunication}/>
</div>
}
const openNewCommDialog = () => {
setIsVisibleNewCommDialog(true);
setNewCommData({
title: '',
comment: ''
});
}
const updateNewCommData = (value, path) => {
const newData = wrap(newCommData).set(path.split('.'), value).value();
setNewCommData(newData);
}
const createCommunication = () => {
setIsLoadingCommunication(true);
CommunicationService.createCommunication(amendmentId, newCommData, createCommunicationCallback, errCreateCommunicationCallback);
}
const createCommunicationCallback = (data) => {
if (data.status === 'SUCCESS') {
if (toast.current) {
toast.current.show({
severity: 'success',
summary: '',
detail: data.message
});
}
setComms([...comms, getFormattedCommsData(data.data)])
setIsVisibleNewCommDialog(false);
}
setIsLoadingCommunication(false);
}
const errCreateCommunicationCallback = (data) => {
if (toast.current && data.message) {
toast.current.show({
severity: 'error',
summary: '',
detail: data.message
});
}
set404FromErrorResponse(data);
setIsLoadingCommunication(false);
}
const displayCommIcon = (comm) => {
const userData = storeGet.main.userData();
return userData.id === comm.senderUserId
? <i className="pi pi-upload"></i>
: <i className="pi pi-download"></i>;
}
const getCommRowClass = (comm) => {
const userData = storeGet.main.userData();
return userData.id === comm.senderUserId ? 'outgoing' : 'incoming';
}
return (
<>
<Toast ref={toast}/>
<table className="myTable">
<thead className="myThead">
<tr>
<th style={{ width: 50 }}></th>
<th style={{ width: 250 }}>{__('Data', 'gepafin')}</th>
<th style={{ width: '100%' }}>{__('Comunicazione', 'gepafin')}</th>
</tr>
</thead>
<tbody className="myTbody">
{!isNil(comms) && !isEmpty(comms)
? comms.map((o, i) => <tr key={o.id} className={getCommRowClass(o)}>
<td valign="top">
{displayCommIcon(o)}
</td>
<td valign="top">
{getDateFromISOstring(o.commentedDate)}
</td>
<td>
<h3>{o.title}</h3>
<p>{o.comment}</p>
</td>
</tr>)
: <tr>
<td></td>
<td>-</td>
<td>-</td>
</tr>}
</tbody>
</table>
<Button
style={{ marginTop: 30 }}
onClick={openNewCommDialog}
disabled={soccorsoStatus === 'CLOSE'}
type="button"
label={__('Aggiungi Comunicazione', 'gepafin')}
icon="pi pi-plus" iconPos="right"/>
<Dialog
visible={isVisibleNewCommDialog}
modal
header={headerNewComDialog}
footer={footerNewComDialog}
style={{ maxWidth: '600px', width: '100%' }}
onHide={hideNewComDialog}>
<div className="appForm__field">
<label
className={classNames({ 'p-error': isEmpty(newCommData.title) })}>
{__('Titolo', 'gepafin')}*
</label>
<InputText value={newCommData.title}
disabled={soccorsoStatus === 'CLOSE'}
invalid={isEmpty(newCommData.title)}
onChange={(e) => updateNewCommData(e.target.value, 'title')}/>
<label
className={classNames({ 'p-error': isEmpty(newCommData.comment) })}>
{__('Contenuto', 'gepafin')}*
</label>
<InputTextarea
value={newCommData.comment}
disabled={soccorsoStatus === 'CLOSE'}
rows={5} cols={30}
invalid={isEmpty(newCommData.comment)}
onChange={(e) => updateNewCommData(e.target.value, 'comment')}/>
</div>
</Dialog>
</>
)
}
export default SoccorsoComunications;

175
src/pages/SoccorsoEditPreInstructor/index.js
View File

@@ -1,7 +1,7 @@
import React, { useState, useEffect, useRef, useMemo } from 'react';
import { __ } from '@wordpress/i18n';
import { useNavigate, useParams } from 'react-router-dom';
import { is, isEmpty, isNil } from 'ramda';
import { is, isEmpty } from 'ramda';
import { wrap } from 'object-path-immutable';
import { klona } from 'klona';
import { useForm } from 'react-hook-form';
@@ -11,14 +11,12 @@ import { storeSet, useStore } from '../../store';
// api
import AmendmentsService from '../../service/amendments-service';
import CommunicationService from '../../service/communication-service';
// tools
import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
import getBandoLabel from '../../helpers/getBandoLabel';
import getDateFromISOstring from '../../helpers/getDateFromISOstring';
import renderHtmlContent from '../../helpers/renderHtmlContent';
import uniqid from '../../helpers/uniqid';
// components
import { Button } from 'primereact/button';
@@ -26,21 +24,17 @@ import BlockingOverlay from '../../components/BlockingOverlay';
import { Toast } from 'primereact/toast';
import { classNames } from 'primereact/utils';
import { Dialog } from 'primereact/dialog';
import { InputText } from 'primereact/inputtext';
import { InputTextarea } from 'primereact/inputtextarea';
import FormField from '../../components/FormField';
import { Editor } from 'primereact/editor';
import { InputNumber } from 'primereact/inputnumber';
import SoccorsoComunications from './components/SoccorsoComunications';
const SoccorsoEditPreInstructor = () => {
const isAsyncRequest = useStore().main.isAsyncRequest();
const { id, amendmentId } = useParams();
const navigate = useNavigate();
const [data, setData] = useState({});
const [comms, setComms] = useState([]);
const [isVisibleNewCommDialog, setIsVisibleNewCommDialog] = useState(false);
const [newCommData, setNewCommData] = useState({});
const [isLoadingCommunication, setIsLoadingCommunication] = useState(false);
const [isVisibleExtendTimeDialog, setIsVisibleExtendTimeDialog] = useState(false);
const [extendedTime, setExtendedTime] = useState(3);
const [isLoadingExtendingTime, setIsLoadingExtendingTime] = useState(false);
@@ -75,9 +69,8 @@ const SoccorsoEditPreInstructor = () => {
return acc;
}, {});
setFormInitialData(formDataInitial);
CommunicationService.getCommsByAmendmentId(data.data.id, getCommsCallback, errGetCommsCallback);
}
//storeSet.main.unsetAsyncRequest();
storeSet.main.unsetAsyncRequest();
}
const errGetCallback = (data) => {
@@ -92,74 +85,12 @@ const SoccorsoEditPreInstructor = () => {
storeSet.main.unsetAsyncRequest();
}
const getCommsCallback = (data) => {
if (data.status === 'SUCCESS') {
setComms(data.data.commentsList.map(o => getFormattedCommsData(o)));
}
storeSet.main.unsetAsyncRequest();
}
const errGetCommsCallback = (data) => {
if (toast.current && data.message) {
toast.current.show({
severity: 'error',
summary: '',
detail: data.message
});
}
set404FromErrorResponse(data);
storeSet.main.unsetAsyncRequest();
}
const getFormattedData = (data) => {
data.startDate = is(String, data.startDate) ? new Date(data.startDate) : (data.startDate ? data.startDate : '');
data.expirationDate = is(String, data.expirationDate) ? new Date(data.expirationDate) : (data.expirationDate ? data.expirationDate : '');
return data;
};
const getFormattedCommsData = (data) => {
data.id = isNil(data.id) ? uniqid('id') : data.id;
data.commentedDate = is(String, data.commentedDate) ? new Date(data.commentedDate) : (data.commentedDate ? data.commentedDate : '');
data.createdDate = is(String, data.createdDate) ? new Date(data.createdDate) : (data.createdDate ? data.createdDate : '');
data.updatedDate = is(String, data.updatedDate) ? new Date(data.updatedDate) : (data.updatedDate ? data.updatedDate : '');
return data;
};
const headerNewComDialog = () => {
return <span>{__('Aggiungi comunicazione', 'gepafin')}</span>
}
const hideNewComDialog = () => {
setIsVisibleNewCommDialog(false);
setNewCommData({
title: '',
comment: ''
});
}
const footerNewComDialog = () => {
return <div>
<Button type="button" label={__('Anulla', 'gepafin')} onClick={hideNewComDialog} outlined/>
<Button
type="button"
disabled={isLoadingCommunication || isEmpty(newCommData.title) || isEmpty(newCommData.comment)}
label={__('Invia', 'gepafin')} onClick={createCommunication}/>
</div>
}
const openNewCommDialog = () => {
setIsVisibleNewCommDialog(true);
setNewCommData({
title: '',
comment: ''
});
}
const updateNewCommData = (value, path) => {
const newData = wrap(newCommData).set(path.split('.'), value).value();
setNewCommData(newData);
}
const renderHeader = () => {
return (
<span className="ql-formats">
@@ -185,38 +116,6 @@ const SoccorsoEditPreInstructor = () => {
setData(newData);
}
const createCommunication = () => {
setIsLoadingCommunication(true);
CommunicationService.createCommunication(amendmentId, newCommData, createCommunicationCallback, errCreateCommunicationCallback);
}
const createCommunicationCallback = (data) => {
if (data.status === 'SUCCESS') {
if (toast.current) {
toast.current.show({
severity: 'success',
summary: '',
detail: data.message
});
}
setComms([...comms, getFormattedCommsData(data.data)])
setIsVisibleNewCommDialog(false);
}
setIsLoadingCommunication(false);
}
const errCreateCommunicationCallback = (data) => {
if (toast.current && data.message) {
toast.current.show({
severity: 'error',
summary: '',
detail: data.message
});
}
set404FromErrorResponse(data);
setIsLoadingCommunication(false);
}
const onSubmit = () => {
};
@@ -471,38 +370,7 @@ const SoccorsoEditPreInstructor = () => {
<div className="appPageSection">
<h2>{__('Comunicazioni', 'gepafin')}</h2>
<table className="myTable">
<thead className="myThead">
<tr>
<th style={{ width: 250 }}>{__('Data', 'gepafin')}</th>
<th>{__('Comunicazione', 'gepafin')}</th>
</tr>
</thead>
<tbody className="myTbody">
{!isNil(comms) && !isEmpty(comms)
? comms.map((o, i) => <tr key={o.id}>
<td valign="top">
{getDateFromISOstring(o.commentedDate)}
</td>
<td>
<h3>{o.title}</h3>
<p>{o.comment}</p>
</td>
</tr>)
: <tr>
<td>-</td>
<td>-</td>
</tr>}
</tbody>
</table>
<Button
style={{ marginTop: 30 }}
onClick={openNewCommDialog}
disabled={data.status === 'CLOSE'}
type="button"
label={__('Aggiungi Comunicazione', 'gepafin')}
icon="pi pi-plus" iconPos="right"/>
<SoccorsoComunications amendmentId={amendmentId} soccorsoStatus={data.status}/>
</div>
<div className="appPageSection">
@@ -511,9 +379,6 @@ const SoccorsoEditPreInstructor = () => {
<form className="appForm" onSubmit={handleSubmit(onSubmit)}>
{data.formFields
? data.formFields.map((o, i) => {
/*const thisField = head(test.updatedFormFields.filter(j => j.fieldId === o.fieldId));
const value = pathOr({}, ['fieldValue'], thisField);
console.log('value', value, o.fieldId);*/
return <FormField
key={o.fieldId}
disabled={data.status === 'CLOSE'}
@@ -589,36 +454,6 @@ const SoccorsoEditPreInstructor = () => {
</div>
<Dialog
visible={isVisibleNewCommDialog}
modal
header={headerNewComDialog}
footer={footerNewComDialog}
style={{ maxWidth: '600px', width: '100%' }}
onHide={hideNewComDialog}>
<div className="appForm__field">
<label
className={classNames({ 'p-error': isEmpty(newCommData.title) })}>
{__('Titolo', 'gepafin')}*
</label>
<InputText value={newCommData.title}
disabled={data.status === 'CLOSE'}
invalid={isEmpty(newCommData.title)}
onChange={(e) => updateNewCommData(e.target.value, 'title')}/>
<label
className={classNames({ 'p-error': isEmpty(newCommData.comment) })}>
{__('Contenuto', 'gepafin')}*
</label>
<InputTextarea
value={newCommData.comment}
disabled={data.status === 'CLOSE'}
rows={5} cols={30}
invalid={isEmpty(newCommData.comment)}
onChange={(e) => updateNewCommData(e.target.value, 'comment')}/>
</div>
</Dialog>
<Dialog
visible={isVisibleExtendTimeDialog}
modal