เงืนเดือนค่าจ้่าง => แสเดงรายการทั้งหมด

src/modules/13_salary/views/salaryRate.vue

@@ -33,7 +33,7 @@ const {
   hideLoader,
 } = useCounterMixin();
 
-const isActive = ref<boolean>(false)
+const isActive = ref<boolean>(false);
 const salaryId = ref<string>(route.params.id.toString());
 
 /** modalDialog*/
@@ -121,7 +121,8 @@ const formQuery = reactive<FormQuerySalary>({
   pageSize: 100, //*จำนวนแถวต่อหน้า
   keyword: "", //keyword ค้นหา
 });
-const totalRow = ref<number>(1);
+const maxPage = ref<number>(1);
+const totalRow = ref<number>(0);
 
 async function fetchListSalalyRate() {
   showLoader();
@@ -134,7 +135,8 @@ async function fetchListSalalyRate() {
         `?page=${page}&pageSize=${pageSize}&keyword=${keyword}`
     )
     .then((res) => {
-      totalRow.value = Math.ceil(res.data.result.total / formQuery.pageSize);
+      maxPage.value = Math.ceil(res.data.result.total / formQuery.pageSize);
+      totalRow.value = res.data.result.total;
 
       rows.value = res.data.result.data;
     })
@@ -202,14 +204,14 @@ function clickDownload() {
       hideLoader();
     });
 }
-function fetchList(){
+function fetchList() {
   http
-  .get(config.API.salaryChartByid(salaryId.value))
-  .then((res)=>{
-    isActive.value = res.data.result.isActive
-  })
-  .catch((e)=>{})
-  .finally(()=>{})
+    .get(config.API.salaryChartByid(salaryId.value))
+    .then((res) => {
+      isActive.value = res.data.result.isActive;
+    })
+    .catch((e) => {})
+    .finally(() => {});
 }
 onMounted(async () => {
   await fetchList();
@@ -240,7 +242,7 @@ watch([() => formQuery.page, () => formQuery.pageSize], async () => {
   <q-card flat bordered class="q-pa-md">
     <div class="col-12 row">
       <q-btn
-      v-if="!isActive"
+        v-if="!isActive"
         flat
         round
         dense
@@ -285,7 +287,12 @@ watch([() => formQuery.page, () => formQuery.pageSize], async () => {
         </template>
         <template v-slot:body="props">
           <q-tr :props="props" class="cursor-pointer">
-            <q-td v-for="col in props.cols" :key="col.name" :props="props" :class="props.row.isNext === true ? 'text-edit text-bold':''">
+            <q-td
+              v-for="col in props.cols"
+              :key="col.name"
+              :props="props"
+              :class="props.row.isNext === true ? 'text-edit text-bold' : ''"
+            >
               <div v-if="col.name == 'no'">
                 {{
                   (formQuery.page - 1) * formQuery.pageSize + props.rowIndex + 1
@@ -335,7 +342,7 @@ watch([() => formQuery.page, () => formQuery.pageSize], async () => {
             </q-td>
             <q-td>
               <q-btn
-              v-if="!isActive"
+                v-if="!isActive"
                 flat
                 dense
                 icon="mdi-dots-vertical"
@@ -376,11 +383,12 @@ watch([() => formQuery.page, () => formQuery.pageSize], async () => {
           </q-tr>
         </template>
         <template v-slot:pagination="scope">
+          ทั้งหมด {{ totalRow }} รายการ
           <q-pagination
             v-model="formQuery.page"
             active-color="primary"
             color="dark"
-            :max="totalRow"
+            :max="maxPage"
             size="sm"
             boundary-links
             direction-links