แก้ load ระบบ kpi

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

@@ -16,13 +16,20 @@ import { useKpiDataStore } from "@/modules/08_KPI/store";
 
 import type { ListCriteria } from "@/modules/08_KPI/interface/request/index";
 
-const score = defineModel("score", { type: Number, default: 0 });
+const indicatorScore = defineModel("indicatorScore", {
+  type: Number,
+  default: 0,
+});
+const competencyScore = defineModel("competencyScore", {
+  type: Number,
+  default: 0,
+});
 const dataListCriteria = ref<ListCriteria[]>([]);
 
 const modalCriteria = ref<boolean>(false);
 const $q = useQuasar();
 const route = useRoute();
-const { showLoader, hideLoader, messageError } = useCounterMixin();
+const { hideLoader, messageError } = useCounterMixin();
 const store = useKpiDataStore();
 
 const evaluationId = ref<string>(route.params.id.toString());
@@ -37,7 +44,6 @@ const totalResults3 = ref<number>(0);
 // const resultWork = ref<number>(0);
 
 function fetchListPlanned() {
-  showLoader();
   http
     .get(config.API.kpiAchievement("planned") + `?id=${evaluationId.value}`)
     .then((res) => {
@@ -64,14 +70,10 @@ function fetchListPlanned() {
     })
     .catch((err) => {
       messageError($q, err);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
 function fetchListRole() {
-  showLoader();
   http
     .get(config.API.kpiAchievement("role") + `?id=${evaluationId.value}`)
     .then((res) => {
@@ -98,14 +100,10 @@ function fetchListRole() {
     })
     .catch((err) => {
       messageError($q, err);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
 function fetchAssigned() {
-  showLoader();
   http
     .get(config.API.kpiAchievement("special") + `?id=${evaluationId.value}`)
     .then((res) => {
@@ -133,9 +131,6 @@ function fetchAssigned() {
     })
     .catch((err) => {
       messageError($q, err);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
@@ -143,10 +138,9 @@ function onInfo() {
   modalCriteria.value = true;
 }
 
-const totalCompetency = ref<number>(0);
 const resultWork = computed(() => {
   const total = totalResults1.value + totalResults2.value + totalResults3.value;
-  score.value = total;
+  indicatorScore.value = total;
   return total.toFixed(2);
 });
 
@@ -159,25 +153,9 @@ function getCriteria() {
     })
     .catch((e) => {
       messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
-watch(
-  () => totalCompetency.value,
-  (newValue, oldValue) => {
-    if (newValue !== oldValue) {
-      score.value =
-        totalResults1.value +
-        totalResults2.value +
-        totalResults3.value +
-        newValue;
-    }
-  }
-);
-
 watch(
   () => store.dataEvaluation.plannedPoint,
   (newValue, oldValue) => {
@@ -210,6 +188,9 @@ onMounted(() => {
   fetchListPlanned();
   fetchListRole();
   fetchAssigned();
+  setTimeout(() => {
+    hideLoader();
+  }, 1000);
 });
 </script>
 
@@ -286,7 +267,7 @@ onMounted(() => {
 
       <Competency
         v-model:dataListCriteria="dataListCriteria"
-        v-model:total-competency="totalCompetency"
+        v-model:competencyScore="competencyScore"
       />
     </div>
   </q-scroll-area>

src/modules/08_KPI/components/Tab/TabMain.vue

@@ -12,8 +12,14 @@ import File from "@/modules/08_KPI/components/Tab/05_File.vue";
 const store = useKpiDataStore();
 const route = useRoute();
 const isReadonly = <boolean>(route.name === "KPIEditEvaluator" ? true : false);
-const score = defineModel("score", { type: Number, default: 0 });
-
+const indicatorScore = defineModel("indicatorScore", {
+  type: Number,
+  default: 0,
+});
+const competencyScore = defineModel("competencyScore", {
+  type: Number,
+  default: 0,
+});
 const itemsTab = ref<any>([
   {
     name: "1",
@@ -84,7 +90,11 @@ const splitterModel = ref<number>(12);
           :name="tab.name"
           class="q-pa-none"
         >
-          <Assessment v-if="store.tabMain === '1'" v-model:score="score" />
+          <Assessment
+            v-if="store.tabMain === '1'"
+            v-model:indicatorScore="indicatorScore"
+            v-model:competencyScore="competencyScore"
+          />
           <Evaluator v-if="store.tabMain === '2'" :type="'evaluator'" />
           <Evaluator v-if="store.tabMain === '3'" :type="'commander'" />
           <Evaluator v-if="store.tabMain === '4'" :type="'commanderHigh'" />

src/modules/08_KPI/components/Tab/Topic/02_Competency.vue

@@ -18,7 +18,7 @@ import type {
 const dataListCriteria = defineModel<ListCriteria[]>("dataListCriteria", {
   required: true,
 });
-const totalCompetency = defineModel("totalCompetency", {
+const competencyScore = defineModel("competencyScore", {
   type: Number,
   default: 0,
 });
@@ -118,7 +118,6 @@ const lists = ref<any>([]);
 const resultEvaluation = ref<string | 0>(0);
 
 function getData(type: string) {
-  showLoader();
   http
     .get(config.API.kpiUserCapacity + `?id=${id.value}&type=${type}`)
     .then(async (res) => {
@@ -163,11 +162,8 @@ function getData(type: string) {
             ? (resultAvg / weightAvg) * store.dataEvaluation.capacityPoint
             : 0;
         resultEvaluation.value = sum.toFixed(2);
-        totalCompetency.value = sum;
+        competencyScore.value = sum;
       }
-      // end cal summary
-
-      hideLoader();
     });
 }