ลงเวลาพิเศษแค่ช่วงบ่ายวันที่ไม่แสดง

src/components/TableHistory.vue

@@ -1,10 +1,14 @@
 <script setup lang="ts">
-import type { QTableProps } from 'quasar'
 import { ref, watch } from 'vue'
+import type { QTableProps } from 'quasar'
+import { useCounterMixin } from '@/stores/mixin'
 
 import { useChekIn } from '@/stores/chekin'
 import Popup from '@/components/PopUp.vue' // dialog เพิ่ม/ขอแก้ไขลงเวลากรณีพิเศษ
 
+const mixin = useCounterMixin()
+const { date2Thai } = mixin
+
 const stores = useChekIn()
 const selected = ref<string[]>([])
 
@@ -50,43 +54,6 @@ const tab = ref<string>(props.tab?.toString())
 
 const emit = defineEmits(['update:change-page'])
 
-// Pagination - initial pagination
-const initialPagination = ref<any>({
-  sortBy: null,
-  descending: false,
-  page: 1,
-  rowsPerPage: props.pageSize, // set ตาม page หลักส่งมา
-})
-
-// Pagination - page & change page & get new data
-const currentPage = ref<number>(1)
-watch(
-  [() => currentPage.value, () => initialPagination.value.rowsPerPage],
-  () => {
-    emit(
-      'update:change-page',
-      currentPage.value,
-      initialPagination.value.rowsPerPage,
-      keyword.value
-    )
-  }
-)
-
-// Pagination - update rowsPerPage
-async function updatePagination(newPagination: any) {
-  initialPagination.value = newPagination
-  currentPage.value = 1 // set current page เป็น 1 เสมอเมื่อเปลี่ยน per row
-}
-
-async function filterFn() {
-  emit(
-    'update:change-page',
-    1,
-    initialPagination.value.rowsPerPage,
-    keyword.value
-  )
-}
-
 /** column history table */
 const columns = ref<QTableProps['columns']>(
   props.tab == 'history'
@@ -157,11 +124,11 @@ const columns = ref<QTableProps['columns']>(
       ]
     : [
         {
-          name: 'checkInDate',
+          name: 'checkInDateTime',
           align: 'left',
           label: 'วัน/เดือน/ปี',
           sortable: true,
-          field: 'checkInDate',
+          field: (v) => date2Thai(v.checkInDateTime),
           headerStyle: 'font-size: 14px',
           style: 'font-size: 14px; width:15%;',
         },
@@ -204,6 +171,7 @@ const columns = ref<QTableProps['columns']>(
       ]
 )
 const visibleColumns = ref<string[]>([
+  'checkInDateTime',
   'checkInDate',
   'checkInTime',
   'checkInLocation',
@@ -212,11 +180,51 @@ const visibleColumns = ref<string[]>([
   'checkOutLocation',
   'checkOutStatus',
 ])
+
+// Pagination - initial pagination
+const initialPagination = ref({
+  sortBy: null,
+  descending: false,
+  page: 1,
+  rowsPerPage: props.pageSize, // set ตาม page หลักส่งมา
+})
+
+// Pagination - page & change page & get new data
+const currentPage = ref<number>(1)
+watch(
+  [() => currentPage.value, () => initialPagination.value.rowsPerPage],
+  () => {
+    emit(
+      'update:change-page',
+      currentPage.value,
+      initialPagination.value.rowsPerPage,
+      keyword.value
+    )
+  }
+)
+
+// Pagination - update rowsPerPage
+async function updatePagination(newPagination: any) {
+  initialPagination.value = newPagination
+  currentPage.value = 1 // set current page เป็น 1 เสมอเมื่อเปลี่ยน per row
+}
+
+async function filterFn() {
+  emit(
+    'update:change-page',
+    1,
+    initialPagination.value.rowsPerPage,
+    keyword.value
+  )
+}
+
 // popup
 const modalPopup = ref<boolean>(false)
 const titlePopup = ref<string>('')
 const dataRow = ref<any>()
 function openPopup(data: any) {
+  console.log(data)
+
   const title = 'แก้ไขลงเวลา'
   modalPopup.value = true
   titlePopup.value = title
@@ -327,7 +335,7 @@ function onClickOpenPopupRejrct(data: any) {
             {{ props.row.checkOutStatus }}
           </div>
           <div v-else>
-            {{ col.value }}
+            {{ col.value ?? '-' }}
           </div>
         </q-td>
         <q-td v-if="tab === 'history'">