แก้ paging วินัย

src/modules/11_discipline/components/2_InvestigateFacts/Form.vue

@@ -61,13 +61,19 @@ const editDirectorId = ref<string>();
 const dutyVal = ref<string>();
 const commandNoVal = ref<string>();
 
+const total = ref<number>(0);
+const totalList = ref<number>(1);
+const pagination = ref({
+  sortBy: "createdAt",
+  descending: true,
+  page: 1,
+  rowsPerPage: 10,
+});
+
 const filter = ref<string>("");
 const isUpdate = ref<boolean>(false);
 const filterTable = ref<string>("");
 const filterKeyword = ref<string>("");
-const maxPage = ref<number>(1);
-const page = ref<number>(1);
-const rowsPerPage = ref<number>(10);
 
 const investigationExtendStatus = ref<boolean>(false);
 
@@ -359,28 +365,25 @@ async function getOc(activeId: string) {
     });
 }
 
-async function updatePagingProp(rowPerpage: number, pageCurrent: number) {
-  rowsPerPage.value = rowPerpage;
-  page.value = pageCurrent;
-  await getList();
-}
-
 /** ดึงข้อมูลรายละเอียดสืบสวน */
 async function getList() {
   showLoader();
   await http
     .get(
       config.API.directorList(
-        page.value,
-        rowsPerPage.value,
-        filterKeyword.value,
+        pagination.value.page,
+        pagination.value.rowsPerPage,
+        filterKeyword2.value,
         mainStore.pathDirector(route.name as string)
       )
     )
     //
     .then((res) => {
-      maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
       const data = res.data.result.data;
+      totalList.value = Math.ceil(
+        res.data.result.total / pagination.value.rowsPerPage
+      );
+      total.value = res.data.result.total;
       investigateDis.fecthDirector(data);
     })
     .catch((e) => {
@@ -600,6 +603,18 @@ function filterOptionFnCauseText(val: string, update: Function) {
   });
 }
 
+function getSearch() {
+  pagination.value.page = 1;
+  getList();
+}
+
+watch(
+  () => pagination.value.rowsPerPage,
+  async () => {
+    getSearch();
+  }
+);
+
 /**
  * เช็คข้อมูลจาก props
  * เมื่อมีข้อมูล
@@ -1744,17 +1759,17 @@ onMounted(async () => {
 
   <DialogDirector
     :get-list="getList"
+    :get-search="getSearch"
     v-model:Modal="modal"
     :click-close="clickClose"
     :rows2="investigateDis.rows2"
     v-model:filterKeyword2="filterKeyword2"
     v-model:type="type"
     :filter-table="filterTable"
-    :rows-per-page="rowsPerPage"
-    :page="page"
-    :max-page="maxPage"
+    v-model:pagination="pagination"
+    v-model:total="total"
+    v-model:total-list="totalList"
     :selected-row="rows"
-    @update:pagination="updatePagingProp"
     @returnDirector="returnDirector"
   />