:

src/components/FormFieldRepeaterCriteria/index.js

@@ -1,6 +1,9 @@
 import React, { useRef, useEffect, useState } from 'react';
 import { classNames } from 'primereact/utils';
 import { __ } from '@wordpress/i18n';
+import { head } from 'ramda';
+
+// components
 import { InputText } from 'primereact/inputtext';
 import { Button } from 'primereact/button';
 import { Menu } from 'primereact/menu';
@@ -19,6 +22,7 @@ const FormFieldRepeaterCriteria = ({
                                    }) => {
     const forMenu = useRef(null);
     const [stateFieldData, setStateFieldData] = useState([]);
+    const [threshold, setThreshold] = useState(0);
     const menuItems = [
         {
             type: 'existing',
@@ -42,13 +46,18 @@ const FormFieldRepeaterCriteria = ({
     }
 
     const selectItem = (e, index) => {
-        const newData = stateFieldData.map((o, i) => {
-            if (i === index) {
-                o.value = e.value;
-            }
-            return o;
-        })
-        setStateFieldData(newData);
+        const targetedOption = head(options.filter(o => o.value === e.value));
+        if (targetedOption) {
+            const newData = stateFieldData.map((o, i) => {
+                if (i === index) {
+                    o.value = targetedOption.value;
+                    o.score = targetedOption.score;
+                }
+                return o;
+            });
+            console.log('newData', newData)
+            setStateFieldData(newData);
+        }
     }
 
     const onInputChange = (value, index, name) => {
@@ -61,6 +70,10 @@ const FormFieldRepeaterCriteria = ({
         setStateFieldData(newData);
     }
 
+    const onThresholdChange = (value) => {
+        setThreshold(value);
+    }
+
     const properField = (item, i) => {
         return item.status === 'new'
             ? <InputText value={item.value} onInput={(e) => onInputChange(e.target.value, i, 'value')}/>
@@ -78,6 +91,7 @@ const FormFieldRepeaterCriteria = ({
         const storeFieldData = data[fieldName] ?? [];
         const newData = storeFieldData.map(o => ({ ...o, status: o.id ? 'existing' : 'new' }))
         setStateFieldData(newData);
+        setThreshold(data['threshold'])
         register(fieldName)
     }, [])
 
@@ -90,45 +104,30 @@ const FormFieldRepeaterCriteria = ({
             <label htmlFor={fieldName} className={classNames({ 'p-error': errors[fieldName] })}>
                 {label}
             </label>
-            {stateFieldData.map((o, i) => <div key={i} className={classNames("appForm__field", 'appForm__repeaterItem')}>
-                <div className="appForm__twoCols">
-                    <div>
-                        <label htmlFor="criterionTotal">{__('Punteggio Totale', 'gepafin')}</label>
-                        <InputNumber inputId="criterionTotal"
-                                     value={o.total}
-                                     showButtons
-                                     onValueChange={(e) => onInputChange(e.value, i, 'total')}/>
-                    </div>
-                    <div>
-                        <label htmlFor="criterionThreshold">{__('Punteggio minimo per l’ammissione', 'gepafin')}</label>
-                        <InputNumber inputId="criterionThreshold"
-                                     value={o.threshold}
-                                     showButtons
-                                     onValueChange={(e) => onInputChange(e.value, i, 'threshold')}/>
-                    </div>
-                </div>
+            <div className="appForm__oneCol">
+                <label htmlFor="criterionThreshold">{__('Punteggio minimo per l’ammissione', 'gepafin')}</label>
+                <InputNumber inputId="criterionThreshold"
+                             value={threshold}
+                             showButtons
+                             onValueChange={(e) => onThresholdChange(e.value)}/>
+            </div>
+            {stateFieldData.map((o, i) => <div key={i}
+                                               className={classNames('appForm__field', 'appForm__repeaterItem')}>
                 <div className="appForm__twoCols">
                     <div>
                         <label>{__('Nome criterio di valutazione', 'gepafin')}</label>
                         <div className="p-inputgroup flex-1">
-                            {properField(o, i)}
+                        {properField(o, i)}
                             <Button icon="pi pi-times" className="p-button-danger" onClick={() => removeItem(i)}/>
                         </div>
                         {o.status === 'new' && infoText ? <small>{infoText}</small> : null}
                     </div>
                     <div>
-                        <label htmlFor="criterionMin">{__('Punteggio minimo', 'gepafin')}</label>
+                        <label htmlFor="criterionMin">{__('Punteggio', 'gepafin')}</label>
                         <InputNumber inputId="criterionMin"
-                                     value={o.min}
+                                     value={o.score}
                                      showButtons
-                                     onValueChange={(e) => onInputChange(e.value, i, 'min')}/>
-                    </div>
-                    <div>
-                        <label htmlFor="criterionMax">{__('Punteggio massimo', 'gepafin')}</label>
-                        <InputNumber inputId="criterionMax"
-                                     value={o.max}
-                                     showButtons
-                                     onValueChange={(e) => onInputChange(e.value, i, 'max')}/>
+                                     onValueChange={(e) => onInputChange(e.value, i, 'score')}/>
                     </div>
                 </div>
             </div>)}