- merged with develop;
This commit is contained in:
Vitalii Kiiko
@@ -1,8 +1,14 @@
|
||||
import React, { useEffect, useRef, useState } from 'react';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
import { isEmpty } from 'ramda';
|
||||
import { isEmpty, pathOr, isNil } from 'ramda';
|
||||
import { wrap } from 'object-path-immutable';
|
||||
|
||||
// store
|
||||
import AppointmentService from '../../../../service/appointment-service';
|
||||
|
||||
// tools
|
||||
import set404FromErrorResponse from '../../../../helpers/set404FromErrorResponse';
|
||||
|
||||
// components
|
||||
import { Button } from 'primereact/button';
|
||||
import { Dialog } from 'primereact/dialog';
|
||||
@@ -11,14 +17,11 @@ import { Dropdown } from 'primereact/dropdown';
|
||||
import { classNames } from 'primereact/utils';
|
||||
import { InputSwitch } from 'primereact/inputswitch';
|
||||
import { InputText } from 'primereact/inputtext';
|
||||
|
||||
import { classificationType, protocolType } from '../../../../configData';
|
||||
import AppointmentService from '../../../../service/appointment-service';
|
||||
import set404FromErrorResponse from '../../../../helpers/set404FromErrorResponse';
|
||||
import { storeSet } from '../../../../store';
|
||||
import { Toast } from 'primereact/toast';
|
||||
|
||||
const ArchiveDocument = ({ applicationId, ndg = '', fileId = 0 }) => {
|
||||
import { classificationType, protocolType } from '../../../../configData';
|
||||
|
||||
const ArchiveDocument = ({ applicationId, ndg = '', fileId = 0, docAttachmentId = null, updateFn = () => {} }) => {
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [isVisibleDialog, setIsVisibleDialog] = useState(false);
|
||||
const [modalData, setModalData] = useState({});
|
||||
@@ -87,19 +90,29 @@ const ArchiveDocument = ({ applicationId, ndg = '', fileId = 0 }) => {
|
||||
|
||||
const submitCallback = (data) => {
|
||||
if (data.status === 'SUCCESS') {
|
||||
console.log(data.data);
|
||||
if (toast.current && data.message) {
|
||||
toast.current.show({
|
||||
severity: 'success',
|
||||
summary: '',
|
||||
detail: data.message
|
||||
});
|
||||
}
|
||||
const documentAttachmentId = pathOr('fake_id', ['documentAttachmentId'], data.data);
|
||||
updateFn(documentAttachmentId);
|
||||
}
|
||||
setIsVisibleDialog(false);
|
||||
setLoading(false);
|
||||
}
|
||||
|
||||
const errSubmitCallback = (data) => {
|
||||
if (toast.current && data.message) {
|
||||
toast.current.show({
|
||||
severity: 'error',
|
||||
severity: data.status === 'SUCCESS' ? 'info' : 'error',
|
||||
summary: '',
|
||||
detail: data.message
|
||||
});
|
||||
}
|
||||
setIsVisibleDialog(false);
|
||||
set404FromErrorResponse(data);
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -119,7 +132,7 @@ const ArchiveDocument = ({ applicationId, ndg = '', fileId = 0 }) => {
|
||||
setTypes(protocolType.map(o => ({ value: o.id, label: o.name })));
|
||||
}, []);
|
||||
|
||||
return (!isEmpty(ndg)
|
||||
return (!isEmpty(ndg) && !isNil(ndg) && !docAttachmentId
|
||||
? <>
|
||||
<Toast ref={toast}/>
|
||||
<Button icon="pi pi-file-export"
|
||||
|
||||
@@ -3,22 +3,35 @@ import { Button } from 'primereact/button';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
import { isNil } from 'ramda';
|
||||
import ArchiveDocument from '../ArchiveDocument';
|
||||
import renderHtmlContent from '../../../../helpers/renderHtmlContent';
|
||||
import uniqid from '../../../../helpers/uniqid';
|
||||
|
||||
const ListOfFiles = ({ files, updateFn, shouldDisableFieldFn, name, ndg, applicationId }) => {
|
||||
|
||||
return (
|
||||
<ol className="appPageSection__list">
|
||||
{files.map((o, i) => <li key={o.id} className="appPageSection__listItem">
|
||||
{files.map((o, i) => <li key={`${o.id}_${uniqid('f')}`} className="appPageSection__listItem">
|
||||
<div className="appPageSection__listItemRow">
|
||||
<span>{o.label}</span>
|
||||
<div>{renderHtmlContent(o.label)}</div>
|
||||
<div className="appPageSection__iconActions">
|
||||
{o.fileDetail && o.fileDetail.length === 1
|
||||
? <Button icon="pi pi-eye" rounded
|
||||
? <>
|
||||
<Button icon="pi pi-eye" rounded
|
||||
onClick={() => {
|
||||
window.open(o.fileDetail[0].filePath, '_blank').focus()
|
||||
}}
|
||||
outlined severity="info"
|
||||
aria-label={__('Mostra', 'gepafin')}/> : null}
|
||||
aria-label={__('Mostra', 'gepafin')}/>
|
||||
<ArchiveDocument
|
||||
ndg={ndg}
|
||||
applicationId={applicationId}
|
||||
fileId={o.fileDetail[0].id}
|
||||
updateFn={(val) => updateFn(
|
||||
val,
|
||||
[name, i, 'fileDetail', 0, 'documentAttachmentId']
|
||||
)}
|
||||
docAttachmentId={o.fileDetail[0].documentAttachmentId}/>
|
||||
</> : null}
|
||||
<Button icon="pi pi-thumbs-up" rounded outlined
|
||||
disabled={shouldDisableFieldFn(name)}
|
||||
severity={!isNil(o.valid) && o.valid ? 'success' : 'secondary'}
|
||||
@@ -45,7 +58,7 @@ const ListOfFiles = ({ files, updateFn, shouldDisableFieldFn, name, ndg, applica
|
||||
flexDirection: 'column',
|
||||
gap: '10px'
|
||||
}}>
|
||||
{o.fileDetail.map((k) => <li key={k.id} style={{
|
||||
{o.fileDetail.map((k, ind) => <li key={k.id} style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
@@ -53,7 +66,15 @@ const ListOfFiles = ({ files, updateFn, shouldDisableFieldFn, name, ndg, applica
|
||||
}}>
|
||||
<span>{k.name}</span>
|
||||
<div className="appPageSection__iconActions">
|
||||
<ArchiveDocument ndg={ndg} applicationId={applicationId} fileId={k.id}/>
|
||||
<ArchiveDocument
|
||||
ndg={ndg}
|
||||
applicationId={applicationId}
|
||||
fileId={k.id}
|
||||
updateFn={(val) => updateFn(
|
||||
val,
|
||||
[name, i, 'fileDetail', ind, 'documentAttachmentId']
|
||||
)}
|
||||
docAttachmentId={k.documentAttachmentId}/>
|
||||
<Button icon="pi pi-eye" rounded
|
||||
onClick={() => {
|
||||
window.open(k.filePath, '_blank').focus()
|
||||
|
||||
@@ -0,0 +1,149 @@
|
||||
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={false}
|
||||
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;
|
||||
Reference in New Issue
Block a user