- added setting for documents category selection for fileselect;

- added confirmation popup for fileselect and fileinput;
This commit is contained in:
Vitalii Kiiko
2025-03-12 12:45:08 +01:00
parent c9770eb91b
commit 8a62213bad
10 changed files with 77 additions and 15 deletions

View File

@@ -3,12 +3,15 @@ import { classNames } from 'primereact/utils';
import { __ } from '@wordpress/i18n'; import { __ } from '@wordpress/i18n';
import { isEmpty, pathOr, pluck } from 'ramda'; import { isEmpty, pathOr, pluck } from 'ramda';
// service
import FileUploadService from '../../../../service/file-upload-service';
import CompanyDocumentsService from '../../../../service/company-documents-service';
// components // components
import { ListBox } from 'primereact/listbox'; import { ListBox } from 'primereact/listbox';
import { Button } from 'primereact/button'; import { Button } from 'primereact/button';
import CompanyDocumentsService from '../../../../service/company-documents-service';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import FileUploadService from '../../../../service/file-upload-service'; import { ConfirmPopup, confirmPopup } from 'primereact/confirmpopup';
const FileSelect = ({ const FileSelect = ({
fieldName, fieldName,
@@ -23,6 +26,7 @@ const FileSelect = ({
options = [], options = [],
sourceId = 0, sourceId = 0,
source = 'DOCUMENT', source = 'DOCUMENT',
documentCategories = [],
saveFormCallback saveFormCallback
}) => { }) => {
//const [stateFieldData, setStateFieldData] = useState([]); //const [stateFieldData, setStateFieldData] = useState([]);
@@ -87,9 +91,18 @@ const FileSelect = ({
console.log('err', err); console.log('err', err);
} }
/*useEffect(() => { const confirmDelete = (event, id) => {
console.log('selectedUnconfirmed', selectedUnconfirmed) confirmPopup({
}, [selectedUnconfirmed]);*/ target: event.currentTarget,
message: __('Sei sicuro di cancellare il file?', 'gepafin'),
acceptLabel: __('Si', 'gepafin'),
icon: 'pi pi-info-circle',
defaultFocus: 'reject',
acceptClassName: 'p-button-danger',
accept: () => removeAttached(id),
reject: () => {}
});
};
useEffect(() => { useEffect(() => {
stateFieldData.current = defaultValue; stateFieldData.current = defaultValue;
@@ -98,7 +111,11 @@ const FileSelect = ({
useEffect(() => { useEffect(() => {
if (!isEmpty(options)) { if (!isEmpty(options)) {
const optionsDefault = options.reduce((acc, cur) => { const optionsDefault = options
.filter(o => isEmpty(documentCategories)
? o
: documentCategories.includes(o.category.id))
.reduce((acc, cur) => {
const catName = pathOr('', ['category', 'categoryName'], cur); const catName = pathOr('', ['category', 'categoryName'], cur);
const catLabel = pathOr('', ['category', 'description'], cur); const catLabel = pathOr('', ['category', 'description'], cur);
@@ -163,7 +180,7 @@ const FileSelect = ({
<Button icon="pi pi-times" rounded <Button icon="pi pi-times" rounded
type="button" type="button"
size="small" size="small"
onClick={() => removeAttached(o.id)} onClick={(e) => confirmDelete(e, o.id)}
outlined severity="danger" outlined severity="danger"
aria-label={__('Cancella', 'gepafin')}/> aria-label={__('Cancella', 'gepafin')}/>
</div> </div>
@@ -188,6 +205,7 @@ const FileSelect = ({
</div> </div>
: null} : null}
{infoText ? <small>{infoText}</small> : null} {infoText ? <small>{infoText}</small> : null}
<ConfirmPopup />
</>) </>)
} }

View File

@@ -16,6 +16,7 @@ import { Button } from 'primereact/button';
import { defaultMaxFileSize, mimeTypes } from '../../../../configData'; import { defaultMaxFileSize, mimeTypes } from '../../../../configData';
import getFormatedFileSizeText from '../../../../helpers/getFormatedFileSizeText'; import getFormatedFileSizeText from '../../../../helpers/getFormatedFileSizeText';
import { ConfirmPopup, confirmPopup } from 'primereact/confirmpopup';
const Fileupload = ({ const Fileupload = ({
fieldName, fieldName,
@@ -72,6 +73,19 @@ const Fileupload = ({
console.log('err', err); console.log('err', err);
} }
const confirmDelete = (event, file) => {
confirmPopup({
target: event.currentTarget,
message: __('Sei sicuro di cancellare il file?', 'gepafin'),
acceptLabel: __('Si', 'gepafin'),
icon: 'pi pi-info-circle',
defaultFocus: 'reject',
acceptClassName: 'p-button-danger',
accept: () => onTemplateRemove(file),
reject: () => {}
});
};
const itemTemplate = (file) => { const itemTemplate = (file) => {
let fileName = file.fileName ? file.fileName : file.name; let fileName = file.fileName ? file.fileName : file.name;
return ( return (
@@ -91,7 +105,7 @@ const Fileupload = ({
type="button" type="button"
disabled={disabled} disabled={disabled}
aria-label={__('Anulla', 'gepafin')} aria-label={__('Anulla', 'gepafin')}
onClick={() => onTemplateRemove(file)}/> onClick={(e) => confirmDelete(e, file)}/>
</div> </div>
</div> </div>
); );
@@ -213,6 +227,7 @@ const Fileupload = ({
onBeforeSelect={onBeforeSelect} onBeforeSelect={onBeforeSelect}
uploadHandler={customBase64Uploader}/> uploadHandler={customBase64Uploader}/>
{infoText ? <small>{infoText}</small> : null} {infoText ? <small>{infoText}</small> : null}
<ConfirmPopup />
</> </>
: null : null
) )

View File

@@ -78,7 +78,6 @@ const Wysiwyg = ({
clipboard: { clipboard: {
matchers: [ matchers: [
[ Node.ELEMENT_NODE, function(node, delta) { [ Node.ELEMENT_NODE, function(node, delta) {
console.log('here')
const ops = delta.ops.map((op) => ({insert: op.insert})); const ops = delta.ops.map((op) => ({insert: op.insert}));
return new Delta(ops) return new Delta(ops)
}] }]

View File

@@ -3,7 +3,7 @@ import { __ } from '@wordpress/i18n';
import { useLocation } from 'react-router-dom'; import { useLocation } from 'react-router-dom';
// store // store
import { useStore, storeSet } from '../../store'; import { useStore, storeSet, storeGet } from '../../store';
// components // components
import AppSidebar from './components/AppSidebar'; import AppSidebar from './components/AppSidebar';

View File

@@ -722,6 +722,7 @@ const BandoApplication = () => {
} }
const step = head(o.settings.filter(o => o.name === 'step')); const step = head(o.settings.filter(o => o.name === 'step'));
const mime = head(o.settings.filter(o => o.name === 'mime')); const mime = head(o.settings.filter(o => o.name === 'mime'));
const documentCategories = head(o.settings.filter(o => o.name === 'documentCategories'));
const formula = head(o.settings.filter(o => o.name === 'formula')); const formula = head(o.settings.filter(o => o.name === 'formula'));
let mimeValue = ''; let mimeValue = '';
@@ -773,6 +774,7 @@ const BandoApplication = () => {
defaultValue={values[o.id] ? values[o.id] : ''} defaultValue={values[o.id] ? values[o.id] : ''}
maxFractionDigits={step ? step.value : 0} maxFractionDigits={step ? step.value : 0}
accept={mimeValue} accept={mimeValue}
documentCategories={documentCategories ? documentCategories.value : []}
config={validations} config={validations}
options={options ? options.value : []} options={options ? options.value : []}
setDataFn={setValue} setDataFn={setValue}

View File

@@ -3,7 +3,7 @@ import { __ } from '@wordpress/i18n';
import { head, is, isEmpty, isNil, uniq } from 'ramda'; import { head, is, isEmpty, isNil, uniq } from 'ramda';
// store // store
import { storeGet } from '../../../../../../store'; import { storeGet, useStore } from '../../../../../../store';
// tools // tools
import renderHtmlContent from '../../../../../../helpers/renderHtmlContent'; import renderHtmlContent from '../../../../../../helpers/renderHtmlContent';
@@ -23,6 +23,7 @@ import { mimeTypes } from '../../../../../../configData';
const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus }) => { const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus }) => {
const [existingVars, setExistingVars] = useState([]); const [existingVars, setExistingVars] = useState([]);
const documentCategories = useStore().main.documentCategories();
const settingLabels = { const settingLabels = {
label: __('Label', 'gepafin'), label: __('Label', 'gepafin'),
@@ -32,6 +33,7 @@ const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus }) => {
isDelegation: __('Delega', 'gepafin'), isDelegation: __('Delega', 'gepafin'),
options: __('Opzioni', 'gepafin'), options: __('Opzioni', 'gepafin'),
mime: __('Tipo di file', 'gepafin'), mime: __('Tipo di file', 'gepafin'),
documentCategories: __('Categorie dei documenti', 'gepafin'),
text: __('Testo formattato', 'gepafin'), text: __('Testo formattato', 'gepafin'),
table_columns: '', table_columns: '',
criteria_table_columns: '', criteria_table_columns: '',
@@ -79,6 +81,13 @@ const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus }) => {
optionLabel="name" optionLabel="name"
display="chip" display="chip"
placeholder={__('Scegli', 'gepafin')}/> placeholder={__('Scegli', 'gepafin')}/>
} else if (setting.name === 'documentCategories') {
return <MultiSelect
value={is(Array, setting.value) ? setting.value : []}
onChange={(e) => updateDataFn(setting.name, e.value)}
options={documentCategories}
display="chip"
placeholder={__('Scegli', 'gepafin')}/>
} else if (setting.name === 'text') { } else if (setting.name === 'text') {
return <Editor return <Editor
value={setting.value} value={setting.value}

View File

@@ -25,6 +25,7 @@ import BandoService from '../../service/bando-service';
// TODO temp data // TODO temp data
import { elementItems } from '../../tempData'; import { elementItems } from '../../tempData';
import DocumentCategoryService from '../../service/document-category-service';
const BandoFormsEdit = () => { const BandoFormsEdit = () => {
const { id, formId } = useParams(); const { id, formId } = useParams();
@@ -257,6 +258,15 @@ const BandoFormsEdit = () => {
set404FromErrorResponse(data); set404FromErrorResponse(data);
} }
const getCategories = (resp) => {
if (resp.status === 'SUCCESS') {
storeSet.main.documentCategories(resp.data.map(o => ({value: o.id, label: o.description})));
}
}
const errGetCategories = () => {
}
useEffect(() => { useEffect(() => {
const bandoId = getBandoId(); const bandoId = getBandoId();
const parsedFormId = parseInt(formId) const parsedFormId = parseInt(formId)
@@ -283,6 +293,10 @@ const BandoFormsEdit = () => {
} }
}, [id, formId]); }, [id, formId]);
useEffect(() => {
DocumentCategoryService.getCategories(getCategories, errGetCategories)
}, []);
return ( return (
<div className="appPage"> <div className="appPage">
<div className="appPage__pageHeader"> <div className="appPage__pageHeader">

View File

@@ -13,7 +13,7 @@ import { Dialog } from 'primereact/dialog';
import { Button } from 'primereact/button'; import { Button } from 'primereact/button';
import { Dropdown } from 'primereact/dropdown'; import { Dropdown } from 'primereact/dropdown';
import { InputText } from 'primereact/inputtext'; import { InputText } from 'primereact/inputtext';
import { useStore } from '../../store'; import { storeSet, useStore } from '../../store';
import { Calendar } from 'primereact/calendar'; import { Calendar } from 'primereact/calendar';
import { FileUpload } from 'primereact/fileupload'; import { FileUpload } from 'primereact/fileupload';
import formatDateString from '../../helpers/formatDateString'; import formatDateString from '../../helpers/formatDateString';
@@ -24,7 +24,7 @@ const DocumentsBeneficiary = () => {
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const chosenCompanyId = useStore().main.chosenCompanyId(); const chosenCompanyId = useStore().main.chosenCompanyId();
const [isVisibleAddNewDialog, setIsVisibleAddNewDialog] = useState(false); const [isVisibleAddNewDialog, setIsVisibleAddNewDialog] = useState(false);
const [categories, setCategories] = useState(false); const documentCategories= useStore().main.documentCategories();
const [newFileData, setNewFileData] = useState({}); const [newFileData, setNewFileData] = useState({});
const [fileAttached, setFileAttached] = useState([]); const [fileAttached, setFileAttached] = useState([]);
const [reloadHash, setReloadHash] = useState(0); const [reloadHash, setReloadHash] = useState(0);
@@ -120,7 +120,7 @@ const DocumentsBeneficiary = () => {
const getCategories = (resp) => { const getCategories = (resp) => {
if (resp.status === 'SUCCESS') { if (resp.status === 'SUCCESS') {
setCategories(resp.data.map(o => ({value: o.id, label: o.description}))); storeSet.main.documentCategories(resp.data.map(o => ({value: o.id, label: o.description})));
} }
setLoading(false); setLoading(false);
} }
@@ -192,7 +192,7 @@ const DocumentsBeneficiary = () => {
value={newFileData.documentCategoryId} value={newFileData.documentCategoryId}
invalid={isEmpty(newFileData.documentCategoryId) || isNil(newFileData.documentCategoryId) || newFileData.documentCategoryId === 0} invalid={isEmpty(newFileData.documentCategoryId) || isNil(newFileData.documentCategoryId) || newFileData.documentCategoryId === 0}
onChange={(e) => onUpdateFieldValue(e.value, 'documentCategoryId')} onChange={(e) => onUpdateFieldValue(e.value, 'documentCategoryId')}
options={categories} options={documentCategories}
optionLabel="label" optionLabel="label"
optionValue="value"/> optionValue="value"/>
</div> </div>

View File

@@ -11,6 +11,7 @@ const initialStore = {
users: [], users: [],
// bando form // bando form
formInitialData: {}, formInitialData: {},
documentCategories: [],
// form builder // form builder
formId: 0, formId: 0,
formLabel: '', formLabel: '',

View File

@@ -495,6 +495,10 @@ export const elementItems = [
name: "label", name: "label",
value: "Seleziona File" value: "Seleziona File"
}, },
{
name: "documentCategories",
value: []
},
{ {
name: "isDelegation", name: "isDelegation",
value: false value: false