เพิ่มข้อมูลหลักตำแหน่งลูกจ้างประจำ, เพิ่ม page เลื่อนเงินเดือนลูกจ้างประจำ

src/modules/01_metadataNew/views/position.vue

@@ -20,7 +20,9 @@ onMounted(() => {
 </script>
 
 <template>
-  <div class="toptitle text-dark col-12 row items-center">ข้อมูลตำแหน่ง</div>
+  <div class="toptitle text-dark col-12 row items-center">
+    ข้อมูลตำแหน่งข้าราชการฯ
+  </div>
 
   <q-card flat bordered>
     <q-tabs

src/modules/01_metadataNew/views/positionEmployee.vue

@@ -0,0 +1,62 @@
+div
+<script setup lang="ts">
+import { ref, onMounted } from "vue";
+import ListPosition from "@/modules/01_metadataNew/components/position-employee/01ListPosition.vue";
+import ListType from "@/modules/01_metadataNew/components/position-employee/02ListType.vue";
+import { usePositionEmployeeDataStore } from "../stores/positionEmployeeStore";
+// const store.pathLocation = ref<string>("list_position");
+const tabs = ref<Array<any>>([]);
+const store = usePositionEmployeeDataStore();
+
+onMounted(() => {
+  const tabsPerson = [
+    { label: "ตำแหน่ง", value: "list_position" },
+    { label: "รายการกลุ่มงาน", value: "list_type" },
+  ];
+  tabs.value = tabsPerson;
+});
+</script>
+
+<template>
+  <div class="toptitle text-dark col-12 row items-center">
+    ข้อมูลตำแหน่งลูกจ้างประจำ
+  </div>
+
+  <q-card flat bordered>
+    <q-tabs
+      dense
+      v-model="store.pathLocation"
+      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="store.pathLocation = tab.value"
+        :label="tab.label"
+        :name="tab.value"
+        class="q-py-xs"
+      />
+    </q-tabs>
+    <q-separator />
+
+    <q-tab-panels v-model="store.pathLocation" animated>
+      <q-tab-panel name="list_position">
+        <ListPosition v-if="store.pathLocation == 'list_position'" />
+      </q-tab-panel>
+
+      <q-tab-panel name="list_type">
+        <ListType v-if="store.pathLocation == 'list_type'" />
+      </q-tab-panel>
+
+      <q-tab-panel name="list_executive">
+        <ListExecutive v-if="store.pathLocation == 'list_executive'" />
+      </q-tab-panel>
+    </q-tab-panels>
+  </q-card>
+</template>
+
+<style scoped></style>