- saving progress;
This commit is contained in:
Vitalii Kiiko
@@ -1,31 +1,37 @@
|
||||
import React, { useState, useEffect, useRef } from 'react';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
import { useNavigate, useParams } from 'react-router-dom';
|
||||
//import equal from 'fast-deep-equal';
|
||||
import { is, isNil } from 'ramda';
|
||||
|
||||
// components
|
||||
// store
|
||||
import { storeSet, useStore } from '../../store';
|
||||
|
||||
// api
|
||||
import BandoService from '../../service/bando-service';
|
||||
|
||||
// tools
|
||||
import getBandoLabel from '../../helpers/getBandoLabel';
|
||||
|
||||
// components
|
||||
import { Button } from 'primereact/button';
|
||||
import { Skeleton } from 'primereact/skeleton';
|
||||
import { Steps } from 'primereact/steps';
|
||||
import BandoEditFormStep1 from './components/BandoEditFormStep1';
|
||||
import BandoEditFormStep2 from './components/BandoEditFormStep2';
|
||||
import { Messages } from 'primereact/messages';
|
||||
|
||||
// TODO temp
|
||||
import { bandoTest } from '../../tempData';
|
||||
import FormsService from '../../service/forms-service';
|
||||
|
||||
const BandoEdit = () => {
|
||||
const isAsyncRequest = useStore().main.isAsyncRequest();
|
||||
const navigate = useNavigate();
|
||||
const { id } = useParams();
|
||||
const [activeStep, setActiveStep] = useState(0)
|
||||
const [activeStep, setActiveStep] = useState(null)
|
||||
const [data, setData] = useState({});
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [forms, setForms] = useState([]);
|
||||
//const [selectedTemplate, setSelectedTemplate] = useState(null);
|
||||
//const [templates, setTemplate] = useState(null);
|
||||
const formRef = useRef(null);
|
||||
const stepErrorMsgs = useRef(null);
|
||||
const bandoMsgs = useRef(null);
|
||||
|
||||
const stepItems = [
|
||||
{
|
||||
@@ -34,7 +40,7 @@ const BandoEdit = () => {
|
||||
if (activeStep === 0) {
|
||||
return false
|
||||
}
|
||||
stepErrorMsgs.current.clear();
|
||||
bandoMsgs.current.clear();
|
||||
const isFormValid = formRef.current.isFormValid();
|
||||
//const values = formRef.current.getValues();
|
||||
//const diffData = equal(values, data);
|
||||
@@ -42,10 +48,13 @@ const BandoEdit = () => {
|
||||
if (isFormValid) {
|
||||
goToStep(0)
|
||||
} else {
|
||||
stepErrorMsgs.current.show([
|
||||
{ sticky: true, severity: 'error', summary: 'Error',
|
||||
bandoMsgs.current.show([
|
||||
{
|
||||
id: '98',
|
||||
sticky: true, severity: 'error', summary: 'Error',
|
||||
detail: __('Potrai andare su altro step dopo risolvere errori della forma', 'gepafin'),
|
||||
closable: true }
|
||||
closable: true
|
||||
}
|
||||
]);
|
||||
}
|
||||
}
|
||||
@@ -56,7 +65,7 @@ const BandoEdit = () => {
|
||||
if (activeStep === 1) {
|
||||
return false
|
||||
}
|
||||
stepErrorMsgs.current.clear();
|
||||
bandoMsgs.current.clear();
|
||||
const isFormValid = formRef.current.isFormValid();
|
||||
//const values = formRef.current.getValues();
|
||||
//const diffData = equal(values, data);
|
||||
@@ -64,10 +73,13 @@ const BandoEdit = () => {
|
||||
if (isFormValid) {
|
||||
goToStep(1);
|
||||
} else {
|
||||
stepErrorMsgs.current.show([
|
||||
{ sticky: true, severity: 'error', summary: 'Error',
|
||||
bandoMsgs.current.show([
|
||||
{
|
||||
id: '98',
|
||||
sticky: true, severity: 'error', summary: 'Error',
|
||||
detail: __('Potrai andare su altro step dopo risolvere errori della forma', 'gepafin'),
|
||||
closable: true }
|
||||
closable: true
|
||||
}
|
||||
]);
|
||||
}
|
||||
}
|
||||
@@ -79,40 +91,151 @@ const BandoEdit = () => {
|
||||
}
|
||||
|
||||
const openBandoFormManagement = () => {
|
||||
navigate('/bandi/11/forms');
|
||||
navigate(`/bandi/${id}/forms`);
|
||||
}
|
||||
|
||||
const validateBando = () => {
|
||||
storeSet.main.setAsyncRequest();
|
||||
bandoMsgs.current.clear();
|
||||
BandoService.validateBando(id, validateCallback, errValidateCallback);
|
||||
}
|
||||
|
||||
const validateCallback = (data) => {
|
||||
if (data.status === 'SUCCESS') {
|
||||
if (bandoMsgs.current) {
|
||||
bandoMsgs.current.show([
|
||||
{
|
||||
id: '99',
|
||||
sticky: true, severity: 'success', summary: '',
|
||||
detail: __('Potrai pubblicare il tuo Bando.', 'gepafin'),
|
||||
closable: false
|
||||
}
|
||||
]);
|
||||
}
|
||||
}
|
||||
storeSet.main.unsetAsyncRequest();
|
||||
}
|
||||
|
||||
const errValidateCallback = (data) => {
|
||||
standardErrCallback(data);
|
||||
}
|
||||
|
||||
const publishBando = () => {
|
||||
storeSet.main.setAsyncRequest();
|
||||
bandoMsgs.current.clear();
|
||||
BandoService.updateBandoStatus(id, publishCallback, errPublishCallback, [['status', 'PUBLISH']]);
|
||||
}
|
||||
|
||||
const publishCallback = (data) => {
|
||||
if (data.status === 'SUCCESS') {
|
||||
if (bandoMsgs.current) {
|
||||
bandoMsgs.current.show([
|
||||
{
|
||||
id: '99',
|
||||
sticky: true, severity: 'success', summary: '',
|
||||
detail: __('Pubblicato!', 'gepafin'),
|
||||
closable: false
|
||||
}
|
||||
]);
|
||||
}
|
||||
}
|
||||
storeSet.main.unsetAsyncRequest();
|
||||
}
|
||||
|
||||
const errPublishCallback = (data) => {
|
||||
standardErrCallback(data);
|
||||
}
|
||||
|
||||
const getCallback = (data) => {
|
||||
if (data.status === 'SUCCESS') {
|
||||
if (!isNil(data.data.dates) && data.data.dates.length) {
|
||||
data.data.dates = data.data.dates.map(v => is(String, v) ? new Date(v) : v);
|
||||
}
|
||||
|
||||
if (data.data.status === 'READY_TO_PUBLISH') {
|
||||
bandoMsgs.current.clear();
|
||||
bandoMsgs.current.show([
|
||||
{
|
||||
id: '1',
|
||||
sticky: true, severity: 'info', summary: 'Info',
|
||||
detail: __('Potrai pubblicare il tuo Bando.', 'gepafin'),
|
||||
closable: false
|
||||
}
|
||||
]);
|
||||
} else if (data.data.status === 'DRAFT') {
|
||||
if (bandoMsgs.current) {
|
||||
bandoMsgs.current.clear();
|
||||
bandoMsgs.current.show([
|
||||
{
|
||||
id: '1',
|
||||
sticky: true, severity: 'info', summary: 'Info',
|
||||
detail: __('Potrai pubblicare il tuo Bando solo dopo aver completato tutti i campi obbligatori contrassegnati dagli asterischi.', 'gepafin'),
|
||||
closable: false
|
||||
}
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
setData(data.data);
|
||||
}
|
||||
storeSet.main.unsetAsyncRequest();
|
||||
}
|
||||
|
||||
const errGetCallback = (data) => {
|
||||
standardErrCallback(data);
|
||||
}
|
||||
|
||||
const standardErrCallback = (data) => {
|
||||
if (bandoMsgs.current && data.message) {
|
||||
bandoMsgs.current.show([
|
||||
{
|
||||
sticky: true, severity: 'error', summary: 'Error',
|
||||
detail: data.message,
|
||||
closable: true
|
||||
}
|
||||
]);
|
||||
}
|
||||
storeSet.main.unsetAsyncRequest();
|
||||
}
|
||||
|
||||
const getFormsCallback = (data) => {
|
||||
if (data.status === 'SUCCESS') {
|
||||
setForms(data.data);
|
||||
}
|
||||
storeSet.main.unsetAsyncRequest();
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
storeSet.main.setAsyncRequest();
|
||||
setActiveStep(0);
|
||||
|
||||
const parsed = parseInt(id)
|
||||
const bandoId = !isNaN(parsed) ? parsed : 0;
|
||||
|
||||
const data = 0 === bandoId
|
||||
? {
|
||||
if (bandoId === 0) {
|
||||
setData({
|
||||
status: 'draft',
|
||||
name: ''
|
||||
}
|
||||
: bandoTest;
|
||||
});
|
||||
storeSet.main.unsetAsyncRequest();
|
||||
|
||||
if (bandoId === 0) {
|
||||
setData(data);
|
||||
setIsLoading(false);
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
if (!isNil(data.dates) && data.dates.length) {
|
||||
data.dates = data.dates.map(v => is(String, v) ? new Date(v) : v);
|
||||
if (bandoMsgs.current) {
|
||||
bandoMsgs.current.clear();
|
||||
bandoMsgs.current.show([
|
||||
{
|
||||
id: '1',
|
||||
sticky: true, severity: 'info', summary: 'Info',
|
||||
detail: __('Potrai pubblicare il tuo Bando solo dopo aver completato tutti i campi obbligatori contrassegnati dagli asterischi.', 'gepafin'),
|
||||
closable: false
|
||||
}
|
||||
|
||||
setData(data);
|
||||
|
||||
/*const templates = [
|
||||
{ name: 'Il mio template', value: 22 },
|
||||
{ name: 'Template #11', value: 11 },
|
||||
];
|
||||
setTemplate(templates);*/
|
||||
setIsLoading(false);
|
||||
}, 2000);
|
||||
]);
|
||||
}
|
||||
}, [id]);
|
||||
} else {
|
||||
BandoService.getBando(id, getCallback, errGetCallback);
|
||||
FormsService.getFormsForCall(id, getFormsCallback, () => {
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="appPage">
|
||||
@@ -146,7 +269,7 @@ const BandoEdit = () => {
|
||||
icon="pi pi-check"
|
||||
iconPos="right"/>
|
||||
</div> : null*/}
|
||||
{!isLoading
|
||||
{!isAsyncRequest
|
||||
? <Steps
|
||||
model={stepItems}
|
||||
activeIndex={activeStep}
|
||||
@@ -155,13 +278,14 @@ const BandoEdit = () => {
|
||||
|
||||
<div className="appPage__spacer"></div>
|
||||
|
||||
<Messages ref={stepErrorMsgs} />
|
||||
<Messages ref={bandoMsgs}/>
|
||||
|
||||
{!isLoading
|
||||
{!isAsyncRequest
|
||||
? <>
|
||||
{activeStep === 0
|
||||
? <BandoEditFormStep1 initialData={data} ref={formRef}/>
|
||||
: <BandoEditFormStep2 initialData={data} ref={formRef}/>}
|
||||
? <BandoEditFormStep1 initialData={data} ref={formRef}/> : null}
|
||||
{activeStep === 1
|
||||
? <BandoEditFormStep2 initialData={data} ref={formRef}/> : null}
|
||||
|
||||
<div className="appPageSection">
|
||||
<h2>{__('Crea o modifica il Form compilabile dal Beneficiario', 'gepafin')}</h2>
|
||||
@@ -169,6 +293,34 @@ const BandoEdit = () => {
|
||||
type="button"
|
||||
onClick={openBandoFormManagement}
|
||||
label={__('Crea/modifica form', 'gepafin')}/>
|
||||
|
||||
{forms.length
|
||||
? <ul className="">
|
||||
{forms.map(o => <li key={o.id}>
|
||||
{o.label}
|
||||
</li>)}
|
||||
</ul>
|
||||
: <p>No forms created yet.</p>}
|
||||
</div>
|
||||
|
||||
<div className="appPage__spacer"></div>
|
||||
|
||||
<div className="appPageSection">
|
||||
<h2>{__('Publicca il Form', 'gepafin')}</h2>
|
||||
|
||||
<div className="appPageSection__actions">
|
||||
<Button
|
||||
type="button"
|
||||
outlined
|
||||
disabled={!(data.status === 'DRAFT')}
|
||||
onClick={validateBando}
|
||||
label={__('Validate', 'gepafin')}/>
|
||||
<Button
|
||||
type="button"
|
||||
disabled={!(data.status === 'READY_TO_PUBLISH')}
|
||||
onClick={publishBando}
|
||||
label={__('Publish', 'gepafin')}/>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
: <>
|
||||
|
||||
Reference in New Issue
Block a user