chamomind/jws-frontend
chamomind/jws-frontend
7
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

refactor: use UploadFileGroup

Browse source
This commit is contained in:
Net 2024-09-20 09:20:59 +07:00
parent 801e3c30bb
commit 78c5eb73f8
1 changed files with 173 additions and 81 deletions
Download patch file Download diff file Expand all files Collapse all files

254
src/pages/03_customer-management/components/employer/EmployerFormBranch.vue
View file

@ -7,12 +7,14 @@ import { CustomerCreate } from 'stores/customer/types';
import EmployerFormAbout from './EmployerFormAbout.vue'; import EmployerFormAbout from './EmployerFormAbout.vue';
import EmployerFormAuthorized from './EmployerFormAuthorized.vue'; import EmployerFormAuthorized from './EmployerFormAuthorized.vue';
import { useCustomerForm } from 'src/pages/03_customer-management/form'; import { useCustomerForm } from 'src/pages/03_customer-management/form';
import { waitAll } from 'src/stores/utils';
const customerFormStore = useCustomerForm(); const customerFormStore = useCustomerForm();
import { FormCitizen } from 'components/upload-file/'; import { FormCitizen } from 'components/upload-file/';
import useOcrStore from 'stores/ocr'; import useOcrStore from 'stores/ocr';
import useCustomerStore from 'stores/customer';
const customerStore = useCustomerStore();
const ocrStore = useOcrStore(); const ocrStore = useOcrStore();
import { import {
SaveButton, SaveButton,
@ -20,8 +22,8 @@ import {
DeleteButton, DeleteButton,
UndoButton, UndoButton,
} from 'components/button'; } from 'components/button';
import UploadFile from 'src/components/upload-file/UploadFile.vue'; import { UploadFileGroup } from 'src/components/upload-file/';
import { uploadFileListCustomer } from '../../constant'; import { uploadFileListCustomer, columnsAttachment } from '../../constant';
const statusOcr = ref(false); const statusOcr = ref(false);
@ -211,100 +213,190 @@ withDefaults(
/> />
</q-tab-panel> </q-tab-panel>
<q-tab-panel name="attachment"> <q-tab-panel name="attachment">
<UploadFile <UploadFileGroup
v-model:current-id="item.id"
v-model="item.file"
hide-action hide-action
:readonly="readonly" :menu="uploadFileListCustomer"
:dropdown-list="uploadFileListCustomer" :columns="columnsAttachment"
v-model:status-ocr="statusOcr" :auto-save="item.id !== ''"
v-model:file="item.file" :download="
:tree-file=" (obj) => {
Object.values( customerStore.getFile({
item.file?.reduce< parentId: item.id || '',
Record<string, { label: string; file: { label: string }[] }> group: obj.group,
>((a, c) => { fileId: obj._meta.id,
const _group = c.group || 'other'; download: true,
});
if (!a[_group]) { }
a[_group] = {
label: $t(
uploadFileListCustomer.find((v) => v.value === _group)
?.label || _group,
),
file: [
{
label:
c.name ||
`${c.group}-${c.file?.name || Date.now()}`,
},
],
};
} else {
a[_group].file.push({
label:
c.name || `${c.group}-${c.file?.name || Date.now()}`,
});
}
return a;
}, {}) || {},
)
" "
@send-ocr=" :delete-item="
async (group: any, file: any) => { async (obj) => {
const res = await ocrStore.sendOcr({ const res = await customerStore.delMeta({
file: file, parentId: item.id || '',
category: group, group: obj.group,
metaId: obj._meta.id,
}); });
if (res) { if (res) {
const map = res.fields.reduce<Record<string, string>>( return true;
(a, c) => {
a[c.name] = c.value;
return a;
},
{},
);
if (!item.citizenId) item.citizenId = map['citizen_id'] || '';
if (!item.address) item.address = map['address'] || '';
if (!customer.firstName)
customer.firstName = map['firstname'] || '';
if (!customer.lastName)
customer.lastName = map['lastname'] || '';
if (!customer.firstNameEN)
customer.firstNameEN = map['firstname_en'] || '';
if (!customer.lastNameEN)
customer.lastNameEN = map['lastname_en'] || '';
if (!customer.birthDate)
customer.birthDate = new Date(map['birth_date'] || '');
} }
return false;
statusOcr = false;
} }
" "
@delete-file=" :save="
(filename) => { async (
if (!item.id) return; group:
| 'citizen'
| 'house-registration'
| 'commercial-registration'
| 'vat-registration'
| 'power-of-attorney',
_meta: any,
file: File | undefined,
) => {
if (file !== undefined && item.id) {
const res = await customerStore.postMeta({
parentId: item.id || '',
group,
meta: _meta,
file,
});
customerFormStore.deleteAttachment( if (res) {
{ branchId: item.id, customerId: item.customerId }, return true;
filename, }
); } else {
const {
customerBranchId,
id,
employeeId,
createdAt,
updatedAt,
middleName,
middleNameEN,
...payload
} = _meta;
const res = await customerStore.putMeta({
parentId: item.id || '',
group,
metaId: _meta.id,
meta: payload,
file,
});
if (res) {
return true;
}
}
return false;
}
"
:get-file-list="
async (
group:
| 'citizen'
| 'house-registration'
| 'commercial-registration'
| 'vat-registration'
| 'power-of-attorney',
) => {
if (!!item.id) {
const resMeta = await customerStore.getMetaList({
parentId: item.id,
group,
});
const tempValue = resMeta.map(async (v: any) => {
return {
_meta: { ...v },
name: v.id || '',
group: group,
url: await customerStore.getFile({
parentId: item.id || '',
group,
fileId: v.id,
}),
file: undefined,
};
});
return await waitAll(tempValue);
}
return [];
} }
" "
> >
<template #form="{ mode }"> <template #form="{ mode, meta, isEdit }">
<FormCitizen <FormCitizen
v-if="mode === 'citizenId'" v-if="mode === 'citizen' && meta"
orc orc
v-model:citizen-id="item.citizenId" ra
v-model:birth-date="customer.birthDate" :readonly="!isEdit"
v-model:first-name="customer.firstName" v-model:name-prefix="meta.namePrefix"
v-model:first-name-en="customer.firstNameEN" v-model:citizen-id="meta.citizenId"
v-model:last-name="customer.lastName" v-model:birth-date="meta.birthDate"
v-model:last-name-en="customer.lastNameEN" v-model:first-name="meta.firstName"
v-model:address="item.address" v-model:first-name-en="meta.firstNameEN"
v-model:last-name="meta.lastName"
v-model:last-name-en="meta.lastNameEN"
v-model:gender="meta.gender"
v-model:religion="meta.religion"
v-model:nationality="meta.nationality"
v-model:expire-date="meta.expireDate"
v-model:issue-date="meta.issueDate"
v-model:homeCode="meta.homeCode"
v-model:employmentOffice="meta.employmentOffice"
v-model:employmentOfficeEN="meta.employmentOfficeEN"
v-model:address="meta.address"
v-model:addressEN="meta.addressEN"
v-model:street="meta.street"
v-model:streetEN="meta.streetEN"
v-model:moo="meta.moo"
v-model:mooEN="meta.mooEN"
v-model:soi="meta.soi"
v-model:soiEN="meta.soiEN"
v-model:province-id="meta.provinceId"
v-model:district-id="meta.districtId"
v-model:sub-district-id="meta.subDistrictId"
v-model:middle-name="meta.middleName"
v-model:middle-name-en="meta.middleNameEN"
/>
<FormEmployeePassport
v-if="mode === 'passport' && meta"
prefix-id="drawer-info-employee"
id="form-passport"
dense
outlined
separator
ocr
:title="$t('customerEmployee.form.group.passport')"
:readonly="!isEdit"
v-model:passport-type="meta.type"
v-model:passport-number="meta.number"
v-model:passport-issue-date="meta.issueDate"
v-model:passport-expiry-date="meta.expireDate"
v-model:passport-issuing-place="meta.issuePlace"
v-model:passport-issuing-country="meta.issueCountry"
/>
<FormEmployeeVisa
v-if="mode === 'visa' && meta"
prefix-id="drawer-info-employee"
id="form-visa"
ocr
dense
outlined
title="customerEmployee.form.group.visa"
:readonly="!isEdit"
v-model:visa-type="meta.type"
v-model:visa-number="meta.number"
v-model:visa-issue-date="meta.issueDate"
v-model:visa-expiry-date="meta.expireDate"
v-model:visa-issuing-place="meta.issuePlace"
/> />
</template> </template>
</UploadFile> </UploadFileGroup>
<!-- <EmployerFormAttachment <!-- <EmployerFormAttachment
:readonly="readonly" :readonly="readonly"