- updated bando form;

This commit is contained in:
Vitalii Kiiko
2024-10-21 17:29:25 +02:00
parent ddb09abd83
commit 3b495cfdcc
8 changed files with 195 additions and 99 deletions

View File

@@ -1,18 +1,63 @@
import { useEffect } from 'react';
import { __ } from '@wordpress/i18n';
import equal from 'fast-deep-equal';
//import { diff } from 'deep-object-diff';
import { diff } from 'deep-object-diff';
import { klona } from 'klona';
import { TZDate } from '@date-fns/tz';
import { wrap } from 'object-path-immutable';
import { is, isNil } from 'ramda';
// store
import { storeGet } from '../../store';
const UnsavedChangesDetector = ({ getValuesFn }) => {
const warnIfUnsavedChanges = (event) => {
const formData = getValuesFn();
let formData = klona(getValuesFn());
formData.dates = [];
if (formData.startDate) {
let starDate;
if (is(String, formData.startDate)) {
starDate = formData.startDate;
} else {
const tzAwareDate = new TZDate(formData.startDate, 'Europe/Berlin');
starDate = tzAwareDate.toISOString().substring(0, 19);
}
formData = wrap(formData).insert(['dates'], starDate, 0).value();
}
if (formData.endDate) {
let endDate;
if (is(String, formData.endDate)) {
endDate = formData.endDate;
} else {
const tzAwareDate = new TZDate(formData.endDate, 'Europe/Berlin');
endDate = tzAwareDate.toISOString().substring(0, 19);
}
formData = wrap(formData).insert(['dates'], endDate, 1).value();
}
if (!isNil(formData.startTime)) {
if (!is(String, formData.startTime)) {
const tzAwareDate = new TZDate(formData.startTime, 'Europe/Berlin');
formData.startTime = tzAwareDate.toISOString().substring(11, 16);
}
}
if (!isNil(formData.endTime)) {
if (!is(String, formData.endTime)) {
const tzAwareDate = new TZDate(formData.endTime, 'Europe/Berlin');
formData.endTime = tzAwareDate.toISOString().substring(11, 16);
}
}
const initial = storeGet.main.formInitialData();
const isEqual = equal(initial, formData);
// TODO
//console.log('isEqual', isEqual, initial, formData, diff(initial, formData))
/*console.log('isEqual', isEqual,
initial, formData,
diff(initial, formData))*/
if (!isEqual) {
event.returnValue = __('You have unsaved changes. If you proceed, they will be lost.', 'gepafin');
}

View File

@@ -1,20 +1,13 @@
import React from 'react';
import { range } from 'ramda';
//import { __ } from '@wordpress/i18n';
import { __ } from '@wordpress/i18n';
// components
import { Steps } from 'primereact/steps';
const ApplicationSteps = ({ totalSteps = 0, activeStepIndex }) => {
const rangeArr = range(1, totalSteps + 1);
const items = rangeArr.map(() => ({ label: 'Passo' }));
/*// TODO update to using Steps after primereact is updated
return(
0 !== totalSteps
? <span>{__('Passo', 'gepafin')}: {activeStepIndex + 1}</span>
: null
)*/
const items = rangeArr.map(() => ({ label: __('Passo', 'gepafin') }));
return(
0 !== totalSteps

View File

@@ -5,6 +5,7 @@ import { useForm } from 'react-hook-form';
import { isEmpty, isNil, is } from 'ramda';
import { klona } from 'klona';
import { TZDate } from '@date-fns/tz';
import { wrap } from 'object-path-immutable';
// components
import FormField from '../../../../components/FormField';
@@ -48,38 +49,36 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors, st
const values = getValues();
const toast = useRef(null);
const onSubmit = (formData) => {
/*if (!isNil(formData.dates) && formData.dates.length) {
formData.dates = formData.dates.map(v => {
if (is(String, v)) {
return v;
} else {
const tzAwareDate = new TZDate(v, 'Europe/Berlin');
return tzAwareDate.toISOString().substring(0, 19);
}
});
}
storeSet.main.setAsyncRequest();
if (!formData.id) {
BandoService.createBando(formData, createCallback, errCreateCallback);
} else {
BandoService.updateBandoStep1(formData.id, formData, createCallback, errCreateCallback);
}*/
};
const onSubmit = () => {};
const onSaveDraft = () => {
trigger();
const formData = getValues();
if (!isNil(formData.dates) && formData.dates.length) {
formData.dates = formData.dates.map(v => {
if (is(String, v)) {
return v;
let formData = klona(getValues());
formData.dates = [];
if (formData.startDate) {
let starDate;
if (is(String, formData.startDate)) {
starDate = formData.startDate;
} else {
const tzAwareDate = new TZDate(v, 'Europe/Berlin');
return tzAwareDate.toISOString().substring(0, 19);
const tzAwareDate = new TZDate(formData.startDate, 'Europe/Berlin');
starDate = tzAwareDate.toISOString().substring(0, 19);
}
});
formData = wrap(formData).insert(['dates'], starDate, 0).value();
}
if (formData.endDate) {
let endDate;
if (is(String, formData.endDate)) {
endDate = formData.endDate;
} else {
const tzAwareDate = new TZDate(formData.endDate, 'Europe/Berlin');
endDate = tzAwareDate.toISOString().substring(0, 19);
}
formData = wrap(formData).insert(['dates'], endDate, 1).value();
}
if (!isNil(formData.startTime)) {
if (!is(String, formData.startTime)) {
@@ -95,6 +94,9 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors, st
}
}
delete formData.startDate;
delete formData.endDate;
storeSet.main.setAsyncRequest();
if (!formData.id) {
BandoService.createBando(formData, createCallback, errCreateCallback);
@@ -106,11 +108,13 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors, st
const createCallback = (data) => {
storeSet.main.unsetAsyncRequest();
if (data.status === 'SUCCESS') {
if (toast.current) {
toast.current.show({
severity: 'success',
summary: '',
detail: __('Il bando è stato aggiornato corretamente!', 'gepafin')
});
}
const values = getValues();
if (!values.id && data.data.id) {
navigate(`/bandi/${data.data.id}`);
@@ -121,6 +125,13 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors, st
}
const errCreateCallback = (data) => {
if (toast.current && data.message) {
toast.current.show({
severity: 'error',
summary: '',
detail: data.message
});
}
set404FromErrorResponse(data);
storeSet.main.unsetAsyncRequest();
}
@@ -193,7 +204,12 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors, st
useEffect(() => {
const newFormData = klona(formInitialData);
if (!isNil(formInitialData.dates) && formInitialData.dates.length) {
newFormData.dates = formInitialData.dates.map(v => is(String, v) ? new Date(v) : (v ? v : ''));
if (newFormData.dates[0]) {
newFormData.startDate = is(String, newFormData.dates[0]) ? new Date(newFormData.dates[0]) : (newFormData.dates[0] ? newFormData.dates[0] : '');
}
if (newFormData.dates[1]) {
newFormData.endDate = is(String, newFormData.dates[1]) ? new Date(newFormData.dates[1]) : (newFormData.dates[1] ? newFormData.dates[1] : '');
}
}
if (!isNil(formInitialData.startTime) && !isEmpty(formInitialData.startTime)) {
newFormData.startTime = is(String, formInitialData.startTime)
@@ -305,7 +321,7 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors, st
}}
/>
<FormField
{/*<FormField
type="datepickerrange"
disabled={shouldDisableField()}
fieldName="dates"
@@ -314,8 +330,31 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors, st
errors={errors}
defaultValue={values['dates']}
config={{ required: __('È obbligatorio', 'gepafin') }}
/>*/}
<div className="appForm__cols">
<FormField
type="datepicker"
disabled={shouldDisableField()}
fieldName="startDate"
label={__('Data di inizio', 'gepafin')}
control={control}
errors={errors}
defaultValue={values['startDate']}
config={{ required: __('È obbligatorio', 'gepafin') }}
/>
<FormField
type="datepicker"
disabled={shouldDisableField()}
fieldName="endDate"
label={__('Data di fine', 'gepafin')}
control={control}
errors={errors}
defaultValue={values['endDate']}
config={{ required: __('È obbligatorio', 'gepafin') }}
/>
</div>
<div className="appForm__cols">
<FormField
type="datepicker"

View File

@@ -22,6 +22,7 @@ import LookupdataService from '../../../../service/lookupdata-service';
import { storeSet } from '../../../../store';
import getTimeParsedFromString from '../../../../helpers/getTimeParsedFromString';
import { mimeTypes } from '../../../../configData';
import { wrap } from 'object-path-immutable';
const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors, status }, ref) {
const navigate = useNavigate();
@@ -46,41 +47,36 @@ const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors, st
//const step2Props = ['threshold', 'criteria', 'checkList', 'docs', 'images'];
const toast = useRef(null);
const onSubmit = (formData) => {
/*if (!isNil(formData.dates) && formData.dates.length) {
formData.dates = formData.dates.map(v => {
if (is(String, v)) {
return v;
} else {
const tzAwareDate = new TZDate(v, 'Europe/Berlin');
return tzAwareDate.toISOString().substring(0, 19);
}
});
}
const forSubmit = Object.keys(formData).reduce((acc, cur) => {
if (step2Props.includes(cur)) {
acc[cur] = formData[cur];
}
return acc;
}, {});
storeSet.main.setAsyncRequest();
BandoService.updateBandoStep2(formData.id, forSubmit, createCallback, errCreateCallback);*/
};
const onSubmit = () => {};
const onSaveDraft = () => {
trigger();
const formData = getValues();
if (!isNil(formData.dates) && formData.dates.length) {
formData.dates = formData.dates.map(v => {
if (is(String, v)) {
return v;
let formData = klona(getValues());
formData.dates = [];
if (formData.startDate) {
let starDate;
if (is(String, formData.startDate)) {
starDate = formData.startDate;
} else {
const tzAwareDate = new TZDate(v, 'Europe/Berlin');
return tzAwareDate.toISOString().substring(0, 19);
const tzAwareDate = new TZDate(formData.startDate, 'Europe/Berlin');
starDate = tzAwareDate.toISOString().substring(0, 19);
}
});
formData = wrap(formData).insert(['dates'], starDate, 0).value();
}
if (formData.endDate) {
let endDate;
if (is(String, formData.endDate)) {
endDate = formData.endDate;
} else {
const tzAwareDate = new TZDate(formData.endDate, 'Europe/Berlin');
endDate = tzAwareDate.toISOString().substring(0, 19);
}
formData = wrap(formData).insert(['dates'], endDate, 1).value();
}
if (!isNil(formData.startTime)) {
if (!is(String, formData.startTime)) {
@@ -88,7 +84,6 @@ const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors, st
formData.startTime = tzAwareDate.toISOString().substring(11, 16);
}
}
if (!isNil(formData.endTime)) {
if (!is(String, formData.endTime)) {
const tzAwareDate = new TZDate(formData.endTime, 'Europe/Berlin');
@@ -96,6 +91,9 @@ const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors, st
}
}
delete formData.startDate;
delete formData.endDate;
storeSet.main.setAsyncRequest();
BandoService.updateBandoStep2(formData.id, formData, createCallback, errCreateCallback);
}

View File

@@ -111,6 +111,13 @@ const BandoEdit = () => {
closable: false
})));
}
if (toast.current) {
toast.current.show(data.data.map((v, i) => ({
severity: 'error',
summary: '',
detail: v
})));
}
} else {
standardErrCallback(data);
}
@@ -153,7 +160,12 @@ const BandoEdit = () => {
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.dates[0]) {
data.data.startDate = is(String, data.data.dates[0]) ? new Date(data.data.dates[0]) : (data.data.dates[0] ? data.data.dates[0] : '');
}
if (data.data.dates[1]) {
data.data.endDate = is(String, data.data.dates[1]) ? new Date(data.data.dates[1]) : (data.data.dates[1] ? data.data.dates[1] : '');
}
}
if (data.data.status === 'READY_TO_PUBLISH') {

View File

@@ -1,9 +1,9 @@
import React, { useState, useEffect } from 'react';
import { __ } from '@wordpress/i18n';
import { is, uniq } from 'ramda';
import { uniq } from 'ramda';
// store
import { storeSet, storeGet } from '../../../../store';
import { useStore, storeSet } from '../../../../store';
// tools
import getBandoSeverity from '../../../../helpers/getBandoSeverity';
@@ -11,7 +11,7 @@ import getBandoLabel from '../../../../helpers/getBandoLabel';
import getDateFromISOstring from '../../../../helpers/getDateFromISOstring';
// api
import BandoService from '../../../../service/bando-service';
import UserService from '../../../../service/user-service';
// components
import { FilterMatchMode, FilterOperator } from 'primereact/api';
@@ -25,34 +25,32 @@ import { Button } from 'primereact/button';
import { Calendar } from 'primereact/calendar';
import { Tag } from 'primereact/tag';
import ProperBandoLabel from '../../../../components/ProperBandoLabel';
import { Link } from 'react-router-dom';
import UserService from '../../../../service/user-service';
const AllUsersTable = () => {
const [items, setItems] = useState(null);
const users = useStore().main.users();
const [filters, setFilters] = useState(null);
const [loading, setLoading] = useState(false);
const [globalFilterValue, setGlobalFilterValue] = useState('');
const [statuses, setStatuses] = useState([]);
useEffect(() => {
if (!loading) {
setLoading(true);
UserService.getUsers(getCallback, errGetCallbacks);
}
}, []);
const getCallback = (data) => {
if (data.status === 'SUCCESS') {
setItems(getFormattedData(data.data));
storeSet.main.users(getFormattedData(data.data));
setStatuses(uniq(data.data.map(o => o.status)))
initFilters();
}
setLoading(false);
}
const errGetCallbacks = (data) => {
const errGetCallbacks = () => {
setLoading(false);
storeSet.main.unsetAsyncRequest();
}
const getFormattedData = (data) => {
@@ -128,7 +126,8 @@ const AllUsersTable = () => {
const statusFilterTemplate = (options) => {
return <Dropdown value={options.value} options={statuses}
onChange={(e) => options.filterCallback(e.value, options.index)}
itemTemplate={statusItemTemplate} placeholder={__('Scegli uno', 'gepafin')} className="p-column-filter"
itemTemplate={statusItemTemplate} placeholder={__('Scegli uno', 'gepafin')}
className="p-column-filter"
showClear/>;
};
@@ -147,7 +146,7 @@ const AllUsersTable = () => {
return (
<div className="appPageSection__table">
<DataTable value={items} paginator showGridlines rows={10} loading={loading} dataKey="id"
<DataTable value={users} paginator showGridlines rows={10} loading={loading} dataKey="id"
filters={filters}
globalFilterFields={['name', 'status']}
header={header}

View File

@@ -4,7 +4,7 @@ import { isEmpty, isNil } from 'ramda';
import { klona } from 'klona';
// store
import { storeSet } from '../../store';
import { storeSet, storeGet } from '../../store';
// service
import UserService from '../../service/user-service';
@@ -76,9 +76,18 @@ const Users = () => {
const createUserCallback = (data) => {
if (data.status === 'SUCCESS') {
const users = storeGet.main.users();
storeSet.main.users([data.data.user, ...users]);
if (toast.current) {
toast.current.show({
severity: 'success',
summary: '',
detail: data.message
});
}
}
setLoading(false);
hideEditDialog();
}
const errCreateUserCallback = (data) => {

View File

@@ -8,6 +8,7 @@ const initialStore = {
token: '',
companies: [],
chosenCompanyId: 0,
users: [],
// bando form
formInitialData: {},
// form builder