refactor: add ocr

This commit is contained in:
Net 2024-09-20 13:10:19 +07:00
parent ac241a8e31
commit 103c4e1bf3
3 changed files with 132 additions and 29 deletions

View file

@ -28,7 +28,14 @@ const splitAttachment = ref(50);
const currentIndex = ref(-1);
const props = defineProps<{
ocr?: (group: any, file: File) => void | Promise<void>;
ocr?: (
group: any,
file: File,
) => void | Promise<{
status: boolean;
group: string;
meta: { name: string; value: string }[];
}>;
getFileList?: (group: any) => Promise<typeof obj.value>;
deleteItem?: (obj: any) => void | Promise<boolean>;
download?: (obj: any) => void;
@ -80,7 +87,7 @@ const inputFile = (() => {
const selectedMenu = ref<NonNullable<typeof props.menu>[number]>();
function change(e: Event) {
async function change(e: Event) {
const _element = e.target as HTMLInputElement | null;
const _file = _element?.files?.[0];
@ -104,9 +111,50 @@ function change(e: Event) {
obj.value[currentIndex.value].url = reader.result as string;
}
};
}
modalDialog.value = true;
const statusOcr = await props.ocr?.(selectedMenu.value?.value, _file);
if (statusOcr?.status) {
modalDialog.value = true;
const map = statusOcr.meta.reduce<Record<string, string>>((a, c) => {
a[c.name] = c.value;
return a;
}, {});
if (statusOcr.group === 'citizen') {
obj.value[currentIndex.value]._meta = {
citizenId: map['citizen_id'],
firstName: map['firstname'],
lastName: map['lastname'],
firstNameEN: map['firstname_en'],
lastNameEN: map['lastname_en'],
birthDate: map['birth_date'],
religion: map['religion'],
issueDate: map['issue_date'],
expireDate: map['expire_date'],
};
}
if (statusOcr.group === 'passport') {
obj.value[currentIndex.value]._meta = {
type: map['type'],
number: map['passport_no'],
issueDate: map['issue_date'],
expireDate: map['expire_date'],
};
}
if (statusOcr.group === 'visa') {
obj.value[currentIndex.value]._meta = {
type: map['visa_type'],
number: map['visa_no'],
issueDate: map['valid_until'],
expireDate: map['expire_date'],
issuePlace: map['issue_place'],
};
}
}
}
}
async function fileList() {

View file

@ -2539,6 +2539,25 @@ const emptyCreateDialog = ref(false);
:group-list="uploadFileListEmployee"
:menu="uploadFileListEmployee"
:columns="columnsAttachment"
:ocr="
async (group, file) => {
const res = await ocrStore.sendOcr({
file: file,
category: group,
});
if (res) {
const tempValue = {
status: true,
group,
meta: res.fields,
};
return tempValue;
}
return { status: false, group, meta: [] };
}
"
:auto-save="currentFromDataEmployee.id !== ''"
:download="
(obj) => {
@ -3731,6 +3750,25 @@ const emptyCreateDialog = ref(false);
:group-list="uploadFileListEmployee"
:menu="uploadFileListEmployee"
:columns="columnsAttachment"
:ocr="
async (group, file) => {
const res = await ocrStore.sendOcr({
file: file,
category: group,
});
if (res) {
const tempValue = {
status: true,
group,
meta: res.fields,
};
return tempValue;
}
return { status: false, group, meta: [] };
}
"
auto-save
:download="
(obj) => {

View file

@ -8,14 +8,11 @@ import EmployerFormAbout from './EmployerFormAbout.vue';
import EmployerFormAuthorized from './EmployerFormAuthorized.vue';
import { useCustomerForm } from 'src/pages/03_customer-management/form';
import { waitAll } from 'src/stores/utils';
const customerFormStore = useCustomerForm();
import { FormCitizen } from 'components/upload-file/';
import useOcrStore from 'stores/ocr';
import useCustomerStore from 'stores/customer';
const customerStore = useCustomerStore();
const ocrStore = useOcrStore();
import {
SaveButton,
EditButton,
@ -24,11 +21,10 @@ import {
} from 'components/button';
import { UploadFileGroup } from 'src/components/upload-file/';
import { uploadFileListCustomer, columnsAttachment } from '../../constant';
import { group } from 'node:console';
const statusOcr = ref(false);
const customer = defineModel<CustomerCreate>('customer', { required: true });
const ocrStore = useOcrStore();
const customerStore = useCustomerStore();
const item = defineModel<NonNullable<CustomerCreate['customerBranch']>[number]>(
'customerBranch',
{ required: true },
@ -217,6 +213,25 @@ withDefaults(
v-model:current-id="item.id"
v-model="item.file"
hide-action
:ocr="
async (group, file) => {
const res = await ocrStore.sendOcr({
file: file,
category: group,
});
if (res) {
const tempValue = {
status: true,
group,
meta: res.fields,
};
return tempValue;
}
return { status: false, group, meta: [] };
}
"
:menu="uploadFileListCustomer"
:columns="columnsAttachment"
:auto-save="item.id !== ''"
@ -303,26 +318,28 @@ withDefaults(
| 'power-of-attorney',
) => {
if (!!item.id) {
const resMeta = await customerStore.getMetaList({
parentId: item.id,
group,
});
if (group === 'citizen') {
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,
};
});
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 await waitAll(tempValue);
}
}
return [];
}