ต่อ api history

src/components/TableHistory.vue

@@ -136,34 +136,34 @@ const columns = ref<QTableProps['columns']>([
     headerStyle: 'font-size: 14px',
     style: 'font-size: 14px; width:15%;',
   },
-  // {
+  {
-  //   name: "loIn",
+    name: 'loIn',
-  //   align: "left",
+    align: 'left',
-  //   label: "พิกัด",
+    label: 'พิกัด',
-  //   sortable: true,
+    sortable: true,
-  //   field: "loIn",
+    field: 'loIn',
-  //   headerStyle: "font-size: 14px",
+    headerStyle: 'font-size: 14px',
-  //   style: "font-size: 14px",
+    style: 'font-size: 14px',
-  // },
+  },
 
-  // {
+  {
-  //   name: "loOut",
+    name: 'loOut',
-  //   align: "left",
+    align: 'left',
-  //   label: "พิกัด",
+    label: 'พิกัด',
-  //   sortable: true,
+    sortable: true,
-  //   field: "loOut",
+    field: 'loOut',
-  //   headerStyle: "font-size: 14px",
+    headerStyle: 'font-size: 14px',
-  //   style: "font-size: 14px",
+    style: 'font-size: 14px',
-  // },
+  },
-  // {
+  {
-  //   name: "status",
+    name: 'status',
-  //   align: "left",
+    align: 'left',
-  //   label: "สถานะ",
+    label: 'สถานะ',
-  //   sortable: true,
+    sortable: true,
-  //   field: "status",
+    field: 'status',
-  //   headerStyle: "font-size: 14px",
+    headerStyle: 'font-size: 14px',
-  //   style: "font-size: 14px; width:10%;",
+    style: 'font-size: 14px; width:10%;',
-  // },
+  },
 ])
 // popup
 const modalPopup = ref<boolean>(false)

src/stores/chekin.ts

@@ -3,6 +3,12 @@ import { ref } from 'vue'
 import http from '@/plugins/http'
 import config from '@/app.config'
 
+// importStores
+import { useCounterMixin } from '@/stores/mixin'
+
+const mixin = useCounterMixin()
+const { date2Thai } = mixin
+
 export const useChekIn = defineStore('checkin', () => {
   const rows = ref<any>()
 
@@ -10,35 +16,34 @@ export const useChekIn = defineStore('checkin', () => {
     // console.log(data)
     rows.value = []
     const datalist = await data.map((e: any) => ({
-      id: e.id,
+      id: e.checkInId,
-      date: e.date,
+      date: date2Thai(e.checkInDate),
-      // no: e.no,
+      no: e.no,
-      // in: e.in,
+      in: e.checkInTime,
-      // loIn: e.loIn,
+      out: e.checkOutTime,
-      // out: e.out,
+      Morningstatus: convertStatus(e.checkInStatus),
-      // loOut: e.loOut,
+      AfternoonStatus: convertStatus(e.checkOutStatus),
-      // status: e.status,
+      loIn: e.checkInLocation,
-      // Morningstatus: convertStatus(e.Morningstatus),
+      loOut: e.checkOutLocation,
-      // AfternoonStatus: convertStatus(e.AfternoonStatus),
+      status: e.statusEdit,
-      // statusEdit: e.statusEdit,
       // statusEditName: convertStatusEdit(e.statusEdit),
-      checkInTime: e.checkInTime,
+      // checkInTime: e.checkInTime,
-      checkInLocation: e.checkInLocation,
+      // checkInLocation: e.checkInLocation,
-      checkOutTime: e.checkOutTime,
+      // checkOutTime: e.checkOutTime,
-      checkOutLocation: e.checkOutLocation,
+      // checkOutLocation: e.checkOutLocation,
-      checkInStatus: convertStatus(e.checkInStatus),
+      // checkInStatus: convertStatus(e.checkInStatus),
-      checkOutStatus: convertStatus(e.checkOutStatus),
+      // checkOutStatus: convertStatus(e.checkOutStatus),
     }))
     rows.value = datalist
   }
 
   function convertStatus(status: string) {
     switch (status) {
-      case '1':
+      case '':
         return 'ขาดราชการ'
-      case '2':
+      case 'NORMAL':
         return 'ปกติ'
-      case '3':
+      case 'LATE':
         return 'สาย'
       default:
         return ''

src/views/HistoryView.vue

@@ -27,7 +27,7 @@ onMounted(() => {
 const fetchlistHistory = async () => {
   showLoader()
   await http
-    .get(config.API.history())
+    .get(config.API.history() + '?year=2023&page=1&pageSize=5&keyword=')
     .then((res) => {
       const data = res.data.result
       fetchHistoryList(data)