no message

src/modules/06_retirement/router.ts

@@ -32,7 +32,7 @@ export default [
     },
   },
   {
-    path: "/retirement/list/:id",
+    path: "/retirement/list/:id/:year",
     name: "retirement/list/id",
     component: Listretirement,
     meta: {

src/modules/06_retirement/views/Main.vue

@@ -13,8 +13,12 @@
         indicator-color="primary"
         align="left"
       >
-        <q-tab name="samun" label="ขรก.กทม.สามัญ" @click="getYear('officer')"/>
-        <q-tab name="employee" label="ลูกจ้างประจำ" @click="getYear('employee')"/>
+        <q-tab name="officer" label="ขรก.กทม.สามัญ" @click="type = 'officer'" />
+        <q-tab
+          name="employee"
+          label="ลูกจ้างประจำ"
+          @click="type = 'employee'"
+        />
       </q-tabs>
     </div>
     <q-separator />
@@ -37,7 +41,6 @@
             :outlined="true"
             :hide-dropdown-icon="false"
             style="min-width: 150px"
-
           />
           <div>
             <q-btn
@@ -175,7 +178,7 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref, useAttrs ,reactive} from "vue";
+import { onMounted, ref, useAttrs, reactive,watch } from "vue";
 import type { QTableProps } from "quasar";
 import type {
   FormMainProbation,
@@ -185,12 +188,12 @@ import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
-import { useCounterMixin } from "@/stores/mixin"
-import type { resMain } from '@/modules/06_retirement/interface/response/Main'
+import { useCounterMixin } from "@/stores/mixin";
+import type { resMain } from "@/modules/06_retirement/interface/response/Main";
 const yearOptions = reactive<any[]>([]);
 
-const mixin = useCounterMixin()
-const { messageError ,date2Thai,showLoader,hideLoader} = mixin
+const mixin = useCounterMixin();
+const { messageError, date2Thai, showLoader, hideLoader } = mixin;
 const router = useRouter();
 const $q = useQuasar(); //ใช้ noti quasar
 const modal = ref<boolean>(false);
@@ -201,7 +204,7 @@ const pagination = ref({
   rowsPerPage: 10,
 });
 
-const type = ref<string>('employee')
+const type = ref<string>("officer");
 const visibleColumns = ref<string[]>(["no", "Date", "retireNumber"]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
 
 // หัวตาราง
@@ -236,55 +239,42 @@ const columns = ref<QTableProps["columns"]>([
 ]);
 
 // ข้อมูลตาราง (จำลอง)
-
-
+const currentYear = new Date().getFullYear();
 const rows = ref<resMain[]>([]);
-const tab = ref<any>("samun");
+const tab = ref<any>("officer");
 const visibleColumns2 = ref<string[]>(["no", "name", "retireNumber"]);
-const getYear = async(type:string) =>{
-  
-  await http
-  .get(config.API.yearOptions())
-  .then((res)=>{
-    yearOptions.length = 0;
-    const response = res.data.result;
-      yearOptions.push(...response);
-
-    console.log(yearOptions)
-    const maxNumber = yearOptions.reduce((max: any, e: any) => {
-        return e.id > max ? e.id : max;
-      }, "");
-      console.log(maxNumber)
-       get(type,maxNumber)
-  })
-}
-const get = async(type:string,year:number) =>{
+  const getYear = () => {
+  yearOptions.length = 0;
+  yearOptions.push(currentYear+543);
+  console.log(yearOptions);
+  get(type.value, currentYear);
+  fiscalyear.value = currentYear+543;
 
+};
+const get = async (type: string, year: number) => {
   await http
-  .get(config.API.retirement(type,year))
-  .then((res)=>{
-    rows.value =[]
-    let data = res.data.result
-     rows.value = data.map((items:resMain) =>({
-      id:items.id,
-      Date:date2Thai(items.createdAt),
-      year:items.year,
-      retireNumber:items.round,
-      total:items.total
-    }))
-    
-  }).catch((e) => {
-      messageError($q, e);
+    .get(config.API.retirement(type, year))
+    .then((res) => {
+      rows.value = [];
+      let data = res.data.result;
+      rows.value = data.map((items: resMain) => ({
+        id: items.id,
+        Date: date2Thai(items.createdAt),
+        year: items.year,
+        retireNumber: items.round,
+        total: items.total,
+      }));
+    })
+    .catch((e) => {
+
     })
     .finally(() => {
-      hideLoader()
+      hideLoader();
     });
-
-}
-onMounted(()=>{
-  // get
-  getYear()
-})
+};
+onMounted(() => {
+  getYear();
+});
 // หัวตาราง2
 const columns2 = ref<QTableProps["columns"]>([
   {
@@ -377,12 +367,13 @@ const clickAdd = () => {
 const clickClose = async () => {
   modal.value = false;
 };
-const fiscalyear = ref(["2566"]);
+const fiscalyear = ref<number>();
 const fiscalyearOP = ref<any>([
   { id: 1, name: "ทั้งหมด" },
   { id: 2, name: "2565" },
   { id: 3, name: "2565" },
 ]);
+
 // ค้นหาในตาราง
 const filterKeyword = ref<string>("");
 const filterRef = ref<any>(null);
@@ -405,9 +396,16 @@ const paginationLabel = (start: string, end: string, total: string) => {
   if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
   else return start + "-" + end + " ใน " + total;
 };
-const nextPage = (val: any) => {
-  router.push(`/retirement/list/${val.no}`);
+const nextPage = () => {
+  router.push(`/retirement/list/${type.value}/${currentYear}`);
 };
+
+watch(type,()=>{
+  console.log(type.value)
+  get(type.value,currentYear)
+  console.log("🚀 ~ file: Main.vue:417 ~ watch ~ fiscalyear:",typeof fiscalyear.value)
+  
+})
 </script>
 
 <style lang="scss" scope>