From 4269779267f0fcd3223fa376be132a431915afa3 Mon Sep 17 00:00:00 2001
From: setthawutttty <trx.setthawut@gmail.com>
Date: Thu, 30 Jan 2025 16:03:18 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=20kpi?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/Tab/Topic/02_Competency.vue    | 60 ++++++++++++++-----
 1 file changed, 45 insertions(+), 15 deletions(-)

diff --git a/src/modules/14_KPI/components/Tab/Topic/02_Competency.vue b/src/modules/14_KPI/components/Tab/Topic/02_Competency.vue
index bd599328f..fb6eca2a8 100644
--- a/src/modules/14_KPI/components/Tab/Topic/02_Competency.vue
+++ b/src/modules/14_KPI/components/Tab/Topic/02_Competency.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, ref, computed } from "vue";
+import { onMounted, ref, computed, watch } from "vue";
 import { useQuasar, type QTableProps } from "quasar";
 
 import http from "@/plugins/http";
@@ -288,28 +288,54 @@ function onLevel(num: number, list: any) {
   modalLevel.value = true;
 }
 
-onMounted(() => {
-  setTimeout(async () => {
+watch(
+  () => store.dataEvaluation.posTypeName, // ตรวจจับค่า posTypeName
+  (newValue) => {
+    if (!newValue) return; // ถ้ายังไม่มีค่า ไม่ต้องทำอะไร
+
+    const competencyTypeList = [
+      {
+        id: "HEAD",
+        name: "สมรรถนะหลัก",
+      },
+      {
+        id: "GROUP",
+        name: "สมรรถนะประจำกลุ่มงาน",
+      },
+      {
+        id: "EXECUTIVE",
+        name: "สมรรถนะประจำผู้บริหารกรุงเทพมหานคร",
+      },
+      {
+        id: "DIRECTOR",
+        name: "สมรรถนะเฉพาะสำหรับตำแหน่ง ผอ.เขต ผช.ผอ.เขต และหัวหน้าฝ่ายในสังกัด สนง.เขต",
+      },
+      {
+        id: "INSPECTOR",
+        name: "สมรรถนะเฉพาะสำหรับตำแหน่งผู้ตรวจราชการ กทม. และผู้ตรวจราชการ",
+      },
+    ];
+
     competencyType.value =
-      store.dataEvaluation.posTypeName == "อำนวยการ" ||
-      store.dataEvaluation.posTypeName == "บริหาร"
-        ? store.competencyType.filter(
+      newValue === "อำนวยการ" || newValue === "บริหาร"
+        ? competencyTypeList.filter(
             (x: DataOptions) =>
-              x.id == "HEAD" ||
-              x.id == "EXECUTIVE" ||
-              x.id == "INSPECTOR" ||
-              x.id == "DIRECTOR"
+              x.id === "HEAD" ||
+              x.id === "EXECUTIVE" ||
+              x.id === "INSPECTOR" ||
+              x.id === "DIRECTOR"
           )
-        : store.competencyType.filter(
-            (x: DataOptions) => x.id == "HEAD" || x.id == "GROUP"
+        : competencyTypeList.filter(
+            (x: DataOptions) => x.id === "HEAD" || x.id === "GROUP"
           );
 
     for (let index = 0; index < competencyType.value.length; index++) {
       const element = competencyType.value[index];
       getData(element.id);
     }
-  }, 1000);
-});
+  },
+  { immediate: true }
+);
 </script>
 
 <template>
@@ -470,7 +496,11 @@ onMounted(() => {
                     dense
                     @click="openPopupProgress(props.row.id)"
                   >
-                    <q-tooltip>{{store.tabMain == '3' ? 'บันทึกเหตุการณ์/พฤติกรรม/เหตุผล':'บันทึกเหตุการณ์/พฤติกรรม'}}</q-tooltip>
+                    <q-tooltip>{{
+                      store.tabMain == "3"
+                        ? "บันทึกเหตุการณ์/พฤติกรรม/เหตุผล"
+                        : "บันทึกเหตุการณ์/พฤติกรรม"
+                    }}</q-tooltip>
                   </q-btn>
                 </div>