refactor: add div column
This commit is contained in:
Net
parent
e40b432609
commit
f8e39d21b2
1 changed files with 383 additions and 376 deletions
|
|
@ -2409,393 +2409,400 @@ const emptyCreateDialog = ref(false);
|
|||
}
|
||||
"
|
||||
>
|
||||
<div class="q-px-lg q-pt-lg surface-2">
|
||||
<ProfileBanner
|
||||
@view="employeeFormState.imageDialog = true"
|
||||
@edit="dialogEmployeeImageUpload && dialogEmployeeImageUpload.browse()"
|
||||
@update:toggle-status="
|
||||
(v) => {
|
||||
if (currentFromDataEmployee.id !== undefined)
|
||||
triggerChangeStatus(currentFromDataEmployee.id, v);
|
||||
}
|
||||
"
|
||||
active
|
||||
use-toggle
|
||||
color="white"
|
||||
icon="mdi-account-plus-outline"
|
||||
bg-color="linear-gradient(135deg, rgba(43,137,223,1) 0%, rgba(230,51,81,1) 100%)"
|
||||
v-model:current-tab="employeeFormState.currentTab"
|
||||
v-model:toggle-status="currentFromDataEmployee.status"
|
||||
v-model:cover-url="employeeFormState.profileUrl"
|
||||
fallback-cover="/images/employee-banner.png"
|
||||
:img="employeeFormState.profileUrl"
|
||||
:tabs-list="[
|
||||
{ name: 'personalInfo', label: 'personalInfo' },
|
||||
{ name: 'healthCheck', label: 'healthCheck' },
|
||||
{ name: 'workHistory', label: 'workHistory' },
|
||||
{ name: 'other', label: 'other' },
|
||||
]"
|
||||
:menu="formMenuIconEmployee"
|
||||
:toggle-title="$t('formDialogTitleUserStatus')"
|
||||
:hide-fade="
|
||||
employeeFormState.profileUrl === '' ||
|
||||
employeeFormState.profileUrl === undefined
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
style="flex: 1; width: 100%; overflow-y: auto"
|
||||
class="surface-2 q-pa-lg"
|
||||
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="q-py-md q-pl-md q-pr-sm">
|
||||
<SideMenu
|
||||
:menu="
|
||||
[
|
||||
{
|
||||
name: $t('formDialogTitleInformation'),
|
||||
anchor: 'drawer-form-information',
|
||||
tab: 'personalInfo',
|
||||
},
|
||||
{
|
||||
name: $t('formDialogTitlePersonal'),
|
||||
anchor: 'drawer-form-personal',
|
||||
tab: 'personalInfo',
|
||||
},
|
||||
{
|
||||
name: $t('formDialogTitlePersonnelAddress'),
|
||||
anchor: 'drawer-form-personal-address',
|
||||
tab: 'personalInfo',
|
||||
},
|
||||
{
|
||||
name: $t('formDialogTitlePassport'),
|
||||
anchor: 'drawer-form-passport',
|
||||
tab: 'personalInfo',
|
||||
},
|
||||
{
|
||||
name: $t('formDialogTitleVisa'),
|
||||
anchor: 'drawer-form-visa',
|
||||
tab: 'personalInfo',
|
||||
},
|
||||
...(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',
|
||||
tab: 'other',
|
||||
},
|
||||
].filter((v) => v.tab === employeeFormState.currentTab)
|
||||
"
|
||||
background="transparent"
|
||||
:active="{
|
||||
background: 'hsla(var(--blue-6-hsl) / .2)',
|
||||
foreground: 'var(--blue-6)',
|
||||
}"
|
||||
scroll-element="#drawer-employee-form-content"
|
||||
/>
|
||||
</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"
|
||||
>
|
||||
<template v-if="employeeFormState.currentTab === 'personalInfo'">
|
||||
<div
|
||||
class="surface-1 rounded q-pt-sm row"
|
||||
style="position: absolute; z-index: 999; right: 4%"
|
||||
>
|
||||
<UndoButton
|
||||
v-if="employeeFormState.isEmployeeEdit"
|
||||
id="btn-info-basic-undo"
|
||||
icon-only
|
||||
@click="
|
||||
() => {
|
||||
employeeFormStore.resetFormDataEmployee();
|
||||
employeeFormState.isEmployeeEdit = false;
|
||||
employeeFormState.dialogType = 'info';
|
||||
}
|
||||
<div class="column full-height">
|
||||
<div class="q-px-lg q-pt-lg surface-2">
|
||||
<ProfileBanner
|
||||
@view="employeeFormState.imageDialog = true"
|
||||
@edit="
|
||||
dialogEmployeeImageUpload && dialogEmployeeImageUpload.browse()
|
||||
"
|
||||
@update:toggle-status="
|
||||
(v) => {
|
||||
if (currentFromDataEmployee.id !== undefined)
|
||||
triggerChangeStatus(currentFromDataEmployee.id, v);
|
||||
}
|
||||
"
|
||||
active
|
||||
use-toggle
|
||||
color="white"
|
||||
icon="mdi-account-plus-outline"
|
||||
bg-color="linear-gradient(135deg, rgba(43,137,223,1) 0%, rgba(230,51,81,1) 100%)"
|
||||
v-model:current-tab="employeeFormState.currentTab"
|
||||
v-model:toggle-status="currentFromDataEmployee.status"
|
||||
v-model:cover-url="employeeFormState.profileUrl"
|
||||
fallback-cover="/images/employee-banner.png"
|
||||
:img="employeeFormState.profileUrl"
|
||||
:tabs-list="[
|
||||
{ name: 'personalInfo', label: 'personalInfo' },
|
||||
{ name: 'healthCheck', label: 'healthCheck' },
|
||||
{ name: 'workHistory', label: 'workHistory' },
|
||||
{ name: 'other', label: 'other' },
|
||||
]"
|
||||
:menu="formMenuIconEmployee"
|
||||
:toggle-title="$t('formDialogTitleUserStatus')"
|
||||
:hide-fade="
|
||||
employeeFormState.profileUrl === '' ||
|
||||
employeeFormState.profileUrl === undefined
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
style="flex: 1; width: 100%; overflow-y: auto"
|
||||
class="surface-2 q-pa-lg column"
|
||||
id="drawer-employee-form"
|
||||
>
|
||||
<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="
|
||||
[
|
||||
{
|
||||
name: $t('formDialogTitleInformation'),
|
||||
anchor: 'drawer-form-information',
|
||||
tab: 'personalInfo',
|
||||
},
|
||||
{
|
||||
name: $t('formDialogTitlePersonal'),
|
||||
anchor: 'drawer-form-personal',
|
||||
tab: 'personalInfo',
|
||||
},
|
||||
{
|
||||
name: $t('formDialogTitlePersonnelAddress'),
|
||||
anchor: 'drawer-form-personal-address',
|
||||
tab: 'personalInfo',
|
||||
},
|
||||
{
|
||||
name: $t('formDialogTitlePassport'),
|
||||
anchor: 'drawer-form-passport',
|
||||
tab: 'personalInfo',
|
||||
},
|
||||
{
|
||||
name: $t('formDialogTitleVisa'),
|
||||
anchor: 'drawer-form-visa',
|
||||
tab: 'personalInfo',
|
||||
},
|
||||
...(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',
|
||||
tab: 'other',
|
||||
},
|
||||
].filter((v) => v.tab === employeeFormState.currentTab)
|
||||
"
|
||||
type="button"
|
||||
/>
|
||||
<SaveButton
|
||||
v-if="employeeFormState.isEmployeeEdit"
|
||||
id="btn-info-basic-save"
|
||||
icon-only
|
||||
type="submit"
|
||||
/>
|
||||
<EditButton
|
||||
v-if="!employeeFormState.isEmployeeEdit"
|
||||
id="btn-info-basic-edit"
|
||||
icon-only
|
||||
@click="
|
||||
() => {
|
||||
employeeFormState.isEmployeeEdit = true;
|
||||
employeeFormState.dialogType = 'edit';
|
||||
}
|
||||
"
|
||||
type="button"
|
||||
/>
|
||||
<DeleteButton
|
||||
v-if="!employeeFormState.isEmployeeEdit"
|
||||
id="btn-info-basic-delete"
|
||||
icon-only
|
||||
@click="
|
||||
() => deleteEmployeeById({ id: currentFromDataEmployee.id })
|
||||
"
|
||||
type="button"
|
||||
background="transparent"
|
||||
:active="{
|
||||
background: 'hsla(var(--blue-6-hsl) / .2)',
|
||||
foreground: 'var(--blue-6)',
|
||||
}"
|
||||
scroll-element="#drawer-employee-form-content"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<BasicInformation
|
||||
no-action
|
||||
id="drawer-form-information"
|
||||
prefix-id="drawer-info-employee"
|
||||
dense
|
||||
outlined
|
||||
:title="'formDialogTitleInformation'"
|
||||
:readonly="!employeeFormState.isEmployeeEdit"
|
||||
:employee-owner-option="employeeStore.ownerOption"
|
||||
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"
|
||||
class="q-mb-xl"
|
||||
/>
|
||||
<FormPerson
|
||||
id="drawer-form-personal"
|
||||
prefix-id="drawer-info-employee"
|
||||
dense
|
||||
outlined
|
||||
employee
|
||||
separator
|
||||
:title="'personalInfo'"
|
||||
:readonly="!employeeFormState.isEmployeeEdit"
|
||||
v-model:firstName="currentFromDataEmployee.firstName"
|
||||
v-model:lastName="currentFromDataEmployee.lastName"
|
||||
v-model:firstNameEN="currentFromDataEmployee.firstNameEN"
|
||||
v-model:lastNameEN="currentFromDataEmployee.lastNameEN"
|
||||
v-model:gender="currentFromDataEmployee.gender"
|
||||
v-model:birthDate="currentFromDataEmployee.dateOfBirth"
|
||||
v-model:nationality="currentFromDataEmployee.nationality"
|
||||
class="q-mb-xl"
|
||||
/>
|
||||
<AddressForm
|
||||
id="drawer-form-personal-address"
|
||||
employee
|
||||
v-model:address="currentFromDataEmployee.address"
|
||||
v-model:addressEN="currentFromDataEmployee.addressEN"
|
||||
v-model:provinceId="currentFromDataEmployee.provinceId"
|
||||
v-model:districtId="currentFromDataEmployee.districtId"
|
||||
v-model:subDistrictId="currentFromDataEmployee.subDistrictId"
|
||||
v-model:zipCode="currentFromDataEmployee.zipCode"
|
||||
:readonly="!employeeFormState.isEmployeeEdit"
|
||||
prefix-id="drawer-info-personnel"
|
||||
dense
|
||||
class="q-mb-xl"
|
||||
/>
|
||||
<FormEmployeePassport
|
||||
prefix-id="drawer-info-employee"
|
||||
id="drawer-form-passport"
|
||||
dense
|
||||
outlined
|
||||
separator
|
||||
:title="'formDialogTitlePassport'"
|
||||
:readonly="!employeeFormState.isEmployeeEdit"
|
||||
v-model:passport-type="currentFromDataEmployee.passportType"
|
||||
v-model:passport-number="currentFromDataEmployee.passportNumber"
|
||||
v-model:passport-issue-date="
|
||||
currentFromDataEmployee.passportIssueDate
|
||||
"
|
||||
v-model:passport-expiry-date="
|
||||
currentFromDataEmployee.passportExpiryDate
|
||||
"
|
||||
v-model:passport-issuing-place="
|
||||
currentFromDataEmployee.passportIssuingPlace
|
||||
"
|
||||
v-model:passport-issuing-country="
|
||||
currentFromDataEmployee.passportIssuingCountry
|
||||
"
|
||||
v-model:previous-passport-reference="
|
||||
currentFromDataEmployee.previousPassportReference
|
||||
"
|
||||
class="q-mb-xl"
|
||||
/>
|
||||
<FormEmployeeVisa
|
||||
prefix-id="drawer-info-employee"
|
||||
id="drawer-form-visa"
|
||||
dense
|
||||
outlined
|
||||
:title="`formDialogTitleVisa`"
|
||||
:readonly="!employeeFormState.isEmployeeEdit"
|
||||
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-issuing-place="
|
||||
currentFromDataEmployee.visaIssuingPlace
|
||||
"
|
||||
v-model:visa-stay-until-date="
|
||||
currentFromDataEmployee.visaStayUntilDate
|
||||
"
|
||||
v-model:tm6-number="currentFromDataEmployee.tm6Number"
|
||||
v-model:entry-date="currentFromDataEmployee.entryDate"
|
||||
class="q-mb-xl"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template v-if="employeeFormState.currentTab === 'healthCheck'">
|
||||
<FormEmployeeHealthCheck
|
||||
v-if="employeeFormState.currentTab === 'healthCheck'"
|
||||
id="drawer-form-checkup"
|
||||
prefix-id="drawer-employee"
|
||||
dense
|
||||
outlined
|
||||
v-model:current-index="employeeFormState.currentIndex"
|
||||
v-model:employee-checkup="currentFromDataEmployee.employeeCheckup"
|
||||
v-model:checkup-type-option="
|
||||
optionStore.globalOption.insurancePlace
|
||||
"
|
||||
v-model:medical-benefit-option="
|
||||
optionStore.globalOption.typeInsurance
|
||||
"
|
||||
v-model:insuranceCompanyOption="
|
||||
optionStore.globalOption.insurancePlace
|
||||
"
|
||||
@save="
|
||||
(index) => {
|
||||
employeeFormState.currentIndex = index;
|
||||
notify('create', $t('success'));
|
||||
}
|
||||
"
|
||||
@edit="
|
||||
(index) => {
|
||||
if (
|
||||
currentFromDataEmployee.employeeCheckup?.[index].statusSave
|
||||
) {
|
||||
</div>
|
||||
<div
|
||||
class="col-12 col-md-10 q-py-md q-pr-md q-pl-sm"
|
||||
id="drawer-employee-form-content"
|
||||
style="height: 100%; overflow-y: auto"
|
||||
>
|
||||
<template v-if="employeeFormState.currentTab === 'personalInfo'">
|
||||
<div
|
||||
class="surface-1 rounded q-pt-sm row"
|
||||
style="position: absolute; z-index: 999; right: 4%"
|
||||
>
|
||||
<UndoButton
|
||||
v-if="employeeFormState.isEmployeeEdit"
|
||||
id="btn-info-basic-undo"
|
||||
icon-only
|
||||
@click="
|
||||
() => {
|
||||
employeeFormStore.resetFormDataEmployee();
|
||||
employeeFormState.isEmployeeEdit = false;
|
||||
employeeFormState.dialogType = 'info';
|
||||
}
|
||||
"
|
||||
type="button"
|
||||
/>
|
||||
<SaveButton
|
||||
v-if="employeeFormState.isEmployeeEdit"
|
||||
id="btn-info-basic-save"
|
||||
icon-only
|
||||
type="submit"
|
||||
/>
|
||||
<EditButton
|
||||
v-if="!employeeFormState.isEmployeeEdit"
|
||||
id="btn-info-basic-edit"
|
||||
icon-only
|
||||
@click="
|
||||
() => {
|
||||
employeeFormState.isEmployeeEdit = true;
|
||||
employeeFormState.dialogType = 'edit';
|
||||
}
|
||||
"
|
||||
type="button"
|
||||
/>
|
||||
<DeleteButton
|
||||
v-if="!employeeFormState.isEmployeeEdit"
|
||||
id="btn-info-basic-delete"
|
||||
icon-only
|
||||
@click="
|
||||
() => deleteEmployeeById({ id: currentFromDataEmployee.id })
|
||||
"
|
||||
type="button"
|
||||
/>
|
||||
</div>
|
||||
<BasicInformation
|
||||
no-action
|
||||
id="drawer-form-information"
|
||||
prefix-id="drawer-info-employee"
|
||||
dense
|
||||
outlined
|
||||
:title="'formDialogTitleInformation'"
|
||||
:readonly="!employeeFormState.isEmployeeEdit"
|
||||
:employee-owner-option="employeeStore.ownerOption"
|
||||
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
|
||||
"
|
||||
class="q-mb-xl"
|
||||
/>
|
||||
<FormPerson
|
||||
id="drawer-form-personal"
|
||||
prefix-id="drawer-info-employee"
|
||||
dense
|
||||
outlined
|
||||
employee
|
||||
separator
|
||||
:title="'personalInfo'"
|
||||
:readonly="!employeeFormState.isEmployeeEdit"
|
||||
v-model:firstName="currentFromDataEmployee.firstName"
|
||||
v-model:lastName="currentFromDataEmployee.lastName"
|
||||
v-model:firstNameEN="currentFromDataEmployee.firstNameEN"
|
||||
v-model:lastNameEN="currentFromDataEmployee.lastNameEN"
|
||||
v-model:gender="currentFromDataEmployee.gender"
|
||||
v-model:birthDate="currentFromDataEmployee.dateOfBirth"
|
||||
v-model:nationality="currentFromDataEmployee.nationality"
|
||||
class="q-mb-xl"
|
||||
/>
|
||||
<AddressForm
|
||||
id="drawer-form-personal-address"
|
||||
employee
|
||||
v-model:address="currentFromDataEmployee.address"
|
||||
v-model:addressEN="currentFromDataEmployee.addressEN"
|
||||
v-model:provinceId="currentFromDataEmployee.provinceId"
|
||||
v-model:districtId="currentFromDataEmployee.districtId"
|
||||
v-model:subDistrictId="currentFromDataEmployee.subDistrictId"
|
||||
v-model:zipCode="currentFromDataEmployee.zipCode"
|
||||
:readonly="!employeeFormState.isEmployeeEdit"
|
||||
prefix-id="drawer-info-personnel"
|
||||
dense
|
||||
class="q-mb-xl"
|
||||
/>
|
||||
<FormEmployeePassport
|
||||
prefix-id="drawer-info-employee"
|
||||
id="drawer-form-passport"
|
||||
dense
|
||||
outlined
|
||||
separator
|
||||
:title="'formDialogTitlePassport'"
|
||||
:readonly="!employeeFormState.isEmployeeEdit"
|
||||
v-model:passport-type="currentFromDataEmployee.passportType"
|
||||
v-model:passport-number="currentFromDataEmployee.passportNumber"
|
||||
v-model:passport-issue-date="
|
||||
currentFromDataEmployee.passportIssueDate
|
||||
"
|
||||
v-model:passport-expiry-date="
|
||||
currentFromDataEmployee.passportExpiryDate
|
||||
"
|
||||
v-model:passport-issuing-place="
|
||||
currentFromDataEmployee.passportIssuingPlace
|
||||
"
|
||||
v-model:passport-issuing-country="
|
||||
currentFromDataEmployee.passportIssuingCountry
|
||||
"
|
||||
v-model:previous-passport-reference="
|
||||
currentFromDataEmployee.previousPassportReference
|
||||
"
|
||||
class="q-mb-xl"
|
||||
/>
|
||||
<FormEmployeeVisa
|
||||
prefix-id="drawer-info-employee"
|
||||
id="drawer-form-visa"
|
||||
dense
|
||||
outlined
|
||||
:title="`formDialogTitleVisa`"
|
||||
:readonly="!employeeFormState.isEmployeeEdit"
|
||||
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-issuing-place="
|
||||
currentFromDataEmployee.visaIssuingPlace
|
||||
"
|
||||
v-model:visa-stay-until-date="
|
||||
currentFromDataEmployee.visaStayUntilDate
|
||||
"
|
||||
v-model:tm6-number="currentFromDataEmployee.tm6Number"
|
||||
v-model:entry-date="currentFromDataEmployee.entryDate"
|
||||
class="q-mb-xl"
|
||||
/>
|
||||
</template>
|
||||
<template v-if="employeeFormState.currentTab === 'healthCheck'">
|
||||
<FormEmployeeHealthCheck
|
||||
v-if="employeeFormState.currentTab === 'healthCheck'"
|
||||
id="drawer-form-checkup"
|
||||
prefix-id="drawer-employee"
|
||||
dense
|
||||
outlined
|
||||
v-model:current-index="employeeFormState.currentIndex"
|
||||
v-model:employee-checkup="
|
||||
currentFromDataEmployee.employeeCheckup
|
||||
"
|
||||
v-model:checkup-type-option="
|
||||
optionStore.globalOption.insurancePlace
|
||||
"
|
||||
v-model:medical-benefit-option="
|
||||
optionStore.globalOption.typeInsurance
|
||||
"
|
||||
v-model:insuranceCompanyOption="
|
||||
optionStore.globalOption.insurancePlace
|
||||
"
|
||||
@save="
|
||||
(index) => {
|
||||
employeeFormState.currentIndex = index;
|
||||
currentFromDataEmployee.employeeCheckup[index].statusSave =
|
||||
false;
|
||||
notify('create', $t('success'));
|
||||
}
|
||||
}
|
||||
"
|
||||
@undo="
|
||||
(index) => {
|
||||
if (
|
||||
currentFromDataEmployee.employeeCheckup?.[index]
|
||||
.statusSave === false
|
||||
) {
|
||||
employeeFormState.currentIndex = -1;
|
||||
currentFromDataEmployee.employeeCheckup[index].statusSave =
|
||||
true;
|
||||
employeeFormStore.resetFormDataEmployee();
|
||||
"
|
||||
@edit="
|
||||
(index) => {
|
||||
if (
|
||||
currentFromDataEmployee.employeeCheckup?.[index]
|
||||
.statusSave
|
||||
) {
|
||||
employeeFormState.currentIndex = index;
|
||||
currentFromDataEmployee.employeeCheckup[
|
||||
index
|
||||
].statusSave = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
"
|
||||
@delete="
|
||||
(index) => {
|
||||
employeeFormState.currentIndex = index;
|
||||
deleteEmployeeById({ type: 'healthCheck' });
|
||||
}
|
||||
"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template v-if="employeeFormState.currentTab === 'workHistory'">
|
||||
<FormEmployeeWorkHistory
|
||||
v-if="employeeFormState.currentTab === 'workHistory'"
|
||||
id="drawer-work-history"
|
||||
prefix-id="drawer-employee"
|
||||
dense
|
||||
outlined
|
||||
v-model:current-index="employeeFormState.currentIndex"
|
||||
v-model:employee-work="currentFromDataEmployee.employeeWork"
|
||||
v-model:position-name-option="optionStore.globalOption.position"
|
||||
v-model:job-type-option="optionStore.globalOption.businessType"
|
||||
v-model:workplace-option="optionStore.globalOption.area"
|
||||
@delete="
|
||||
(index) => {
|
||||
employeeFormState.currentIndex = index;
|
||||
deleteEmployeeById({ type: 'work' });
|
||||
}
|
||||
"
|
||||
@save="
|
||||
(index) => {
|
||||
employeeFormState.currentIndex = index;
|
||||
}
|
||||
"
|
||||
@undo="
|
||||
(index) => {
|
||||
if (
|
||||
currentFromDataEmployee.employeeWork?.[index].statusSave ===
|
||||
false
|
||||
) {
|
||||
employeeFormState.currentIndex = -1;
|
||||
currentFromDataEmployee.employeeWork[index].statusSave =
|
||||
true;
|
||||
"
|
||||
@undo="
|
||||
(index) => {
|
||||
if (
|
||||
currentFromDataEmployee.employeeCheckup?.[index]
|
||||
.statusSave === false
|
||||
) {
|
||||
employeeFormState.currentIndex = -1;
|
||||
currentFromDataEmployee.employeeCheckup[
|
||||
index
|
||||
].statusSave = true;
|
||||
employeeFormStore.resetFormDataEmployee();
|
||||
}
|
||||
}
|
||||
}
|
||||
"
|
||||
@edit="
|
||||
(index) => {
|
||||
if (
|
||||
currentFromDataEmployee.employeeWork?.[index].statusSave
|
||||
) {
|
||||
"
|
||||
@delete="
|
||||
(index) => {
|
||||
employeeFormState.currentIndex = index;
|
||||
currentFromDataEmployee.employeeWork[index].statusSave =
|
||||
false;
|
||||
deleteEmployeeById({ type: 'healthCheck' });
|
||||
}
|
||||
}
|
||||
"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template v-if="employeeFormState.currentTab === 'other'">
|
||||
<FormEmployeeOther
|
||||
v-if="employeeFormState.currentTab === 'other'"
|
||||
id="drawer-other"
|
||||
prefix-id="drawer-employee"
|
||||
dense
|
||||
outlined
|
||||
v-model:employee-other="currentFromDataEmployee.employeeOtherInfo"
|
||||
@undo="
|
||||
() => {
|
||||
if (
|
||||
currentFromDataEmployee.employeeOtherInfo?.statusSave ===
|
||||
false
|
||||
) {
|
||||
currentFromDataEmployee.employeeOtherInfo.statusSave = true;
|
||||
"
|
||||
/>
|
||||
</template>
|
||||
<template v-if="employeeFormState.currentTab === 'workHistory'">
|
||||
<FormEmployeeWorkHistory
|
||||
v-if="employeeFormState.currentTab === 'workHistory'"
|
||||
id="drawer-work-history"
|
||||
prefix-id="drawer-employee"
|
||||
dense
|
||||
outlined
|
||||
v-model:current-index="employeeFormState.currentIndex"
|
||||
v-model:employee-work="currentFromDataEmployee.employeeWork"
|
||||
v-model:position-name-option="optionStore.globalOption.position"
|
||||
v-model:job-type-option="optionStore.globalOption.businessType"
|
||||
v-model:workplace-option="optionStore.globalOption.area"
|
||||
@delete="
|
||||
(index) => {
|
||||
employeeFormState.currentIndex = index;
|
||||
deleteEmployeeById({ type: 'work' });
|
||||
}
|
||||
}
|
||||
"
|
||||
@edit="
|
||||
() => {
|
||||
if (currentFromDataEmployee.employeeOtherInfo?.statusSave) {
|
||||
currentFromDataEmployee.employeeOtherInfo.statusSave = false;
|
||||
"
|
||||
@save="
|
||||
(index) => {
|
||||
employeeFormState.currentIndex = index;
|
||||
}
|
||||
}
|
||||
"
|
||||
/>
|
||||
</template>
|
||||
"
|
||||
@undo="
|
||||
(index) => {
|
||||
if (
|
||||
currentFromDataEmployee.employeeWork?.[index]
|
||||
.statusSave === false
|
||||
) {
|
||||
employeeFormState.currentIndex = -1;
|
||||
currentFromDataEmployee.employeeWork[index].statusSave =
|
||||
true;
|
||||
}
|
||||
}
|
||||
"
|
||||
@edit="
|
||||
(index) => {
|
||||
if (
|
||||
currentFromDataEmployee.employeeWork?.[index].statusSave
|
||||
) {
|
||||
employeeFormState.currentIndex = index;
|
||||
currentFromDataEmployee.employeeWork[index].statusSave =
|
||||
false;
|
||||
}
|
||||
}
|
||||
"
|
||||
/>
|
||||
</template>
|
||||
<template v-if="employeeFormState.currentTab === 'other'">
|
||||
<FormEmployeeOther
|
||||
v-if="employeeFormState.currentTab === 'other'"
|
||||
id="drawer-other"
|
||||
prefix-id="drawer-employee"
|
||||
dense
|
||||
outlined
|
||||
v-model:employee-other="
|
||||
currentFromDataEmployee.employeeOtherInfo
|
||||
"
|
||||
@undo="
|
||||
() => {
|
||||
if (
|
||||
currentFromDataEmployee.employeeOtherInfo?.statusSave ===
|
||||
false
|
||||
) {
|
||||
currentFromDataEmployee.employeeOtherInfo.statusSave = true;
|
||||
}
|
||||
}
|
||||
"
|
||||
@edit="
|
||||
() => {
|
||||
if (currentFromDataEmployee.employeeOtherInfo?.statusSave) {
|
||||
currentFromDataEmployee.employeeOtherInfo.statusSave = false;
|
||||
}
|
||||
}
|
||||
"
|
||||
/>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue