- company files for evaluation functionality;
This commit is contained in:
Vitalii Kiiko
@@ -50,7 +50,7 @@ import { InputTextarea } from 'primereact/inputtextarea';
|
||||
import { InputText } from 'primereact/inputtext';
|
||||
import { Dropdown } from 'primereact/dropdown';
|
||||
import ListOfFiles from '../DomandaEditPreInstructor/components/ListOfFiles';
|
||||
import RepeaterFields from '../DomandaEditPreInstructor/components/RepeaterFields';
|
||||
import EvaluationExtraFiles from '../DomandaEditPreInstructor/components/EvaluationExtraFiles';
|
||||
import ApplicationInfo from '../DomandaEditPreInstructor/components/ApplicationInfo';
|
||||
import ApplicationDownloadFiles from '../DomandaEditPreInstructor/components/ApplicationDownloadFiles';
|
||||
import FormField from '../../components/FormField';
|
||||
@@ -1288,7 +1288,7 @@ const DomandaEditInstructorManager = () => {
|
||||
|
||||
<div className="appPageSection">
|
||||
<h2>{__('Documenti aggiuntivi', 'gepafin')}</h2>
|
||||
<RepeaterFields
|
||||
<EvaluationExtraFiles
|
||||
defaultValue={data.evaluationDocument ?? []}
|
||||
updateFn={(data) => updateEvaluationValue(
|
||||
data,
|
||||
@@ -1305,6 +1305,8 @@ const DomandaEditInstructorManager = () => {
|
||||
})}
|
||||
shouldDisable={['APPROVED', 'REJECTED'].includes(data.applicationStatus) || evaluationBlockedForUser(data)}
|
||||
sourceId={data.id}
|
||||
applicationId={data.applicationId}
|
||||
companyId={data.companyId}
|
||||
sourceName="evaluation"/>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -0,0 +1,300 @@
|
||||
import React, { useMemo, useState, useCallback, useEffect, useRef } from 'react';
|
||||
import { useForm, useFieldArray } from 'react-hook-form';
|
||||
import { isEmpty, head, pluck } from 'ramda';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
import { klona } from 'klona';
|
||||
|
||||
// tools
|
||||
import uniqid from '../../../../helpers/uniqid';
|
||||
|
||||
// components
|
||||
import FormField from '../../../../components/FormField';
|
||||
import { Button } from 'primereact/button';
|
||||
import { Dialog } from 'primereact/dialog';
|
||||
import { Toast } from 'primereact/toast';
|
||||
import CompanyService from '../../../../service/company-service';
|
||||
import FileSelect from '../../../../components/FormField/components/FileSelect';
|
||||
import ApplicationService from '../../../../service/application-service';
|
||||
import set404FromErrorResponse from '../../../../helpers/set404FromErrorResponse';
|
||||
import { storeSet } from '../../../../store';
|
||||
|
||||
const EvaluationExtraFiles = ({
|
||||
sourceId,
|
||||
applicationId,
|
||||
companyId,
|
||||
sourceName,
|
||||
updateFn = () => {
|
||||
},
|
||||
updateCallbackFn = () => {
|
||||
},
|
||||
defaultValue = [],
|
||||
shouldDisable = false
|
||||
}) => {
|
||||
const [chosen, setChosen] = useState('');
|
||||
const [isVisibleCompanyDocsDialog, setIsVisibleCompanyDocsDialog] = useState(false);
|
||||
const [companyDocs, setCompanyDocs] = useState([]);
|
||||
const [companyDocsSelected, setCompanyDocsSelected] = useState([]);
|
||||
const toast = useRef(null);
|
||||
const {
|
||||
control,
|
||||
handleSubmit,
|
||||
formState: { errors },
|
||||
setValue,
|
||||
register,
|
||||
trigger,
|
||||
getValues,
|
||||
watch
|
||||
} = useForm({
|
||||
defaultValues: useMemo(() => {
|
||||
return {
|
||||
items: defaultValue || []
|
||||
};
|
||||
}, [defaultValue]), mode: 'onChange'
|
||||
});
|
||||
const { fields, append, remove } = useFieldArray({
|
||||
control,
|
||||
name: 'items'
|
||||
});
|
||||
|
||||
const watchFields = watch('items');
|
||||
|
||||
const onSubmit = () => {
|
||||
}
|
||||
|
||||
const doUpdateAfterFileUploaded = () => {
|
||||
const formData = getValues();
|
||||
updateFn(formData.items);
|
||||
updateCallbackFn(formData.items);
|
||||
}
|
||||
|
||||
const addNew = () => {
|
||||
const uid = uniqid('f');
|
||||
const newItem = {
|
||||
fieldId: uid,
|
||||
nameValue: '',
|
||||
fileValue: []
|
||||
}
|
||||
append(newItem);
|
||||
setChosen(newItem.fieldId);
|
||||
trigger();
|
||||
};
|
||||
|
||||
const setNewChosen = useCallback((id) => {
|
||||
const chosenObj = head(fields.filter(o => id === o.fieldId));
|
||||
if (chosenObj) {
|
||||
setChosen(chosen === id ? '' : id);
|
||||
}
|
||||
}, [fields, chosen]);
|
||||
|
||||
const removeItem = useCallback((index) => {
|
||||
const chosenObj = klona(fields[index]);
|
||||
remove(index);
|
||||
if (chosen === chosenObj.fieldId) {
|
||||
setChosen('');
|
||||
}
|
||||
const formData = getValues();
|
||||
updateFn(formData.items);
|
||||
updateCallbackFn(formData.items);
|
||||
}, [fields, chosen]);
|
||||
|
||||
const openCompanyArchive = () => {
|
||||
setIsVisibleCompanyDocsDialog(true);
|
||||
}
|
||||
|
||||
const headerCompanyDocsDialog = () => {
|
||||
return <span>{__('Documenti aziendale', 'gepafin')}</span>;
|
||||
}
|
||||
|
||||
const hideCompanyDocsDialog = () => {
|
||||
setIsVisibleCompanyDocsDialog(false);
|
||||
setCompanyDocsSelected([]);
|
||||
}
|
||||
|
||||
const footerPreTecEvalDialog = useCallback(() => {
|
||||
return <div>
|
||||
<Button type="button" label={__('Annulla', 'gepafin')} onClick={hideCompanyDocsDialog} outlined/>
|
||||
<Button
|
||||
type="button"
|
||||
disabled={isEmpty(companyDocsSelected)}
|
||||
label={__('Aggiungi', 'gepafin')} onClick={doImportCompanyDocs}/>
|
||||
</div>
|
||||
}, [companyDocsSelected]);
|
||||
|
||||
const doImportCompanyDocs = useCallback(() => {
|
||||
if (!isEmpty(companyDocsSelected)) {
|
||||
const ids = pluck('id', companyDocsSelected);
|
||||
ApplicationService.setApplicationDocuments(applicationId, setDocsCallback, errSetDocsCallback, [
|
||||
['companyDocumentIds', ids]
|
||||
])
|
||||
}
|
||||
}, [companyDocsSelected]);
|
||||
|
||||
const setDocsCallback = (resp) => {
|
||||
if (resp.status === 'SUCCESS') {
|
||||
if (toast.current && resp.message) {
|
||||
toast.current.show({
|
||||
severity: 'success',
|
||||
summary: '',
|
||||
detail: resp.message
|
||||
});
|
||||
}
|
||||
}
|
||||
setIsVisibleCompanyDocsDialog(false);
|
||||
setCompanyDocsSelected([]);
|
||||
storeSet('unsetAsyncRequest');
|
||||
|
||||
setTimeout(() => {
|
||||
window.location.reload();
|
||||
}, 2500);
|
||||
}
|
||||
|
||||
const errSetDocsCallback = (resp) => {
|
||||
if (toast.current && resp.message) {
|
||||
toast.current.show({
|
||||
severity: resp.status === 'SUCCESS' ? 'info' : 'error',
|
||||
summary: '',
|
||||
detail: resp.message
|
||||
});
|
||||
}
|
||||
setIsVisibleCompanyDocsDialog(false);
|
||||
setCompanyDocsSelected([]);
|
||||
set404FromErrorResponse(resp);
|
||||
storeSet('unsetAsyncRequest');
|
||||
}
|
||||
|
||||
const getDocsCallback = (resp) => {
|
||||
if (resp.status === 'SUCCESS') {
|
||||
setCompanyDocs(resp.data);
|
||||
}
|
||||
}
|
||||
|
||||
const errGetDocsCallback = (resp) => {
|
||||
if (toast.current && resp.message) {
|
||||
toast.current.show({
|
||||
severity: resp.status === 'SUCCESS' ? 'info' : 'error',
|
||||
summary: '',
|
||||
detail: resp.message
|
||||
});
|
||||
}
|
||||
set404FromErrorResponse(resp);
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
CompanyService.getCompanyDocuments(companyId, getDocsCallback, errGetDocsCallback, [
|
||||
['documentType', 'COMPANY_DOCUMENT']
|
||||
])
|
||||
}, [companyId]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="fieldsRepeater">
|
||||
<form className="appForm" onSubmit={handleSubmit(onSubmit)}>
|
||||
{watchFields
|
||||
? watchFields.map((o, index) => <div key={o.fieldId}
|
||||
className="fieldsRepeater__panel p-panel p-component">
|
||||
<div className="fieldsRepeater__heading p-panel p-panel-header">
|
||||
<span onClick={() => setNewChosen(o.fieldId)}>{o.nameValue}</span>
|
||||
<Button icon="pi pi-times"
|
||||
disabled={shouldDisable}
|
||||
outlined
|
||||
severity="danger"
|
||||
className="actionBtn"
|
||||
type="button"
|
||||
aria-label={__('Cancella', 'gepafin')}
|
||||
onClick={() => removeItem(index)}/>
|
||||
</div>
|
||||
<div className="fieldsRepeater__fields p-panel-content" data-hide={chosen !== o.fieldId}>
|
||||
<FormField
|
||||
type="textinput"
|
||||
disabled={shouldDisable}
|
||||
fieldName={`items.${index}.nameValue`}
|
||||
label={__('Titolo del file', 'gepafin')}
|
||||
control={control}
|
||||
errors={errors}
|
||||
defaultValue={o.nameValue}
|
||||
config={{ required: __('È obbligatorio', 'gepafin') }}
|
||||
/>
|
||||
<FormField
|
||||
type="fileupload"
|
||||
disabled={isEmpty(o.nameValue) || shouldDisable}
|
||||
setDataFn={setValue}
|
||||
saveFormCallback={doUpdateAfterFileUploaded}
|
||||
fieldName={`items.${index}.fileValue`}
|
||||
label={__('File', 'gepafin')}
|
||||
control={control}
|
||||
register={register}
|
||||
errors={errors}
|
||||
defaultValue={o.fileValue ? o.fileValue : []}
|
||||
accept={[]}
|
||||
source={sourceName}
|
||||
sourceId={sourceId}
|
||||
multiple={false}
|
||||
deleteOnBackend={true}
|
||||
config={{ required: __('È obbligatorio', 'gepafin') }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
</form>
|
||||
<div style={{ display: 'flex', gap: '10px' }}>
|
||||
<Button
|
||||
className="fieldsRepeater__addNew"
|
||||
outlined
|
||||
type="button"
|
||||
disabled={(watchFields && watchFields.filter(o => isEmpty(o.nameValue) || isEmpty(o.fileValue)).length > 0) || shouldDisable}
|
||||
onClick={addNew}
|
||||
label={__('Aggiungi nuovo file', 'gepafin')}
|
||||
/>
|
||||
<Button
|
||||
className="fieldsRepeater__addNew"
|
||||
outlined
|
||||
type="button"
|
||||
disabled={(watchFields && watchFields.filter(o => isEmpty(o.nameValue) || isEmpty(o.fileValue)).length > 0) || shouldDisable}
|
||||
onClick={openCompanyArchive}
|
||||
label={__('Documenti aziendale', 'gepafin')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<Toast ref={toast}/>
|
||||
<Dialog
|
||||
visible={isVisibleCompanyDocsDialog}
|
||||
modal
|
||||
header={headerCompanyDocsDialog}
|
||||
footer={footerPreTecEvalDialog}
|
||||
style={{ maxWidth: '600px', width: '100%' }}
|
||||
onHide={hideCompanyDocsDialog}>
|
||||
<div className="appForm__field">
|
||||
{/*<label
|
||||
className={classNames({
|
||||
'p-error': isEmpty(companyDocsSelected)
|
||||
})}>
|
||||
{__('Documenti', 'gepafin')}
|
||||
</label>*/}
|
||||
<FileSelect
|
||||
fieldName="companyDocsSelected"
|
||||
label={null}
|
||||
errors={{}}
|
||||
register={() => {}}
|
||||
key={companyDocsSelected}
|
||||
defaultValue={companyDocsSelected}
|
||||
options={companyDocs}
|
||||
sourceId="0"
|
||||
source="DOCUMENT"
|
||||
documentCategories={[]}
|
||||
attachFilesCallback={(o) => {
|
||||
setCompanyDocsSelected(prev => {
|
||||
const newSelected = [...prev];
|
||||
if (!newSelected.find(s => s.id === o.id)) {
|
||||
newSelected.push(o);
|
||||
}
|
||||
return newSelected;
|
||||
})
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</Dialog>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default EvaluationExtraFiles;
|
||||
@@ -1,149 +0,0 @@
|
||||
import React, { useMemo, useState, useCallback } from 'react';
|
||||
import { useForm, useFieldArray } from 'react-hook-form';
|
||||
import { isEmpty, head } from 'ramda';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
import { klona } from 'klona';
|
||||
|
||||
// tools
|
||||
import uniqid from '../../../../helpers/uniqid';
|
||||
|
||||
// components
|
||||
import FormField from '../../../../components/FormField';
|
||||
import { Button } from 'primereact/button';
|
||||
|
||||
const RepeaterFields = ({
|
||||
sourceId,
|
||||
sourceName,
|
||||
updateFn = () => {
|
||||
},
|
||||
updateCallbackFn = () => {
|
||||
},
|
||||
defaultValue = [],
|
||||
shouldDisable = false
|
||||
}) => {
|
||||
const [chosen, setChosen] = useState('');
|
||||
const {
|
||||
control,
|
||||
handleSubmit,
|
||||
formState: { errors },
|
||||
setValue,
|
||||
register,
|
||||
trigger,
|
||||
getValues,
|
||||
watch
|
||||
} = useForm({
|
||||
defaultValues: useMemo(() => {
|
||||
return {
|
||||
items: defaultValue || []
|
||||
};
|
||||
}, [defaultValue]), mode: 'onChange'
|
||||
});
|
||||
const { fields, append, remove } = useFieldArray({
|
||||
control,
|
||||
name: 'items'
|
||||
});
|
||||
|
||||
const watchFields = watch('items');
|
||||
|
||||
const onSubmit = () => {
|
||||
}
|
||||
|
||||
const doUpdateAfterFileUploaded = () => {
|
||||
const formData = getValues();
|
||||
updateFn(formData.items);
|
||||
updateCallbackFn(formData.items);
|
||||
}
|
||||
|
||||
const addNew = () => {
|
||||
const uid = uniqid('f');
|
||||
const newItem = {
|
||||
fieldId: uid,
|
||||
nameValue: '',
|
||||
fileValue: []
|
||||
}
|
||||
append(newItem);
|
||||
setChosen(newItem.fieldId);
|
||||
trigger();
|
||||
};
|
||||
|
||||
const setNewChosen = useCallback((id) => {
|
||||
const chosenObj = head(fields.filter(o => id === o.fieldId));
|
||||
if (chosenObj) {
|
||||
setChosen(chosen === id ? '' : id);
|
||||
}
|
||||
}, [fields, chosen]);
|
||||
|
||||
const removeItem = useCallback((index) => {
|
||||
const chosenObj = klona(fields[index]);
|
||||
remove(index);
|
||||
if (chosen === chosenObj.fieldId) {
|
||||
setChosen('');
|
||||
}
|
||||
const formData = getValues();
|
||||
updateFn(formData.items);
|
||||
updateCallbackFn(formData.items);
|
||||
}, [fields, chosen]);
|
||||
|
||||
return (
|
||||
<div className="fieldsRepeater">
|
||||
<form className="appForm" onSubmit={handleSubmit(onSubmit)}>
|
||||
{watchFields
|
||||
? watchFields.map((o, index) => <div key={o.fieldId}
|
||||
className="fieldsRepeater__panel p-panel p-component">
|
||||
<div className="fieldsRepeater__heading p-panel p-panel-header">
|
||||
<span onClick={() => setNewChosen(o.fieldId)}>{o.nameValue}</span>
|
||||
<Button icon="pi pi-times"
|
||||
disabled={shouldDisable}
|
||||
outlined
|
||||
severity="danger"
|
||||
className="actionBtn"
|
||||
type="button"
|
||||
aria-label={__('Cancella', 'gepafin')}
|
||||
onClick={() => removeItem(index)}/>
|
||||
</div>
|
||||
<div className="fieldsRepeater__fields p-panel-content" data-hide={chosen !== o.fieldId}>
|
||||
<FormField
|
||||
type="textinput"
|
||||
disabled={shouldDisable}
|
||||
fieldName={`items.${index}.nameValue`}
|
||||
label={__('Titolo del file', 'gepafin')}
|
||||
control={control}
|
||||
errors={errors}
|
||||
defaultValue={o.nameValue}
|
||||
config={{ required: __('È obbligatorio', 'gepafin') }}
|
||||
/>
|
||||
<FormField
|
||||
type="fileupload"
|
||||
disabled={isEmpty(o.nameValue) || shouldDisable}
|
||||
setDataFn={setValue}
|
||||
saveFormCallback={doUpdateAfterFileUploaded}
|
||||
fieldName={`items.${index}.fileValue`}
|
||||
label={__('File', 'gepafin')}
|
||||
control={control}
|
||||
register={register}
|
||||
errors={errors}
|
||||
defaultValue={o.fileValue ? o.fileValue : []}
|
||||
accept={[]}
|
||||
source={sourceName}
|
||||
sourceId={sourceId}
|
||||
multiple={false}
|
||||
deleteOnBackend={true}
|
||||
config={{ required: __('È obbligatorio', 'gepafin') }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
</form>
|
||||
<Button
|
||||
className="fieldsRepeater__addNew"
|
||||
outlined
|
||||
type="button"
|
||||
disabled={(watchFields && watchFields.filter(o => isEmpty(o.nameValue) || isEmpty(o.fileValue)).length > 0) || shouldDisable}
|
||||
onClick={addNew}
|
||||
label={__('Aggiungi nuovo file', 'gepafin')}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default RepeaterFields;
|
||||
@@ -50,7 +50,7 @@ import { InputTextarea } from 'primereact/inputtextarea';
|
||||
import { InputText } from 'primereact/inputtext';
|
||||
import { Dropdown } from 'primereact/dropdown';
|
||||
import ListOfFiles from './components/ListOfFiles';
|
||||
import RepeaterFields from './components/RepeaterFields';
|
||||
import EvaluationExtraFiles from './components/EvaluationExtraFiles';
|
||||
import ApplicationInfo from './components/ApplicationInfo';
|
||||
import ApplicationDownloadFiles from './components/ApplicationDownloadFiles';
|
||||
import FormField from '../../components/FormField';
|
||||
@@ -1288,7 +1288,7 @@ const DomandaEditPreInstructor = () => {
|
||||
|
||||
<div className="appPageSection">
|
||||
<h2>{__('Documenti aggiuntivi', 'gepafin')}</h2>
|
||||
<RepeaterFields
|
||||
<EvaluationExtraFiles
|
||||
defaultValue={data.evaluationDocument ?? []}
|
||||
updateFn={(data) => updateEvaluationValue(
|
||||
data,
|
||||
@@ -1305,6 +1305,8 @@ const DomandaEditPreInstructor = () => {
|
||||
})}
|
||||
shouldDisable={['APPROVED', 'REJECTED'].includes(data.applicationStatus) || evaluationBlockedForUser(data)}
|
||||
sourceId={data.id}
|
||||
applicationId={data.applicationId}
|
||||
companyId={data.companyId}
|
||||
sourceName="evaluation"/>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user