Skip to content

Commit

Permalink
fix(monitoraggio-caricamenti): recupero intervento BE con autoselezio…
Browse files Browse the repository at this point in the history
…namento e modifiche comportamento chips 20241030
  • Loading branch information
federico-tocci-dxc committed Oct 30, 2024
1 parent 081ebd8 commit 5fcac89
Show file tree
Hide file tree
Showing 4 changed files with 101 additions and 58 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -106,12 +106,14 @@ const Monitoring: React.FC<MonitoringI> = ({
handleSearchAfterSingleChipRemoveClick();
}, 1);
};

const [removeChipCount, setRemoveChipCount] = useState(0);
useEffect(() => {
fetchData();
}, [removeChipCount]);

const handleSearchAfterSingleChipRemoveClick = () => {
const targetElement = document.querySelector('#applicaFiltri') as HTMLButtonElement;
if (targetElement) {
targetElement.click();
}
setRemoveChipCount(removeChipCount + 1);
};


Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { Select as SelectKit } from 'design-react-kit';
import clsx from 'clsx';
import { useDispatch, useSelector } from 'react-redux';
import { selectEntityFiltersOptions } from '../../../redux/features/administrativeArea/administrativeAreaSlice';
import { GetAllEntityValues, GetProgettiDropdownList, GetProgrammiDropdownList } from '../../../redux/features/administrativeArea/administrativeAreaThunk';
import { GetAllEntityValues, GetInterventiDropdownList, GetProgettiDropdownList, GetProgrammiDropdownList } from '../../../redux/features/administrativeArea/administrativeAreaThunk';
import './monitoring.scss';

