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