49 lines
1.6 KiB
Vue
49 lines
1.6 KiB
Vue
div
|
|
<script setup lang="ts">
|
|
import { ref, onMounted } from "vue";
|
|
import ListPosition from "@/modules/01_metadataNew/components/position/01ListPosition.vue";
|
|
import ListType from "@/modules/01_metadataNew/components/position/02ListType.vue";
|
|
import ListExecutive from "@/modules/01_metadataNew/components/position/03ListExecutive.vue";
|
|
const currentTab = ref<string>("list_position");
|
|
const tabs = ref<Array<any>>([]);
|
|
|
|
onMounted(() => {
|
|
const tabsPerson = [
|
|
{ label: "ตำแหน่ง", value: "list_position" },
|
|
{ label: "ประเภทและระดับตำแหน่ง", value: "list_type" },
|
|
{ label: "ตำแหน่งทางการบริหาร", value: "list_executive" },
|
|
];
|
|
tabs.value = tabsPerson;
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="toptitle text-dark col-12 row items-center">ข้อมูลตำแหน่ง</div>
|
|
|
|
<q-card flat bordered class="q-pa-md">
|
|
<q-tabs
|
|
dense
|
|
v-model="currentTab"
|
|
align="left"
|
|
indicator-color="primary"
|
|
active-color="primary bg-teal-1"
|
|
inline-label
|
|
class="text-body2 text-grey-7"
|
|
>
|
|
<q-tab
|
|
v-for="tab in tabs"
|
|
:key="tab.value"
|
|
v-on:click="currentTab = tab.value"
|
|
:label="tab.label"
|
|
:name="tab.value"
|
|
class="q-py-xs"
|
|
/>
|
|
</q-tabs>
|
|
<q-separator size="2px" />
|
|
<ListPosition v-if="currentTab == 'list_position'"/>
|
|
<ListType v-if="currentTab == 'list_type'"/>
|
|
<ListExecutive v-if="currentTab == 'list_executive'"/>
|
|
</q-card>
|
|
</template>
|
|
|
|
<style scoped></style>
|