API ประเมินบุคคล

src/modules/06_evaluate/views/EvaluateMain.vue

@@ -36,12 +36,19 @@ function onclickAddEvaluate(data: ListMenu) {
   modal.value = !modal.value;
   menu.value = data;
 }
+const page = ref<number>(1);
+const pageSize = ref<number>(25);
+const maxPage = ref<number>(10);
 
 async function fetchEvaluteList() {
   showLoader();
   await http
-    .get(config.API.evaluationList())
+    .get(
+      config.API.evaluationList() +
+        `?page=${page.value}&pageSize=${pageSize.value}`
+    )
     .then((res) => {
+      maxPage.value = Math.ceil(res.data.result.total / pageSize.value);
       store.fetchEvaluateList(res.data.result.data);
     })
     .catch((err) => {
@@ -52,6 +59,13 @@ async function fetchEvaluteList() {
     });
 }
 
+async function updatePaging(newPagination: any, currentPage: number) {
+  page.value = currentPage;
+  pageSize.value = newPagination.rowsPerPage;
+
+  await fetchEvaluteList();
+}
+
 onMounted(() => {
   fetchEvaluteList();
 });
@@ -128,7 +142,12 @@ onMounted(() => {
             </div>
           </div>
           <div class="col-12">
-            <TableListEvaluate />
+            <TableListEvaluate
+              :page="page"
+              :pageSize="pageSize"
+              :maxPage="maxPage"
+              @update:pagination="updatePaging"
+            />
           </div>
         </q-card>
       </div>