- updates to Evaluation page;

public/index.html

@@ -4,7 +4,7 @@
     <meta charset="utf-8"/>
     <link rel="icon" href="/loaded-files/favicon.ico"/>
     <meta name="viewport" content="width=device-width, initial-scale=1"/>
-    <meta name="description" content="Gepafin"/>
+    <meta name="description" content="%REACT_APP_TAB_TITLE%"/>
     <link rel="apple-touch-icon" href="/loaded-files/%REACT_APP_LOGO_FILENAME%"/>
     <link rel="manifest" href="/manifest.json"/>
     <title>%REACT_APP_TAB_TITLE%</title>

src/assets/scss/components/layout.scss

@@ -12,7 +12,7 @@ body {
   margin: 0;
   font-family: "Montserrat", sans-serif;
 
-  p, span:not(.p-button-label, .p-button-icon, .p-badge, .p-message-detail, .p-highlight, .p-inline-message-text),
+  p, span:not(.p-button-label, .p-button-icon, .p-badge, .p-message-detail, .p-highlight, .p-inline-message-text, .p-tag, .p-tag-icon),
   input, label:not(.p-error), textarea, a, li, h1, h2, h3, h4, h5, h6, div:not(.p-inline-message, .p-toast-detail), th, td {
     color: var(--global-textColor);
   }

src/assets/scss/components/myTable.scss

@@ -0,0 +1,39 @@
+.myTable {
+  border-spacing: 0px;
+  width: 100%;
+}
+
+.myThead {
+  th {
+    text-align: left;
+    padding: 1rem 1rem;
+    border: 1px solid #e5e7eb;
+    border-width: 0 0 1px 0;
+    font-weight: 700;
+    color: #374151;
+    background: #f9fafb;
+    transition: box-shadow 0.2s;
+  }
+}
+
+.myTbody {
+  td {
+    text-align: left;
+    border: 1px solid #e5e7eb;
+    border-width: 0 0 1px 0;
+    padding: 1rem 1rem;
+  }
+}
+
+.myTfoot {
+  td {
+    text-align: left;
+    padding: 1rem 1rem;
+    border: 1px solid #e5e7eb;
+    border-width: 0 0 1px 0;
+    font-weight: 700;
+    color: #374151;
+    background: #f9fafb;
+    transition: box-shadow 0.2s;
+  }
+}

src/assets/scss/theme.scss

@@ -40,4 +40,5 @@
 @import "./components/misc.scss";
 @import "./components/login.scss";
 @import "./components/flowBuilder.scss";
-@import "./components/error404.scss";
+@import "./components/error404.scss";
+@import "./components/myTable.scss";

src/pages/EvaluationEdit/index.js

@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useRef } from 'react';
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import { useNavigate, useParams } from 'react-router-dom';
 import { is, isEmpty, isNil } from 'ramda';
 
@@ -14,6 +14,7 @@ import getNumberWithCurrency from '../../helpers/getNumberWithCurrency';
 import { Skeleton } from 'primereact/skeleton';
 import { Button } from 'primereact/button';
 import { Messages } from 'primereact/messages';
+import { Tag } from 'primereact/tag';
 
 const EvaluationEdit = () => {
     const isAsyncRequest = useStore().main.isAsyncRequest();
@@ -62,8 +63,15 @@ const EvaluationEdit = () => {
             beneficiario: 'Azienda Alpha SRL',
             createdAt: '2024-08-01',
             scadenzaAt: '2024-08-05',
-            status: 'In Valutazione'
+            status: 'In Valutazione',
-        })
+            criteria: [
+                { title: 'Innovatività del progetto', score: 25, id: 12 },
+                { title: 'Innovatività del progetto2', score: 35, id: 13 },
+                { title: 'Innovatività del progetto3', score: 15, id: 14 }
+            ],
+            minScore: 60
+        });
+
         //BandoService.getBando(entityId, getCallback, errGetCallback);
     }, [id]);
 
