<script setup lang="ts">
import { ref, reactive, onMounted } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";

/**importType*/
import type {
  QuerySting,
  DateFilter,
} from "@/modules/09_leave/interface/request/leave";

import TableList from "@/modules/09_leave/components/2_Leave/TableList.vue";
import ToolBar from "@/modules/09_leave/components/2_Leave/ToolBarLeave.vue";

/**importStroe*/
import { useCounterMixin } from "@/stores/mixin";
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
import { useLeavelistDataStoreTest } from "@/modules/09_leave/stores/ListLeave";

const mixin = useCounterMixin();
const leaveStore = useLeavelistDataStore();
const APIDATA = useLeavelistDataStoreTest();
const { date2Thai, dateToISO, showLoader, hideLoader, messageError } = mixin;
const { fetchListLeaveReject } = leaveStore;

const $q = useQuasar(); //ใช้ noti quasar

const querySting = reactive<QuerySting>({
  year: leaveStore.filter.year, //*ปีในการยื่นขอใบลา(ใช้เป็น คศ.)
  type: leaveStore.filter.type, //*Id ประเภทการลา
  status: leaveStore.filter.status, //*สถานะการของลา
  page: 1, //*หน้า
  pageSize: 10, //*จำนวนแถวต่อหน้า
  keyword: leaveStore.filter.keyword, //keyword ค้นหา
});
const maxPage = ref<number>(1);

//** เรียกข้อมูลจาก API*/
async function fecthLeaveList() {
  querySting.status = await (querySting.status == null
    ? "ALL"
    : querySting.status);
  querySting.type = await (querySting.type == null
    ? "00000000-0000-0000-0000-000000000000"
    : querySting.type);

  if (querySting.status != null && querySting.type != null) {
    showLoader();
    await http
      .post(config.API.leaveListDelete(), querySting)
      .then((res) => {
        const data = res.data.result;
        console.log(data);

        maxPage.value = Math.ceil(data.total / querySting.pageSize);
        console.log(maxPage.value);
        fetchListLeaveReject(data.data); /** ส่งข้อมูลไป stores*/
      })
      .catch((err) => {
        messageError($q, err);
      })
      .finally(() => {
        hideLoader();
      });
  }
  // const data = APIDATA.data;
}

/**
 *
 * @param newPage หน้า
 * @param pageSize จำนวนต่อแถว
 * @param dateFilter ข้อมูลค้นหา
 */
async function updatePaging(
  newPage: number,
  pageSize: number,
  dateFilter: DateFilter
) {
  querySting.year = dateFilter ? dateFilter.year : querySting.year;
  querySting.type = dateFilter ? dateFilter.type : querySting.type;
  querySting.status = dateFilter ? dateFilter.status : querySting.status;
  querySting.page = newPage;
  querySting.pageSize = pageSize ? pageSize : querySting.pageSize;
  querySting.keyword = dateFilter ? dateFilter.keyword : querySting.keyword;

  console.log(querySting);
  await fecthLeaveList();
}

onMounted(async () => {
  await fecthLeaveList();
});
</script>
<template>
  <ToolBar
    :rowsPerPage="querySting.pageSize"
    @update:querySting="updatePaging"
  />
  <TableList
    :page="querySting.page"
    :rowsPerPage="querySting.pageSize"
    :maxPage="maxPage"
    @update:querySting="updatePaging"
  />
</template>

<style scoped></style>
