- saving progress;

This commit is contained in:
Vitalii Kiiko
2025-02-10 14:35:51 +01:00
parent 7ff7d84c17
commit 7fa06b5b8c
12 changed files with 447 additions and 11 deletions

View File

@@ -116,6 +116,8 @@ const BandoEditFormStep3 = forwardRef(function () {
return () => {
storeSet.main.formId(0);
storeSet.main.formElements([]);
storeSet.main.activeElement('');
storeSet.main.selectedElement('');
}
}, []);

View File

@@ -18,6 +18,7 @@ import BuilderElementProperLabel from '../BuilderElementProperLabel';
const BuilderElement = ({ id, name, label, index, bandoStatus }) => {
const draggingElementId = useStore().main.draggingElementId();
const selectedElement = useStore().main.selectedElement();
const ref = useRef(null);
const elements = useStore().main.formElements();
const element = head(elements.filter(o => o.id === id));
@@ -99,11 +100,15 @@ const BuilderElement = ({ id, name, label, index, bandoStatus }) => {
storeSet.main.moveElement(dragIndex, hoverIndex, item);
}
const openSettings = (id) => {
const openSettings = () => {
storeSet.main.activeElement(id);
}
const duplicateElement = useCallback((id) => {
const selectElement = () => {
storeSet.main.selectedElement(id);
}
const duplicateElement = useCallback(() => {
const duplicatedElement = head(elements.filter(o => o.id === id));
if (duplicatedElement) {
@@ -121,7 +126,7 @@ const BuilderElement = ({ id, name, label, index, bandoStatus }) => {
}
}, [elements]);
const remove = (id) => {
const remove = () => {
storeSet.main.removeElement(id);
}
@@ -158,7 +163,11 @@ const BuilderElement = ({ id, name, label, index, bandoStatus }) => {
? <div ref={ref} className="formBuilder__elementNew">
{__('lascia qui', 'gepafin')}
</div>
: <div ref={ref} className="formBuilder__element" style={{ opacity }} data-handler-id={handlerId}>
: <div ref={ref}
className={`formBuilder__element${selectedElement === id ? ' selected' : ''}`}
style={{ opacity }}
onClick={selectElement}
data-handler-id={handlerId}>
<div className="meta">
<div className="tagHeader">
<Tag value={label} severity="info"/>
@@ -174,9 +183,9 @@ const BuilderElement = ({ id, name, label, index, bandoStatus }) => {
<BuilderElementProperLabel id={id} defaultLabel={label}/>
</div>
<div className="actions">
<Button icon="pi pi-clone" onClick={() => duplicateElement(id)} outlined severity="success"/>
<Button icon="pi pi-cog" onClick={() => openSettings(id)} outlined severity="info"/>
<Button icon="pi pi-trash" disabled={bandoStatus === 'PUBLISH'} onClick={() => remove(id)} outlined severity="danger"/>
<Button icon="pi pi-clone" onClick={duplicateElement} outlined severity="success"/>
<Button icon="pi pi-cog" onClick={openSettings} outlined severity="info"/>
<Button icon="pi pi-trash" disabled={bandoStatus === 'PUBLISH'} onClick={remove} outlined severity="danger"/>
</div>
</div>
)

View File

@@ -223,7 +223,7 @@ const BandoFormsEdit = () => {
storeSet.main.unsetAsyncRequest();
}
const errGetElementItemsCallback = (data) => {
const errGetElementItemsCallback = () => {
storeSet.main.unsetAsyncRequest();
}
@@ -278,6 +278,8 @@ const BandoFormsEdit = () => {
storeSet.main.formLabel('');
storeSet.main.formElements([]);
storeSet.main.bandoCriteria([]);
storeSet.main.activeElement('');
storeSet.main.selectedElement('');
}
}, [id, formId]);

View File

@@ -0,0 +1,178 @@
import React, { useState, useEffect} from 'react';
import { __ } from '@wordpress/i18n';
import { is, isNil, uniq } from 'ramda';
import { Link } from 'react-router-dom';
// api
import AmendmentsService from '../../../../service/amendments-service';
// tools
import getBandoLabel from '../../../../helpers/getBandoLabel';
import getBandoSeverity from '../../../../helpers/getBandoSeverity';
// components
import { FilterMatchMode, FilterOperator } from 'primereact/api';
import { DataTable } from 'primereact/datatable';
import { Column } from 'primereact/column';
import { Button } from 'primereact/button';
import { Calendar } from 'primereact/calendar';
import ProperBandoLabel from '../../../../components/ProperBandoLabel';
import { Dropdown } from 'primereact/dropdown';
import { Tag } from 'primereact/tag';
import translationStrings from '../../../../translationStringsForComponents';
const PreInstructorSoccorsiTable = ({ userId = null }) => {
const [items, setItems] = useState(null);
const [filters, setFilters] = useState(null);
const [localAsyncRequest, setLocalAsyncRequest] = useState(false);
const [statuses, setStatuses] = useState([]);
useEffect(() => {
if (!isNil(userId)) {
setLocalAsyncRequest(true);
if (userId === 0) {
AmendmentsService.getSoccorsi(getCallback, errGetCallbacks);
} else {
AmendmentsService.getSoccorsi(getCallback, errGetCallbacks, [
['userId', userId]
]);
}
}
}, [userId]);
const getCallback = (data) => {
if (data.status === 'SUCCESS') {
setItems(getFormattedData(data.data));
setStatuses(uniq(data.data.map(o => o.status)))
initFilters();
}
setLocalAsyncRequest(false);
}
const errGetCallbacks = (data) => {
setLocalAsyncRequest(false);
}
const getFormattedData = (data) => {
return data.map((d) => {
d.startDate = is(String, d.startDate) ? new Date(d.startDate) : (d.startDate ? d.startDate : '');
d.evaluationEndDate = is(String, d.evaluationEndDate) ? new Date(d.evaluationEndDate) : (d.evaluationEndDate ? d.evaluationEndDate : '');
return d;
});
};
const formatDate = (value) => {
return value.toLocaleDateString('it-IT', {
day: '2-digit',
month: '2-digit',
year: 'numeric'
});
};
const clearFilter = () => {
initFilters();
};
const initFilters = () => {
setFilters({
global: { value: null, matchMode: FilterMatchMode.CONTAINS },
callName: {
operator: FilterOperator.AND,
constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }]
},
companyName: {
operator: FilterOperator.AND,
constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }]
},
startDate: {
operator: FilterOperator.AND,
constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }]
},
evaluationEndDate: {
operator: FilterOperator.AND,
constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }]
}
});
};
const renderHeader = () => {
return (
<div className="appTableHeader">
<Button type="button" icon="pi pi-filter-slash" label={__('Pulisci', 'gepafin')} outlined onClick={clearFilter} />
</div>
);
};
const dateStartBodyTemplate = (rowData) => {
return formatDate(rowData.startDate);
};
const dateExpirationBodyTemplate = (rowData) => {
return rowData.evaluationEndDate ? formatDate(rowData.evaluationEndDate) : '';
};
const dateFilterTemplate = (options) => {
return <Calendar value={options.value} onChange={(e) => options.filterCallback(e.value, options.index)} dateFormat="mm/dd/yy" placeholder="mm/dd/yyyy" mask="99/99/9999" />;
};
const statusBodyTemplate = (rowData) => {
return <ProperBandoLabel status={rowData.status}/>;
};
const statusFilterTemplate = (options) => {
return <Dropdown value={options.value} options={statuses} onChange={(e) => options.filterCallback(e.value, options.index)} itemTemplate={statusItemTemplate} placeholder={translationStrings.selectOneLabel} className="p-column-filter" showClear />;
};
const statusItemTemplate = (option) => {
return <Tag value={getBandoLabel(option)} severity={getBandoSeverity(option)} />;
};
const actionsBodyTemplate = (rowData) => {
return <Link to={`/domande/${rowData.applicationId}/soccorso/${rowData.id}`}>
<Button severity="info" label={__('Dettagli', 'gepafin')} size="small" />
</Link>
}
const header = renderHeader();
return(
<div className="appPageSection__table">
<DataTable value={items} paginator showGridlines rows={5} loading={localAsyncRequest} dataKey="id"
filters={filters} stripedRows removableSort
header={header}
emptyMessage={translationStrings.emptyMessage}
onFilter={(e) => setFilters(e.filters)}>
<Column field="applicationId" header={__('ID domanda', 'gepafin')}
sortable filterPlaceholder={__('Cerca', 'gepafin')}
style={{ minWidth: '6rem' }}/>
<Column field="protocolNumber" header={__('Protocollo', 'gepafin')}
sortable filterPlaceholder={__('Cerca', 'gepafin')}
style={{ minWidth: '6rem' }}/>
<Column field="callName" header={__('Bando', 'gepafin')}
filter filterPlaceholder={__('Cerca', 'gepafin')}
style={{ minWidth: '8rem' }}/>
<Column field="companyName" header={__('Azienda Beneficiaria', 'gepafin')}
filter filterPlaceholder={__('Cerca', 'gepafin')}
style={{ minWidth: '8rem' }}/>
<Column header={__('Data richiesta', 'gepafin')}
filterField="startDate" dataType="date"
style={{ minWidth: '8rem' }}
body={dateStartBodyTemplate} filter filterElement={dateFilterTemplate}/>
<Column header={__('Scadenza', 'gepafin')}
filterField="evaluationEndDate" dataType="date"
style={{ minWidth: '8rem' }}
body={dateExpirationBodyTemplate} filter filterElement={dateFilterTemplate}/>
<Column field="status" header={__('Stato', 'gepafin')}
style={{ minWidth: '7rem' }} body={statusBodyTemplate} filter
filterElement={statusFilterTemplate} />
<Column header={__('Azioni', 'gepafin')}
body={actionsBodyTemplate}/>
</DataTable>
</div>
)
}
export default PreInstructorSoccorsiTable;

