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

src/components/FormField/components/CriteriaTable/RenderTable/components/DefaultCell/index.js

@@ -1,24 +1,19 @@
+import { InputText } from 'primereact/inputtext';
+
 const DefaultCell = ({ getValue, row: { index }, column: { id }, table }) => {
     const initialValue = getValue();
     const disabled = table.options.meta?.disabled;
 
-    const onBlur = (e) => {
-        table.options.meta?.updateData(index, id, e.target.value);
-    };
-
     const onFocus = (e) => {
         e.target.select();
     }
 
     return (
-        <input
-            disabled={disabled}
+        <InputText
             value={initialValue ?? ''}
-            onChange={(e) => table.options.meta?.updateData(index, id, e.target.value)}
-            onBlur={onBlur}
+            disabled={disabled}
             onFocus={onFocus}
-            className="w-full px-2 py-1 border rounded"
-        />
+            onChange={(e) => table.options.meta?.updateData(index, id, e.target.value)} />
     );
 };
 

src/components/FormField/components/CriteriaTable/RenderTable/components/NumericFormulaCell/index.js

@@ -1,32 +1,28 @@
+import { InputNumber } from 'primereact/inputnumber';
+
 const NumericFormulaCell = ({ getValue, row: { index }, column: { id }, table }) => {
     const initialValue = getValue();
     const disabled = table.options.meta?.disabled;
 
-    const onBlur = (e) => {
-        const numValue = e.target.value === 0 ? null : Number(e.target.value);
-        table.options.meta?.updateData(index, id, numValue);
-    };
-
     const onFocus = (e) => {
         e.target.select();
     }
 
-    const onChange = (e) => {
-        if (e.target.value === 0 || !isNaN(e.target.value)) {
-            table.options.meta?.updateData(index, id, e.target.value);
-        }
+    const onChange = (value) => {
+        table.options.meta?.updateData(index, id, value);
     };
 
     return (
-        <input
-            type="number"
+        <InputNumber
             disabled={disabled}
             value={initialValue ?? 0}
-            onChange={onChange}
+            onValueChange={(e) => onChange(e.value)}
             onFocus={onFocus}
-            onBlur={onBlur}
-            step="any"
-            className="w-full px-2 py-1 border rounded"
+            minFractionDigits={0}
+            maxFractionDigits={2}
+            locale='it-IT'
+            useGrouping={false}
+            showButtons
         />
     );
 };

src/components/FormField/components/CriteriaTable/RenderTable/index.js

@@ -82,17 +82,17 @@ const RenderTable = ({ tableValue = {}, columnsCfg, lastRowCfg, setTableValueFn,
                     </tr>
                 );
             })}
+            </tbody>
             {!isEmpty(lastRowCfg)
-                ? <tr>
+                ? <tfoot><tr>
                     {columnsCfg.map((o) => <LastRowCell
                         key={o.accessorKey}
                         columnId={o.accessorKey}
                         columnMeta={o.meta}
                         lastRowCfg={lastRowCfg}
                         tableValue={tableValue}/>)}
-                </tr>
+                </tr></tfoot>
                 : null}
-            </tbody>
         </table>
     )
 }

src/components/FormField/components/CriteriaTable/index.js

@@ -58,10 +58,10 @@ const Table = ({
                 }
             }
 
