hrms-mgt/src/modules/09_leave/views/LeaveListMain.vue

<script setup lang="ts">
/**importStroe*/
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";

/**importComponets*/
import Tab1 from "@/modules/09_leave/components/2_Leave/Tab1.vue";
import Tab2 from "@/modules/09_leave/components/2_Leave/Tab2.vue";

const leaveStore = useLeavelistDataStore();
</script>
<template>
  <div class="toptitle text-dark col-12 row items-center">รายการลา</div>
  <div>
    <q-card flat bordered class="col-12 q-mt-sm q-pt-sm q-pa-md">
      <q-tabs
        v-model="leaveStore.tabMenu"
        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 />
      <q-tab-panels v-model="leaveStore.tabMenu" animated>
        <q-tab-panel name="1"> <Tab1 /> </q-tab-panel>

        <q-tab-panel name="2"> <Tab2 /> </q-tab-panel>
      </q-tab-panels>
      <!-- <ToolBar @update:querySting="updatePaging" />
      <TableList
        :page="querySting.page"
        :rowsPerPage="querySting.pageSize"
        :maxPage="maxPage"
        @update:querySting="updatePaging"
      /> -->
    </q-card>
  </div>
</template>