- added evaluation single page new sections;

This commit is contained in:
Vitalii Kiiko
2024-10-25 17:26:10 +02:00
parent 6e7b79a8ff
commit fb39d0f66d
4 changed files with 173 additions and 16 deletions

View File

@@ -88,6 +88,18 @@
display: flex;
flex-direction: column;
align-items: flex-start;
width: 100%;
&.columns {
display: grid;
gap: 1rem;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
width: 100%;
/*> div {
max-width: 50%;
}*/
}
h2 {
color: var(--global-textColor);
@@ -103,6 +115,13 @@
gap: 1rem;
align-items: center;
padding: 5px 0;
width: 100%;
}
.col {
display: flex;
flex-direction: column;
gap: 1rem;
}
}
@@ -117,6 +136,10 @@
container-name: section_with_border;
container-type: inline-size;
&.grey {
border-color: var(--table-border-color)
}
&.disabled {
filter: grayscale(1);
opacity: 0.8;
@@ -171,6 +194,37 @@
}
}
.appPageSection__list {
display: flex;
flex-direction: column;
padding: 0;
li {
padding: 15px;
border-bottom: 1px solid var(--button-secondary-borderColor);
display: flex;
justify-content: space-between;
align-items: center;
gap: 1rem;
}
}
.appPageSection__checklist {
display: flex;
flex-direction: column;
gap: 1rem;
div {
display: flex;
gap: 0.5rem;
}
}
.appPageSection__iconActions {
display: flex;
gap: 0.5em;
}
@container section_with_border (max-width: 600px) {
.appPageSection__withBorder {
.row {

View File

@@ -7,7 +7,7 @@ import { is, isEmpty, isNil } from 'ramda';
import { storeSet, useStore } from '../../store';
// tools
import getNumberWithCurrency from '../../helpers/getNumberWithCurrency';
//import getNumberWithCurrency from '../../helpers/getNumberWithCurrency';
//import getDateFromISOstring from '../../helpers/getDateFromISOstring';
// components
@@ -15,16 +15,19 @@ import { Skeleton } from 'primereact/skeleton';
import { Button } from 'primereact/button';
import { Messages } from 'primereact/messages';
import { Tag } from 'primereact/tag';
import { Checkbox } from 'primereact/checkbox';
import { Editor } from 'primereact/editor';
const EvaluationEdit = () => {
const DomandaEdit = () => {
const isAsyncRequest = useStore().main.isAsyncRequest();
const { id } = useParams();
const navigate = useNavigate();
const [data, setData] = useState({});
const [message, setMessage] = useState('');
const pageMsgs = useRef(null);
const goToEvaluationsPage = () => {
navigate('/valutazioni');
navigate('/domande');
}
/*const getCallback = (data) => {
@@ -53,6 +56,26 @@ const EvaluationEdit = () => {
return data;
};*/
const renderHeader = () => {
return (
<span className="ql-formats">
<button className="ql-bold" aria-label="Bold"></button>
<button className="ql-italic" aria-label="Italic"></button>
<button className="ql-underline" aria-label="Underline"></button>
<button className="ql-link" aria-label="Link"></button>
<button className="ql-list" value="ordered"></button>
<button className="ql-header" value="2"></button>
<button className="ql-header" value="3"></button>
<button className="ql-blockquote"></button>
<button className="ql-list" value="bullet"></button>
<button className="ql-indent" value="-1"></button>
<button className="ql-indent" value="+1"></button>
</span>
);
};
const header = renderHeader();
useEffect(() => {
const parsed = parseInt(id)
const entityId = !isNaN(parsed) ? parsed : 0;
@@ -75,6 +98,36 @@ const EvaluationEdit = () => {
//BandoService.getBando(entityId, getCallback, errGetCallback);
}, [id]);
// TODO
const checklist = [
{
id: 1,
title: 'Requisiti di ammissibilità soddisfatti'
},
{
id: 2,
title: 'Documentazione completa'
},
{
id: 3,
title: 'Obiettivi del progetto chiari e misurabili'
}
];
const documents = [
{
id: 1,
title: 'Doc 1'
},
{
id: 2,
title: 'Bilancio ultimo esercizio Bilancio ultimo esercizio Bilancio ultimo esercizio'
},
{
id: 3,
title: 'Bilancio ultimo esercizio'
}
];
return (
<div className="appPage">
<div className="appPage__pageHeader">
@@ -139,7 +192,16 @@ const EvaluationEdit = () => {
{data.criteria.map(o => <tr key={o.id}>
<td>{o.title}</td>
<td>{o.score}</td>
<td></td>
<td>
<div className="appPageSection__iconActions">
<Button icon="pi pi-eye" rounded outlined severity="info"
aria-label={__('Mostra', 'gepafin')}/>
<Button icon="pi pi-thumbs-up" rounded outlined
aria-label={__('Su', 'gepafin')}/>
<Button icon="pi pi-thumbs-down" rounded outlined
aria-label={__('Giu', 'gepafin')}/>
</div>
</td>
</tr>)}
<tr>
<td>{__('Punteggio:', 'gepafin')}</td>
@@ -157,8 +219,49 @@ const EvaluationEdit = () => {
<div className="appPageSection">
<h2>{__('Checklist Valutazione', 'gepafin')}</h2>
<div className="appPageSection columns">
<div>
<h3>{__('Lista', 'gepafin')}</h3>
<div className="appPageSection__withBorder grey">
<div className="appPageSection__checklist">
{checklist.map(o => <div key={o.id}>
<Checkbox
inputId={`checklist_${o.id}`}
onChange={(e) => console.log(e.checked)}
checked={false}></Checkbox>
<label htmlFor={`checklist_${o.id}`}>{o.title}</label>
</div>)}
</div>
</div>
<h3>{__('Note', 'gepafin')}</h3>
<div>
<Editor
value={message}
placeholder={__('Digita qui il messagio', 'gepafin')}
headerTemplate={header}
onTextChange={(e) => setMessage(e.htmlValue)}
style={{ height: 80 * 3, width: '100%' }}
/>
</div>
</div>
<div>
<h3>{__('Documenti allegati', 'gepafin')}</h3>
<ol className="appPageSection__list">
{documents.map(o => <li key={o.id}>
<span>{o.title}</span>
<div className="appPageSection__iconActions">
<Button icon="pi pi-eye" rounded outlined severity="info"
aria-label={__('Mostra', 'gepafin')}/>
<Button icon="pi pi-thumbs-up" rounded outlined
aria-label={__('Su', 'gepafin')}/>
<Button icon="pi pi-thumbs-down" rounded outlined
aria-label={__('Giu', 'gepafin')}/>
</div>
</li>)}
</ol>
</div>
</div>
</div>
<div className="appPage__spacer"></div>
@@ -174,7 +277,7 @@ const EvaluationEdit = () => {
outlined
label={<>
{__('Richiedi Soccorso Istruttorio', 'gepafin')}
<i style={{marginLeft: 7}}>
<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)">
@@ -199,11 +302,11 @@ const EvaluationEdit = () => {
icon="pi pi-save" iconPos="right"/>
<Button
type="button"
label={__('Richiedi Soccorso Istruttorio', 'gepafin')}
label={__('Approva Domanda', 'gepafin')}
icon="pi pi-check" iconPos="right"/>
<Button
type="button"
label={__('Richiedi Soccorso Istruttorio', 'gepafin')}
label={__('Respingi Domanda', 'gepafin')}
icon="pi pi-times" iconPos="right"/>
</div>
</div>
@@ -224,4 +327,4 @@ const EvaluationEdit = () => {
}
export default EvaluationEdit;
export default DomandaEdit;

View File

@@ -4,7 +4,7 @@ import { __ } from '@wordpress/i18n';
// components
import PreInstructorDomandeTable from '../DashboardPreInstructor/components/PreInstructorDomandeTable';
const Bandi = () => {
const DomandePreInstructor = () => {
return(
<div className="appPage">
<div className="appPage__pageHeader">
@@ -20,4 +20,4 @@ const Bandi = () => {
)
}
export default Bandi;
export default DomandePreInstructor;

View File

@@ -27,9 +27,9 @@ import AddCompany from './pages/AddCompany';
import ResetPassword from './pages/ResetPassword';
import DashboardPreInstructor from './pages/DashboardPreInstructor';
import ProfileBeneficiario from './pages/ProfileBeneficiario';
import Evaluations from './pages/Evaluations';
import EvaluationEdit from './pages/EvaluationEdit';
import Domande from './pages/Domande';
import DomandePreInstructor from './pages/DomandePreInstructor';
import DomandaEdit from './pages/DomandaEdit';
const routes = ({ role, chosenCompanyId }) => {
@@ -84,12 +84,12 @@ const routes = ({ role, chosenCompanyId }) => {
<Route path="/domande" element={<DefaultLayout>
{'ROLE_SUPER_ADMIN' === role ? <Domande/> : null}
{'ROLE_BENEFICIARY' === role ? <PageNotFound/> : null}
{'ROLE_PRE_INSTRUCTOR' === role ? <Evaluations/> : null}
{'ROLE_PRE_INSTRUCTOR' === role ? <DomandePreInstructor/> : null}
</DefaultLayout>}/>
<Route path="/domande/:id/" element={<DefaultLayout>
{'ROLE_SUPER_ADMIN' === role ? <PageNotFound/> : null}
{'ROLE_BENEFICIARY' === role ? <PageNotFound/> : null}
{'ROLE_PRE_INSTRUCTOR' === role ? <EvaluationEdit/> : null}
{'ROLE_PRE_INSTRUCTOR' === role ? <DomandaEdit/> : null}
</DefaultLayout>}/>
<Route path="/imieibandi" element={<DefaultLayout>
{'ROLE_SUPER_ADMIN' === role ? <PageNotFound/> : null}