diff --git a/src/assets/scss/components/formBuilder.scss b/src/assets/scss/components/formBuilder.scss index 3ed9564..00db384 100644 --- a/src/assets/scss/components/formBuilder.scss +++ b/src/assets/scss/components/formBuilder.scss @@ -57,6 +57,10 @@ cursor: pointer; } + /*&.selected { + border-color: var(--menuitem-active-background); + }*/ + .meta { display: flex; flex-direction: column; diff --git a/src/assets/scss/components/statsBigBadges.scss b/src/assets/scss/components/statsBigBadges.scss index 8bde805..6c08cb7 100644 --- a/src/assets/scss/components/statsBigBadges.scss +++ b/src/assets/scss/components/statsBigBadges.scss @@ -112,6 +112,50 @@ } } +.statsBigBadges__gridItemDoubleStatsBeneficiary { + display: flex; + flex-direction: column; + padding: 16px; + border-radius: 6px; + border: 1px solid #858585; + background: #cecece; + align-items: center; + gap: 32px; + + span { + color: #FFF; + font-size: 18px; + font-style: normal; + font-weight: 600; + line-height: normal; + text-align: center; + } + + > span:first-of-type { + min-height: 50px; + } + + &:nth-of-type(1) { + border: 1px solid var(--yellow-500); + background: var(--card-full-background-color-2); + } + + &:nth-of-type(2) { + border: 1px solid var(--yellow-500); + background: var(--card-full-background-color-4); + } + + &:nth-of-type(3) { + border: 1px solid var(--yellow-500); + background: var(--card-full-background-color-3); + } + + &:nth-of-type(4) { + border: 1px solid var(--yellow-500); + background: var(--card-full-background-color-1); + } +} + .statsBigBadges__grid { .statsBigBadges__gridItem { &:nth-of-type(1) { diff --git a/src/components/ChartDomandePerStato/index.js b/src/components/ChartDomandePerStato/index.js new file mode 100644 index 0000000..efbc744 --- /dev/null +++ b/src/components/ChartDomandePerStato/index.js @@ -0,0 +1,79 @@ +import React, { useEffect, useState } from 'react'; +import { __ } from '@wordpress/i18n'; +import { Tooltip, ResponsiveContainer, Cell, Pie, PieChart } from 'recharts'; +import { isEmpty } from 'ramda'; +import getBandoLabel from '../../helpers/getBandoLabel'; + +// components + + +const ChartDomandePerStato = ({ title, data = [] }) => { + const COLORS = ['#0088FE', '#00C49F', '#FFBB28', '#FF8042', '#8884d8', '#82ca9d']; + const [chartData, setChartData] = useState({}); + + const CustomTooltip = ({ active, payload }) => { + if (active && payload && payload.length) { + return ( +
+

{getBandoLabel(payload[0].name)}

+

+ {payload[0].name}: {payload[0].value} +

+
+ ); + } + return null; + }; + + useEffect(() => { + const grouped = data.reduce((acc, cur) => { + if (cur.status === 'APPROVED') { + acc.approved.value = cur.numberOfApplication; + } else if (cur.status === 'REJECTED') { + acc.rejected.value = cur.numberOfApplication; + } else { + acc.inProgress.value += cur.numberOfApplication; + } + return acc; + }, { + inProgress: {value: 0, label: 'In corso'}, + approved: {value: 0, label: 'Approvato'}, + rejected: {value: 0, label: 'Respinto'} + }); + setChartData(grouped) + }, [data]); + + console.log('chartData', chartData) + + return (
+ {title ? {title} : null} + {chartData && !isEmpty(chartData) + ?
+ + + `${(percent * 100).toFixed(0)}%`} + outerRadius={120} + fill="#8884d8" + dataKey="value" + nameKey="label" + > + {Object.values(chartData).map((entry, index) => ( + + ))} + + } /> + + +
: null} +
) +} + +export default ChartDomandePerStato; \ No newline at end of file diff --git a/src/layouts/DefaultLayout/components/AppSidebar/index.js b/src/layouts/DefaultLayout/components/AppSidebar/index.js index aa25929..c449022 100644 --- a/src/layouts/DefaultLayout/components/AppSidebar/index.js +++ b/src/layouts/DefaultLayout/components/AppSidebar/index.js @@ -132,11 +132,11 @@ const AppSidebar = () => { enable: false }, { - label: __('Report e Analisi', 'gepafin'), + label: __('Statistiche', 'gepafin'), icon: 'pi pi-chart-bar', - //href: '/stats', + href: '/stats', id: 15, - enable: false + enable: intersection(permissions, ['APPLY_CALLS']).length }, { label: __('Log di Sistema', 'gepafin'), diff --git a/src/pages/BandoEdit/components/BandoEditFormStep3/index.js b/src/pages/BandoEdit/components/BandoEditFormStep3/index.js index 4f7fd1e..b67b93f 100644 --- a/src/pages/BandoEdit/components/BandoEditFormStep3/index.js +++ b/src/pages/BandoEdit/components/BandoEditFormStep3/index.js @@ -116,6 +116,8 @@ const BandoEditFormStep3 = forwardRef(function () { return () => { storeSet.main.formId(0); storeSet.main.formElements([]); + storeSet.main.activeElement(''); + storeSet.main.selectedElement(''); } }, []); diff --git a/src/pages/BandoFormsEdit/components/BuilderElement/index.js b/src/pages/BandoFormsEdit/components/BuilderElement/index.js index 78353bc..d0acc67 100644 --- a/src/pages/BandoFormsEdit/components/BuilderElement/index.js +++ b/src/pages/BandoFormsEdit/components/BuilderElement/index.js @@ -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 }) => { ?
{__('lascia qui', 'gepafin')}
- :
+ :
@@ -174,9 +183,9 @@ const BuilderElement = ({ id, name, label, index, bandoStatus }) => {
-
) diff --git a/src/pages/BandoFormsEdit/index.js b/src/pages/BandoFormsEdit/index.js index 9fdfbe9..e739c89 100644 --- a/src/pages/BandoFormsEdit/index.js +++ b/src/pages/BandoFormsEdit/index.js @@ -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]); diff --git a/src/pages/StatsBeneficiary/components/PreInstructorSoccorsiTable/index.js b/src/pages/StatsBeneficiary/components/PreInstructorSoccorsiTable/index.js new file mode 100644 index 0000000..b74acd6 --- /dev/null +++ b/src/pages/StatsBeneficiary/components/PreInstructorSoccorsiTable/index.js @@ -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 ( +
+
+ ); + }; + + const dateStartBodyTemplate = (rowData) => { + return formatDate(rowData.startDate); + }; + + const dateExpirationBodyTemplate = (rowData) => { + return rowData.evaluationEndDate ? formatDate(rowData.evaluationEndDate) : ''; + }; + + const dateFilterTemplate = (options) => { + return options.filterCallback(e.value, options.index)} dateFormat="mm/dd/yy" placeholder="mm/dd/yyyy" mask="99/99/9999" />; + }; + + const statusBodyTemplate = (rowData) => { + return ; + }; + + const statusFilterTemplate = (options) => { + return options.filterCallback(e.value, options.index)} itemTemplate={statusItemTemplate} placeholder={translationStrings.selectOneLabel} className="p-column-filter" showClear />; + }; + + const statusItemTemplate = (option) => { + return ; + }; + + const actionsBodyTemplate = (rowData) => { + return +