View File

@@ -0,0 +1,107 @@
import React, { useEffect, useState, useCallback } from 'react';
import { __ } from '@wordpress/i18n';
import { isEmpty, pathOr } from 'ramda';
import NumberFlow from '@number-flow/react';
// store
import { useStore } from '../../store';
// components
//import PreInstructorSoccorsiTable from './components/PreInstructorSoccorsiTable';
import DashboardService from '../../service/dashboard-service';
import ChartDomandePerBando from '../../components/ChartDomandePerBando';
import ChartStatoDomande from '../../components/ChartStatoDomande';
import ChartDomandePerStato from '../../components/ChartDomandePerStato';
const StatsBeneficiary = () => {
const [mainStats, setMainStats] = useState({});
const [chartStats, setChartStats] = useState({});
//const userData = useStore().main.userData();
const chosenCompanyId = useStore().main.chosenCompanyId();
const getStats = (resp) => {
if (resp.status === 'SUCCESS') {
setMainStats(resp.data.applicationWidget);
setChartStats(resp.data.applicationWidgetBars);
}
}
const errGetStats = () => {}
const getStatValue = useCallback((key, fallback = '') => {
return pathOr(fallback, [key], mainStats);
}, [mainStats]);
useEffect(() => {
DashboardService.getBeneficiaryStatsPage(chosenCompanyId, getStats, errGetStats);
}, []);
console.log(chartStats)
return(
<div className="appPage">
<div className="appPage__pageHeader">
<h1>{__('Statistiche', 'gepafin')}</h1>
</div>
<div className="appPage__spacer"></div>
<div className="appPageSection statsBigBadges">
<h2>{__('Riepilogo', 'gepafin')}</h2>
<div className="statsBigBadges__grid doubleStatsItems">
<div className="statsBigBadges__gridItemDoubleStatsBeneficiary">
<span>{__('Domande presentate', 'gepafin')}</span>
<span><NumberFlow
value={getStatValue('submittedApplication', 0)}
format={{ notation: 'compact' }}
locales="it-IT"/></span>
</div>
<div className="statsBigBadges__gridItemDoubleStatsBeneficiary">
<span>{__('Tasso di successo', 'gepafin')}</span>
<span><NumberFlow
value={getStatValue('waitingForResponseAmendments', 0)}
format={{ notation: 'compact' }}
suffix={` ${__('%', 'gepafin')}`}
locales="it-IT"/></span>
</div>
<div className="statsBigBadges__gridItemDoubleStatsBeneficiary">
<span>{__('Domande approvate', 'gepafin')}</span>
<span><NumberFlow
value={getStatValue('approvedApplication', 0)}
format={{ notation: 'compact' }}
locales="it-IT"/></span>
</div>
<div className="statsBigBadges__gridItemDoubleStatsBeneficiary">
<span>{__('Importo totale finanziato', 'gepafin')}</span>
<span><NumberFlow
value={getStatValue('averageResponseDays', 0)}
format={{
notation: 'compact',
compactDisplay: 'short',
roundingMode: 'trunc',
style: 'currency',
currency: 'EUR',
currencyDisplay: 'symbol'
}}
locales="en-US"/></span>
</div>
</div>
</div>
<div className="appPage__spacer"></div>
{chartStats && !isEmpty(chartStats)
? <div className="appPageSection">
<h2>{__('Statistiche di sistema', 'gepafin')}</h2>
<div className="appPageSection columns">
{/*<ChartDomandePerBando
title={__('Domande per bando', 'gepafin')}
data={chartStats.applicationPerCall}/>*/}
<ChartDomandePerStato
title={__('Domande per stato', 'gepafin')}
data={chartStats.applicationPerStatus}/>
</div>
</div> : null}
</div>
)
}
export default StatsBeneficiary;