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

feat: form ocr (#56)

Browse source 
* refactor: add i18n

* refactor: add id in type employee visa

* refactor: edit layout ui visa

* refactor: add menu visa

* refactor: add type visa

* refactor: by value visa

* refactor: add workerType in option

* refactor: add index visa

* feat: submit add  delete and assign value

* feat: use submitVisa

* fix: col not working

* refactor: handle mrz and remark can is null

* refactor: add i18n

* refactor: add option workerStatus

* refactor: edit layout input

* refactor: menu set sub true

* refactor: add visa at dialog add

* refactor: handle index visa

* refactor: add i18n

* refactor: add input entryCount and issueCountry

* refactor: add input entryCout and issueCountry
This commit is contained in:
Net 2024-11-11 09:39:43 +07:00 • committed by GitHub
parent 5888f3a9dd
commit ce3d809bd9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 1664 additions and 336 deletions
Download patch file Download diff file Expand all files Collapse all files

291
src/pages/03_customer-management/MainPage.vue
View file

@ -46,7 +46,6 @@ import FormPerson from 'components/02_personnel-management/FormPerson.vue';
import { EmployerFormBasicInfo, EmployerFormBranch } from './components';
import BranchPage from './BranchPage.vue';
import FormEmployeePassport from 'components/03_customer-management/FormEmployeePassport.vue';
import FormEmployeeVisa from 'components/03_customer-management/FormEmployeeVisa.vue';
import DialogForm from 'components/DialogForm.vue';
import SideMenu from 'components/SideMenu.vue';
import TableEmpoloyee from 'src/components/03_customer-management/TableEmpoloyee.vue';
@ -77,6 +76,7 @@ import useOptionStore from 'stores/options';
import { DialogContainer, DialogHeader } from 'components/dialog';
import KebabAction from 'src/components/shared/KebabAction.vue';
import { nextTick } from 'vue';
import FormEmployeeVisa from 'components/03_customer-management/FormEmployeeVisa.vue';
const { t, locale } = useI18n();
const $q = useQuasar();
@ -464,7 +464,7 @@ async function toggleStatusCustomer(id: string, status: boolean) {
async function deleteEmployeeById(opts: {
id?: string;
type?: 'passport' | 'healthCheck' | 'work';
type?: 'passport' | 'visa' | 'healthCheck' | 'work';
}) {
dialog({
color: 'negative',
@ -478,6 +478,10 @@ async function deleteEmployeeById(opts: {
await employeeFormStore.deletePassport();
}
if (opts.type === 'visa') {
await employeeFormStore.deleteVisa();
}
if (opts.type === 'healthCheck') {
await employeeFormStore.deleteHealthCheck();
}
@ -2300,6 +2304,10 @@ const emptyCreateDialog = ref(false);
await employeeFormStore.submitPassport();
}
if (employeeFormState.currentTab === 'visa') {
await employeeFormStore.submitVisa();
}
if (employeeFormState.currentTab === 'healthCheck') {
await employeeFormStore.submitHealthCheck();
}
@ -2370,6 +2378,11 @@ const emptyCreateDialog = ref(false);
name: 'passport',
label: 'customerEmployee.fileType.passport',
},
{
name: 'visa',
label: 'customerEmployee.form.group.visa',
},
{
name: 'healthCheck',
label: 'customerEmployee.form.group.healthCheck',
@ -2479,6 +2492,20 @@ const emptyCreateDialog = ref(false);
sub: true,
})) || []),
{
name: $t('customerEmployee.form.group.visa'),
anchor: 'drawer-visa',
tab: 'visa',
useBtn: true,
},
...(currentFromDataEmployee.employeeVisa?.map((v, i) => ({
name: dateFormat(v.expireDate),
anchor: `drawer-employee-visa-${i}`,
tab: 'visa',
sub: true,
})) || []),
...(currentFromDataEmployee.employeeCheckup?.map((v, i) => ({
name: $t('general.times', { number: i + 1 }),
anchor: `form-employee-checkup-${i}`,
@ -2953,6 +2980,8 @@ const emptyCreateDialog = ref(false);
v-model:visa-issue-date="meta.issueDate"
v-model:visa-expiry-date="meta.expireDate"
v-model:visa-issuing-place="meta.issuePlace"
v-model:entry-count="meta.entryCount"
v-model:issue-country="meta.issueCountry"
/>
<NoticeJobEmployment v-if="mode === 'noticeJobEmployment'" />
@ -3091,6 +3120,114 @@ const emptyCreateDialog = ref(false);
</div>
</template>
<template v-if="employeeFormState.currentTab === 'visa'">
<FormEmployeeVisa
v-for="(value, index) in currentFromDataEmployee.employeeVisa"
prefix-id="drawer-info-employee"
id="form-visa"
dense
outlined
title="customerEmployee.form.group.visa"
:readonly="employeeFormState.currentIndexVisa !== index"
v-model:visa-type="value.type"
v-model:visa-number="value.number"
v-model:visa-issue-date="value.issueDate"
v-model:visa-expiry-date="value.expireDate"
v-model:visa-issuing-place="value.issuePlace"
v-model:entry-count="value.entryCount"
v-model:issue-country="value.issueCountry"
>
<template v-slot:expiryDate>
{{ $t('general.expirationDate') }} :
{{ dateFormat(value.expireDate) }}
<ExpirationDate
v-if="value.id !== undefined"
:expiration-date="value.expireDate"
/>
</template>
<template v-slot:button>
<div class="surface-1 row rounded" style="min-height: 35px">
<UndoButton
v-if="
employeeFormState.isEmployeeEdit &&
!(employeeFormState.currentIndexVisa === -1) &&
employeeFormState.currentIndexVisa === index
"
id="btn-info-basic-undo"
icon-only
@click="
() => {
employeeFormStore.resetFormDataEmployee();
employeeFormState.isEmployeeEdit = false;
employeeFormState.dialogType = 'info';
employeeFormState.currentIndexVisa = -1;
}
"
type="button"
/>
<SaveButton
v-if="
(employeeFormState.isEmployeeEdit ||
value.id === undefined) &&
!(employeeFormState.currentIndexVisa === -1) &&
employeeFormState.currentIndexVisa === index
"
id="btn-info-basic-save"
icon-only
@click="
() => {
employeeFormState.currentIndexVisa = index;
}
"
type="submit"
/>
<EditButton
v-if="
employeeFormState.currentIndexVisa === -1 ||
(!employeeFormState.isEmployeeEdit &&
value.id !== undefined &&
employeeFormState.currentIndexVisa === index)
"
id="btn-info-basic-edit"
icon-only
@click="
() => {
employeeFormState.currentIndexVisa = index;
employeeFormState.isEmployeeEdit = true;
employeeFormState.dialogType = 'edit';
}
"
type="button"
/>
<DeleteButton
v-if="
employeeFormState.currentIndexVisa === -1 ||
(!employeeFormState.isEmployeeEdit &&
value.id !== undefined &&
!(employeeFormState.currentIndexVisa === -1) &&
employeeFormState.currentIndexVisa === index)
"
id="btn-info-basic-delete"
icon-only
@click.stop="
() => {
employeeFormState.currentIndexVisa = index;
deleteEmployeeById({ type: 'visa' });
}
"
type="button"
:disabled="
!(employeeFormState.currentIndex === -1) &&
!(employeeFormState.currentIndex === index)
"
/>
</div>
</template>
</FormEmployeeVisa>
</template>
<template v-if="employeeFormState.currentTab === 'healthCheck'">
<FormEmployeeHealthCheck
v-if="employeeFormState.currentTab === 'healthCheck'"
@ -3848,6 +3985,10 @@ const emptyCreateDialog = ref(false);
await employeeFormStore.submitPassport();
}
if (employeeFormState.currentTab === 'visa') {
await employeeFormStore.submitVisa();
}
if (employeeFormState.currentTab === 'healthCheck') {
await employeeFormStore.submitHealthCheck();
}
@ -3934,6 +4075,10 @@ const emptyCreateDialog = ref(false);
name: 'passport',
label: 'customerEmployee.fileType.passport',
},
{
name: 'visa',
label: 'customerEmployee.form.group.visa',
},
{
name: 'healthCheck',
label: 'customerEmployee.form.group.healthCheck',
@ -3983,6 +4128,7 @@ const emptyCreateDialog = ref(false);
anchor: 'drawer-upload-file',
tab: 'personalInfo',
},
{
name: $t('customerEmployee.form.group.passport'),
anchor: 'drawer-passport',
@ -4009,14 +4155,28 @@ const emptyCreateDialog = ref(false);
}),
) || []),
{
name: $t('customerEmployee.form.group.visa'),
anchor: 'drawer-visa',
tab: 'visa',
useBtn: true,
},
...(currentFromDataEmployee.employeeVisa?.map((v, i) => ({
name: dateFormat(v.expireDate),
anchor: `drawer-employee-visa-${i}`,
tab: 'visa',
sub: true,
})) || []),
...(currentFromDataEmployee.employeeCheckup?.map(
(v, i) => ({
(_v, i) => ({
name: $t('general.times', { number: i + 1 }),
anchor: `drawer-employee-checkup-${i}`,
tab: 'healthCheck',
}),
) || []),
...(currentFromDataEmployee.employeeWork?.map((v, i) => ({
...(currentFromDataEmployee.employeeWork?.map((_v, i) => ({
name: $t('general.times', { number: i + 1 }),
anchor: `drawer-employee-work-history-${i}`,
tab: 'workHistory',
@ -4047,6 +4207,18 @@ const emptyCreateDialog = ref(false);
@click.stop="employeeFormStore.addPassport()"
/>
</template>
<template v-slot:btn-drawer-visa>
<q-btn
dense
flat
icon="mdi-plus"
size="sm"
rounded
style="color: var(--stone-9)"
@click.stop="employeeFormStore.addVisa()"
/>
</template>
</SideMenu>
</div>
</div>
@ -4483,6 +4655,8 @@ const emptyCreateDialog = ref(false);
v-model:visa-issue-date="meta.issueDate"
v-model:visa-expiry-date="meta.expireDate"
v-model:visa-issuing-place="meta.issuePlace"
v-model:entry-count="meta.entryCount"
v-model:issue-country="meta.issueCountry"
/>
<NoticeJobEmployment v-if="mode === 'noticeJobEmployment'" />
@ -4619,6 +4793,115 @@ const emptyCreateDialog = ref(false);
</FormEmployeePassport>
</div>
</template>
<template v-if="employeeFormState.currentTab === 'visa'">
<FormEmployeeVisa
v-for="(value, index) in currentFromDataEmployee.employeeVisa"
prefix-id="drawer-info-employee"
id="form-visa"
dense
outlined
title="customerEmployee.form.group.visa"
:readonly="employeeFormState.currentIndexVisa !== index"
v-model:visa-type="value.type"
v-model:visa-number="value.number"
v-model:visa-issue-date="value.issueDate"
v-model:visa-expiry-date="value.expireDate"
v-model:visa-issuing-place="value.issuePlace"
v-model:entry-count="value.entryCount"
v-model:issue-country="value.issueCountry"
>
<template v-slot:expiryDate>
{{ $t('general.expirationDate') }} :
{{ dateFormat(value.expireDate) }}
<ExpirationDate
v-if="value.id !== undefined"
:expiration-date="value.expireDate"
/>
</template>
<template v-slot:button>
<div class="surface-1 row rounded" style="min-height: 35px">
<UndoButton
v-if="
employeeFormState.isEmployeeEdit &&
!(employeeFormState.currentIndexVisa === -1) &&
employeeFormState.currentIndexVisa === index
"
id="btn-info-basic-undo"
icon-only
@click="
() => {
employeeFormStore.resetFormDataEmployee();
employeeFormState.isEmployeeEdit = false;
employeeFormState.dialogType = 'info';
employeeFormState.currentIndexVisa = -1;
}
"
type="button"
/>
<SaveButton
v-if="
(employeeFormState.isEmployeeEdit ||
value.id === undefined) &&
!(employeeFormState.currentIndexVisa === -1) &&
employeeFormState.currentIndexVisa === index
"
id="btn-info-basic-save"
icon-only
@click="
() => {
employeeFormState.currentIndexVisa = index;
}
"
type="submit"
/>
<EditButton
v-if="
employeeFormState.currentIndexVisa === -1 ||
(!employeeFormState.isEmployeeEdit &&
value.id !== undefined &&
employeeFormState.currentIndexVisa === index)
"
id="btn-info-basic-edit"
icon-only
@click="
() => {
employeeFormState.currentIndexVisa = index;
employeeFormState.isEmployeeEdit = true;
employeeFormState.dialogType = 'edit';
}
"
type="button"
/>
<DeleteButton
v-if="
employeeFormState.currentIndexVisa === -1 ||
(!employeeFormState.isEmployeeEdit &&
value.id !== undefined &&
!(employeeFormState.currentIndexVisa === -1) &&
employeeFormState.currentIndexVisa === index)
"
id="btn-info-basic-delete"
icon-only
@click.stop="
() => {
employeeFormState.currentIndexVisa = index;
deleteEmployeeById({ type: 'visa' });
}
"
type="button"
:disabled="
!(employeeFormState.currentIndex === -1) &&
!(employeeFormState.currentIndex === index)
"
/>
</div>
</template>
</FormEmployeeVisa>
</template>
<template v-if="employeeFormState.currentTab === 'healthCheck'">
<FormEmployeeHealthCheck
v-if="employeeFormState.currentTab === 'healthCheck'"

120
src/pages/03_customer-management/form.ts
View file

@ -589,6 +589,7 @@ export const useEmployeeForm = defineStore('form-employee', () => {
currentEmployee: Employee | null;
currentIndex: number;
currentIndexPassport: number;
currentIndexVisa: number;
profileUrl: string;
isEmployeeEdit: boolean;
profileSubmit: boolean;
@ -619,6 +620,7 @@ export const useEmployeeForm = defineStore('form-employee', () => {
isImageEdit: false,
currentIndexPassport: -1,
currentIndex: -1,
currentIndexVisa: -1,
statusSavePersonal: false,
drawerModal: false,
imageDialog: false,
@ -771,6 +773,7 @@ export const useEmployeeForm = defineStore('form-employee', () => {
function resetFormDataEmployee(clean = false) {
state.value.currentIndexPassport = -1;
state.value.currentIndexVisa = -1;
if (clean) {
state.value.currentTab = 'personalInfo';
state.value.formDataEmployeeOwner = undefined;
@ -836,6 +839,56 @@ export const useEmployeeForm = defineStore('form-employee', () => {
state.value.currentIndexPassport = -1;
}
async function submitVisa() {
if (
currentFromDataEmployee.value.employeeVisa?.[
state.value.currentIndexVisa
] === undefined
)
return;
if (
currentFromDataEmployee.value.employeeVisa?.[state.value.currentIndexVisa]
.id === undefined
) {
const res = await employeeStore.postMeta({
parentId: currentFromDataEmployee.value.id || '',
group: 'visa',
meta: currentFromDataEmployee.value.employeeVisa?.[
state.value.currentIndexVisa
],
});
if (res) {
currentFromDataEmployee.value.employeeVisa[
state.value.currentIndexVisa
].id = res.id;
}
}
if (
currentFromDataEmployee.value.employeeVisa?.[state.value.currentIndexVisa]
.id !== undefined
) {
const { id, ...payload } =
currentFromDataEmployee.value.employeeVisa?.[
state.value.currentIndexVisa
];
await employeeStore.putMeta({
parentId: currentFromDataEmployee.value.id || '',
group: 'visa',
metaId:
currentFromDataEmployee.value.employeeVisa?.[
state.value.currentIndexVisa
].id || '',
meta: payload,
});
}
await assignFormDataEmployee(currentFromDataEmployee.value.id);
state.value.currentIndexPassport = -1;
}
async function submitOther() {
if (!currentFromDataEmployee.value.employeeOtherInfo) return;
@ -881,6 +934,25 @@ export const useEmployeeForm = defineStore('form-employee', () => {
}
}
async function deleteVisa() {
const res = await employeeStore.delMeta({
parentId: currentFromDataEmployee.value.id || '',
group: 'visa',
metaId:
currentFromDataEmployee.value.employeeVisa?.[
state.value.currentIndexVisa
].id || '',
});
if (res) {
currentFromDataEmployee.value.employeeVisa?.splice(
state.value.currentIndexVisa,
1,
);
await assignFormDataEmployee(currentFromDataEmployee.value.id);
}
}
async function deleteWorkHistory() {
if (!currentFromDataEmployee.value.employeeWork) return;
@ -1085,6 +1157,22 @@ export const useEmployeeForm = defineStore('form-employee', () => {
})),
),
employeeVisa: structuredClone(
payload.employeeVisa?.length === 0
? defaultFormData.employeeVisa
: payload.employeeVisa?.map((item) => ({
id: item.id,
number: item.number,
type: item.type,
entryCount: item.entryCount,
issueCountry: item.issueCountry,
issuePlace: item.issuePlace,
issueDate: item.issueDate,
expireDate: item.expireDate,
mrz: item.mrz || undefined,
remark: item.remark || undefined,
})),
),
employeeCheckup: structuredClone(
payload.employeeCheckup?.length === 0
? defaultFormData.employeeCheckup
@ -1128,6 +1216,9 @@ export const useEmployeeForm = defineStore('form-employee', () => {
state.value.currentIndexPassport =
(currentFromDataEmployee.value.employeePassport?.length || 0) - 1;
state.value.currentIndexVisa =
(currentFromDataEmployee.value.employeeVisa?.length || 0) - 1;
if (
currentFromDataEmployee.value.employeePassport?.[
state.value.currentIndexPassport
@ -1135,6 +1226,15 @@ export const useEmployeeForm = defineStore('form-employee', () => {
) {
state.value.currentIndexPassport = -1;
}
if (
currentFromDataEmployee.value.employeeVisa?.[
state.value.currentIndexVisa
].id !== undefined
) {
state.value.currentIndexVisa = -1;
}
const foundBranch = await customerStore.fetchListCustomerBranchById(
payload.customerBranchId,
);
@ -1197,20 +1297,40 @@ export const useEmployeeForm = defineStore('form-employee', () => {
(currentFromDataEmployee.value.employeePassport?.length || 0) - 1;
}
function addVisa() {
currentFromDataEmployee.value.employeeVisa?.push({
number: '',
type: '',
entryCount: 0,
issueCountry: '',
issuePlace: '',
issueDate: new Date(),
expireDate: new Date(),
mrz: undefined,
remark: undefined,
});
state.value.currentIndexVisa =
(currentFromDataEmployee.value.employeeVisa?.length || 0) - 1;
}
return {
state,
currentFromDataEmployee,
resetEmployeeData,
addPassport,
addVisa,
submitPassport,
submitVisa,
submitOther,
submitWorkHistory,
submitPersonal,
submitHealthCheck,
deletePassport,
deleteVisa,
deleteWorkHistory,
deleteHealthCheck,

2
src/pages/05_quotation/QuotationForm.vue
View file

@ -2325,6 +2325,8 @@ async function getInvoiceCodeFullPay() {
v-model:visa-issue-date="meta.issueDate"
v-model:visa-expiry-date="meta.expireDate"
v-model:visa-issuing-place="meta.issuePlace"
v-model:entry-count="meta.entryCount"
v-model:issue-country="meta.issueCountry"
/>
<NoticeJobEmployment v-if="mode === 'noticeJobEmployment'" />