hrms-mgt/src/modules/04_registryPerson/views/requestEditView.vue
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 0612820928 ปรับ UI
2024-11-22 18:04:12 +07:00

82 lines
2.2 KiB
Vue

<script setup lang="ts">
import { onBeforeMount, onMounted, ref } from "vue";
import { useRoute, useRouter } from "vue-router";
import { useRegistryNewDataStore } from "@/modules/04_registryPerson/store";
import TabInformation from "@/modules/04_registryPerson/components/requestEdit/01_TabInformation.vue";
import TabIDP from "@/modules/04_registryPerson/components/requestEdit/02_TabIDP.vue";
const router = useRouter();
const route = useRoute();
const store = useRegistryNewDataStore();
const isIDP = ref<boolean | null>(null);
const isEmployee = ref<boolean>(
route.name?.toString() == "registryNewRequestEditEMP" ? true : false
);
onBeforeMount(async () => {
isIDP.value = await (route.name?.toString() == "registryNewRequestEditEMP"
? false
: true);
});
onMounted(() => {
store.tabs = !isIDP.value ? "Main" : store.tabs;
});
</script>
<template>
<div class="row items-center">
<div class="toptitle text-dark row items-center q-py-xs">
<q-btn
icon="mdi-arrow-left"
unelevated
round
dense
flat
color="primary"
class="q-mr-sm"
@click="router.go(-1)"
/>
รายการคำรองขอแกไขทะเบยนประว
{{ `(${isEmployee ? "ลูกจ้างประจำ" : "ข้าราชการ กทม.สามัญ"})` }}
</div>
</div>
<q-card class="q-mt-sm">
<q-card-section style="padding: 0px">
<q-separator />
<q-tabs
v-if="isIDP"
v-model="store.tabs"
inline-label
align="left"
indicator-color="primary"
active-color="primary bg-teal-1"
>
<q-tab
v-for="(tab, index) in store.tabsManu"
:key="index"
:name="tab.id"
:label="tab.name"
/>
</q-tabs>
<q-separator />
<q-tab-panels v-model="store.tabs" animated>
<q-tab-panel style="padding: 0px" name="Main">
<TabInformation />
</q-tab-panel>
<q-tab-panel style="padding: 0px" name="IDP">
<TabIDP :is-idp="isIDP" />
</q-tab-panel>
</q-tab-panels>
</q-card-section>
</q-card>
</template>
<style scoped></style>