fix(leave):sort

src/modules/09_leave/views/02_WorkingMain.vue

@@ -1,66 +1,50 @@
 <script setup lang="ts">
-import { ref } from "vue";
+import { ref, toRefs } from "vue";
+
+import { useWorklistDataStore } from "@/modules/09_leave/stores/WorkStore";
 
 /** import Components */
 import Tab1 from "@/modules/09_leave/components/02_WorkList/Tab1.vue";
 import Tab2 from "@/modules/09_leave/components/02_WorkList/Tab2.vue";
-// import DialogReport from "@/modules/09_leave/components/02_WorkList/DialogReport.vue";
 
-const tab = ref("1");
+const stores = useWorklistDataStore();
 
-const modalReport = ref<boolean>(false);
-
-function onClickOpenDialog() {
-  modalReport.value = !modalReport.value;
-}
+const { tabs } = toRefs(stores);
 </script>
+
 <template>
   <div class="row">
     <span class="toptitle text-dark item-center">รายการลงเวลาปฏิบัติงาน</span>
-    <q-space />
-    <!-- <q-btn
+  </div>
+
+  <q-card bordered flat>
+    <q-tabs
+      v-model="tabs"
       dense
-      flat
-      class="text-blue"
-      label="รายงานสถิติการลงเวลา"
-      @click="onClickOpenDialog"
+      align="left"
+      inline-label
+      class="rounded-borders"
+      indicator-color="primary"
+      active-bg-color="teal-1"
+      active-class="text-primary"
     >
-      <q-tooltip>รายงานสถิติการลงเวลา</q-tooltip>
-    </q-btn> -->
-  </div>
+      <q-tab name="1" label="รายการลงเวลาที่ประมวลผลแล้ว" />
+      <q-tab name="2" label="รายการลงเวลา" />
+    </q-tabs>
 
-  <div>
-    <q-card bordered flat>
-      <q-tabs
-        v-model="tab"
-        dense
-        align="left"
-        inline-label
-        class="rounded-borders"
-        indicator-color="primary"
-        active-bg-color="teal-1"
-        active-class="text-primary"
-      >
-        <q-tab name="1" label="รายการลงเวลาที่ประมวลผลแล้ว" />
-        <q-tab name="2" label="รายการลงเวลา" />
-      </q-tabs>
+    <q-separator />
+    <div class="q-pa-sm">
+      <q-tab-panels v-model="tabs" animated>
+        <q-tab-panel name="1">
+          <Tab1 />
+        </q-tab-panel>
 
-      <q-separator />
-      <div class="q-pa-sm">
-        <q-tab-panels v-model="tab" animated>
-          <q-tab-panel name="1">
-            <Tab1 />
-          </q-tab-panel>
-
-          <q-tab-panel name="2">
-            <Tab2 />
-          </q-tab-panel>
-        </q-tab-panels>
-      </div>
-    </q-card>
-  </div>
-
-  <!-- <DialogReport :modal="modalReport" :close="onClickOpenDialog" /> -->
+        <q-tab-panel name="2">
+          <Tab2 />
+        </q-tab-panel>
+      </q-tab-panels>
+    </div>
+  </q-card>
 </template>
 
 <style scoped></style>