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

src/views/HistoryView.vue

@@ -1,17 +1,25 @@
 <script setup lang="ts">
-import { ref, onMounted, computed, watch } from 'vue'
+import { ref, onMounted, watch } from 'vue'
 import { useQuasar } from 'quasar'
 import { useRouter } from 'vue-router'
+import http from '@/plugins/http'
+import config from '@/app.config'
 
+/**
+ * import Components
+ */
 import TableHistory from '@/components/TableHistory.vue'
 import ToolBar from '@/components/ToolBar.vue'
 
-import http from '@/plugins/http'
-import config from '@/app.config'
-import { useCounterMixin } from '@/stores/mixin'
-// importStores
+/**
+ * importStores
+ */
 import { useChekIn } from '@/stores/chekin'
+import { useCounterMixin } from '@/stores/mixin'
 
+/**
+ * use
+ */
 const mixin = useCounterMixin()
 const router = useRouter()
 const stores = useChekIn()
@@ -19,8 +27,6 @@ const { showLoader, hideLoader, messageError } = mixin
 const { fetchHistoryList } = stores
 const $q = useQuasar() //ใช้ noti quasar
 
-const tab = ref<string>('history')
-
 // paging
 const page = ref<number>(1)
 const year = ref<number>(new Date().getFullYear())
@@ -130,73 +136,73 @@ watch(
         <div
           class="bg-secondary text-white col-12 row items-center q-px-md q-py-sm"
         >
-            <q-btn
-              icon="arrow_back"
-              round
-              dense
-              flat
-              color="white"
-              @click="router.go(-1)"
-            />
+          <q-btn
+            icon="arrow_back"
+            round
+            dense
+            flat
+            color="white"
+            @click="router.go(-1)"
+          />
           <span class="text-body1 text-weight-bold q-pl-md"
             >ประวัติการลงเวลา
           </span>
         </div>
         <div class="col-12 text-grey-9">
-            <q-tabs
-              v-model="stores.tab"
-              dense
-              align="left"
-              inline-label
-              class="rounded-borders"
-              indicator-color="primary"
-              active-bg-color="teal-1"
-              active-class="text-primary"
-            >
-              <q-tab name="history" label="ประวัติการลงเวลา" />
-              <q-tab name="time" label="รายการลงเวลากรณีพิเศษ" />
-            </q-tabs>
+          <q-tabs
+            v-model="stores.tab"
+            dense
+            align="left"
+            inline-label
+            class="rounded-borders"
+            indicator-color="primary"
+            active-bg-color="teal-1"
+            active-class="text-primary"
+          >
+            <q-tab name="history" label="ประวัติการลงเวลา" />
+            <q-tab name="time" label="รายการลงเวลากรณีพิเศษ" />
+          </q-tabs>
 
-            <q-separator />
+          <q-separator />
 
-            <q-tab-panels v-model="stores.tab" animated>
-              <q-tab-panel name="history">
-                <ToolBar
-                  :fetchData="functionFetch"
-                  @update:year="updateYear"
-                  :tab="stores.tab"
-                />
-                <TableHistory
-                  :fetchData="functionFetch"
-                  :page-size="pageSize"
-                  :total="total"
-                  :page="page"
-                  :paging="true"
-                  @update:change-page="changePage"
-                  :max-page="maxPage"
-                  :tab="stores.tab"
-                />
-              </q-tab-panel>
+          <q-tab-panels v-model="stores.tab" animated>
+            <q-tab-panel name="history">
+              <ToolBar
+                :fetchData="functionFetch"
+                @update:year="updateYear"
+                :tab="stores.tab"
+              />
+              <TableHistory
+                :fetchData="functionFetch"
+                :page-size="pageSize"
+                :total="total"
+                :page="page"
+                :paging="true"
+                @update:change-page="changePage"
+                :max-page="maxPage"
+                :tab="stores.tab"
+              />
+            </q-tab-panel>
 
-              <q-tab-panel name="time">
-                <ToolBar
-                  :fetchData="functionFetch"
-                  @update:year="updateYear"
-                  :tab="stores.tab"
-                />
-                <TableHistory
-                  :fetchData="functionFetch"
-                  :page-size="pageSize"
-                  :total="total"
-                  :page="page"
-                  :paging="true"
-                  @update:change-page="changePage"
-                  :max-page="maxPage"
-                  :tab="stores.tab"
-                />
-              </q-tab-panel>
-            </q-tab-panels>
-            <!-- </q-card> -->
+            <q-tab-panel name="time">
+              <ToolBar
+                :fetchData="functionFetch"
+                @update:year="updateYear"
+                :tab="stores.tab"
+              />
+              <TableHistory
+                :fetchData="functionFetch"
+                :page-size="pageSize"
+                :total="total"
+                :page="page"
+                :paging="true"
+                @update:change-page="changePage"
+                :max-page="maxPage"
+                :tab="stores.tab"
+              />
+            </q-tab-panel>
+          </q-tab-panels>
+          <!-- </q-card> -->
           <!-- <Table
             :fetchData="fetchlistHistory"
             :page-size="pageSize"
@@ -210,4 +216,4 @@ watch(
       </q-card>
     </div>
   </div>
-</template>
+</template>