-            if (o.predefined) {
-                item.cell = (info) => info.getValue();
-            } else if (o.enableFormula || o.fieldtype === 'numeric') {
+            if (o.enableFormula || o.fieldtype === 'numeric') {
                 item.cell = NumericFormulaCell;
+            } else {
+                item.cell = (info) => info.getValue();
             }
 
             return item;
@@ -84,7 +84,7 @@ const Table = ({
         let rowsData = pathOr([obj], ['rowsData'], tableColumns);
         rowsData = isEmpty(rowsData) ? [obj] : rowsData;
         setColumnsCfg(stateFieldData);
-        setRowsCfg({rows: rowsData, total: 0});
+        setRowsCfg({ rows: rowsData, total: 0 });
 
         let lastRowData = stateFieldData.reduce((acc, cur) => {
             const value = cur.enableFormula ? cur.lastRowFormula : (cur.lastRowText ? cur.lastRowText : '');

src/components/FormField/components/Table/RenderTable/components/DefaultCell/index.js

@@ -1,24 +1,19 @@
+import { InputText } from 'primereact/inputtext';
+
 const DefaultCell = ({ getValue, row: { index }, column: { id }, table }) => {
     const initialValue = getValue();
     const disabled = table.options.meta?.disabled;
 
-    const onBlur = (e) => {
-        table.options.meta?.updateData(index, id, e.target.value);
-    };
-
     const onFocus = (e) => {
         e.target.select();
     }
 
     return (
-        <input
-            disabled={disabled}
+        <InputText
             value={initialValue ?? ''}
-            onChange={(e) => table.options.meta?.updateData(index, id, e.target.value)}
-            onBlur={onBlur}
+            disabled={disabled}
             onFocus={onFocus}
-            className="w-full px-2 py-1 border rounded"
-        />
+            onChange={(e) => table.options.meta?.updateData(index, id, e.target.value)} />
     );
 };
 

src/components/FormField/components/Table/RenderTable/components/NumericFormulaCell/index.js

@@ -1,32 +1,28 @@
+import { InputNumber } from 'primereact/inputnumber';
+
 const NumericFormulaCell = ({ getValue, row: { index }, column: { id }, table }) => {
     const initialValue = getValue();
     const disabled = table.options.meta?.disabled;
 
-    const onBlur = (e) => {
-        const numValue = e.target.value === 0 ? null : Number(e.target.value);
-        table.options.meta?.updateData(index, id, numValue);
-    };
-
     const onFocus = (e) => {
         e.target.select();
     }
 
-    const onChange = (e) => {
-        if (e.target.value === 0 || !isNaN(e.target.value)) {
-            table.options.meta?.updateData(index, id, e.target.value);
-        }
+    const onChange = (value) => {
+        table.options.meta?.updateData(index, id, value);
     };
 
     return (
-        <input
-            type="number"
+        <InputNumber
             disabled={disabled}
             value={initialValue ?? 0}
-            onChange={onChange}
+            onValueChange={(e) => onChange(e.value)}
             onFocus={onFocus}
-            onBlur={onBlur}
-            step="any"
-            className="w-full px-2 py-1 border rounded"
+            minFractionDigits={0}
+            maxFractionDigits={2}
+            locale='it-IT'
+            useGrouping={false}
+            showButtons
         />
     );
 };

src/components/FormField/components/Table/RenderTable/index.js

@@ -68,17 +68,17 @@ const RenderTable = ({ rowsData, columnsCfg, lastRowCfg, setRowsFn, disabled })
                     </tr>
                 );
             })}
+            </tbody>
             {!isEmpty(lastRowCfg)
-                ? <tr>
+                ? <tfoot><tr>
                     {columnsCfg.map((o) => <LastRowCell
                         key={o.accessorKey}
                         columnId={o.accessorKey}
                         columnMeta={o.meta}
                         lastRowCfg={lastRowCfg}
                         getColumnDataFn={getColumnData}/>)}
-                </tr>
+                </tr></tfoot>
                 : null}
-            </tbody>
         </table>
     )
 }

src/components/FormField/components/Table/index.js

@@ -176,7 +176,7 @@ const Table = ({
                 setRowsFn={updateRows}
                 disabled={disabled}/> : null}
             {!isEmpty(columns) && !shouldDisableNewRows
-                ? <div className="addNewTableRow" onClick={addNewRow}>
+                ? <div className="addNewTableRow p-button p-component" onClick={addNewRow}>
                     {__('Aggiungi una riga', 'gepafin')}
                 </div>
                 : null}