@@ -116,6 +124,90 @@ const EvaluationEdit = () => {
                         </p>
                     </div>
 
+                    <div className="appPageSection">
+                        <h2>{__('Punteggi di valutazione', 'gepafin')}</h2>
+                        {data.criteria
+                            ? <table className="myTable">
+                                <thead className="myThead">
+                                <tr>
+                                    <th>{__('Parametro', 'gepafin')}</th>
+                                    <th>{__('Punteggio', 'gepafin')}</th>
+                                    <th>{__('Stato', 'gepafin')}</th>
+                                </tr>
+                                </thead>
+                                <tbody className="myTbody">
+                                {data.criteria.map(o => <tr key={o.id}>
+                                    <td>{o.title}</td>
+                                    <td>{o.score}</td>
+                                    <td></td>
+                                </tr>)}
+                                <tr>
+                                    <td>{__('Punteggio:', 'gepafin')}</td>
+                                    <td>{68}</td>
+                                    <td><Tag icon="pi pi-check" severity="success" value={__('Ammissibile')}></Tag></td>
+                                </tr>
+                                </tbody>
+                                <tfoot className="myTfoot">
+                                <tr>
+                                    <td colSpan="3">{sprintf(__('Punteggio minimo per l\'ammissione: %d'), data.minScore)}</td>
+                                </tr>
+                                </tfoot>
+                            </table> : null}
+                    </div>
+
+                    <div className="appPageSection">
+                        <h2>{__('Checklist Valutazione', 'gepafin')}</h2>
+
+
+                    </div>
+
+                    <div className="appPage__spacer"></div>
+
+                    <div className="appPageSection__hr">
+                        <span>{__('Azioni rapide', 'gepafin')}</span>
+                    </div>
+
+                    <div className="appPageSection">
+                        <div className="appPageSection__actions">
+                            <Button
+                                type="button"
+                                outlined
+                                label={<>
+                                    {__('Richiedi Soccorso Istruttorio', 'gepafin')}
+                                    <i style={{marginLeft: 7}}>
+                                        <svg width="15" height="14" viewBox="0 0 15 14" fill="none"
+                                             xmlns="http://www.w3.org/2000/svg">
+                                            <g clipPath="url(#clip0_1665_1656)">
+                                                <path
+                                                    d="M7.50129 14C6.53308 14 5.62302 13.8163 4.7711 13.4488C3.91919 13.0814 3.17818 12.5827 2.54805 11.9529C1.91793 11.323 1.41903 10.5823 1.05134 9.73074C0.683781 8.87919 0.5 7.96938 0.5 7.00129C0.5 6.03308 0.683719 5.12302 1.05116 4.2711C1.4186 3.41919 1.91725 2.67818 2.54713 2.04805C3.17701 1.41793 3.91772 0.919026 4.76926 0.551342C5.62081 0.183781 6.53062 0 7.49871 0C8.46692 0 9.37698 0.183719 10.2289 0.551158C11.0808 0.918596 11.8218 1.41725 12.4519 2.04713C13.0821 2.67701 13.581 3.41772 13.9487 4.26926C14.3162 5.12081 14.5 6.03062 14.5 6.99871C14.5 7.96692 14.3163 8.87698 13.9488 9.72889C13.5814 10.5808 13.0827 11.3218 12.4529 11.9519C11.823 12.5821 11.0823 13.081 10.2307 13.4487C9.37919 13.8162 8.46938 14 7.50129 14ZM5.36316 12.4895L6.44576 10.0238C5.98585 9.86147 5.58888 9.60977 5.25484 9.26874C4.92081 8.92758 4.66598 8.52747 4.49037 8.06842L1.99634 9.1C2.28359 9.88596 2.72195 10.5737 3.31142 11.1632C3.90089 11.7526 4.58481 12.1947 5.36316 12.4895ZM4.49037 5.93158C4.65665 5.47253 4.90816 5.07555 5.24489 4.74066C5.58163 4.40576 5.97719 4.15567 6.43158 3.99037L5.4 1.49634C4.60937 1.79587 3.91932 2.24037 3.32984 2.82984C2.74037 3.41932 2.29587 4.10937 1.99634 4.9L4.49037 5.93158ZM7.49834 9.09724C8.08045 9.09724 8.57579 8.8935 8.98437 8.48603C9.39295 8.07855 9.59724 7.58376 9.59724 7.00166C9.59724 6.41955 9.3935 5.92421 8.98603 5.51563C8.57855 5.10705 8.08376 4.90276 7.50166 4.90276C6.91955 4.90276 6.42421 5.1065 6.01563 5.51397C5.60705 5.92145 5.40276 6.41624 5.40276 6.99834C5.40276 7.58045 5.6065 8.07579 6.01397 8.48437C6.42145 8.89295 6.91624 9.09724 7.49834 9.09724ZM9.63684 12.4895C10.4105 12.1947 11.089 11.7557 11.6724 11.1724C12.2557 10.589 12.6947 9.91053 12.9895 9.13684L10.5238 8.05424C10.368 8.50862 10.1209 8.90302 9.78274 9.23742C9.44453 9.57182 9.05203 9.82923 8.60526 10.0096L9.63684 12.4895ZM10.5096 5.89474L12.9895 4.86316C12.6947 4.08947 12.2557 3.41096 11.6724 2.82763C11.089 2.2443 10.4105 1.80526 9.63684 1.51053L8.60526 4.01303C9.04258 4.18299 9.4242 4.43051 9.75013 4.75558C10.0761 5.08053 10.3292 5.46025 10.5096 5.89474Z"
+                                                    fill="#3B7C43"/>
+                                            </g>
+                                            <defs>
+                                                <clipPath id="clip0_1665_1656">
+                                                    <rect width="14" height="14" fill="white"
+                                                          transform="translate(0.5)"/>
+                                                </clipPath>
+                                            </defs>
+                                        </svg>
+                                    </i>
+                                </>}
+                            />
+                            <Button
+                                type="button"
+                                outlined
+                                label={__('Salva Bozza Valutazione', 'gepafin')}
+                                icon="pi pi-save" iconPos="right"/>
+                            <Button
+                                type="button"
+                                label={__('Richiedi Soccorso Istruttorio', 'gepafin')}
+                                icon="pi pi-check" iconPos="right"/>
+                            <Button
+                                type="button"
+                                label={__('Richiedi Soccorso Istruttorio', 'gepafin')}
+                                icon="pi pi-times" iconPos="right"/>
+                        </div>
+                    </div>
+
                 </div>
                 : <>
                     <Skeleton width="20%" height="1rem" className="mb-2"></Skeleton>