- added form fields calculation and new table calculationl tested in preview;

src/pages/BandoFormsEdit/components/BuilderElementSettings/components/ElementSetting/index.js

@@ -1,6 +1,9 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { __ } from '@wordpress/i18n';
-import { is } from 'ramda';
+import { head, is, isEmpty, isNil, uniq } from 'ramda';
+
+// store
+import { storeGet } from '../../../../../../store';
 
 // tools
 import renderHtmlContent from '../../../../../../helpers/renderHtmlContent';
@@ -19,6 +22,8 @@ import { mimeTypes } from '../../../../../../configData';
 
 
 const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus }) => {
+    const [existingVars, setExistingVars] = useState([]);
+
     const settingLabels = {
         label: __('Label', 'gepafin'),
         placeholder: __('Segnaposto', 'gepafin'),
@@ -72,7 +77,7 @@ const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus }) => {
                 options={mimeTypes}
                 optionLabel="name"
                 display="chip"
-                placeholder={__('Scegli', 'gepafin')} />
+                placeholder={__('Scegli', 'gepafin')}/>
         } else if (setting.name === 'text') {
             return <Editor
                 value={setting.value}
@@ -115,13 +120,34 @@ const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus }) => {
         }
     }
 
+    useEffect(() => {
+        const elements = storeGet.main.formElements();
+        const activeElement = storeGet.main.activeElement();
+        const vars = elements
+            .filter(o => o.id !== activeElement)
+            // eslint-disable-next-line
+            .map((o) => {
+                const variableSetting = head(o.settings.filter(s => s.name === 'variable'));
+                if (variableSetting) {
+                    return variableSetting.value[0];
+                }
+            })
+            .filter(v => !isNil(v));
+
+        setExistingVars(uniq(vars));
+    }, []);
+
     return <div className="formElementSettings__field" key={setting.name}>
         <label htmlFor={setting.name}>{settingLabels[setting.name]}</label>
         {getProperField(setting)}
+        {setting.name === 'formula' && !isEmpty(existingVars)
+            ? <div className="formElementSettings__fieldVarsList">
+                <p>Existing variables: {existingVars.map(v => <code key={v}>{`{${v}}`}</code>)}</p>
+            </div> : null}
         {settingDescription[setting.name]
             ? <div className="formElementSettings__fieldDescription">
                 <p>{renderHtmlContent(settingDescription[setting.name])}</p>
-        </div> : null}
+            </div> : null}
     </div>
 }
 

src/pages/BandoFormsEdit/components/BuilderElementSettings/components/ElementSettingCriteriaTableColumns/index.js

@@ -1,17 +1,18 @@
 import React, { useCallback, useEffect, useState } from 'react';
 import { __, sprintf } from '@wordpress/i18n';
 import { wrap } from 'object-path-immutable';
-import { isEmpty, pathOr } from 'ramda';
+import { isEmpty, last, pathOr } from 'ramda';
 
 // components
 import { InputText } from 'primereact/inputtext';
 import { Button } from 'primereact/button';
 import { InputSwitch } from 'primereact/inputswitch';
+import { Dropdown } from 'primereact/dropdown';
+import { Accordion, AccordionTab } from 'primereact/accordion';
 
 // tools
 import uniqid from '../../../../../../helpers/uniqid';
