BFLOWS/bflows-bandi-fe
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- updated version;

Browse Source
This commit is contained in:
Vitalii Kiiko
2024-09-05 17:15:57 +02:00
parent d2a28bea1b
commit 4054745695
33 changed files with 516 additions and 296 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/assets/scss/components/appForm.scss
View File

@@ -88,7 +88,9 @@
display: flex;
flex-direction: column;
gap: 14px;
}
> div:not(.appForm__field) {
label {
font-weight: 400;
}

19
src/assets/scss/components/flowBuilder.scss Normal file
View File

@@ -0,0 +1,19 @@
.flowBuilder__wrapper {
width: 100%;
height: 500px;
}
.nodeInitialForm {
padding: 10px 20px;
background-color: white;
border: 1px solid black;
border-radius: 4px;
display: flex;
flex-direction: column;
gap: 10px;
label {
font-size: 13px;
text-align: center;
}
}

2
src/assets/scss/components/layout.scss
View File

@@ -10,7 +10,7 @@ body {
flex-direction: column;
flex-grow: 1;
margin: 0;
font-family: 'Montserrat';
font-family: "Montserrat", sans-serif;
p, span:not(.p-button-label, .p-button-icon, .p-badge), input, label:not(.p-error), textarea, a, li, h1, h2, h3, h4, h5, h6, div, th, td {
color: var(--global-textColor);

4
src/assets/scss/components/reactFlow.scss
View File

@@ -1,4 +0,0 @@
.reactFlow__wrapper {
width: 100%;
height: 500px;
}

4
src/assets/scss/components/statsBigBadges.scss
View File

@@ -7,6 +7,10 @@
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
width: 100%;
&.grid-3 {
grid-template-columns: repeat(3, 1fr);
}
}
.statsBigBadges__grid .statsBigBadges__gridItem span {

2
src/assets/scss/theme.scss
View File

@@ -36,4 +36,4 @@
@import "./components/formBuilder.scss";
@import "./components/misc.scss";
@import "./components/login.scss";
@import "./components/reactFlow.scss";
@import "./components/flowBuilder.scss";

55
src/components/FlowBuilder/components/NodeInitialForm/index.js Normal file
View File

@@ -0,0 +1,55 @@
import React, { useEffect, useState } from 'react';
import { Handle, Position } from '@xyflow/react';
import { isEmpty, head } from 'ramda';
// store
import { storeGet, storeSet } from '../../../../store';
const NodeInitialForm = ({ data: { id, label = '' } }) => {
const [options, setOptions] = useState([]);
const [value, setValue] = useState('');
const onChangeFn = (e) => {
const { value } = e.target;
const data = {
formId: String(id),
chosenField: value,
chosenValue: ''
}
setValue(value);
storeSet.main.addFlowData(data);
}
useEffect(() => {
const forms = storeGet.main.flowForms();
const form = head(forms.filter(o => String(o.id) === String(id)))
const relevantFields = form
? form.content
.filter(o => ['radio', 'select'].includes(o.name))
.map(o => ({ name: o.id, label: o.label }))
: [];
setOptions(relevantFields);
}, [id]);
return (
<div className="nodeInitialForm">
<label>
{label}
</label>
{options && !isEmpty(options)
? <select onChange={onChangeFn} value={value}>
<option value="">Choose form</option>
{options.map(o => <option key={o.name} value={o.name}>
{o.label}
</option>)}
</select> : null}
<Handle
type="source"
position={Position.Bottom}
isConnectable={true}
/>
</div>
);
}
export default NodeInitialForm;

71
src/components/FlowBuilder/components/NodeIntermediateForm/index.js Normal file
View File

@@ -0,0 +1,71 @@
import React, { useEffect, useState } from 'react';
import { Handle, Position } from '@xyflow/react';
import { head, isEmpty } from 'ramda';
import { useStore, storeSet, storeGet } from '../../../../store';
const NodeIntermediateForm = ({ data: { id, label = '' } }) => {
const flowEdges = useStore().main.flowEdges();
const flowData = useStore().main.flowData();
const [options, setOptions] = useState([]);
const [value, setValue] = useState('');
const onChangeFn = (e) => {
const { value } = e.target;
const data = {
formId: String(id),
chosenField: '',
chosenValue: value
}
setValue(value);
storeSet.main.addFlowData(data);
}
useEffect(() => {
const edge = head(flowEdges.filter(o => o.target === String(id)));
if (edge) {
const sourceForm = edge.source;
const sourceFormData = head(flowData.filter(o => o.formId === sourceForm));
const flowForms = storeGet.main.flowForms();
const form = head(flowForms.filter(o => String(o.id) === String(sourceForm)));
if (form && sourceFormData) {
const { chosenField } = sourceFormData;
const field = head(form.content.filter(o => o.id === chosenField));
if (field) {
const options = head(field.settings.filter(o => o.name === 'options'));
if (options) {
setOptions(options.value);
}
}
}
}
}, [flowEdges, flowData]);
return (
<div className="nodeInitialForm">
<Handle
type="target"
position={Position.Top}
isConnectable={true}
/>
<label>
{label}
</label>
{options && !isEmpty(options)
? <select onChange={onChangeFn} value={value}>
<option value="">Choose form</option>
{options.map(o => <option key={o.name} value={o.name}>
{o.label}
</option>)}
</select> : null}
<Handle
type="source"
position={Position.Bottom}
isConnectable={true}
/>
</div>
);
}
export default NodeIntermediateForm;

41
src/components/FlowBuilder/index.js
View File

@@ -1,19 +1,26 @@
import React, { useEffect, useState } from 'react';
import {
ReactFlow,
Background,
useNodesState,
useEdgesState,
addEdge,
getIncomers,
getOutgoers,
getConnectedEdges,
Background
} from '@xyflow/react';
import { isEmpty } from 'ramda';
import '@xyflow/react/dist/style.css';
const FlowBuilder = ({ initialForm = 0, finalForm = 0, forms = [], updateFn }) => {
// store
import { useStore, storeSet } from '../../store';
// nodes
import NodeInitialForm from './components/NodeInitialForm';
import NodeIntermediateForm from './components/NodeIntermediateForm';
const nodeTypes = {
initialForm: NodeInitialForm,
intermediateForm: NodeIntermediateForm
};
const FlowBuilder = ({ initialForm = 0, finalForm = 0 }) => {
const forms = useStore().main.flowForms();
const [nodes, setNodes] = useState([]);
const [edges, setEdges] = useState([]);
@@ -35,22 +42,23 @@ const FlowBuilder = ({ initialForm = 0, finalForm = 0, forms = [], updateFn }) =
if (o.id === initialForm) {
obj = {
id: String(o.id),
type: 'input',
data: { label: o.label },
type: 'initialForm',
data: { label: o.label, id: o.id },
position: { x: 0, y: 0 },
}
} else if (o.id === finalForm) {
obj = {
id: String(o.id),
type: 'output',
data: { label: o.label },
data: { label: o.label, id: o.id },
position: { x: 0, y: 300 },
}
} else {
const x = coordinates.splice(0, 1);
obj = {
id: String(o.id),
data: { label: o.label },
type: 'intermediateForm',
data: { label: o.label, id: o.id },
position: { x, y: 150 },
}
}
@@ -60,14 +68,14 @@ const FlowBuilder = ({ initialForm = 0, finalForm = 0, forms = [], updateFn }) =
let edges = [];
forms.map(o => {
if (o.id !== initialForm && o.id !== finalForm) {
edges.push({ id: `${initialForm}->${o.id}`, source: String(initialForm), target: String(o.id) });
edges.push({ id: `${o.id}->${finalForm}`, source: String(o.id), target: String(finalForm) });
edges.push({ id: `${initialForm}->${o.id}`, source: String(initialForm), target: String(o.id), type: 'smoothstep' });
edges.push({ id: `${o.id}->${finalForm}`, source: String(o.id), target: String(finalForm), type: 'smoothstep' });
}
});
setNodes(initialNodes);
setEdges(edges);
updateFn(edges);
storeSet.main.flowEdges(edges);
} else {
setNodes([]);
setEdges([]);
@@ -76,13 +84,14 @@ const FlowBuilder = ({ initialForm = 0, finalForm = 0, forms = [], updateFn }) =
return (
!isEmpty(nodes) && !isEmpty(edges)
? <div className="reactFlow__wrapper">
? <div className="flowBuilder__wrapper">
<ReactFlow
nodes={nodes}
edges={edges}
nodesDraggable={false}
nodesConnectable={false}
fitView
nodeTypes={nodeTypes}
attributionPosition="top-right"
>
<Background variant="dots" gap={12} size={1}/>

38
src/components/FormFieldRepeaterFaq/index.js
View File

@@ -27,6 +27,7 @@ const FormFieldRepeaterFaq = ({
const [stateOptionsData, setStateOptionsData] = useState([]);
const [question, setQuestion] = useState('');
const [answer, setAnswer] = useState('');
const [title, setTitle] = useState('');
const [editDataIndex, setEditDataIndex] = useState(null);
const [isVisibleEditDialog, setIsVisibleEditDialog] = useState(false);
@@ -37,14 +38,13 @@ const FormFieldRepeaterFaq = ({
const selectItem = (e) => {
const targetedOption = head(stateOptionsData.filter(o => o.value === e.value));
console.log('selected:', e, stateOptionsData, targetedOption)
if (targetedOption) {
setStateFieldData([...stateFieldData, targetedOption]);
setStateFieldData([...stateFieldData, {...targetedOption, isVisible: true}]);
}
}
const addNewItem = () => {
const newItem = { id: null, lookUpDataId: null, title: '', value: '', isVisible: true };
const newItem = { id: null, lookUpDataId: null, title: '', value: '', response: '', isVisible: true };
setStateFieldData([...stateFieldData, newItem]);
}
@@ -76,6 +76,8 @@ const FormFieldRepeaterFaq = ({
const onChangeEditItem = (value, key) => {
if (key === 'title') {
setTitle(value);
} else if (key === 'value') {
setQuestion(value);
} else {
setAnswer(value)
@@ -85,8 +87,9 @@ const FormFieldRepeaterFaq = ({
const saveEditDialog = () => {
const newData = stateFieldData.map((o, i) => {
if (i === editDataIndex) {
o.title = question;
o.value = answer;
o.title = title;
o.value = question;
o.response = answer;
return o
} else {
return o;
@@ -106,7 +109,10 @@ const FormFieldRepeaterFaq = ({
const footerEditDialog = () => {
return <div>
<Button type="button" label={__('Anulla', 'gepafin')} onClick={hideEditDialog} outlined/>
<Button type="button" label={__('Salva', 'gepafin')} onClick={saveEditDialog}/>
<Button
type="button"
disabled={isEmpty(title) || isEmpty(question) || isEmpty(answer)}
label={__('Salva', 'gepafin')} onClick={saveEditDialog}/>
</div>
}
@@ -151,6 +157,7 @@ const FormFieldRepeaterFaq = ({
<Dropdown onChange={(e) => selectItem(e)}
optionDisabled={(opt) => usedExistingValues().includes(opt.title)}
options={stateOptionsData}
placeholder={__('Scegli tra quelli pre-creati', 'gepafin')}
optionLabel="title"/>
</div>
<Accordion activeIndex={0}>
@@ -164,8 +171,13 @@ const FormFieldRepeaterFaq = ({
onLabel=""
offLabel=""
checked={o.isVisible}
onChange={(e) => setChecked(e, i)}/>
{o.title}
onChange={(e) => {
console.log('e', e);
e.preventDefault();
e.stopPropagation();
setChecked(e, i);
}}/>
{o.value}
</div>
<div className="appForm__faqTabItem">
<Button icon="pi pi-pencil" severity="success"
@@ -179,7 +191,7 @@ const FormFieldRepeaterFaq = ({
}
>
<p className="m-0">
{o.value}
{o.response}
</p>
</AccordionTab>)}
</Accordion>
@@ -192,11 +204,15 @@ const FormFieldRepeaterFaq = ({
<div className="appPage__spacer"></div>
<div className="appForm__field">
<label>{__('Titolo FAQ', 'gepafin')}</label>
<InputText value={question} onChange={(e) => onChangeEditItem(e.target.value, 'title')}/>
<InputText value={title} onChange={(e) => onChangeEditItem(e.target.value, 'title')}/>
</div>
<div className="appForm__field">
<label>{__('Domanda', 'gepafin')}</label>
<InputText value={question} onChange={(e) => onChangeEditItem(e.target.value, 'value')}/>
</div>
<div className="appForm__field">
<label>{__('Risposta', 'gepafin')}</label>
<InputTextarea value={answer} onChange={(e) => onChangeEditItem(e.target.value, 'value')}
<InputTextarea value={answer} onChange={(e) => onChangeEditItem(e.target.value, 'response')}
rows={5}
cols={30}/>
</div>

31
src/components/UnsavedChangesDetector/index.js
View File

@@ -1,36 +1,29 @@
import { useEffect, useState, useCallback } from 'react';
import { useEffect } from 'react';
import { __ } from '@wordpress/i18n';
import equal from 'fast-deep-equal';
// tools
// store
import { storeGet } from '../../store';
const UnsavedChangesDetector = ({ initialData, getValuesFn }) => {
const [initial, setInitial] = useState(initialData);
const warnIfUnsavedChanges = useCallback((event) => {
const updatedData = getValuesFn();
const isEqual = equal(initial, updatedData);
const UnsavedChangesDetector = ({ getValuesFn }) => {
const warnIfUnsavedChanges = (event) => {
const formData = getValuesFn();
const initial = storeGet.main.formInitialData();
const isEqual = equal(initial, formData);
console.log(initial, formData);
if (!isEqual) {
event.returnValue = __('You have unsaved changes. If you proceed, they will be lost.', 'gepafin');
}
return event.returnValue;
}, [initialData]);
};
useEffect(() => {
setInitial(initialData);
}, [initialData])
useEffect(() => {
window.addEventListener('beforeunload', (e) => {
warnIfUnsavedChanges(e);
});
window.addEventListener('beforeunload', warnIfUnsavedChanges);
return () => {
window.removeEventListener('beforeunload', (e) => {
warnIfUnsavedChanges(e);
});
window.removeEventListener('beforeunload', warnIfUnsavedChanges);
}
}, []);
}

15
src/layouts/DefaultLayout/components/AppSidebar/index.js
View File

@@ -10,6 +10,7 @@ import { NavLink } from 'react-router-dom';
const AppSidebar = () => {
const permissions = useStore().main.getPermissions();
const role = useStore().main.getRole();
const items = [
{
@@ -22,16 +23,24 @@ const AppSidebar = () => {
{
label: __('Gestione Bandi', 'gepafin'),
icon: 'pi pi-file',
href: '/bandi',
href: '/tenders',
id: 2,
enable: intersection(permissions, ['VIEW_CALLS', 'MANAGE_TENDERS']).length
enable: intersection(permissions, ['MANAGE_TENDERS']).length
},
{
label: __('Domande in lavorazione', 'gepafin'),
icon: 'pi pi-file',
href: '/bids',
id: 11,
enable: intersection(permissions, ['APPLY_CALLS']).length
},
{
label: __('Gestione Utenti', 'gepafin'),
icon: 'pi pi-users',
//href: '/utenti',
id: 3,
enable: intersection(permissions, ['VIEW_USERS', 'MANAGE_USERS']).length
enable: false
//enable: intersection(permissions, ['VIEW_USERS', 'MANAGE_USERS']).length
},
{
label: __('Configurazione', 'gepafin'),

2
src/pages/Bandi/components/AllBandiTable/index.js
View File

@@ -123,7 +123,7 @@ const AllBandiTable = () => {
};
const actionsBodyTemplate = (rowData) => {
return <Link to={`/bandi/${rowData.id}`}>
return <Link to={`/tenders/${rowData.id}`}>
<Button severity="info" label={__('Modifica', 'gepafin')} icon="pi pi-pencil" size="small" iconPos="right" />
</Link>
}

2
src/pages/Bandi/index.js
View File

@@ -10,7 +10,7 @@ const Bandi = () => {
const navigate = useNavigate();
const onGoToCreateNewBando = () => {
navigate('/bandi/new');
navigate('/tenders/new');
}
return(

19
src/pages/BandoEdit/components/BandoEditFormStep1/index.js
View File

@@ -39,7 +39,6 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors },
}, [formInitialData]), mode: 'onChange'
});
const values = getValues();
let minDateStart = new Date();
const onSubmit = (formData) => {
if (!isNil(formData.dates) && formData.dates.length) {
@@ -57,7 +56,7 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors },
if (data.status === 'SUCCESS') {
const values = getValues();
if (!values.id && data.data.id) {
navigate(`/bandi/${data.data.id}`);
navigate(`/tenders/${data.data.id}`);
} else {
setFormInitialData(data.data);
reset();
@@ -70,11 +69,11 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors },
}
const openPreview = () => {
navigate(`/bandi/${values.id}/preview`);
navigate(`/tenders/${values.id}/preview`);
}
const openPreviewEvaluation = () => {
navigate(`/bandi/${values.id}/preview-evaluation`);
navigate(`/tenders/${values.id}/preview-evaluation`);
}
const lookupdataCallback = (data) => {
@@ -125,6 +124,7 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors },
}, [errors, isValid]);
useEffect(() => {
storeSet.main.formInitialData(initialData);
setFormInitialData(initialData);
}, [initialData]);
@@ -142,13 +142,16 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors },
}
trigger().then(() => clearErrors());
//storeSet.main.setAsyncRequest();
LookupdataService.getItems(lookupdataCallback, errLookupdataCallback, [['type', ['AIMED_TO', 'FAQ']]])
LookupdataService.getItems(lookupdataCallback, errLookupdataCallback, [['type', ['AIMED_TO', 'FAQ']]]);
return () => {
storeSet.main.formInitialData({});
}
}, []);
return (
<form className="appForm" onSubmit={handleSubmit(onSubmit)}>
<UnsavedChangesDetector initialData={formInitialData} getValuesFn={getValues}/>
<UnsavedChangesDetector getValuesFn={getValues}/>
<FormField
type="switch"
fieldName="confidi"
@@ -236,7 +239,7 @@ const BandoEditFormStep1 = forwardRef(function ({ initialData, getFormErrors },
errors={errors}
defaultValue={values['dates']}
config={{ required: __('È obbligatorio', 'gepafin') }}
minDate={minDateStart}
/*minDate={minDateStart}*/
/>
<div className="appForm__twoCols">

14
src/pages/BandoEdit/components/BandoEditFormStep2/index.js
View File

@@ -13,6 +13,7 @@ import BandoEditFormActions from '../BandoEditFormActions';
import UnsavedChangesDetector from '../../../../components/UnsavedChangesDetector';
import BandoService from '../../../../service/bando-service';
import LookupdataService from '../../../../service/lookupdata-service';
import { storeSet } from '../../../../store';
const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors }, ref) {
const navigate = useNavigate();
@@ -94,11 +95,11 @@ const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors },
}
const openPreview = () => {
navigate('/bandi/preview/11');
navigate('/tenders/preview/11');
}
const openPreviewEvaluation = () => {
navigate('/bandi/preview-evaluation/11');
navigate('/tenders/preview-evaluation/11');
}
useImperativeHandle(
@@ -118,6 +119,7 @@ const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors },
}, [errors, isValid]);
useEffect(() => {
storeSet.main.formInitialData(initialData);
setFormInitialData(initialData);
}, [initialData]);
@@ -131,12 +133,16 @@ const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors },
useEffect(() => {
trigger().then(() => clearErrors());
LookupdataService.getItems(lookupdataCallback, errLookupdataCallback, [['type', ['CHECKLIST', 'EVALUATION_CRITERIA']]])
LookupdataService.getItems(lookupdataCallback, errLookupdataCallback, [['type', ['CHECKLIST', 'EVALUATION_CRITERIA']]]);
return () => {
storeSet.main.formInitialData({});
}
}, []);
return (
<form className="appForm" onSubmit={handleSubmit(onSubmit)}>
<UnsavedChangesDetector initialData={initialData} getValuesFn={getValues}/>
<UnsavedChangesDetector getValuesFn={getValues}/>
<FormFieldRepeaterCriteria
data={values}
setDataFn={setValue}

16
src/pages/BandoEdit/index.js
View File

@@ -52,7 +52,7 @@ const BandoEdit = () => {
bandoMsgs.current.show([
{
id: '98',
sticky: true, severity: 'error', summary: 'Error',
sticky: true, severity: 'error', summary: '',
detail: __('Potrai andare su altro step dopo risolvere errori della forma', 'gepafin'),
closable: true
}
@@ -77,7 +77,7 @@ const BandoEdit = () => {
bandoMsgs.current.show([
{
id: '98',
sticky: true, severity: 'error', summary: 'Error',
sticky: true, severity: 'error', summary: '',
detail: __('Potrai andare su altro step dopo risolvere errori della forma', 'gepafin'),
closable: true
}
@@ -92,11 +92,11 @@ const BandoEdit = () => {
}
const openBandoFormManagement = () => {
navigate(`/bandi/${id}/forms`);
navigate(`/tenders/${id}/forms`);
}
const openBandoFlowManagement = () => {
navigate(`/bandi/${id}/flow`);
navigate(`/tenders/${id}/flow`);
}
const validateBando = () => {
@@ -162,7 +162,7 @@ const BandoEdit = () => {
bandoMsgs.current.show([
{
id: '1',
sticky: true, severity: 'info', summary: 'Info',
sticky: true, severity: 'info', summary: '',
detail: __('Potrai pubblicare il tuo Bando.', 'gepafin'),
closable: false
}
@@ -173,7 +173,7 @@ const BandoEdit = () => {
bandoMsgs.current.show([
{
id: '1',
sticky: true, severity: 'info', summary: 'Info',
sticky: true, severity: 'info', summary: '',
detail: __('Potrai pubblicare il tuo Bando solo dopo aver completato tutti i campi obbligatori contrassegnati dagli asterischi.', 'gepafin'),
closable: false
}
@@ -195,7 +195,7 @@ const BandoEdit = () => {
if (bandoMsgs.current && data.message) {
bandoMsgs.current.show([
{
sticky: true, severity: 'error', summary: 'Error',
sticky: true, severity: 'error', summary: '',
detail: data.message,
closable: true
}
@@ -230,7 +230,7 @@ const BandoEdit = () => {
bandoMsgs.current.show([
{
id: '1',
sticky: true, severity: 'info', summary: 'Info',
sticky: true, severity: 'info', summary: '',
detail: __('Potrai pubblicare il tuo Bando solo dopo aver completato tutti i campi obbligatori contrassegnati dagli asterischi.', 'gepafin'),
closable: false
}

46
src/pages/BandoFlowEdit/index.js
View File

@@ -1,26 +1,30 @@
import React, { useEffect, useState } from 'react';
import React, { useEffect, useState, useCallback } from 'react';
import { __ } from '@wordpress/i18n';
import { useNavigate, useParams } from 'react-router-dom';
import { isEmpty } from 'ramda';
// store
import { storeSet, useStore } from '../../store';
// api
import FormsService from '../../service/forms-service';
// tools
import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
// components
import { Button } from 'primereact/button';
import { InputText } from 'primereact/inputtext';
import { Dropdown } from 'primereact/dropdown';
import FormsService from '../../service/forms-service';
import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
import FlowBuilder from '../../components/FlowBuilder';
const BandoFlowEdit = () => {
const { id } = useParams();
const navigate = useNavigate();
const [forms, setForms] = useState([]);
const flowData = useStore().main.flowData();
const flowEdges = useStore().main.flowEdges();
const [formOptions, setFormOptions] = useState([]);
const [initialForm, setInitialForm] = useState(0);
const [finalForm, setFinalForm] = useState(0);
const isAsyncRequest = useStore().main.isAsyncRequest();
const getBandoId = () => {
const parsed = parseInt(id)
@@ -29,21 +33,26 @@ const BandoFlowEdit = () => {
const goBack = () => {
const bandoId = getBandoId();
navigate(`/bandi/${bandoId}/forms`);
navigate(`/tenders/${bandoId}/forms`);
}
const shoudDisableSaving = useCallback(() => {
return isEmpty(flowData) || isEmpty(flowEdges) || isEmpty(initialForm) || isEmpty(finalForm);
}, [flowData, flowEdges]);
const doSave = () => {
console.log('doSave');
}
const updateEdges = (data) => {
console.log('doSave', {
initialForm,
finalForm,
flowData,
flowEdges
});
}
const getFormsCallback = (data) => {
if (data.status === 'SUCCESS') {
const formOptions = data.data.map(o => ({label: o.label, value: o.id}))
setForms(data.data);
storeSet.main.flowForms(data.data);
setFormOptions(formOptions);
}
storeSet.main.unsetAsyncRequest();
@@ -60,6 +69,14 @@ const BandoFlowEdit = () => {
FormsService.getFormsForCall(bandoId, getFormsCallback, errGetFormsCallback);
}, [id]);
useEffect(() => {
return () => {
storeSet.main.flowForms([]);
storeSet.main.flowData([]);
storeSet.main.flowEdges([]);
}
}, [])
return (
<div className="appPage">
<div className="appPage__pageHeader">
@@ -104,7 +121,7 @@ const BandoFlowEdit = () => {
<div className="appPage__spacer"></div>
<div className="appPageSection">
<FlowBuilder forms={forms} initialForm={initialForm} finalForm={finalForm} updateFn={updateEdges}/>
<FlowBuilder initialForm={initialForm} finalForm={finalForm}/>
</div>
<div className="appPage__spacer"></div>
@@ -117,6 +134,7 @@ const BandoFlowEdit = () => {
label={__('Indietro', 'gepafin')} icon="pi pi-arrow-left" iconPos="left"/>
<Button
onClick={doSave}
disabled={shoudDisableSaving()}
label={__('Salva', 'gepafin')} icon="pi pi-save" iconPos="right"/>
</div>
</div>

10
src/pages/BandoForms/index.js
View File

@@ -24,26 +24,26 @@ const BandoForms = () => {
const [forms, setForms] = useState([]);
const doCreateNewForm = () => {
navigate(`/bandi/${id}/forms/new`);
navigate(`/tenders/${id}/forms/new`);
}
const goToEditBando = () => {
navigate(`/bandi/${id}`);
navigate(`/tenders/${id}`);
}
const openBandoFlowManagement = () => {
navigate(`/bandi/${id}/flow`);
navigate(`/tenders/${id}/flow`);
}
const goToEditForm = () => {
if (selectedForm && selectedForm !== 0) {
navigate(`/bandi/${id}/forms/${selectedForm}`);
navigate(`/tenders/${id}/forms/${selectedForm}`);
}
}
const goToEditFormFromTemplate = () => {
console.log('goToEditFormFromTemplate', selectedTemplate)
//navigate(`/bandi/${id}`);
//navigate(`/tenders/${id}`);
}
const getFormsCallback = (data) => {

9
src/pages/BandoFormsEdit/index.js
View File

@@ -32,7 +32,7 @@ const BandoFormsEdit = () => {
const goBack = () => {
const bandoId = getBandoId();
navigate(`/bandi/${bandoId}/forms`);
navigate(`/tenders/${bandoId}/forms`);
}
const doSave = (shouldRedirect = false) => {
@@ -59,11 +59,11 @@ const BandoFormsEdit = () => {
const bandoId = getBandoId();
if (shouldRedirect) {
navigate(`/bandi/${bandoId}/forms/${data.data.id}/preview`);
navigate(`/tenders/${bandoId}/forms/${data.data.id}/preview`);
return;
}
if (data.data.id) {
navigate(`/bandi/${bandoId}/forms/${data.data.id}`);
navigate(`/tenders/${bandoId}/forms/${data.data.id}`);
}
}
}
@@ -102,7 +102,7 @@ const BandoFormsEdit = () => {
const formDeleteCallback = (data) => {
if (data.status === 'SUCCESS') {
const bandoId = getBandoId();
navigate(`/bandi/${bandoId}/forms`);
navigate(`/tenders/${bandoId}/forms`);
}
storeSet.main.unsetAsyncRequest();
}
@@ -199,7 +199,6 @@ const BandoFormsEdit = () => {
label={__('Indietro', 'gepafin')} icon="pi pi-arrow-left" iconPos="left"/>
<Button
onClick={doSave}
outlined
label={__('Salva progressi', 'gepafin')} icon="pi pi-save" iconPos="right"/>
<Button
outlined

2
src/pages/BandoFormsPreview/index.js
View File

@@ -38,7 +38,7 @@ const BandoFormsPreview = () => {
const bandoId = !isNaN(parsedId) ? parsedId : 0;
const parsedFormId = parseInt(formId)
const bandoFormId = !isNaN(parsedFormId) ? parsedFormId : 0;
navigate(`/bandi/${bandoId}/forms/${bandoFormId}`);
navigate(`/tenders/${bandoId}/forms/${bandoFormId}`);
}
const getFormCallback = (data) => {

4
src/pages/BandoView/index.js
View File

@@ -29,7 +29,7 @@ const BandoView = () => {
const bandoMsgs = useRef(null);
const closePreview = () => {
navigate(`/bandi/${id}`);
navigate(`/tenders/${id}`);
}
const scaricaBando = () => {
@@ -59,7 +59,7 @@ const BandoView = () => {
if (bandoMsgs.current && data.message) {
bandoMsgs.current.show([
{
sticky: true, severity: 'error', summary: 'Error',
sticky: true, severity: 'error', summary: '',
detail: data.message,
closable: true
}

44
src/pages/Bids/index.js Normal file
View File

@@ -0,0 +1,44 @@
import React from 'react';
import { __ } from '@wordpress/i18n';
import { useNavigate } from 'react-router-dom';
// components
import MyLatestSubmissionsTable from '../DashboardBenefeciario/components/MyLatestSubmissionsTable';
import { Button } from 'primereact/button';
const Bandi = () => {
const navigate = useNavigate();
return(
<div className="appPage">
<div className="appPage__pageHeader">
<h1>{__('Domande in Lavorazione', 'gepafin')}</h1>
</div>
<div className="appPage__spacer"></div>
<div className="appPageSection">
<MyLatestSubmissionsTable/>
</div>
<div className="appPage__spacer"></div>
<div className="appPageSection__hr">
<span>{__('Azioni rapide', 'gepafin')}</span>
</div>
<div className="appPageSection">
<div className="appPageSection__actions">
<Button
disabled={true}
outlined
onClick={() => {
}}
label={__('Contatta assistenza', 'gepafin')} icon="pi pi-envelope" iconPos="right"/>
</div>
</div>
</div>
)
}
export default Bandi;

6
src/pages/Dashboard/components/LatestBandiTable/index.js
View File

@@ -36,7 +36,7 @@ const LatestBandiTable = () => {
start_date: '2024-08-08T00:00:00+00:00',
end_date: '2024-08-30T00:00:00+00:00',
submissions: 24,
status: 'publish',
status: 'PUBLISH',
id: 11
},
{
@@ -44,7 +44,7 @@ const LatestBandiTable = () => {
start_date: '2024-07-28T00:00:00+00:00',
end_date: '2024-08-15T00:00:00+00:00',
submissions: 35,
status: 'publish',
status: 'PUBLISH',
id: 9
},
{
@@ -52,7 +52,7 @@ const LatestBandiTable = () => {
start_date: '2024-06-28T00:00:00+00:00',
end_date: '2024-06-15T00:00:00+00:00',
submissions: 2,
status: 'closed',
status: 'EXPIRED',
id: 2
}
]

15
src/pages/Dashboard/index.js
View File

@@ -11,7 +11,7 @@ const Dashboard = () => {
const navigate = useNavigate();
const onGoToCreateNewBando = () => {
navigate('/bandi/new');
navigate('/tenders/new');
}
const onGoToUsers = () => {
@@ -63,22 +63,25 @@ const Dashboard = () => {
<LatestBandiTable/>
</div>
<div className="appPage__spacer"></div>
{/*<div className="appPage__spacer"></div>
<div className="appPageSection">
<h2>{__('Attività Recenti Utenti', 'gepafin')}</h2>
<LatestUsersActivityTable/>
</div>
</div>*/}
<div className="appPage__spacer"></div>
<div className="appPageSection__hr">
<span>{__('Azioni rapide', 'gepafin')}</span>
</div>
<div className="appPageSection">
<h2>{__('Collegamenti rapidi', 'gepafin')}</h2>
<div className="appPageSection__actions">
<Button
onClick={onGoToCreateNewBando}
label={__('Crea nuovo bando', 'gepafin')} icon="pi pi-plus" iconPos="right"/>
<Button
{/*<Button
disabled={true}
onClick={onGoToUsers}
label={__('Gestione utenti', 'gepafin')} icon="pi pi-users" iconPos="right"/>
@@ -89,7 +92,7 @@ const Dashboard = () => {
<Button
disabled={true}
onClick={onGoToSettings}
label={__('Configurazione', 'gepafin')} icon="pi pi-cog" iconPos="right"/>
label={__('Configurazione', 'gepafin')} icon="pi pi-cog" iconPos="right"/>*/}
</div>
</div>
</div>

123
src/pages/DashboardBenefeciario/components/LatestUsersActivityTable/index.js
View File

@@ -1,123 +0,0 @@
import React, { useState, useEffect} from 'react';
import { __ } from '@wordpress/i18n';
// components
import { FilterMatchMode, FilterOperator } from 'primereact/api';
import { DataTable } from 'primereact/datatable';
import { Column } from 'primereact/column';
import { InputText } from 'primereact/inputtext';
import { IconField } from 'primereact/iconfield';
import { InputIcon } from 'primereact/inputicon';
import { Button } from 'primereact/button';
import { Calendar } from 'primereact/calendar';
const LatestUsersActivityTable = () => {
const [items, setItems] = useState(null);
const [filters, setFilters] = useState(null);
const [loading, setLoading] = useState(false);
const [globalFilterValue, setGlobalFilterValue] = useState('');
useEffect(() => {
// TODO
const bandi = [
{
date: '2024-08-02T00:00:00+14:32',
email: 'mario.rossi@gepafin.it',
action: 'Valutazione Domanda',
details: 'Bando Innovazione 2024 - Domanda #123',
id: 11
},
{
date: '2024-08-01T00:00:00+08:23',
email: 'laura.bianchi@gepafin.it',
action: 'Creazione Bando',
details: 'Nuovo bando "Formazione 2025" in bozza',
id: 9
}
]
setItems(getFormattedBandiData(bandi));
setLoading(false);
initFilters();
}, []);
const getFormattedBandiData = (data) => {
return [...(data || [])].map((d) => {
d.date = new Date(d.date);
return d;
});
};
const formatDate = (value) => {
return value.toLocaleDateString('it-IT', {
day: '2-digit',
month: '2-digit',
year: 'numeric'
});
};
const clearFilter = () => {
initFilters();
};
const onGlobalFilterChange = (e) => {
const value = e.target.value;
let _filters = { ...filters };
_filters['global'].value = value;
setFilters(_filters);
setGlobalFilterValue(value);
};
const initFilters = () => {
setFilters({
global: { value: null, matchMode: FilterMatchMode.CONTAINS },
email: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }] },
date: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }] },
});
setGlobalFilterValue('');
};
const renderHeader = () => {
return (
<div className="appTableHeader">
<Button type="button" icon="pi pi-filter-slash" label={__('Pulisci', 'gepafin')} outlined onClick={clearFilter} />
<IconField iconPosition="left">
<InputIcon className="pi pi-search" />
<InputText value={globalFilterValue} onChange={onGlobalFilterChange} placeholder={__('Cerca', 'gepafin')} />
</IconField>
</div>
);
};
const dateBodyTemplate = (rowData) => {
return formatDate(rowData.date);
};
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 header = renderHeader();
return(
<div className="appPageSection__table">
<DataTable value={items} paginator showGridlines rows={10} loading={loading} dataKey="id"
filters={filters}
globalFilterFields={['name', 'status']}
header={header}
emptyMessage="Nothing found." onFilter={(e) => setFilters(e.filters)}>
<Column header={__('Timestamp', 'gepafin')} filterField="date" dataType="date"
style={{ minWidth: '10rem' }}
body={dateBodyTemplate} filter filterElement={dateFilterTemplate}/>
<Column field="email" header={__('Utente', 'gepafin')} filter filterPlaceholder="Search by email"
style={{ minWidth: '12rem' }}/>
<Column field="action" header={__('Azione', 'gepafin')}/>
<Column field="dettails" header={__('Dettagli', 'gepafin')}/>
</DataTable>
</div>
)
}
export default LatestUsersActivityTable;

62
src/pages/DashboardBenefeciario/components/LatestBandiTable/index.js → src/pages/DashboardBenefeciario/components/MyLatestSubmissionsTable/index.js
View File

@@ -19,9 +19,10 @@ 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';
const LatestBandiTable = () => {
const MyLatestSubmissionsTable = () => {
const [items, setItems] = useState(null);
const [filters, setFilters] = useState(null);
const [loading, setLoading] = useState(false);
@@ -33,27 +34,19 @@ const LatestBandiTable = () => {
const items = [
{
name: 'Bando Innovazione 2024',
start_date: '2024-08-08T00:00:00+00:00',
end_date: '2024-08-30T00:00:00+00:00',
submissions: 24,
status: 'publish',
end_date: '2024-08-08T00:00:00+00:00',
modify_date: '2024-08-30T00:00:00+00:00',
progress: 50,
status: 'DRAFT',
id: 11
},
{
name: 'Bando Sostenibilità 2024',
start_date: '2024-07-28T00:00:00+00:00',
end_date: '2024-08-15T00:00:00+00:00',
submissions: 35,
status: 'publish',
end_date: '2024-07-28T00:00:00+00:00',
modify_date: '2024-08-15T00:00:00+00:00',
progress: 25,
status: 'DRAFT',
id: 9
},
{
name: 'Bando A',
start_date: '2024-06-28T00:00:00+00:00',
end_date: '2024-06-15T00:00:00+00:00',
submissions: 2,
status: 'closed',
id: 2
}
]
setItems(getFormattedBandiData(items));
@@ -64,7 +57,7 @@ const LatestBandiTable = () => {
const getFormattedBandiData = (data) => {
return [...(data || [])].map((d) => {
d.start_date = new Date(d.start_date);
d.modify_date = new Date(d.modify_date);
d.end_date = new Date(d.end_date);
return d;
@@ -97,9 +90,8 @@ const LatestBandiTable = () => {
setFilters({
global: { value: null, matchMode: FilterMatchMode.CONTAINS },
name: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }] },
start_date: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }] },
modify_date: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }] },
end_date: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }] },
submissions: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.EQUALS }] },
status: { operator: FilterOperator.OR, constraints: [{ value: null, matchMode: FilterMatchMode.EQUALS }] },
});
setGlobalFilterValue('');
@@ -117,8 +109,8 @@ const LatestBandiTable = () => {
);
};
const dateStartBodyTemplate = (rowData) => {
return formatDate(rowData.start_date);
const dateModifyBodyTemplate = (rowData) => {
return formatDate(rowData.modify_date);
};
const dateEndBodyTemplate = (rowData) => {
@@ -145,6 +137,12 @@ const LatestBandiTable = () => {
return <Tag value={getBandoLabel(option)} severity={getBandoSeverity(option)} />;
};
const actionsBodyTemplate = (rowData) => {
return <Link to={`/bids/${rowData.id}`}>
<Button severity="info" label={__('Modifica', 'gepafin')} icon="pi pi-pencil" size="small" iconPos="right" />
</Link>
}
const header = renderHeader();
return(
@@ -154,23 +152,25 @@ const LatestBandiTable = () => {
globalFilterFields={['name', 'status']}
header={header}
emptyMessage="Nothing found." onFilter={(e) => setFilters(e.filters)}>
<Column field="name" header={__('Nome Bando', 'gepafin')} filter filterPlaceholder="Search by name"
<Column field="name" header={__('Bando', 'gepafin')} filter filterPlaceholder="Search by name"
style={{ minWidth: '12rem' }}/>
<Column header={__('Data Pubblicazione', 'gepafin')} filterField="start_date" dataType="date"
style={{ minWidth: '10rem' }}
body={dateStartBodyTemplate} filter filterElement={dateFilterTemplate}/>
<Column header={__('Data Scadenza', 'gepafin')} filterField="end_date" dataType="date"
<Column header={__('Scadenza', 'gepafin')} filterField="end_date" dataType="date"
style={{ minWidth: '10rem' }}
body={dateEndBodyTemplate} filter filterElement={dateFilterTemplate}/>
<Column header={__('Domande ricevute', 'gepafin')} filterField="submissions" dataType="numeric"
style={{ minWidth: '10rem' }} field="submissions"
filter filterElement={balanceFilterTemplate}/>
<Column header={__('Ultima modifica', 'gepafin')} filterField="modify_date" dataType="date"
style={{ minWidth: '10rem' }}
body={dateModifyBodyTemplate} filter filterElement={dateFilterTemplate}/>
<Column field="status" header={__('Stato', 'gepafin')} filterMenuStyle={{ width: '14rem' }}
style={{ minWidth: '12rem' }} body={statusBodyTemplate} filter
filterElement={statusFilterTemplate}/>
<Column header={__('Progressi', 'gepafin')}
style={{ minWidth: '10rem' }} field="progress"
filterElement={balanceFilterTemplate}/>
<Column header={__('Azioni', 'gepafin')}
body={actionsBodyTemplate}/>
</DataTable>
</div>
)
}
export default LatestBandiTable;
export default MyLatestSubmissionsTable;

62
src/pages/DashboardBenefeciario/index.js
View File

@@ -3,27 +3,15 @@ import { __ } from '@wordpress/i18n';
import { useNavigate } from 'react-router-dom';
// components
import LatestBandiTable from './components/LatestBandiTable';
import LatestUsersActivityTable from './components/LatestUsersActivityTable';
import LatestBandiTable from '../Dashboard/components/LatestBandiTable';
import MyLatestSubmissionsTable from './components/MyLatestSubmissionsTable';
import { Button } from 'primereact/button';
const DashboardBenefeciario = () => {
const navigate = useNavigate();
const onGoToCreateNewBando = () => {
navigate('/bandi/new');
}
const onGoToUsers = () => {
console.log('onGoToUsers')
}
const onGoToStats = () => {
console.log('onGoToStats')
}
const onGoToSettings = () => {
console.log('onGoToSettings')
const goToAllSubmissions = () => {
navigate('/bids/new');
}
return(
@@ -36,7 +24,7 @@ const DashboardBenefeciario = () => {
<div className="appPageSection statsBigBadges">
<h2>{__('Panoramica di Sistema', 'gepafin')}</h2>
<div className="statsBigBadges__grid">
<div className="statsBigBadges__grid grid-3">
<div className="statsBigBadges__gridItem">
<span>{__('Domande attivi', 'gepafin')}</span>
<span>3</span>
@@ -51,6 +39,46 @@ const DashboardBenefeciario = () => {
</div>
</div>
</div>
<div className="appPage__spacer"></div>
<div className="appPageSection">
<h2>{__('Domande in lavorazione', 'gepafin')}</h2>
<MyLatestSubmissionsTable/>
</div>
<div className="appPage__spacer"></div>
<div className="appPageSection">
<h2>{__('Bandi disponibili', 'gepafin')}</h2>
<LatestBandiTable/>
</div>
<div className="appPage__spacer"></div>
<div className="appPageSection__hr">
<span>{__('Azioni rapide', 'gepafin')}</span>
</div>
<div className="appPageSection">
<div className="appPageSection__actions">
<Button
onClick={goToAllSubmissions}
label={__('Nuova domanda', 'gepafin')} icon="pi pi-plus" iconPos="right"/>
<Button
disabled={true}
outlined
onClick={() => {
}}
label={__('Carica documento', 'gepafin')} icon="pi pi-upload" iconPos="right"/>
<Button
disabled={true}
outlined
onClick={() => {
}}
label={__('Contatta assistenza', 'gepafin')} icon="pi pi-envelope" iconPos="right"/>
</div>
</div>
</div>
)
}

4
src/pages/Login/index.js
View File

@@ -45,7 +45,7 @@ const Login = () => {
});
} else {
errorMsgs.current.show([
{ sticky: true, severity: 'error', summary: 'Error',
{ sticky: true, severity: 'error', summary: '',
detail: data.message,
closable: true }
]);
@@ -55,7 +55,7 @@ const Login = () => {
const loginError = (err) => {
errorMsgs.current.show([
{ sticky: true, severity: 'error', summary: 'Error',
{ sticky: true, severity: 'error', summary: '',
detail: sprintf(__('%s', 'gepafin'), err),
closable: true }
]);

20
src/routes.js
View File

@@ -14,6 +14,7 @@ import BandoFormsEdit from './pages/BandoFormsEdit';
import BandoForms from './pages/BandoForms';
import BandoFormsPreview from './pages/BandoFormsPreview';
import BandoFlowEdit from './pages/BandoFlowEdit';
import Bids from './pages/Bids';
const routes = ({ role }) => {
return (
@@ -23,30 +24,33 @@ const routes = ({ role }) => {
{'ROLE_SUPER_ADMIN' === role ? <Dashboard/> : null}
{'ROLE_BENEFICIARY' === role ? <DashboardBenefeciario/> : null}
</DefaultLayout>}/>
<Route path="/bandi" element={<DefaultLayout>
<Route path="/tenders" element={<DefaultLayout>
{'ROLE_SUPER_ADMIN' === role ? <Bandi/> : null}
</DefaultLayout>}/>
<Route path="/bandi/:id" element={<DefaultLayout>
<Route path="/tenders/:id" element={<DefaultLayout>
{'ROLE_SUPER_ADMIN' === role ? <BandoEdit/> : null}
</DefaultLayout>}/>
<Route path="/bandi/:id/preview" element={<DefaultLayout>
<Route path="/tenders/:id/preview" element={<DefaultLayout>
{'ROLE_SUPER_ADMIN' === role ? <BandoView/> : null}
</DefaultLayout>}/>
<Route path="/bandi/:id/preview-evaluation" element={<DefaultLayout>
<Route path="/tenders/:id/preview-evaluation" element={<DefaultLayout>
{'ROLE_SUPER_ADMIN' === role ? <BandoView/> : null}
</DefaultLayout>}/>
<Route path="/bandi/:id/forms" element={<DefaultLayout>
<Route path="/tenders/:id/forms" element={<DefaultLayout>
{'ROLE_SUPER_ADMIN' === role ? <BandoForms/> : null}
</DefaultLayout>}/>
<Route path="/bandi/:id/forms/:formId" element={<DefaultLayout>
<Route path="/tenders/:id/forms/:formId" element={<DefaultLayout>
{'ROLE_SUPER_ADMIN' === role ? <BandoFormsEdit/> : null}
</DefaultLayout>}/>
<Route path="/bandi/:id/forms/:formId/preview" element={<DefaultLayout>
<Route path="/tenders/:id/forms/:formId/preview" element={<DefaultLayout>
{'ROLE_SUPER_ADMIN' === role ? <BandoFormsPreview/> : null}
</DefaultLayout>}/>
<Route path="/bandi/:id/flow" element={<DefaultLayout>
<Route path="/tenders/:id/flow" element={<DefaultLayout>
{'ROLE_SUPER_ADMIN' === role ? <BandoFlowEdit/> : null}
</DefaultLayout>}/>
<Route path="/bids" element={<DefaultLayout>
{'ROLE_BENEFICIARY' === role ? <Bids/> : null}
</DefaultLayout>}/>
</Route>
<Route exact path="/login" element={<Login/>}/>
{/*<Route exact path="/forgot-password" element={<ForgotPassword/>}/>*/}

10
src/store/actions.js
View File

@@ -42,5 +42,15 @@ export const actionsBeta = (set, get, api) => ({
const newElements = newFields.toSpliced(hoverIndex, 0, prevFields[dragIndex]);
set.formElements(newElements);
}
},
addFlowData: (data) => {
const initial = get.flowData();
const exists = initial ? initial.filter(o => o.formId === data.formId) : [];
if (exists.length) {
const newData = initial.map(o => o.formId === data.formId ? data : o);
set.flowData(newData);
} else {
set.flowData([...initial, data]);
}
}
});

8
src/store/initial.js
View File

@@ -5,12 +5,18 @@ const initialStore = {
// user
userData: {},
token: '',
// bando form
formInitialData: {},
// form builder
formId: 0,
formLabel: '',
formElements: [],
elementItems: [],
activeElement: ''
activeElement: '',
// flow
flowData: [],
flowForms: [],
flowEdges: []
}
export default initialStore;

48
src/tempData.js
View File

@@ -365,3 +365,51 @@ export const elementItems = [
}
}
]
const flowData = {
"initialForm":9,
"finalForm":13,
"flowData":[
{
"formId":"9",
"chosenField":"a0acf568c8",
"chosenValue":""
},
{
"formId":"12",
"chosenField":"",
"chosenValue":"o8bf116e28"
},
{
"formId":"11",
"chosenField":"",
"chosenValue":"o1eb76229d"
}
],
"flowEdges":[
{
"id":"9->12",
"source":"9",
"target":"12",
"type":"smoothstep"
},
{
"id":"12->13",
"source":"12",
"target":"13",
"type":"smoothstep"
},
{
"id":"9->11",
"source":"9",
"target":"11",
"type":"smoothstep"
},
{
"id":"11->13",
"source":"11",
"target":"13",
"type":"smoothstep"
}
]
}