BFLOWS/bflows-bandi-fe
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- saving;

Browse Source
This commit is contained in:
Vitalii Kiiko
2025-02-21 16:04:50 +01:00
parent 5893281457
commit a0c6a4895c
1 changed files with 95 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
src/components/FormField/components/FileSelect/index.js
View File

@@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react'; import React, { useCallback, useEffect, useState } from 'react';
import { classNames } from 'primereact/utils'; import { classNames } from 'primereact/utils';
// components // components
@@ -15,43 +15,96 @@ const FileSelect = ({
config = {}, config = {},
infoText = null, infoText = null,
disabled = false, disabled = false,
options = []
}) => { }) => {
const [stateFieldData, setStateFieldData] = useState([]); const [stateFieldData, setStateFieldData] = useState([]);
const [selectedUnconfirmed, setSelectedUnconfirmed] = useState(null); const [selectedUnconfirmed, setSelectedUnconfirmed] = useState(null);
const cities = [ const cities = [
{ {
label: 'Germany', label: 'Company files',
code: 'DE', code: 'company-files',
items: [ items: [
{ label: 'Berlin', value: 'berlin' }, {
{ label: 'Frankfurt', value: 'frankfurt' }, 'id': 589,
{ label: 'Hamburg', value: 'hamburg' }, 'name': 'pdf-3-test.pdf',
{ label: 'Munich', value: 'munich' } 'filePath': 'https://mementoresources.s3.eu-west-1.amazonaws.com/gepafin/staging/call/%2Fapplication/%2Fpdf-1-test_8432561.pdf',
'type': 'DOCUMENT',
'source': 'APPLICATION',
'sourceId': 0,
'createdDate': '2025-02-21T15:33:52.767089176',
'updatedDate': '2025-02-21T15:33:52.767109885',
'documentAttachmentId': null
},
{
'id': 569,
'name': 'pdf-2-test.pdf',
'filePath': 'https://mementoresources.s3.eu-west-1.amazonaws.com/gepafin/staging/call/%2Fapplication/%2Fpdf-1-test_8432561.pdf',
'type': 'DOCUMENT',
'source': 'APPLICATION',
'sourceId': 0,
'createdDate': '2025-02-21T15:33:52.767089176',
'updatedDate': '2025-02-21T15:33:52.767109885',
'documentAttachmentId': null
},
{
'id': 519,
'name': 'pdf-1-test.pdf',
'filePath': 'https://mementoresources.s3.eu-west-1.amazonaws.com/gepafin/staging/call/%2Fapplication/%2Fpdf-1-test_8432561.pdf',
'type': 'DOCUMENT',
'source': 'APPLICATION',
'sourceId': 0,
'createdDate': '2025-02-21T15:33:52.767089176',
'updatedDate': '2025-02-21T15:33:52.767109885',
'documentAttachmentId': null
}
] ]
}, },
{ {
label: 'USA', label: 'Personal files',
code: 'US', code: 'personal-files',
items: [ items: [
{ label: 'Chicago', value: 'chicago' }, {
{ label: 'Los Angeles', value: 'los Angeles' }, 'id': 179,
{ label: 'New York', value: 'New York' }, 'name': 'pdf-13-test.pdf',
{ label: 'San Francisco', value: 'San Francisco' } 'filePath': 'https://mementoresources.s3.eu-west-1.amazonaws.com/gepafin/staging/call/%2Fapplication/%2Fpdf-1-test_8432561.pdf',
] 'type': 'DOCUMENT',
'source': 'APPLICATION',
'sourceId': 0,
'createdDate': '2025-02-21T15:33:52.767089176',
'updatedDate': '2025-02-21T15:33:52.767109885',
'documentAttachmentId': null
}, },
{ {
label: 'Japan', 'id': 169,
code: 'JP', 'name': 'pdf-12-test.pdf',
items: [ 'filePath': 'https://mementoresources.s3.eu-west-1.amazonaws.com/gepafin/staging/call/%2Fapplication/%2Fpdf-1-test_8432561.pdf',
{ label: 'Kyoto', value: 'Kyoto' }, 'type': 'DOCUMENT',
{ label: 'Osaka', value: 'Osaka' }, 'source': 'APPLICATION',
{ label: 'Tokyo', value: 'Tokyo' }, 'sourceId': 0,
{ label: 'Yokohama', value: 'Yokohama' } 'createdDate': '2025-02-21T15:33:52.767089176',
'updatedDate': '2025-02-21T15:33:52.767109885',
'documentAttachmentId': null
},
{
'id': 129,
'name': 'pdf-11-test.pdf',
'filePath': 'https://mementoresources.s3.eu-west-1.amazonaws.com/gepafin/staging/call/%2Fapplication/%2Fpdf-1-test_8432561.pdf',
'type': 'DOCUMENT',
'source': 'APPLICATION',
'sourceId': 0,
'createdDate': '2025-02-21T15:33:52.767089176',
'updatedDate': '2025-02-21T15:33:52.767109885',
'documentAttachmentId': null
}
] ]
} }
]; ];
const attachSelectedFiles = useCallback(() => {
setStateFieldData([...stateFieldData, ...selectedUnconfirmed]);
setSelectedUnconfirmed([]);
}, [selectedUnconfirmed, stateFieldData])
useEffect(() => { useEffect(() => {
console.log('selectedUnconfirmed', selectedUnconfirmed) console.log('selectedUnconfirmed', selectedUnconfirmed)
}, [selectedUnconfirmed]); }, [selectedUnconfirmed]);
@@ -68,25 +121,30 @@ const FileSelect = ({
return ( return (
<> <>
<label htmlFor={fieldName} className={classNames({ 'p-error': errors[fieldName] })}> <label htmlFor={fieldName} className={classNames({ 'p-error': errors[fieldName] })}>
{label}{config.required || config.isRequired ? <span className="appForm__field--required">*</span> : null} {label}{config.required || config.isRequired ?
<span className="appForm__field--required">*</span> : null}
</label> </label>
<div className="fileselectInner"> <div className="fileselectInner">
<ListBox multiple <ListBox multiple
value={selectedUnconfirmed} value={selectedUnconfirmed}
onChange={(e) => setSelectedUnconfirmed(e.value)} onChange={(e) => setSelectedUnconfirmed(e.value)}
options={cities} options={cities}
optionLabel="label" optionLabel="name"
optionGroupLabel="label" optionGroupLabel="label"
optionGroupChildren="items" optionGroupChildren="items"
className="w-full md:w-14rem" className="w-full md:w-14rem"
listStyle={{ maxHeight: '130px' }} /> listStyle={{ maxHeight: '130px' }}/>
<div className="fileselectInner__selectedFiles"> <div className="fileselectInner__selectedFiles">
<Button <Button
severity="success" severity="success"
label={__('Conferma selezionati', 'gepafin')} icon="pi pi-plus" size="small" iconPos="right" /> onClick={attachSelectedFiles}
label={__('Conferma selezionati', 'gepafin')}
icon="pi pi-plus" size="small" iconPos="right"/>
<p>{__('Selezionati')}</p> <p>{__('Selezionati')}</p>
<ul> <ul>
{[...stateFieldData].map(o => <li key={o.id}>
{o.name}
</li>)}
</ul> </ul>
</div> </div>
</div> </div>