72 lines
2.6 KiB
Vue
72 lines
2.6 KiB
Vue
<script setup lang="ts">
|
|
import { ref, onMounted } from "vue";
|
|
|
|
import ListCompetency from "@/modules/01_metadata/components/competency/01ListCompetency.vue";
|
|
import ListLinkPosition from "@/modules/01_metadata/components/competency/02ListLinkPosition.vue";
|
|
import ListLinkGroup from "@/modules/01_metadata/components/competency/03ListLinkGroup.vue";
|
|
import ListCriteria from "@/modules/01_metadata/components/competency/04ListCriteria.vue";
|
|
import ListDetail from "@/modules/01_metadata/components/competency/05ListDetail.vue";
|
|
|
|
const currentTab = ref<string>("list_competency");
|
|
const tabs = ref<Array<any>>([]);
|
|
|
|
onMounted(() => {
|
|
const tab = [
|
|
{ label: "รายการสมรรถนะ", value: "list_competency" },
|
|
{ label: "กลุ่มงาน", value: "list_linkPosition" },
|
|
{ label: "เชื่อมโยงกับกลุ่มงานและตำแหน่ง", value: "list_linkGroup" },
|
|
{ label: "เกณฑ์การประเมิน", value: "list_criteria" },
|
|
{ label: "การประเมินพฤติกรรมการปฏิบัติราชการ", value: "list_detail" },
|
|
];
|
|
tabs.value = tab;
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="toptitle text-dark col-12 row items-center">สมรรถนะ</div>
|
|
|
|
<q-card flat bordered>
|
|
<div class="text-subtitle1 text-grey-9">
|
|
<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 />
|
|
<!-- person -->
|
|
|
|
<q-tab-panels v-model="currentTab" animated>
|
|
<q-tab-panel name="list_competency">
|
|
<ListCompetency v-if="currentTab == 'list_competency'" />
|
|
</q-tab-panel>
|
|
<q-tab-panel name="list_linkPosition">
|
|
<ListLinkPosition v-if="currentTab == 'list_linkPosition'" />
|
|
</q-tab-panel>
|
|
<q-tab-panel name="list_linkGroup">
|
|
<ListLinkGroup v-if="currentTab == 'list_linkGroup'" />
|
|
</q-tab-panel>
|
|
<q-tab-panel name="list_criteria">
|
|
<ListCriteria v-if="currentTab == 'list_criteria'" />
|
|
</q-tab-panel>
|
|
<q-tab-panel name="list_detail">
|
|
<ListDetail v-if="currentTab == 'list_detail'" />
|
|
</q-tab-panel>
|
|
</q-tab-panels>
|
|
</div>
|
|
</q-card>
|
|
</template>
|
|
|
|
<style scoped></style>
|