From 9d467c110aa4382610716e7b5b49ae0b34304d8e Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Thu, 23 Nov 2023 16:59:37 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=9C=E0=B8=B9=E0=B8=81=20API=20=E0=B8=A3?=
 =?UTF-8?q?=E0=B8=B2=E0=B8=A2=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B8=A5=E0=B8=87?=
 =?UTF-8?q?=E0=B9=80=E0=B8=A7=E0=B8=A5=E0=B8=B2=E0=B8=9B=E0=B8=8F=E0=B8=B4?=
 =?UTF-8?q?=E0=B8=9A=E0=B8=B1=E0=B8=95=E0=B8=B4=E0=B8=87=E0=B8=B2=E0=B8=99?=
 =?UTF-8?q?=E0=B8=97=E0=B8=B5=E0=B9=88=E0=B8=9B=E0=B8=A3=E0=B8=B0=E0=B8=A1?=
 =?UTF-8?q?=E0=B8=A7=E0=B8=A5=E0=B8=9C=E0=B8=A5=E0=B9=81=E0=B8=A5=E0=B9=89?=
 =?UTF-8?q?=E0=B8=A7=20(ADMIN)=20#15?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/09_leave/api.leave.ts                 |   1 +
 .../09_leave/components/1_Work/Tab1.vue       | 109 ++++++++----------
 .../09_leave/components/1_Work/ToolBar.vue    |   8 +-
 3 files changed, 51 insertions(+), 67 deletions(-)

diff --git a/src/api/09_leave/api.leave.ts b/src/api/09_leave/api.leave.ts
index daebda442..7276d605d 100644
--- a/src/api/09_leave/api.leave.ts
+++ b/src/api/09_leave/api.leave.ts
@@ -6,5 +6,6 @@ export default {
 
   /**รายการลงเวลาปฏิบัติงาน */
   logRecord: () => `${leave}/log-record`,
+  timeRecord: () => `${leave}/time-record`,
   timeRecordById: (id: string) => `${leave}/time-record/${id}`,
 };
diff --git a/src/modules/09_leave/components/1_Work/Tab1.vue b/src/modules/09_leave/components/1_Work/Tab1.vue
index ed16da718..bed1e3c3e 100644
--- a/src/modules/09_leave/components/1_Work/Tab1.vue
+++ b/src/modules/09_leave/components/1_Work/Tab1.vue
@@ -1,5 +1,8 @@
 <script setup lang="ts">
 import { ref, onMounted, onUnmounted } from "vue";
+import { useQuasar } from "quasar";
+import http from "@/plugins/http";
+import config from "@/app.config";
 
 /** importType*/
 import type { QTableProps } from "quasar";
@@ -19,13 +22,15 @@ import { useWorklistDataStore } from "@/modules/09_leave/stores/WorkStore";
 /** useStore */
 const mixin = useCounterMixin();
 const workStore = useWorklistDataStore();
-const { date2Thai, dateToISO, showLoader, hideLoader } = mixin;
+const { date2Thai, dateToISO, showLoader, hideLoader, messageError } = mixin;
+
+const $q = useQuasar(); //ใช้ noti quasar
 
 const keyword = ref<string>("");
 const page = ref<number>(1);
-const rowsPerPage = ref<number>(10);
+const rowsPerPage = ref<number>(3);
 const maxPage = ref<number>(1);