-import { Dropdown } from 'primereact/dropdown';
-import { Accordion, AccordionTab } from 'primereact/accordion';
+import removeKey from '../../../../../../helpers/removeKey';
 
 const ElementSettingCriteriaTableColumns = ({
                                         value,
@@ -24,13 +25,15 @@ const ElementSettingCriteriaTableColumns = ({
 
     const removeItem = (index) => {
         let newData = stateFieldData
-            .toSpliced(index, 1)
+            .toSpliced(index, 1);
         newData = newData.map((o, i) => {
                 return i === newData.length - 1
                     ? {...o, fieldtype: 'numeric', predefined: false, enableFormula: true}
                     : {...o, fieldtype: 'text', predefined: true, enableFormula: false}
             });
         setStateFieldData(newData);
+        const newRowsData = removeKey(rowsData, last(newData.map(o => o.name)));
+        setRowsData(newRowsData);
     }
 
     const addNewItem = () => {

src/pages/BandoFormsEdit/components/BuilderElementSettings/components/ElementSettingTableColumns/index.js

@@ -1,17 +1,18 @@
 import React, { useCallback, useEffect, useState } from 'react';
 import { __, sprintf } from '@wordpress/i18n';
 import { wrap } from 'object-path-immutable';
-import { isEmpty, pathOr } from 'ramda';
+import { isEmpty, last, pathOr } from 'ramda';
 
 // components
 import { InputText } from 'primereact/inputtext';
 import { Button } from 'primereact/button';
 import { InputSwitch } from 'primereact/inputswitch';
+import { Dropdown } from 'primereact/dropdown';
+import { Accordion, AccordionTab } from 'primereact/accordion';
 
 // tools
 import uniqid from '../../../../../../helpers/uniqid';
-import { Dropdown } from 'primereact/dropdown';
-import { Accordion, AccordionTab } from 'primereact/accordion';
+import removeKey from '../../../../../../helpers/removeKey';
 
 const ElementSettingTableColumns = ({
                                         value,
@@ -25,6 +26,8 @@ const ElementSettingTableColumns = ({
     const removeItem = (index) => {
         const newData = stateFieldData.toSpliced(index, 1);
         setStateFieldData(newData);
+        const newRowsData = removeKey(rowsData, last(newData.map(o => o.name)));
+        setRowsData(newRowsData);
     }
 
     const addNewItem = () => {

src/pages/BandoFormsPreview/index.js

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
 import { __ } from '@wordpress/i18n';
 import { useNavigate, useParams } from 'react-router-dom';
 import { klona } from 'klona';
-import { head, isNil , isEmpty } from 'ramda';
+import { head, isNil, isEmpty, pathOr } from 'ramda';
 import { useForm } from 'react-hook-form';
 import 'quill/dist/quill.core.css';
 import { evaluate } from 'mathjs';
@@ -84,23 +84,6 @@ const BandoFormsPreview = () => {
         if (data.status === 'SUCCESS') {
             setFormName(data.data.label);
             const elements = klona(data.data.content);
-            let allvars = {};
-            let allformulas = {};
-
-            // eslint-disable-next-line array-callback-return
-            elements.map((o) => {
-                const variable = head(o.settings.filter(o => o.name === 'variable'));
-                if (variable && !isEmpty(variable.value)) {
-                    allvars[o.id] = variable.value[0];
-                }
-                const formula = head(o.settings.filter(o => o.name === 'formula'));
-                if (formula && !isEmpty(formula.value)) {
-                    allformulas[o.id] = formula.value;
-                }
-            });
-
-            setFieldsWithVars(allvars);
-            setFieldsWithFormula(allformulas);
             setFormData(elements);
         }
         storeSet.main.unsetAsyncRequest();
@@ -112,37 +95,39 @@ const BandoFormsPreview = () => {
     }
 
     useEffect(() => {
-        if (!isEmpty(fieldsWithVars) && !isEmpty(fieldsWithFormula)) {
-            const updatedFormValues = klona(formValues);
-            let context = {};
+        let updatedFormValues = klona(formValues);
+        let context = {};
 
-            // eslint-disable-next-line array-callback-return
-            Object.keys(updatedFormValues).map(fieldId => {
-                if (!isNil(fieldsWithFormula[fieldId])) {
-                    const formula = fieldsWithFormula[fieldId];
-                    context = getTokens(formula)
-                        .filter(v => !['false', 'null', 'true'].includes(v))
-                        .reduce((acc, cur) => {
-                            acc[cur] = isNil(context[cur]) ? 0 : context[cur];
-                            return acc;
-                        }, {});
-                    const mathFormula = renderWithDataVars(formula, context);
-                    try {
-                        updatedFormValues[fieldId] = evaluate(mathFormula);
-                    } catch (e) {
-                        console.log('Error in math formula: "', mathFormula, '"', e.message);
-                        updatedFormValues[fieldId] = 0;
-                    }
-                }
-                if (!isNil(fieldsWithVars[fieldId])) {
-                    context[fieldsWithVars[fieldId]] = updatedFormValues[fieldId]
-                }
-            });
+        // eslint-disable-next-line array-callback-return
+        formData.map((o) => {
+            const variable = head(o.settings.filter(o => o.name === 'variable'));
+            const formula = head(o.settings.filter(o => o.name === 'formula'));
 
-            if (!isEmpty(updatedFormValues) && !equal(updatedFormValues, formValues)) {
-                reset(updatedFormValues);
+            if (formula && !isEmpty(formula.value)) {
+                context = getTokens(formula.value)
+                    .filter(v => !['false', 'null', 'true'].includes(v))
+                    .reduce((acc, cur) => {
+                        acc[cur] = isNil(context[cur]) ? 0 : context[cur];
+                        return acc;
+                    }, context);
+                const mathFormula = renderWithDataVars(formula.value, context);
+                try {
+                    updatedFormValues[o.id] = evaluate(mathFormula);
+                } catch (e) {
+                    console.log('Error in math formula: "', mathFormula, '"', e.message);
+                    updatedFormValues[o.id] = 0;
+                }
             }
 
+            if (variable && !isEmpty(variable.value)) {
+                context[variable.value[0]] = 'criteria_table' === o.name
+                    ? pathOr(0, [o.id, 'total'], updatedFormValues)
+                    : pathOr(0, [o.id], updatedFormValues);
+            }
+        });
+
+        if (!isEmpty(updatedFormValues) && !equal(updatedFormValues, formValues)) {
+            reset(updatedFormValues);
         }
     }, [formValues]);
 

src/pages/ResetPassword/index.js

@@ -1,8 +1,8 @@
-import React, { useRef, useState, useEffect, useMemo } from 'react';
+import React, { useRef, useState, useEffect } from 'react';
 import { __, sprintf } from '@wordpress/i18n';
 import { useForm } from 'react-hook-form';
 import { classNames } from 'primereact/utils';
-import { isEmpty, isNil } from 'ramda';
+import { isEmpty } from 'ramda';
 import { useNavigate, useSearchParams } from 'react-router-dom';
 
 // tools