export type OptionType = {
Expand Down Expand Up @@ -64,7 +64,6 @@ export const initialFormValues = {
const MonitoringSearchFilters: React.FC<MonitoringSearchFilterI> = ({ formValues, setFormValues, onSearch, chips, setChips, isDisabled, setIsDisabled }) => {
const [isDateValid, setIsDateValid] = useState<{ dataInizio?: boolean; dataFine?: boolean }>({ dataInizio: true, dataFine: true });
const [shouldSearch, setShouldSearch] = useState(false);
const isCrossButtonClickedRef = useRef(false);
const dispatch = useDispatch();
const dropdownFilterOptions = useSelector(selectEntityFiltersOptions);

Expand All @@ -80,6 +79,7 @@ const MonitoringSearchFilters: React.FC<MonitoringSearchFilterI> = ({ formValues
dispatch(retrieveProgramma);
dispatch(retrieveProgetto);
dispatch(retrieveEnte);
dispatch(retrieveIntervento);
}, [dispatch]);


Expand All @@ -105,6 +105,24 @@ const MonitoringSearchFilters: React.FC<MonitoringSearchFilterI> = ({ formValues

const [enteMultiOptions, setEnteMultiOptions] = useState<OptionType[]>([]);

const retrieveIntervento = async (idEnte?: string, idProgramma?: string) => {
const payload = {
filtroRequest: {
...(idEnte != '' && { idEnte: idEnte }),
...(idProgramma != '' && { filtroIdsProgrammi: [idProgramma] }),
}
}
try {
const response = await GetInterventiDropdownList(payload)(dispatch);
const mappedInterventoTypes = response.map((intervento: any) => ({
value: intervento,
label: intervento,
}));
setInterventoTypes(mappedInterventoTypes);
} catch (error) {
console.error("Network error:", error);
}
}

const retrieveProgramma = async (policy?: string, idEnte?: string) => {
const payload = {
Expand Down Expand Up @@ -230,9 +248,9 @@ const MonitoringSearchFilters: React.FC<MonitoringSearchFilterI> = ({ formValues
setFormValues(() => ({ ...formValues, [name?.name]: option }));
setIsDisabled(false);
if (name?.name === 'intervento') {
retrieveProgramma(option.value, formValues.ente.value !== '' ? formValues.ente.value : undefined);
retrieveProgetto(option.value, 0, formValues.ente.value !== '' ? formValues.ente.value : undefined);
setFormValues(() => ({ ...formValues, programma: { value: '' }, progetto: { value: '' }, intervento: option }));
retrieveProgramma(option.value, formValues.ente.value !== '' ? formValues.ente.value : undefined);
retrieveProgetto(option.value, Number(formValues.programma.value), formValues.ente.value !== '' ? formValues.ente.value : undefined);
}
if (name?.name === 'programma') {
setFormValues(() => ({ ...formValues, progetto: { value: '', label: 'Seleziona' }, programma: option, intervento: { value: option.policy === RFD ? "RFD" : "SCD", label: option.policy === RFD ? "RFD" : "SCD" } }));
Expand All @@ -252,61 +270,63 @@ const MonitoringSearchFilters: React.FC<MonitoringSearchFilterI> = ({ formValues
}
if (name?.name === 'ente') {
retrieveProgramma(formValues.intervento.value, option.value);
retrieveProgetto(formValues.intervento.value, Number(formValues.programma.value), option.value);
retrieveProgetto(formValues.intervento.value, Number(formValues.programma.value), option.value);
retrieveIntervento(option.value, formValues.programma.value);
}
};

const getPolicyProgrammi = () => {
const policiesProgrammi = Array.from(new Set(programTypes?.map((program: OptionType) => program.policy)));
const policiesProgetti = Array.from(new Set(projectTypes?.map((project: OptionType) => project.policy)));
let interventi = policiesProgrammi.map((policy) => ({
value: policy === "Rete dei servizi di Facilitazione Digitale" ? "RFD" : policy === "Servizio Civile Digitale" ? "SCD" : policy || '',
label: policy === "Rete dei servizi di Facilitazione Digitale" ? "RFD" : policy === "Servizio Civile Digitale" ? "SCD" : policy || '',
}));
interventi = interventi.concat(
policiesProgetti.map((policy) => ({
value: policy || '',
label: policy || '',
}))
);

// Remove duplicates
interventi = interventi.filter((intervento, index, self) =>
index === self.findIndex((i) => i.value === intervento.value)
);
setInterventoTypes(interventi);
};

useEffect(() => {
getPolicyProgrammi();
}, [programTypes, projectTypes]);
// const getPolicyProgrammi = () => {
// const policiesProgrammi = Array.from(new Set(programTypes?.map((program: OptionType) => program.policy)));
// const policiesProgetti = Array.from(new Set(projectTypes?.map((project: OptionType) => project.policy)));
// let interventi = policiesProgrammi.map((policy) => ({
// value: policy === "Rete dei servizi di Facilitazione Digitale" ? "RFD" : policy === "Servizio Civile Digitale" ? "SCD" : policy || '',
// label: policy === "Rete dei servizi di Facilitazione Digitale" ? "RFD" : policy === "Servizio Civile Digitale" ? "SCD" : policy || '',
// }));
// interventi = interventi.concat(
// policiesProgetti.map((policy) => ({
// value: policy || '',
// label: policy || '',
// }))
// );

// // Remove duplicates
// interventi = interventi.filter((intervento, index, self) =>
// index === self.findIndex((i) => i.value === intervento.value)
// );
// setInterventoTypes(interventi);
// };

// useEffect(() => {
// getPolicyProgrammi();
// },[programTypes, projectTypes]);

useEffect(() => {
retrieveEnte();
}, [formValues.intervento, formValues.programma, formValues.progetto]);

// useEffect(() => {
// const updatedFormValues = { ...formValues };

// if (isCrossButtonClickedRef.current) {
// isCrossButtonClickedRef.current = false;
// return;
// }

// if(isFiltersChanged){
// if (programTypes?.length === 1) {
// updatedFormValues.programma = programTypes[0];
// }
// if (projectTypes?.length === 1) {
// updatedFormValues.progetto = projectTypes[0];
// }
// if (interventoTypes?.length === 1) {
// updatedFormValues.intervento = interventoTypes[0];
// }
// }

// setFormValues(updatedFormValues);
// }, [programTypes, projectTypes, interventoTypes]);
useEffect(() => {
const updatedFormValues = { ...formValues };
if (programTypes?.length === 1) {
updatedFormValues.programma = programTypes[0];
}
setFormValues(updatedFormValues);
}, [programTypes]);

useEffect(() => {
const updatedFormValues = { ...formValues };
if (projectTypes?.length === 1) {
updatedFormValues.progetto = projectTypes[0];
}
setFormValues(updatedFormValues);
}, [projectTypes]);

useEffect(() => {
const updatedFormValues = { ...formValues };
if (interventoTypes?.length === 1) {
updatedFormValues.intervento = interventoTypes[0];
}
setFormValues(updatedFormValues);
}, [interventoTypes]);

const handleClearForm = () => {
setFormValues(initialFormValues);
Expand All @@ -316,6 +336,7 @@ const MonitoringSearchFilters: React.FC<MonitoringSearchFilterI> = ({ formValues
dispatch(retrieveProgramma);
dispatch(retrieveProgetto);
dispatch(retrieveEnte);
dispatch(retrieveIntervento)
setShouldSearch(true);
};

Expand All @@ -329,13 +350,11 @@ const MonitoringSearchFilters: React.FC<MonitoringSearchFilterI> = ({ formValues
const [enteInputValue, setEnteInputValue] = useState('');

const handleCrossButtonClick = () => {
if (formValues.ente.value !== '') {
setFormValues(() => ({ ...formValues, ente: { value: '', label: 'Inizia a scrivere il nome dell\'ente' }, intervento: { value: '', label: 'Seleziona' }, programma: { value: '', label: 'Seleziona' }, progetto: { value: '', label: 'Seleziona' } }));
setEnteInputValue('');
dispatch(retrieveProgramma);
dispatch(retrieveProgetto);
isCrossButtonClickedRef.current = true;
}
dispatch(retrieveIntervento);
};

const renderSelect = (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -165,6 +165,27 @@ export const GetEntityValues =
}
};

export const GetInterventiDropdownList =
(payload?: any) => async (dispatch: Dispatch) => {
try {
//dispatch(showLoader());
dispatch({ ...GetValuesAction, payload });
const endpoint = `/progetto/policies/programmi/dropdown`;
const res = await API.post(endpoint, payload, {
headers: {
'Content-Type': 'application/json',
},
});
if (res?.data) {
return res.data;
}
} catch (error) {
console.log('GetInterventiDropdownList error', error);
} finally {
//dispatch(hideLoader());
}
};


export const GetProgrammiDropdownList =
(payload?: any) => async (dispatch: Dispatch) => {
Expand Down
1 change: 1 addition & 0 deletions fe-piattaforma/src/styles/main.scss
Original file line number Diff line number Diff line change
Expand Up @@ -68,5 +68,6 @@ select:-webkit-autofill:focus {
input[type="date"]::-webkit-calendar-picker-indicator {
content: url('../../public/assets/img/it-calendar-primary.png');
background: none;
margin-right: -13px;
transform: scale(1.2);
}

0 comments on commit 5fcac89

Please sign in to comment.