-const filetStatus = ref<string>("");
+const filetStatus = ref<string>("LATE");
 
 /** ข้อมูลหัวตาราง*/
 const columns = ref<QTableProps["columns"]>([
@@ -115,42 +120,6 @@ const visibleColumns = ref<string[]>([
 const rows = ref<TableRowsTime[]>([]);
 
 async function fetchListTimeRecord() {
-  showLoader();
-  const listData: DataResTime[] = [
-    {
-      id: "00000000-0000-0000-0000-000000000000",
-      fullName: "นางอมร ใจดี",
-      checkInDate: new Date(),
-      checkInTime: "08:30",
-      checkInLocation: "สำนักงงาน",
-      checkInLat: "18.7903",
-      checkInLon: "99.0029",
-      checkInStatus: "normal",
-      checkOutDate: new Date(),
-      checkOutLocation: "สำนักงงาน",
-      checkOutTime: "18:04",
-      checkOutLat: "18.7903",
-      checkOutLon: "99.0029",
-      checkOutStatus: "late",
-    },
-    {
-      id: "00000000-0000-0000-0000-000000000000",
-      fullName: "นางอมร ใจดี",
-      checkInDate: new Date(),
-      checkInTime: "08:30",
-      checkInLocation: "สำนักงงาน",
-      checkInLat: "18.7903",
-      checkInLon: "99.0029",
-      checkInStatus: "normal",
-      checkOutDate: new Date(),
-      checkOutLocation: "สำนักงงาน",
-      checkOutTime: "18:04",
-      checkOutLat: "18.7903",
-      checkOutLon: "99.0029",
-      checkOutStatus: "late",
-    },
-  ];
-
   const date = new Date(workStore.selectDate as string | Date);
   const querySting = {
     startDate: dateToISO(date), //*วันที่เริ่ม
@@ -160,29 +129,43 @@ async function fetchListTimeRecord() {
     pageSize: rowsPerPage.value, //*จำนวนแถวต่อหน้า
     keyword: keyword.value, //keyword ค้นหา
   };
-
-  console.log(querySting);
-
-  const datalist: TableRowsTime[] = listData.map((e: DataResTime) => ({
-    id: e.id,
-    fullName: e.fullName,
-    checkInDate: e.checkInDate && date2Thai(e.checkInDate),
-    checkInTime: e.checkInTime,
-    checkInLocation: e.checkInLocation,
-    checkInLat: e.checkInLat,
-    checkInLon: e.checkInLon,
-    checkInStatus: e.checkInStatus && workStore.convertSatatus(e.checkInStatus),
-    checkOutDate: e.checkOutDate && date2Thai(e.checkOutDate),
-    checkOutLocation: e.checkOutLocation,
-    checkOutTime: e.checkOutTime,
-    checkOutLat: e.checkOutLat,
-    checkOutLon: e.checkOutLon,
-    checkOutStatus:
-      e.checkOutStatus && workStore.convertSatatus(e.checkOutStatus),
-  }));
-  rows.value = datalist;
-  maxPage.value = Math.ceil(rows.value.length / rowsPerPage.value);
-  hideLoader();
+  showLoader();
+  await http
+    .get(
+      config.API.timeRecord() +
+        `?startDate=${querySting.startDate}&endDate=${querySting.startDate}
+        &status=${querySting.status}&page=${querySting.page}&pageSize=${querySting.pageSize}&keyword=${querySting.keyword}`
+    )
+    .then((res) => {
+      maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
+      const datalist: TableRowsTime[] = res.data.result.data.map(
+        (e: DataResTime) => ({
+          id: e.id,
+          fullName: e.fullName,
+          checkInDate: e.checkInDate && date2Thai(e.checkInDate),
+          checkInTime: e.checkInTime,
+          checkInLocation: e.checkInLocation,
+          checkInLat: e.checkInLat,
+          checkInLon: e.checkInLon,
+          checkInStatus:
+            e.checkInStatus && workStore.convertSatatus(e.checkInStatus),
+          checkOutDate: e.checkOutDate && date2Thai(e.checkOutDate),
+          checkOutLocation: e.checkOutLocation,
+          checkOutTime: e.checkOutTime,
+          checkOutLat: e.checkOutLat,
+          checkOutLon: e.checkOutLon,
+          checkOutStatus:
+            e.checkOutStatus && workStore.convertSatatus(e.checkOutStatus),
+        })
+      );
+      rows.value = datalist;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
 }
 
 async function updatePaging(
@@ -194,7 +177,7 @@ async function updatePaging(
   page.value = currentPage;
   rowsPerPage.value = params.rowsPerPage ?? rowsPerPage.value;
   keyword.value = key ?? keyword.value;
-  filetStatus.value = status;
+  filetStatus.value = status ?? filetStatus.value;
   await fetchListTimeRecord();
 }
 
diff --git a/src/modules/09_leave/components/1_Work/ToolBar.vue b/src/modules/09_leave/components/1_Work/ToolBar.vue
index 55a305e1f..db6f7853d 100644
--- a/src/modules/09_leave/components/1_Work/ToolBar.vue
+++ b/src/modules/09_leave/components/1_Work/ToolBar.vue
@@ -16,10 +16,10 @@ const updateProp = (newPagination: any, keyword: string, status: string) => {
 };
 
 const option = ref<any[]>([
-  { id: "", name: "ทั้งหมด" },
-  { id: "normal", name: "ปกติ" },
-  { id: "late", name: "สาย" },
-  { id: "absent", name: "ขาดราชการ" },
+  { id: "ALL", name: "ทั้งหมด" },
+  { id: "NORMAL", name: "ปกติ" },
+  { id: "LATE", name: "สาย" },
+  { id: "ABSENT", name: "ขาดราชการ" },
 ]);
 const filetStatus = ref<string>("");
 const keyword = ref<string>("");