diff --git a/src/modules/13_salary/components/02_salaryEmployee/TabCriteria.vue b/src/modules/13_salary/components/02_salaryEmployee/TabCriteria.vue
index a611f252a..5176dcf92 100644
--- a/src/modules/13_salary/components/02_salaryEmployee/TabCriteria.vue
+++ b/src/modules/13_salary/components/02_salaryEmployee/TabCriteria.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { ref, reactive, onMounted, watch } from "vue";
 import { checkPermission } from "@/utils/permissions";
+import { updateCurrentPage } from "@/utils/function";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useQuasar } from "quasar";
@@ -150,11 +151,14 @@ const posTypeOpMain = ref<DataOption[]>([]); //ข้อมูลกลุ่ม
 const posTypeOp = ref<DataOption[]>([]); //ตัวเลือกข้อมูลรายการกลุ่มงาน
 const posType = ref<string | null>(""); //กลุ่มงาน
 
-/**
- * ดึงข้อมูลกลุ่มงาน
- */
-function getPosType() {
-  http
+const pagination = ref({
+  page: formFilter.page,
+  rowsPerPage: formFilter.pageSize,
+});
+
+/** ดึงข้อมูลกลุ่มงาน*/
+async function getPosType() {
+  await http
     .get(config.API.salaryEmployeePosType())
     .then((res) => {
       const data = res.data.result;
@@ -164,12 +168,12 @@ function getPosType() {
           name: "ทั้งหมด",
         },
       ];
-      const test = data.map((item: PosType) => ({
+      const datatypes = data.map((item: PosType) => ({
         id: item.id,
         name: item.posTypeName,
       }));
 
-      option.push(...test);
+      option.push(...datatypes);
       posTypeOp.value = option;
       posTypeOpMain.value = option;
     })
@@ -178,15 +182,14 @@ function getPosType() {
     });
 }
 
-/**
- * ดึงข้อมูลรายการหลักเกณฑ์
- */
-function getData() {
-  showLoader();
-  http
+/** ดึงข้อมูลรายการหลักเกณฑ์ */
+async function getData() {
+  await http
     .get(
       config.API.salaryFormula() +
-        `/?page=${formFilter.page}&pageSize=${formFilter.pageSize}&keyword=${formFilter.keyword.trim()}&posTypeId=${posType.value}`
+        `/?page=${formFilter.page}&pageSize=${
+          formFilter.pageSize
+        }&keyword=${formFilter.keyword.trim()}&posTypeId=${posType.value}`
     )
     .then((res) => {
       const data = res.data.result.data;
@@ -207,9 +210,6 @@ function getData() {
     })
     .catch((e) => {
       messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
@@ -228,14 +228,19 @@ function editPopup(params: ListData, type: string) {
  * function fetch ข้อมูลรายการตามหน้า
  * @param val หน้า
  */
-function updatePage(val: number) {
-  formFilter.page = val;
-  getData();
+async function updatePage(val: number) {
+  try {
+    showLoader();
+    formFilter.page = val;
+    await getData();
+  } catch (error) {
+    messageError($q, error);
+  } finally {
+    hideLoader();
+  }
 }
 
-/**
- * function อัปเดทแถวต่อหน้า
- */
+/** function อัปเดทแถวต่อหน้า*/
 function updatePageSize(newPagination: NewPagination) {
   formFilter.page = 1;
   formFilter.pageSize = newPagination.rowsPerPage;
@@ -246,11 +251,16 @@ function updatePageSize(newPagination: NewPagination) {
  * @param id หลักเกณฑ์
  */
 function onClickDelete(id: string) {
-  dialogRemove($q, () => {
+  dialogRemove($q, async () => {
     showLoader();
-    http
+    await http
       .delete(config.API.salaryFormula() + `/${id}`)
       .then(async () => {
+        formFilter.page = await updateCurrentPage(
+          formFilter.page,
+          maxPage.value,
+          rows.value.length
+        );
         await getData();
         await success($q, "ลบข้อมูลสำเร็จ");
       })
@@ -276,31 +286,37 @@ function filterSelector(val: string, update: Function) {
   });
 }
 
-/**
- * callbackFuntioon ทำงานเมื่อมี่การอัปเดทแถว
- */
-watch(
-  () => formFilter.pageSize,
-  () => {
-    getData();
-  }
-);
-
-/**
- * functionn fetch ข้อมูลรายการหน้าแรก
- */
+/** function fetch ข้อมูลรายการหน้าแรก */
 function filterFn() {
   formFilter.page = 1;
   getData();
 }
 
-const pagination = ref({
-  page: formFilter.page,
-  rowsPerPage: formFilter.pageSize,
-});
+/** callbackFunction ทำงานเมื่อมี่การอัปเดทแถว*/
+watch(
+  () => formFilter.pageSize,
+  async () => {
+    try {
+      showLoader();
+      await getData();
+    } catch (error) {
+      messageError($q, error);
+    } finally {
+      hideLoader();
+    }
+  }
+);
 
+/** Hook */
 onMounted(async () => {
-  await Promise.all([getData(), getPosType()]);
+  try {
+    showLoader();
+    await Promise.all([getData(), getPosType()]);
+  } catch (error) {
+    messageError($q, error);
+  } finally {
+    hideLoader();
+  }
 });
 </script>
 
diff --git a/src/modules/13_salary/components/02_salaryEmployee/TabStructure.vue b/src/modules/13_salary/components/02_salaryEmployee/TabStructure.vue
index d6ef43154..a3b10b375 100644
--- a/src/modules/13_salary/components/02_salaryEmployee/TabStructure.vue
+++ b/src/modules/13_salary/components/02_salaryEmployee/TabStructure.vue
@@ -5,6 +5,7 @@ import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
+import { updateCurrentPage } from "@/utils/function";
 
 /** importType*/
 import type { QTableProps } from "quasar";
@@ -179,6 +180,11 @@ function onClickDelete(id: string) {
     http
       .delete(config.API.salaryEmployeeChartByid(id))
       .then(async () => {
+        formFilter.page = await updateCurrentPage(
+          formFilter.page,
+          maxPage.value,
+          rows.value.length
+        );
         await fetchListChart();
         await success($q, "ลบข้อมูลสำเร็จ");
       })
@@ -282,7 +288,7 @@ onMounted(() => {
     :rows="rows"
     :columns="columns"
     row-key="name"
-    :rows-per-page-options="[10, 20, 50, 100]"
+    :rows-per-page-options="[1, 10, 20, 50, 100]"
     :visible-columns="visibleColumns"
     @update:pagination="updatePageSize"
   >
diff --git a/src/modules/13_salary/views/01_salaryMain.vue b/src/modules/13_salary/views/01_salaryMain.vue
index 114a110ad..9a03034d5 100644
--- a/src/modules/13_salary/views/01_salaryMain.vue
+++ b/src/modules/13_salary/views/01_salaryMain.vue
@@ -4,25 +4,22 @@ import { useQuasar } from "quasar";
 
 import { useRouter } from "vue-router";
 import { checkPermission } from "@/utils/permissions";
+import { updateCurrentPage } from "@/utils/function";
 import { useCounterMixin } from "@/stores/mixin";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-/**
- * importType
- */
+/** importType */
 import type { QTableProps } from "quasar";
 import type { NewPagination } from "@/modules/13_salary/interface/index/Main";
 import type { Salary } from "@/modules/13_salary/interface/response/Main";
 import type { FormQuerySalary } from "@/modules/13_salary/interface/request/Main";
 
-/**
- * importComponents
- */
+/** importComponents */
 import DialogFormMain from "@/modules/13_salary/components/01_Salary/DialogFormMain.vue"; // ผังบัญชีเงินเดือน
 import DialogFormUpload from "@/modules/13_salary/components/01_Salary/DialogUpload.vue"; // อัปโหลดเอกสารอ้างอิง
 
-/** use*/
+/** use composables */
 const $q = useQuasar();
 const router = useRouter();
 const {
@@ -34,7 +31,7 @@ const {
   success,
 } = useCounterMixin();
 
-/** modalDialog*/
+/** modalDialog */
 const modalDialogFormMain = ref<boolean>(false); //popup เพิ่ม,แก้ไข ผังบัญชีเงินเดือน
 const modalUpload = ref<boolean>(false); //popup อัปโหลดเอกสารอ้างอิง
 const rowId = ref<string>(""); // id รายการผังบัญชีเงินเดือน
@@ -86,7 +83,7 @@ const visibleColumns = ref<string[]>([
   "isActive",
 ]);
 
-/** queryString*/
+/** queryString */
 const formQuery = reactive<FormQuerySalary>({
   page: 1, //*หน้า
   pageSize: 10, //*จำนวนแถวต่อหน้า
@@ -98,9 +95,7 @@ const isActive = ref<boolean>(false); //สถานะการใช้งา
 const typeAction = ref<string>(""); //ประเภทการกระทำ
 const dataSalary = ref<Salary>(); //ข้อมูลรายการผังบัญชีเงินเดือนที่ต้องการแก้ไข
 
-/**
- *  fetch ข้อมูลรายการผังบัญชีเงินเดือน
- */
+/** ฟังก์ชันดึงข้อมูลรายการผังบัญชีเงินเดือน */
 async function fetchListSalaly() {
   showLoader();
   const page = formQuery.page.toString();
@@ -126,8 +121,8 @@ async function fetchListSalaly() {
 }
 
 /**
- *  function openDialog เพิ่ม,แก้ไข ผังบัญชีเงินเดือน
- * @param type ประเภท แก่ไข,เพิ่ม
+ *  ฟังก์ชัน openDialog เพิ่ม,แก้ไข ผังบัญชีเงินเดือน
+ * @param type ประเภท แก้ไข,เพิ่ม
  * @param data ข้อมูลผังบัญชีเงินเดือน
  */
 function onClickSalary(type: string, data: Salary | null) {
@@ -139,7 +134,7 @@ function onClickSalary(type: string, data: Salary | null) {
 }
 
 /**
- *  function redirect to page อัตราเงินเดือน
+ *  ฟังก์ชัน redirect to page อัตราเงินเดือน
  * @param id บัญชีเงินเดือน
  */
 function onClickSalaryRate(id: string) {
@@ -147,7 +142,7 @@ function onClickSalaryRate(id: string) {
 }
 
 /**
- * function คัดลอกข้อมูลรายการผังบัญชีเงินเดือน
+ * ฟังก์ชันคัดลอกข้อมูลรายการผังบัญชีเงินเดือน
  * @param id บัญชีเงินเดือน
  */
 function onClickCoppy(id: string) {
@@ -167,21 +162,21 @@ function onClickCoppy(id: string) {
 }
 
 /**
- * function ลบข้อมูลรายการผังบัญชีเงินเดือน
+ * ฟังก์ชันลบข้อมูลรายการผังบัญชีเงินเดือน
  * @param id บัญชีเงินเดือน
  */
 function onClickDelete(id: string) {
   dialogRemove($q, async () => {
     showLoader();
-    formQuery.page =
-      formQuery.page !== 1 &&
-      formQuery.page === maxPage.value &&
-      rows.value.length === 1
-        ? formQuery.page - 1
-        : formQuery.page;
     await http
       .delete(config.API.salaryChartByid(id))
       .then(async () => {
+        formQuery.page = await updateCurrentPage(
+          formQuery.page,
+          maxPage.value,
+          rows.value.length
+        );
+
         await fetchListSalaly();
         success($q, "ลบข้อมูลสำเร็จ");
       })
@@ -195,7 +190,7 @@ function onClickDelete(id: string) {
 }
 
 /**
- *  function openDialog อัปโหลดเอกสารอ้างอิง
+ *  ฟังก์ชัน openDialog อัปโหลดเอกสารอ้างอิง
  * @param type
  * @param id ผังบัญชีเงินเดือน
  * @param active สถานะการใช้งาน
@@ -208,7 +203,7 @@ function onClickUpload(type: string, id: string, active: boolean) {
 }
 
 /**
- * function updatePagination
+ * ฟังก์ชัน updatePagination
  * @param newPagination ข้อมูล Pagination ใหม่
  */
 function updatePagination(newPagination: NewPagination) {
@@ -216,16 +211,12 @@ function updatePagination(newPagination: NewPagination) {
   formQuery.pageSize = newPagination.rowsPerPage;
 }
 
-/**
- * function ค้นหาข้อมูลตาม keyword
- */
+/** ฟังก์ชัน ค้นหาข้อมูลตาม keyword */
 function filterFn(page: number) {
   page !== 1 ? (formQuery.page = 1) : fetchListSalaly();
 }
 
-/**
- * callbackFunction ทำงานเมื่อมีการ เปลี่ยนแถว
- */
+/** callbackFunction ทำงานเมื่อมีการ เปลี่ยนแถว */
 watch(
   () => formQuery.pageSize,
   () => {
diff --git a/src/modules/13_salary/views/03_salaryRound.vue b/src/modules/13_salary/views/03_salaryRound.vue
index 71516124c..12672c075 100644
--- a/src/modules/13_salary/views/03_salaryRound.vue
+++ b/src/modules/13_salary/views/03_salaryRound.vue
@@ -3,6 +3,7 @@ import { ref, watch, onMounted } from "vue";
 import { useQuasar } from "quasar";
 
 import { checkPermission } from "@/utils/permissions";
+import { updateCurrentPage } from "@/utils/function";
 import { useCounterMixin } from "@/stores/mixin";
 import { useSalaryDataStore } from "@/modules/13_salary/store/SalaryStore";
 import config from "@/app.config";
@@ -42,7 +43,6 @@ const yearData = ref<number | null>(0); //ปีงบประมาณ
 /** Table*/
 const year = ref<number>(0); //ปีงบประมาณ
 const filterKeyword = ref<string>(""); //คำค้นหา
-const currentPage = ref<number>(1); //หน้า
 const maxPage = ref<number>(1); //จำนวนหน้า
 const totalList = ref<number>(0); //จำนวนรายการ
 const page = ref<number>(1); //หน้า
@@ -117,23 +117,19 @@ const pagination = ref({
   rowsPerPage: rowsPerPage.value,
 });
 
-/**
- * function เปิด Dialog เพิ่มรอบการขึ้นเงินเดือน
- */
+/**ฟังก์ชัน เปิด Dialog เพิ่มรอบการขึ้นเงินเดือน */
 function clickAdd() {
   dialog.value = true;
   editCheck.value = false;
 }
 
-/**
- * fetch รายการรอบการขึ้นเงินเดือน
- */
+/** ฟังก์ชันดึงข้อมูลรายการรอบการขึ้นเงินเดือน */
 async function getData() {
   showLoader();
   await http
     .get(
       config.API.salaryPeriod() +
-        `?page=${page.value}&pageSise=${rowsPerPage.value}&keyword=${filterKeyword.value}&year=${year.value}`
+        `?page=${page.value}&pageSize=${rowsPerPage.value}&keyword=${filterKeyword.value}&year=${year.value}`
     )
     .then(async (res) => {
       const data = await res.data.result;
@@ -149,31 +145,34 @@ async function getData() {
     });
 }
 
-/**
- *  function เลือกปีงบประมาณ
- */
+/** ฟังก์ชันเลือกปีงบประมาณ */
 function updateYear() {
   page.value = 1;
   getData();
 }
-/**
- * set ปี ทั้งหมด
- */
+
+/** ฟังก์ชันกำหนด ปี ทั้งหมด */
 function yearAll() {
   year.value = 0;
   getData();
 }
 
 /**
- * function ลบรายการรอบการขึ้นเงินเดือน
+ * ฟังก์ชันลบรายการรอบการขึ้นเงินเดือน
  * @param id รอบการขึ้นเงินเดือน
  */
 function deleteData(id: string) {
-  dialogRemove($q, () => {
+  dialogRemove($q, async () => {
     showLoader();
-    http
+    await http
       .delete(config.API.salaryPeriod() + `/${id}`)
       .then(async () => {
+        page.value = await updateCurrentPage(
+          page.value,
+          maxPage.value,
+          dataStore.rows.length
+        );
+
         await getData();
         await success($q, "ลบข้อมูลสำเร็จ");
       })
@@ -187,9 +186,9 @@ function deleteData(id: string) {
 }
 
 /**
- * function เปิด Dialog ข้อมูลรอบการขึ้นเงินเดือน
+ * ฟังก์ชันเปิด Dialog ข้อมูลรอบการขึ้นเงินเดือน
  * @param data ข้อมูลรอบการขึ้นเงินเดือน
- * @param status สะถานะการแก่้ไข
+ * @param status สถานะการแก้ไข
  */
 function editPopup(data: RowList, status: string) {
   if (status == "read") {
@@ -205,7 +204,7 @@ function editPopup(data: RowList, status: string) {
 }
 
 /**
- * function ปิดรอการขึ้นเงินเดือน
+ * ฟังก์ชันปิดรอการขึ้นเงินเดือน
  * @param id รอบการขึ้นเงินเดือน
  */
 function dialogClose(id: string) {
@@ -232,7 +231,7 @@ function dialogClose(id: string) {
 }
 
 /**
- * function อัปเดท แถวต่อหน้า
+ * ฟังก์ชันอัปเดท แถวต่อหน้า
  * @param newPagination
  */
 function updatePageSize(newPagination: NewPagination) {
@@ -240,9 +239,7 @@ function updatePageSize(newPagination: NewPagination) {
   rowsPerPage.value = newPagination.rowsPerPage;
 }
 
-/**
- * callbackFunction ทำเมื่อมีการอัปเดท แถวต่อหน้า แล้ว fetch รายการรอบการขึ้นเงินเดือน
- */
+/** ฟังก์ชันทำเมื่อมีการอัปเดท แถวต่อหน้า แล้ว fetch รายการรอบการขึ้นเงินเดือน */
 watch(
   () => rowsPerPage.value,
   () => {
@@ -250,12 +247,12 @@ watch(
   }
 );
 
-/** Hooklifecycle*/
+/** Hooklifecycle */
 onMounted(async () => {
   year.value = new Date().getFullYear();
-  getData();
   dataStore.visibleColumns = visibleColumns.value;
   dataStore.columns = columns.value;
+  getData();
 });
 </script>
 
@@ -358,7 +355,7 @@ onMounted(async () => {
         <template v-slot:pagination="scope">
           ทั้งหมด {{ totalList?.toLocaleString() }} รายการ
           <q-pagination
-            v-model="currentPage"
+            v-model="page"
             active-color="primary"
             color="dark"
             :max="Number(maxPage)"
@@ -481,7 +478,7 @@ onMounted(async () => {
             <q-td v-for="col in props.cols" :key="col.name" :props="props">
               <div v-if="col.name == 'no'">
                 {{
-                  (currentPage - 1) * Number(pagination.rowsPerPage) +
+                  (page - 1) * Number(pagination.rowsPerPage) +
                   props.rowIndex +
                   1
                 }}
diff --git a/src/modules/13_salary/views/page01_salaryRate.vue b/src/modules/13_salary/views/page01_salaryRate.vue
index 2f0caf1bc..65cdaa47b 100644
--- a/src/modules/13_salary/views/page01_salaryRate.vue
+++ b/src/modules/13_salary/views/page01_salaryRate.vue
@@ -1,15 +1,15 @@
 <script setup lang="ts">
 import { ref, onMounted, reactive, watch } from "vue";
-import { checkPermission } from "@/utils/permissions";
 import { useQuasar } from "quasar";
+
 import { useRouter, useRoute } from "vue-router";
+import { checkPermission } from "@/utils/permissions";
+import { updateCurrentPage } from "@/utils/function";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import genReportXLSX from "@/plugins/genreportxlsx";
 
-/**
- * importType
- */
+/** importType */
 import type { QTableProps } from "quasar";
 import type {
   NewPagination,
@@ -18,17 +18,13 @@ import type {
 import type { SalaryRate } from "@/modules/13_salary/interface/response/Main";
 import type { FormQuerySalary } from "@/modules/13_salary/interface/request/Main";
 
-/**
- * importComponents
- */
+/** importComponents */
 import DialogFormRate from "@/modules/13_salary/components/01_Salary/DialogFormRate.vue";
 
-/**
- * importStore
- */
+/** importStore */
 import { useCounterMixin } from "@/stores/mixin";
 
-/** use*/
+/** use composables */
 const $q = useQuasar();
 const router = useRouter();
 const route = useRoute();
@@ -38,12 +34,12 @@ const { dialogRemove, success, messageError, showLoader, hideLoader } =
 const isActive = ref<boolean>(false);
 const posType = ref<string>("");
 
-const salaryId = ref<string>(route.params.id.toString());
+const salaryId = ref<string>(route.params.id.toString()); // id รายการผังบัญชีเงินเดือน
 
-/** modalDialog*/
+/** modalDialog */
 const modalDialogFormRate = ref<boolean>(false);
 
-/** Table*/
+/** Table */
 const rows = ref<SalaryRate[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
@@ -102,7 +98,7 @@ const columns = ref<QTableProps["columns"]>([
   },
 ]);
 
-/** List Mune*/
+/** List Menu */
 const itemMenu = ref<ItemsMenu[]>([
   {
     label: "แก้ไข",
@@ -119,7 +115,7 @@ const itemMenu = ref<ItemsMenu[]>([
   },
 ]);
 
-/** queryString*/
+/** queryString */
 const formQuery = reactive<FormQuerySalary>({
   page: 1, //*หน้า
   pageSize: 100, //*จำนวนแถวต่อหน้า
@@ -135,9 +131,7 @@ const pagination = ref({
 const typeAction = ref<string>(""); //ประเภทการกระทำ
 const dataSalaryRate = ref<SalaryRate>(); //ข้อมูลรายการ
 
-/**
- * fetch รายการอัตราเงินเดือน
- */
+/** ฟังก์ชันดึงข้อมูลรายการอัตราเงินเดือน*/
 async function fetchListSalaryRate() {
   const page = formQuery.page.toString();
   const pageSize = formQuery.pageSize.toString();
@@ -159,8 +153,8 @@ async function fetchListSalaryRate() {
 }
 
 /**
- *  function openDialog เพิ่ม,แก้ไข อัตราเงินเดือน
- * @param type ประเภท แก่ไข,เพิ่ม
+ *  ฟังก์ชัน openDialog เพิ่ม,แก้ไข อัตราเงินเดือน
+ * @param type ประเภท แก้ไข,เพิ่ม
  * @param data ข้อมูลอัตราเงินเดือน
  */
 function onClickSalaryRate(type: string, data: SalaryRate | null) {
@@ -178,15 +172,15 @@ function onClickSalaryRate(type: string, data: SalaryRate | null) {
 function onClickDelete(id: string) {
   dialogRemove($q, async () => {
     showLoader();
-    formQuery.page =
-      formQuery.page !== 1 &&
-      formQuery.page === maxPage.value &&
-      rows.value.length === 1
-        ? formQuery.page - 1
-        : formQuery.page;
     await http
       .delete(config.API.salaryRateListByid(id))
       .then(async () => {
+        formQuery.page = await updateCurrentPage(
+          formQuery.page,
+          maxPage.value,
+          rows.value.length
+        );
+
         await fetchListSalaryRateNew();
         await success($q, "ลบข้อมูลสำเร็จ");
       })
@@ -199,9 +193,7 @@ function onClickDelete(id: string) {
   });
 }
 
-/**
- *  ดาวน์โหลดไฟล์
- */
+/** ฟังก์ชันดาวน์โหลดรายงานอัตราเงินเดือน */
 function clickDownload() {
   showLoader();
   http
@@ -218,9 +210,7 @@ function clickDownload() {
     });
 }
 
-/**
- * fetch ข้อมูลอัตราเงินเดือน
- */
+/** ฟังก์ชันดึงข้อมูลอัตราเงินเดือน */
 function fetchDataSalary() {
   http
     .get(config.API.salaryChartByid(salaryId.value))
@@ -235,7 +225,7 @@ function fetchDataSalary() {
 }
 
 /**
- * function updatePagination
+ * ฟังก์ชัน updatePagination
  * @param newPagination ข้อมูล Pagination ใหม่
  */
 function updatePagination(newPagination: NewPagination) {
@@ -243,6 +233,7 @@ function updatePagination(newPagination: NewPagination) {
   formQuery.pageSize = newPagination.rowsPerPage;
 }
 
+/** ฟังก์ชันดึงข้อมูลรายการอัตราเงินเดือนใหม่ */
 async function fetchListSalaryRateNew() {
   try {
     showLoader();
@@ -254,9 +245,7 @@ async function fetchListSalaryRateNew() {
   }
 }
 
-/**
- *  ทำงานเมื่อมีการ เปลี่ยนหน้าหรือ แถว
- */
+/** ฟังก์ชันติดตามการเปลี่ยนแปลงขนาดหน้า */
 watch(
   () => formQuery.pageSize,
   async () => {
@@ -264,6 +253,7 @@ watch(
   }
 );
 
+/** Hook ที่ทำงานเมื่อ component ถูก mount */
 onMounted(async () => {
   try {
     showLoader();
diff --git a/src/modules/13_salary/views/page02_salaryEmployeeRate.vue b/src/modules/13_salary/views/page02_salaryEmployeeRate.vue
index 776b28914..078ff46a8 100644
--- a/src/modules/13_salary/views/page02_salaryEmployeeRate.vue
+++ b/src/modules/13_salary/views/page02_salaryEmployeeRate.vue
@@ -4,6 +4,7 @@ import { useQuasar } from "quasar";
 
 import { useRouter, useRoute } from "vue-router";
 import { checkPermission } from "@/utils/permissions";
+import { updateCurrentPage } from "@/utils/function";
 import { useCounterMixin } from "@/stores/mixin";
 import http from "@/plugins/http";
 import config from "@/app.config";
@@ -110,9 +111,7 @@ const itemMenu = ref<ItemsMenu[]>([
 const isActive = ref<boolean>(false); //สถานะการใช้งาน
 const groupSalary = ref<string>(""); //ชื่ออัตราค่าจ้าง
 
-/**
- * fetch ข้อมูลอัตราค่าจ้าง
- */
+/** ฟังก์ชันดึงข้อมูลรายละเอียดอัตราค่าจ้าง */
 async function fetchDataDetail() {
   await http
     .get(config.API.salaryEmployeeChartByid(salaryEmployeeId.value))
@@ -125,11 +124,8 @@ async function fetchDataDetail() {
     });
 }
 
-/**
- * fetch อัตราค่าจ้าง
- */
-async function fetchSalalyEmployeeRate() {
-  showLoader();
+/** ฟังก์ชันดึงข้อมูลรายการอัตราค่าจ้าง */
+async function fetchSalaryEmployeeRate() {
   await http
     .get(
       config.API.salaryEmployeeRateListByid(salaryEmployeeId.value) +
@@ -143,9 +139,6 @@ async function fetchSalalyEmployeeRate() {
     })
     .catch((err) => {
       messageError($q, err);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
@@ -169,7 +162,12 @@ function onDelete(id: string) {
     http
       .delete(config.API.salaryEmployeeRateListByid(id))
       .then(async () => {
-        await fetchSalalyEmployeeRate();
+        formFilter.page = await updateCurrentPage(
+          formFilter.page,
+          maxPage.value,
+          rows.value.length
+        );
+        await fetchSalaryEmployeeRate();
         await success($q, "ลบข้อมูลสำเร็จ");
       })
       .catch((err) => {
@@ -181,9 +179,7 @@ function onDelete(id: string) {
   });
 }
 
-/**
- * เพิ่มข้อมูลรายการอัตราค่าจ้าง
- */
+/** ฟังก์ชันเปิด Popup เพิ่มข้อมูลรายการอัตราค่าจ้าง */
 function onClickAdd() {
   modalDialogEmployeeRate.value = true;
   isStatusEdit.value = false;
@@ -193,9 +189,16 @@ function onClickAdd() {
  * ฟังก์ชันเปลี่ยนหน้าข้อมูล
  * @param val หน้าที่จ้องการไป
  */
-function updatePage(val: number) {
-  formFilter.page = val;
-  fetchSalalyEmployeeRate();
+async function updatePage(val: number) {
+  try {
+    showLoader();
+    formFilter.page = val;
+    await fetchSalaryEmployeeRate();
+  } catch (error) {
+    messageError($q, error);
+  } finally {
+    hideLoader();
+  }
 }
 
 /**
@@ -207,9 +210,7 @@ function updatePageSize(newPagination: NewPagination) {
   formFilter.pageSize = newPagination.rowsPerPage;
 }
 
-/**
- * click download
- */
+/** ฟังก์ชันดาวน์โหลดรายงาน */
 function clickDownload() {
   showLoader();
   http
@@ -228,15 +229,30 @@ function clickDownload() {
 
 watch(
   () => formFilter.pageSize,
-  () => {
-    fetchSalalyEmployeeRate();
+  async () => {
+    try {
+      showLoader();
+      await fetchSalaryEmployeeRate();
+    } catch (error) {
+      messageError($q, error);
+    } finally {
+      hideLoader();
+    }
   }
 );
 
 onMounted(async () => {
-  await Promise.all([fetchDataDetail(), fetchSalalyEmployeeRate()]);
+  try {
+    showLoader();
+    await Promise.all([fetchDataDetail(), fetchSalaryEmployeeRate()]);
+  } catch (error) {
+    messageError($q, error);
+  } finally {
+    hideLoader();
+  }
 });
 </script>
+
 <template>
   <div class="row items-center">
     <div class="toptitle text-dark row items-center q-py-xs">
@@ -345,7 +361,7 @@ onMounted(async () => {
   <DialogEmployeeRate
     v-model:modal="modalDialogEmployeeRate"
     :is-status-edit="isStatusEdit"
-    :fetch-data="fetchSalalyEmployeeRate"
+    :fetch-data="fetchSalaryEmployeeRate"
     :data="dataRow as EmployeeRateSalary"
   />
 </template>
diff --git a/src/utils/function.ts b/src/utils/function.ts
new file mode 100644
index 000000000..cab7df1ed
--- /dev/null
+++ b/src/utils/function.ts
@@ -0,0 +1,19 @@
+/**
+ * คำนวณหน้าที่จะแสดงหลังจากลบข้อมูล
+ *
+ * @param page หน้าปัจจุบัน
+ * @param maxPage หน้าสุดท้าย
+ * @param currentPageItems จำนวนข้อมูลในหน้าปัจจุบัน
+ * @returns หน้าที่ควรแสดง
+ */
+export async function updateCurrentPage(
+  page: number,
+  maxPage: number,
+  total: number
+) {
+  // ถ้าหน้าปัจจุบันไม่ใช่หน้าแรก และเป็นหน้าสุดท้าย และมีข้อมูลเหลือ 1 รายการ ให้กลับไปหน้าก่อนหน้า
+  if (page > 1 && page === maxPage && total === 1) {
+    return page - 1;
+  }
+  return page;
+}