รายการขอรับประเมินผลการปฏิบัติราชการระดับบุคคล => แก้ไขแบบประเมิน, API ผลสัมฤทธิ์ของงาน

src/modules/08_KPI/components/Tab/01_Assessment.vue

@@ -1,38 +1,69 @@
 <script setup lang="ts">
-import { useQuasar, type QTableProps } from "quasar";
 import { ref, onMounted } from "vue";
+import { useQuasar } from "quasar";
+import { useRoute } from "vue-router";
+
+import config from "@/app.config";
+import http from "@/plugins/http";
 
 import Work from "@/modules/08_KPI/components/Tab/Topic/01_Indicator.vue";
 import Competency from "@/modules/08_KPI/components/Tab/Topic/02_Competency.vue";
 
+import { useCounterMixin } from "@/stores/mixin";
+import { useKpiDataStore } from "@/modules/08_KPI/store";
+
+const $q = useQuasar();
+const route = useRoute();
+const { showLoader, hideLoader, messageError } = useCounterMixin();
+const store = useKpiDataStore();
+
+const evaluationId = ref<string>(route.params.id.toString());
+
 const rows_01 = ref<any[]>();
 const rows_02 = ref<any[]>();
 const rows_03 = ref<any[]>();
 
-const rows_04 = ref<any[]>();
-const rows_05 = ref<any[]>();
-
 const total = ref<number>(0);
 const resultWork = ref<number>(0);
 const resultEvaluation = ref<number>(0);
 
-function getList() {
-  const data = [
-    {
-      indicators: "ตัวชี้วัด 1",
-      target: null,
-      scoreLevel: "4",
-      weight: "50",
-      workResult: "ระดับ 5",
-      evaluationResults: "50",
-    },
-  ];
-
-  rows_01.value = data;
+function fetchListPlanned() {
+  showLoader();
+  http
+    .get(config.API.kpiAchievement("planned") + `?id=${evaluationId.value}`)
+    .then((res) => {
+      const data = res.data.result;
+      rows_01.value = data;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
 }
 
+function fetchListRole() {
+  showLoader();
+  http
+    .get(config.API.kpiAchievement("role") + `?id=${evaluationId.value}`)
+    .then((res) => {
+      const data = res.data.result;
+      rows_02.value = data;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
+function fetchAssigned() {}
+
 onMounted(() => {
-  getList();
+  fetchListPlanned();
+  fetchListRole();
 });
 </script>
 
@@ -52,16 +83,19 @@ onMounted(() => {
         v-model:data="rows_01"
         :title="`1. งานตามแผนปฏิบัติราชการประจำปี`"
         :page="1"
+        :fetchList="fetchListPlanned"
       />
       <Work
         v-model:data="rows_02"
         :title="`2. งานตามหน้าที่ความรับผิดชอบหลัก`"
         :page="2"
+        :fetchList="fetchListRole"
       />
       <Work
         v-model:data="rows_03"
         :title="`3. งานที่ได้รับมอบหมายพิเศษ`"
         :page="3"
+        :fetchList="fetchAssigned"
       />
       <div class="row text-body2 text-weight-bold">
         <div class="col-6 text-center row justify-center">