refactor: add div column

This commit is contained in:
Net 2024-08-19 17:56:36 +07:00
parent e40b432609
commit f8e39d21b2

View file

@ -2409,10 +2409,13 @@ const emptyCreateDialog = ref(false);
}
"
>
<div class="column full-height">
<div class="q-px-lg q-pt-lg surface-2">
<ProfileBanner
@view="employeeFormState.imageDialog = true"
@edit="dialogEmployeeImageUpload && dialogEmployeeImageUpload.browse()"
@edit="
dialogEmployeeImageUpload && dialogEmployeeImageUpload.browse()
"
@update:toggle-status="
(v) => {
if (currentFromDataEmployee.id !== undefined)
@ -2443,18 +2446,13 @@ const emptyCreateDialog = ref(false);
"
/>
</div>
<div
style="flex: 1; width: 100%; overflow-y: auto"
class="surface-2 q-pa-lg"
class="surface-2 q-pa-lg column"
id="drawer-employee-form"
>
<div class="col surface-1 full-height rounded bordered scroll row">
<div
class="col"
style="height: 100%; max-height: 100; overflow-y: auto"
v-if="$q.screen.gt.sm"
>
<div class="col bg-red surface-1 rounded bordered row">
<div class="col full-height scroll" v-if="$q.screen.gt.sm">
<div class="q-py-md q-pl-md q-pr-sm">
<SideMenu
:menu="
@ -2484,18 +2482,18 @@ const emptyCreateDialog = ref(false);
anchor: 'drawer-form-visa',
tab: 'personalInfo',
},
...(currentFromDataEmployee.employeeCheckup?.map((v, i) => ({
...(currentFromDataEmployee.employeeCheckup?.map(
(v, i) => ({
name: $t('customer.form.instance', { index: i + 1 }),
anchor: `drawer-employee-checkup-${i}`,
tab: 'healthCheck',
})) || []),
}),
) || []),
...(currentFromDataEmployee.employeeWork?.map((v, i) => ({
name: $t('customer.form.instance', { index: i + 1 }),
anchor: `drawer-employee-work-history-${i}`,
tab: 'workHistory',
})) || []),
{
name: $t('formDialogTitleFamilyHistory'),
anchor: 'drawer-other',
@ -2512,11 +2510,10 @@ const emptyCreateDialog = ref(false);
/>
</div>
</div>
<div
class="col-12 col-md-10 q-py-md q-pr-md q-pl-sm"
id="drawer-employee-form-content"
style="height: 290px; overflow-y: auto"
style="height: 100%; overflow-y: auto"
>
<template v-if="employeeFormState.currentTab === 'personalInfo'">
<div
@ -2564,7 +2561,6 @@ const emptyCreateDialog = ref(false);
type="button"
/>
</div>
<BasicInformation
no-action
id="drawer-form-information"
@ -2574,11 +2570,15 @@ const emptyCreateDialog = ref(false);
:title="'formDialogTitleInformation'"
:readonly="!employeeFormState.isEmployeeEdit"
:employee-owner-option="employeeStore.ownerOption"
v-model:customer-branch="employeeFormState.formDataEmployeeOwner"
v-model:customer-branch="
employeeFormState.formDataEmployeeOwner
"
v-model:employee-id="employeeFormState.currentEmployeeCode"
v-model:nrc-no="currentFromDataEmployee.nrcNo"
v-model:code="currentFromDataEmployee.code"
@filter-owner-branch="employeeFormStore.employeeFilterOwnerBranch"
@filter-owner-branch="
employeeFormStore.employeeFilterOwnerBranch
"
class="q-mb-xl"
/>
<FormPerson
@ -2650,7 +2650,9 @@ const emptyCreateDialog = ref(false);
v-model:visa-type="currentFromDataEmployee.visaType"
v-model:visa-number="currentFromDataEmployee.visaNumber"
v-model:visa-issue-date="currentFromDataEmployee.visaIssueDate"
v-model:visa-expiry-date="currentFromDataEmployee.visaExpiryDate"
v-model:visa-expiry-date="
currentFromDataEmployee.visaExpiryDate
"
v-model:visa-issuing-place="
currentFromDataEmployee.visaIssuingPlace
"
@ -2662,7 +2664,6 @@ const emptyCreateDialog = ref(false);
class="q-mb-xl"
/>
</template>
<template v-if="employeeFormState.currentTab === 'healthCheck'">
<FormEmployeeHealthCheck
v-if="employeeFormState.currentTab === 'healthCheck'"
@ -2671,7 +2672,9 @@ const emptyCreateDialog = ref(false);
dense
outlined
v-model:current-index="employeeFormState.currentIndex"
v-model:employee-checkup="currentFromDataEmployee.employeeCheckup"
v-model:employee-checkup="
currentFromDataEmployee.employeeCheckup
"
v-model:checkup-type-option="
optionStore.globalOption.insurancePlace
"
@ -2690,11 +2693,13 @@ const emptyCreateDialog = ref(false);
@edit="
(index) => {
if (
currentFromDataEmployee.employeeCheckup?.[index].statusSave
currentFromDataEmployee.employeeCheckup?.[index]
.statusSave
) {
employeeFormState.currentIndex = index;
currentFromDataEmployee.employeeCheckup[index].statusSave =
false;
currentFromDataEmployee.employeeCheckup[
index
].statusSave = false;
}
}
"
@ -2705,8 +2710,9 @@ const emptyCreateDialog = ref(false);
.statusSave === false
) {
employeeFormState.currentIndex = -1;
currentFromDataEmployee.employeeCheckup[index].statusSave =
true;
currentFromDataEmployee.employeeCheckup[
index
].statusSave = true;
employeeFormStore.resetFormDataEmployee();
}
}
@ -2719,7 +2725,6 @@ const emptyCreateDialog = ref(false);
"
/>
</template>
<template v-if="employeeFormState.currentTab === 'workHistory'">
<FormEmployeeWorkHistory
v-if="employeeFormState.currentTab === 'workHistory'"
@ -2746,8 +2751,8 @@ const emptyCreateDialog = ref(false);
@undo="
(index) => {
if (
currentFromDataEmployee.employeeWork?.[index].statusSave ===
false
currentFromDataEmployee.employeeWork?.[index]
.statusSave === false
) {
employeeFormState.currentIndex = -1;
currentFromDataEmployee.employeeWork[index].statusSave =
@ -2768,7 +2773,6 @@ const emptyCreateDialog = ref(false);
"
/>
</template>
<template v-if="employeeFormState.currentTab === 'other'">
<FormEmployeeOther
v-if="employeeFormState.currentTab === 'other'"
@ -2776,7 +2780,9 @@ const emptyCreateDialog = ref(false);
prefix-id="drawer-employee"
dense
outlined
v-model:employee-other="currentFromDataEmployee.employeeOtherInfo"
v-model:employee-other="
currentFromDataEmployee.employeeOtherInfo
"
@undo="
() => {
if (
@ -2799,6 +2805,7 @@ const emptyCreateDialog = ref(false);
</div>
</div>
</div>
</div>
</DrawerInfo>
</template>