refactor: customer => display no data condition

This commit is contained in:
puriphatt 2024-12-11 13:52:23 +07:00
parent 6f9e693c58
commit 3b30e9a736

View file

@ -5050,8 +5050,8 @@ const emptyCreateDialog = ref(false);
</template>
<template v-if="employeeFormState.currentTab === 'passport'">
<div class="q-gutter-sm full-width">
<div class="col-12 q-pb-sm text-weight-bold text-body1">
<div class="q-gutter-sm full-width column no-wrap">
<div class="q-pb-sm text-weight-bold text-body1">
<q-icon
flat
size="xs"
@ -5069,8 +5069,8 @@ const emptyCreateDialog = ref(false);
) in currentFromDataEmployee.employeePassport"
:key="index"
>
<div class="col" v-if="value !== undefined">
<FormEmployeePassport
v-if="value !== undefined"
prefix-id="drawer-info-employee"
id="form-passport"
hide-title
@ -5078,7 +5078,9 @@ const emptyCreateDialog = ref(false);
outlined
separator
:title="$t('customerEmployee.form.group.passport')"
:readonly="employeeFormState.currentIndexPassport !== index"
:readonly="
employeeFormState.currentIndexPassport !== index
"
:full-name="
employeeFormState.currentIndexPassport !== index
"
@ -5119,7 +5121,9 @@ const emptyCreateDialog = ref(false);
<UndoButton
v-if="
employeeFormState.isEmployeeEdit &&
!(employeeFormState.currentIndexPassport === -1) &&
!(
employeeFormState.currentIndexPassport === -1
) &&
employeeFormState.currentIndexPassport === index
"
id="btn-info-basic-undo"
@ -5138,7 +5142,9 @@ const emptyCreateDialog = ref(false);
v-if="
(employeeFormState.isEmployeeEdit ||
value.id === undefined) &&
!(employeeFormState.currentIndexPassport === -1) &&
!(
employeeFormState.currentIndexPassport === -1
) &&
employeeFormState.currentIndexPassport === index
"
id="btn-info-basic-save"
@ -5156,7 +5162,8 @@ const emptyCreateDialog = ref(false);
employeeFormState.currentIndexPassport === -1 ||
(!employeeFormState.isEmployeeEdit &&
value.id !== undefined &&
employeeFormState.currentIndexPassport === index)
employeeFormState.currentIndexPassport ===
index)
"
id="btn-info-basic-edit"
icon-only
@ -5177,7 +5184,8 @@ const emptyCreateDialog = ref(false);
!(
employeeFormState.currentIndexPassport === -1
) &&
employeeFormState.currentIndexPassport === index)
employeeFormState.currentIndexPassport ===
index)
"
id="btn-info-basic-delete"
icon-only
@ -5188,28 +5196,32 @@ const emptyCreateDialog = ref(false);
"
type="button"
:disabled="
!(employeeFormState.currentIndexPassport === -1) &&
!(employeeFormState.currentIndexPassport === index)
!(
employeeFormState.currentIndexPassport === -1
) &&
!(
employeeFormState.currentIndexPassport === index
)
"
/>
</div>
</template>
</FormEmployeePassport>
</div>
</template>
<div class="full-width full-height flex flex-center">
<NoData
v-if="
currentFromDataEmployee.employeePassport?.length === 0
"
/>
<div
class="full-width flex flex-center col"
v-if="currentFromDataEmployee.employeePassport?.length === 0"
>
<NoData />
</div>
</div>
</template>
<template v-if="employeeFormState.currentTab === 'visa'">
<div class="q-gutter-sm full-width">
<div class="col-12 q-pb-sm text-weight-bold text-body1">
<div class="q-gutter-sm full-width column no-wrap">
<div class="q-pb-sm text-weight-bold text-body1">
<q-icon
flat
size="xs"
@ -5220,8 +5232,11 @@ const emptyCreateDialog = ref(false);
/>
{{ $t('customerEmployee.form.group.visa') }}
</div>
<div class="col">
<FormEmployeeVisa
v-for="(value, index) in currentFromDataEmployee.employeeVisa"
v-for="(
value, index
) in currentFromDataEmployee.employeeVisa"
:key="index"
prefix-id="drawer-info-employee"
id="form-visa"
@ -5256,7 +5271,10 @@ const emptyCreateDialog = ref(false);
</template>
<template v-slot:button>
<div class="surface-1 row rounded" style="min-height: 35px">
<div
class="surface-1 row rounded"
style="min-height: 35px"
>
<UndoButton
v-if="
employeeFormState.isEmployeeEdit &&
@ -5334,17 +5352,18 @@ const emptyCreateDialog = ref(false);
</div>
</template>
</FormEmployeeVisa>
<div class="full-width full-height flex flex-center">
<NoData
</div>
<div
v-if="currentFromDataEmployee.employeeVisa?.length === 0"
/>
class="full-width col flex flex-center"
>
<NoData />
</div>
</div>
</template>
<template v-if="employeeFormState.currentTab === 'healthCheck'">
<div class="q-gutter-sm full-width">
<div class="q-gutter-sm full-width column">
<div
class="q-pb-sm text-weight-bold text-body1 row items-center"
>
@ -5360,6 +5379,7 @@ const emptyCreateDialog = ref(false);
{{ $t(`customerEmployee.formHealthCheck.title`) }}
</div>
<div class="col">
<FormEmployeeHealthCheck
v-if="employeeFormState.currentTab === 'healthCheck'"
id="drawer-form-checkup"
@ -5367,7 +5387,9 @@ const emptyCreateDialog = ref(false);
dense
outlined
:hide-action="currentFromDataEmployee.status === 'INACTIVE'"
v-model:current-index="employeeFormState.currentIndexCheckup"
v-model:current-index="
employeeFormState.currentIndexCheckup
"
v-model:employee-checkup="
currentFromDataEmployee.employeeCheckup
"
@ -5423,18 +5445,19 @@ const emptyCreateDialog = ref(false);
}
"
/>
<div class="full-width full-height flex flex-center">
<NoData
</div>
<div
class="full-width col flex flex-center"
v-if="currentFromDataEmployee.employeeCheckup?.length === 0"
/>
>
<NoData />
</div>
</div>
</template>
<template v-if="employeeFormState.currentTab === 'workHistory'">
<div class="q-gutter-sm full-width">
<div class="q-gutter-sm full-width column">
<div
class="col-12 q-pb-sm text-weight-bold text-body1 row items-center"
class="q-pb-sm text-weight-bold text-body1 row items-center"
>
<q-icon
flat
@ -5447,6 +5470,7 @@ const emptyCreateDialog = ref(false);
{{ $t(`customerEmployee.form.group.workHistory`) }}
</div>
<div class="col">
<FormEmployeeWorkHistory
v-if="employeeFormState.currentTab === 'workHistory'"
id="drawer-work-history"
@ -5483,29 +5507,34 @@ const emptyCreateDialog = ref(false);
.statusSave === false
) {
employeeFormState.currentIndexWorkHistory = -1;
currentFromDataEmployee.employeeWork[index].statusSave =
true;
currentFromDataEmployee.employeeWork[
index
].statusSave = true;
}
}
"
@edit="
(index) => {
if (
currentFromDataEmployee.employeeWork?.[index].statusSave
currentFromDataEmployee.employeeWork?.[index]
.statusSave
) {
employeeFormState.currentIndexWorkHistory = index;
currentFromDataEmployee.employeeWork[index].statusSave =
false;
currentFromDataEmployee.employeeWork[
index
].statusSave = false;
}
}
"
/>
</div>
</div>
<div class="full-width full-height flex flex-center">
<NoData
<div
class="full-width col flex flex-center"
v-if="currentFromDataEmployee.employeeWork?.length === 0"
/>
>
<NoData />
</div>
</template>
<template v-if="employeeFormState.currentTab === 'other'">