- 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 = () => {