รายละเอียดการประเมินผลการปฏิบัติราชการระดับบุคคล

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

@@ -21,7 +21,7 @@ const dataListCriteria = ref<ListCriteria[]>([]);
 const modalCriteria = ref<boolean>(false);
 const $q = useQuasar();
 const route = useRoute();
-const { messageError } = useCounterMixin();
+const { messageError, showLoader, hideLoader } = useCounterMixin();
 const store = useKpiDataStore();
 
 const evaluationId = ref<string>(route.params.id.toString());
@@ -42,11 +42,11 @@ const resultPlanned = ref<number>(0);
 const resultRole = ref<number>(0);
 const resultAssigned = ref<number>(0);
 
-function fetchListPlanned() {
-  http
+async function fetchListPlanned() {
+  await http
     .get(config.API.kpiAchievement("planned") + `?id=${evaluationId.value}`)
-    .then((res) => {
-      const data = res.data.result;
+    .then(async (res) => {
+      const data = await res.data.result;
       const newRow = data.map((e: any) => ({
         ...e,
         evaluationResults: (e.point / 5) * e.weight,
@@ -78,11 +78,11 @@ function fetchListPlanned() {
     });
 }
 
-function fetchListRole() {
-  http
+async function fetchListRole() {
+  await http
     .get(config.API.kpiAchievement("role") + `?id=${evaluationId.value}`)
-    .then((res) => {
-      const data = res.data.result;
+    .then(async (res) => {
+      const data = await res.data.result;
       const newRow = data.map((e: any) => ({
         ...e,
         evaluationResults: (e.point / 5) * e.weight,
@@ -108,11 +108,11 @@ function fetchListRole() {
     });
 }
 
-function fetchAssigned() {
-  http
+async function fetchAssigned() {
+  await http
     .get(config.API.kpiAchievement("special") + `?id=${evaluationId.value}`)
-    .then((res) => {
-      const data = res.data.result;
+    .then(async (res) => {
+      const data = await res.data.result;
       const newRow = data.map((e: any) => ({
         ...e,
         evaluationResults: (e.point / 5) * e.weight,
@@ -146,11 +146,11 @@ function fetchAssigned() {
     });
 }
 
-function getCriteria() {
-  http
+async function getCriteria() {
+  await http
     .get(config.API.KpiEvaluationInfo)
-    .then((res) => {
-      const data = res.data.result.data;
+    .then(async (res) => {
+      const data = await res.data.result.data;
       dataListCriteria.value = data;
     })
     .catch((e) => {
@@ -206,12 +206,17 @@ watch(
 );
 
 onMounted(async () => {
+  showLoader();
   await Promise.all([
     getCriteria(),
     fetchListPlanned(),
     fetchListRole(),
     fetchAssigned(),
-  ]);
+  ]).finally(() => {
+    setTimeout(() => {
+      hideLoader();
+    }, 1000);
+  });
 });
 </script>