refactor: SideMenu navigate

This commit is contained in:
Net 2024-08-19 17:18:53 +07:00
parent b8a67a0b97
commit 8a9df70639

View file

@ -1943,51 +1943,50 @@ const emptyCreateDialog = ref(false);
<div class="q-py-md q-pl-md q-pr-sm"> <div class="q-py-md q-pl-md q-pr-sm">
<SideMenu <SideMenu
:menu=" :menu="
employeeFormState.currentTab === 'personalInfo' [
? [ {
{ name: $t('formDialogTitleInformation'),
name: $t('formDialogTitleInformation'), anchor: 'form-information',
anchor: 'form-information', tab: 'personalInfo',
}, },
{ {
name: $t('formDialogTitlePersonal'), name: $t('formDialogTitlePersonal'),
anchor: 'form-personal', anchor: 'form-personal',
}, tab: 'personalInfo',
{ },
name: $t('formDialogTitlePersonnelAddress'), {
anchor: 'form-personal-address', name: $t('formDialogTitlePersonnelAddress'),
}, anchor: 'form-personal-address',
{ tab: 'personalInfo',
name: $t('formDialogTitlePassport'), },
anchor: 'form-passport', {
}, name: $t('formDialogTitlePassport'),
{ anchor: 'form-passport',
name: $t('formDialogTitleVisa'), tab: 'personalInfo',
anchor: 'form-visa', },
}, {
] name: $t('formDialogTitleVisa'),
: employeeFormState.currentTab === 'healthCheck' anchor: 'form-visa',
? [ tab: 'personalInfo',
{ },
name: $t('formDialogInputCheckupRes'), ...(currentFromDataEmployee.employeeCheckup?.map((v, i) => ({
anchor: 'form-checkup', name: $t('customer.form.instance', { index: i + 1 }),
}, anchor: `form-employee-checkup-${i}`,
] tab: 'healthCheck',
: employeeFormState.currentTab === 'workHistory' })) || []),
? [
{ ...(currentFromDataEmployee.employeeWork?.map((v, i) => ({
name: $t('workHistory'), name: $t('customer.form.instance', { index: i + 1 }),
anchor: 'form-workHistory', anchor: `form-employee-work-history-${i}`,
}, tab: 'workHistory',
] })) || []),
: employeeFormState.currentTab === 'other'
? [ {
{ name: $t('formDialogTitleFamilyHistory'),
name: $t('other'), anchor: 'form-employee-other',
anchor: 'form-other', tab: 'other',
}, },
] ].filter((v) => v.tab === employeeFormState.currentTab)
: []
" "
background="transparent" background="transparent"
:active="{ :active="{
@ -2260,7 +2259,7 @@ const emptyCreateDialog = ref(false);
<template v-if="employeeFormState.currentTab === 'other'"> <template v-if="employeeFormState.currentTab === 'other'">
<FormEmployeeOther <FormEmployeeOther
v-if="employeeFormState.currentTab === 'other'" v-if="employeeFormState.currentTab === 'other'"
id="form-other" id="form-employee-other"
prefix-id="form-employee" prefix-id="form-employee"
dense dense
outlined outlined
@ -2458,28 +2457,52 @@ const emptyCreateDialog = ref(false);
> >
<div class="q-py-md q-pl-md q-pr-sm"> <div class="q-py-md q-pl-md q-pr-sm">
<SideMenu <SideMenu
:menu="[ :menu="
{ [
name: $t('formDialogTitleInformation'), {
anchor: 'drawer-form-information', name: $t('formDialogTitleInformation'),
}, anchor: 'drawer-form-information',
{ tab: 'personalInfo',
name: $t('formDialogTitlePersonal'), },
anchor: 'drawer-form-personal', {
}, name: $t('formDialogTitlePersonal'),
{ anchor: 'drawer-form-personal',
name: $t('formDialogTitlePersonnelAddress'), tab: 'personalInfo',
anchor: 'drawer-form-personal-address', },
}, {
{ name: $t('formDialogTitlePersonnelAddress'),
name: $t('formDialogTitlePassport'), anchor: 'drawer-form-personal-address',
anchor: 'drawer-form-passport', tab: 'personalInfo',
}, },
{ {
name: $t('formDialogTitleVisa'), name: $t('formDialogTitlePassport'),
anchor: 'drawer-form-visa', 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" background="transparent"
:active="{ :active="{
background: 'hsla(var(--blue-6-hsl) / .2)', background: 'hsla(var(--blue-6-hsl) / .2)',
@ -2644,7 +2667,7 @@ const emptyCreateDialog = ref(false);
<FormEmployeeHealthCheck <FormEmployeeHealthCheck
v-if="employeeFormState.currentTab === 'healthCheck'" v-if="employeeFormState.currentTab === 'healthCheck'"
id="drawer-form-checkup" id="drawer-form-checkup"
prefix-id="form-employee" prefix-id="drawer-employee"
dense dense
outlined outlined
v-model:current-index="employeeFormState.currentIndex" v-model:current-index="employeeFormState.currentIndex"