- added new setting 'isPecEmail';

- added automatic enabling/disabling participating of the field in CSV report for tables based on enabling individual columns;

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

@@ -21,6 +21,7 @@ import ElementSettingTableColumnsForCsv from '../ElementSettingTableColumnsForCs
 
 import { mimeTypes } from '../../../../../../configData';
 import ElementSettingReportHeader from '../ElementSettingReportHeader';
+import ElementSettingReportEnable from '../ElementSettingReportEnable';
 
 
 const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus }) => {
@@ -119,10 +120,12 @@ const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus }) => {
                 name={setting.name}
                 bandoStatus={bandoStatus}
                 setDataFn={updateDataFn}/>
-        } else if (['isRequestedAmount', 'isDelegation', 'isChecklistItem', 'reportEnable'].includes(setting.name)) {
+        } else if (['isRequestedAmount', 'isDelegation', 'isChecklistItem'].includes(setting.name)) {
             return <InputSwitch
                 checked={setting.value}
                 onChange={(e) => changeFn(e.value, setting.name)}/>
+        } else if (['reportEnable'].includes(setting.name)) {
+            return <ElementSettingReportEnable setting={setting} setDataFn={updateDataFn}/>
         } else if (setting.name === 'reportColumns') {
             return <ElementSettingTableColumnsForCsv
                 value={is(Object, setting.value) ? setting.value : {}}

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

@@ -0,0 +1,53 @@
+import React, { useCallback } from 'react';
+import { head, pathOr } from 'ramda';
+import { klona } from 'klona';
+
+// components
+import { useStoreValue } from '../../../../../../store';
+import { InputSwitch } from 'primereact/inputswitch';
+
+const ElementSettingReportEnable = ({ setting = {}, setDataFn }) => {
+    const chosenFieldSettings = useStoreValue('chosenFieldSettings');
+
+    const handleChangeFn = useCallback((value) => {
+        setDataFn(setting.name, value);
+        const tableColumns = head(chosenFieldSettings.filter(o => o.name === 'table_columns'));
+        let reportColumns = head(chosenFieldSettings.filter(o => o.name === 'reportColumns'));
+
+        if (tableColumns) {
+            if (reportColumns) {
+                if (reportColumns.value && reportColumns.value.length === 0) {
+                    const settingReports = head(chosenFieldSettings.filter(o => o.name === 'reportColumns'));
+                    const settingData = pathOr([], ['value', 'stateFieldData'], tableColumns);
+                    const settingReportData = pathOr([], ['value'], settingReports);
+                    const canBeEnabled = settingData.filter(o => o.predefined).length > 0;
+                    reportColumns.value = settingData.map((o) => {
+                        const existing = pathOr({}, [], head(settingReportData.filter(s => s.name === o.name)));
+                        const existingEnabled = pathOr(false, ['enableCsv'], existing);
+                        return {
+                            ...o,
+                            ...existing,
+                            predefined: o.predefined,
+                            enableCsv: !canBeEnabled ? false : existingEnabled
+                        }
+                    });
+                }
+
+                const newValueReportColumns = klona(reportColumns.value).map(o => {
+                    o.enableCsv = value
+                    return o;
+                });
+
+                setDataFn('reportColumns', newValueReportColumns);
+            }
+        }
+    }, [chosenFieldSettings]);
+
+    return (
+        <InputSwitch
+            checked={setting.value}
+            onChange={(e) => handleChangeFn(e.value)}/>
+    );
+}
+
+export default ElementSettingReportEnable;

src/pages/BandoFormsEdit/components/BuilderElementSettings/components/ElementSettingTableColumnsForCsv/index OLD.js

@@ -0,0 +1,127 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import { __, sprintf } from '@wordpress/i18n';
+import { head, pathOr, pluck } from 'ramda';
+import equal from 'fast-deep-equal';
+
+// components
+import { InputText } from 'primereact/inputtext';
+import { InputSwitch } from 'primereact/inputswitch';
+
+// store
+import { storeGet } from '../../../../../../store';
+
+const ElementSettingTableColumnsForCsv = ({ name, setDataFn, value }) => {
+    const [stateFieldData, setStateFieldData] = useState([]);
+    const canBeEnabled = stateFieldData.filter(o => o.predefined).length > 0;
+
+    const onInputChange = (e, index) => {
+        const { value } = e.target;
+        const newData = stateFieldData.map((o, i) => {
+            if (i === index) {
+                o.labelCsv = value;
+            }
+            return o;
+        })
+        setStateFieldData(newData);
+    }
+
+    const setChecked = (value, index) => {
+        //let name = '';
+        const newData = stateFieldData.map((o, i) => {
+            if (i === index) {
+                o.enableCsv = value;
+                //name = o.name;
+            }
+            return o;
+        });
+
+        setStateFieldData(newData);
+    }
+
+    const properFields = useCallback((item, i) => {
+        return <>
+            <div>
+                <InputText
+                    value={item.label}
+                    disabled={true}
+                    placeholder={sprintf(__('Colonna %d', 'gepafin'), i + 1)}
+                    onInput={(e) => onInputChange(e, i)}/>
+            </div>
+            <div>
+                <InputText
+                    value={item.labelCsv}
+                    disabled={!canBeEnabled}
+                    placeholder={item.label}
+                    onInput={(e) => onInputChange(e, i)}/>
+            </div>
+            <div>
+                <InputSwitch
+                    checked={item.enableCsv}
+                    disabled={!canBeEnabled}
+                    onChange={(e) => setChecked(e.value, i)}/>
+            </div>
+        </>
+    }, [canBeEnabled]);
+
+    useEffect(() => {
+        const settings = storeGet('chosenFieldSettings');
+        let newValue = []
+
+        if (settings) {
+            const setting = head(settings.filter(o => o.name === 'table_columns'));
+            const settingReports = head(settings.filter(o => o.name === 'reportColumns'));
+            const settingData = pathOr([], ['value', 'stateFieldData'], setting);
+            const settingReportData = pathOr([], ['value'], settingReports);
+            const canBeEnabled = settingData.filter(o => o.predefined).length > 0;
+            newValue = settingData.map((o) => {
+                const existing = pathOr({}, [], head(settingReportData.filter(s => s.name === o.name)));
+                const existingEnabled = pathOr(false, ['enableCsv'], existing);
+                return {
+                    ...o,
+                    ...existing,
+                    predefined: o.predefined,
+                    enableCsv: !canBeEnabled ? false : existingEnabled
+                }
+            });
+        }
+        setStateFieldData(newValue);
+    }, []);
+
+    useEffect(() => {
+        const atLeastOneIsEnabled = pluck('enableCsv', stateFieldData).filter(v => v).length > 0;
+        setDataFn(name, stateFieldData);
+
+        if (atLeastOneIsEnabled) {
+            setDataFn('reportEnable', true);
+        } else {
+            setDataFn('reportEnable', false);
+        }
+    }, [stateFieldData]);
+
+    /*useEffect(() => {
+        console.log('value', value, stateFieldData, equal(value, stateFieldData))
+        if (!equal(value, stateFieldData)) {
+            setStateFieldData(value);
+        }
+    }, [value]);*/
+
+    return (
+        <>
+            {!canBeEnabled
+                ? <p>{__('Almeno una colonna deve essere predefinita! ⚠️')}</p> : null}
+            <div className="formElementSettings__repeater">
+                {stateFieldData.length > 0
+                    ? <div className="formElementSettings__repeaterItem tableRowCsv">
+                        <div>{__('Colonna', 'gepafin')}</div>
+                        <div>{__('Header CSV', 'gepafin')}</div>
+                        <div>{__('Abilitato?', 'gepafin')}</div>
+                    </div> : null}
+                {stateFieldData.map((o, i) => <div key={i} className="formElementSettings__repeaterItem tableRowCsv">
+                    {properFields(o, i)}
+                </div>)}
+            </div>
+        </>
+    )
+}
+
+export default ElementSettingTableColumnsForCsv;

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

@@ -1,32 +1,56 @@
-import React, { useCallback, useEffect, useState } from 'react';
+import React, { useCallback, useMemo } from 'react';
 import { __, sprintf } from '@wordpress/i18n';
-import { head, pathOr } from 'ramda';
+import { head, pathOr, pluck } from 'ramda';
 
 // components
 import { InputText } from 'primereact/inputtext';
 import { InputSwitch } from 'primereact/inputswitch';
 
 // store
-import { storeGet } from '../../../../../../store';
+import { useStoreValue } from '../../../../../../store';
 
-const ElementSettingTableColumnsForCsv = ({ name, setDataFn }) => {
+const ElementSettingTableColumnsForCsv = ({ setDataFn }) => {
-    const [stateFieldData, setStateFieldData] = useState([]);
+    const chosenFieldSettings = useStoreValue('chosenFieldSettings');
-    const canBeEnabled = stateFieldData.filter(o => o.predefined).length > 0;
 
-    const onInputChange = (e, index) => {
+    const properValue = useMemo(() => {
+        let newValue = []
+
+        if (chosenFieldSettings) {
+            const setting = head(chosenFieldSettings.filter(o => o.name === 'table_columns'));
+            const settingReports = head(chosenFieldSettings.filter(o => o.name === 'reportColumns'));
+            const settingData = pathOr([], ['value', 'stateFieldData'], setting);
+            const settingReportData = pathOr([], ['value'], settingReports);
+            const canBeEnabled = settingData.filter(o => o.predefined).length > 0;
+            newValue = settingData.map((o) => {
+                const existing = pathOr({}, [], head(settingReportData.filter(s => s.name === o.name)));
+                const existingEnabled = pathOr(false, ['enableCsv'], existing);
+                return {
+                    ...o,
+                    ...existing,
+                    predefined: o.predefined,
+                    enableCsv: !canBeEnabled ? false : existingEnabled
+                }
+            });
+        }
+
+        return newValue;
+    }, [chosenFieldSettings]);
+    const canBeEnabled = properValue.filter(o => o.predefined).length > 0;
+
+    const onInputChange = useCallback((e, index) => {
         const { value } = e.target;
-        const newData = stateFieldData.map((o, i) => {
+        const newData = properValue.map((o, i) => {
             if (i === index) {
                 o.labelCsv = value;
             }
             return o;
         })
-        setStateFieldData(newData);
-    }
 
-    const setChecked = (value, index) => {
+        setDataFn('reportColumns', newData);
-        //let name = '';
+    }, [properValue]);
-        const newData = stateFieldData.map((o, i) => {
+
+    const setChecked = useCallback((value, index) => {
+        const newData = properValue.map((o, i) => {
             if (i === index) {
                 o.enableCsv = value;
                 //name = o.name;
@@ -34,8 +58,16 @@ const ElementSettingTableColumnsForCsv = ({ name, setDataFn }) => {
             return o;
         });
 
-        setStateFieldData(newData);
+        setDataFn('reportColumns', newData);
+
+        const atLeastOneIsEnabled = pluck('enableCsv', newData).filter(v => v).length > 0;
+
+        if (atLeastOneIsEnabled) {
+            setDataFn('reportEnable', true);
+        } else {
+            setDataFn('reportEnable', false);
         }
+    }, [properValue]);
 
     const properFields = useCallback((item, i) => {
         return <>
@@ -62,46 +94,18 @@ const ElementSettingTableColumnsForCsv = ({ name, setDataFn }) => {
         </>
     }, [canBeEnabled]);
 
-    useEffect(() => {
-        const settings = storeGet('chosenFieldSettings');
-        let newValue = []
-
-        if (settings) {
-            const setting = head(settings.filter(o => o.name === 'table_columns'));
-            const settingReports = head(settings.filter(o => o.name === 'reportColumns'));
-            const settingData = pathOr([], ['value', 'stateFieldData'], setting);
-            const settingReportData = pathOr([], ['value'], settingReports);
-            const canBeEnabled = settingData.filter(o => o.predefined).length > 0;
-            newValue = settingData.map((o) => {
-                const existing = pathOr({}, [], head(settingReportData.filter(s => s.name === o.name)));
-                const existingEnabled = pathOr(false, ['enableCsv'], existing);
-                return {
-                    ...o,
-                    ...existing,
-                    predefined: o.predefined,
-                    enableCsv: !canBeEnabled ? false : existingEnabled
-                }
-            });
-        }
-        setStateFieldData(newValue);
-    }, []);
-
-    useEffect(() => {
-        setDataFn(name, stateFieldData);
-    }, [stateFieldData]);
-
     return (
         <>
             {!canBeEnabled
                 ? <p>{__('Almeno una colonna deve essere predefinita! ⚠️')}</p> : null}
             <div className="formElementSettings__repeater">
-                {stateFieldData.length > 0
+                {properValue.length > 0
                     ? <div className="formElementSettings__repeaterItem tableRowCsv">
                         <div>{__('Colonna', 'gepafin')}</div>
                         <div>{__('Header CSV', 'gepafin')}</div>
                         <div>{__('Abilitato?', 'gepafin')}</div>
                     </div> : null}
-                {stateFieldData.map((o, i) => <div key={i} className="formElementSettings__repeaterItem tableRowCsv">
+                {properValue.map((o, i) => <div key={i} className="formElementSettings__repeaterItem tableRowCsv">
                     {properFields(o, i)}
                 </div>)}
             </div>

src/tempData.js

@@ -448,6 +448,10 @@ export const elementItems = [
             {
                 name: "reportHeader",
                 value: ""
+            },
+            {
+                name: "isPecEmail",
+                value: false
             }
         ],
         validators: {
@@ -477,6 +481,10 @@ export const elementItems = [
             {
                 name: "reportHeader",
                 value: ""
+            },
+            {
+                name: "isPecEmail",
+                value: false
             }
         ],
         validators: {