Merge branch 'NiceDev' into develop

2025-09-15 13:53:12 +07:00 · 2025-09-15 13:53:12 +07:00 · ec8f370785
commit ec8f370785
parent 6a5abd818f 1f18b56fbf
24 changed files with 282 additions and 167 deletions
--- a/.forgejo/workflows/build.yml
+++ b/.forgejo/workflows/build.yml
@ -0,0 +1,50 @@
+# /.forgejo/workflows/build.yml
+name: Build
+
+on:
+  push:
+    tags:
+      - "v[0-9]+.[0-9]+.[0-9]+"
+      - "v[0-9]+.[0-9]+.[0-9]+*"
+  workflow_dispatch:
+
+env:
+  REGISTRY: ${{ vars.CONTAINER_REGISTRY }}
+  REGISTRY_USERNAME: ${{ vars.CONTAINER_REGISTRY_USERNAME }}
+  REGISTRY_PASSWORD: ${{ secrets.CONTAINER_REGISTRY_PASSWORD }}
+  CONTAINER_IMAGE_NAME: ${{ vars.CONTAINER_REGISTRY }}/${{ vars.CONTAINER_IMAGE_OWNER }}/${{ vars.CONTAINER_IMAGE_NAME }}
+  IMAGE_VERSION: build
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+        with:
+          config-inline: |
+            [registry."${{ env.REGISTRY }}"]
+              ca=["/etc/ssl/certs/ca-certificates.crt"]
+      - name: Tag Version
+        run: |
+          if [[ "${{ github.event_name }}" == "push" ]]; then
+            echo "IMAGE_VERSION=${{ github.ref_name }}" | sed 's/v//g' >> $GITHUB_ENV
+          else
+            echo "IMAGE_VERSION=${{ env.IMAGE_VERSION }}-${{ github.run_number }}" >> $GITHUB_ENV
+          fi
+      - name: Login in to registry
+        uses: docker/login-action@v2
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ env.REGISTRY_USERNAME }}
+          password: ${{ env.REGISTRY_PASSWORD }}
+      - name: Build and push docker image
+        uses: docker/build-push-action@v3
+        with:
+          platforms: linux/amd64
+          context: .
+          file: ./docker/Dockerfile
+          tags: ${{ env.CONTAINER_IMAGE_NAME }}:latest,${{ env.CONTAINER_IMAGE_NAME }}:${{ env.IMAGE_VERSION }}
+          push: true
--- a/.forgejo/workflows/deploy.yml
+++ b/.forgejo/workflows/deploy.yml
@ -0,0 +1,29 @@
+name: Build
+
+on:
+  workflow_dispatch:
+    inputs:
+      version:
+        description: "Version to deploy"
+        type: string
+        required: false
+        default: "latest"
+
+env:
+  IMAGE_VERSION: build
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Remote Deploy
+        uses: appleboy/ssh-action@v1.2.1
+        with:
+          host: ${{ vars.SSH_DEPLOY_HOST }}
+          port: ${{ vars.SSH_DEPLOY_PORT }}
+          username: ${{ secrets.SSH_DEPLOY_USER }}
+          password: ${{ secrets.SSH_DEPLOY_PASSWORD }}
+          script: |
+            cd ~/repo
+            ./replace-env.sh APP_USER "${{ inputs.version }}"
+            ./deploy.sh hrms-user
--- a/.onedev-buildspec.yml
+++ b/.onedev-buildspec.yml
@ -1,4 +1,4 @@
-version: 37
+version: 38
 jobs:
 - name: CI for UAT
  steps:
@ -40,7 +40,7 @@ jobs:
    name: build docker image
    dockerfile: ./docker/Dockerfile
    output: !RegistryOutput
-      tags: hrms-git.chin.in.th/bma-hrms/hrms-user:@build_version@ hrms-git.chin.in.th/bma-hrms/hrms-user:latest
+      tags: '@server@/bma-hrms/hrms-user:@build_version@ @server@/bma-hrms/hrms-user:latest'
    condition: ALL_PREVIOUS_STEPS_WERE_SUCCESSFUL
  triggers:
  - !TagCreateTrigger
@ -90,7 +90,7 @@ jobs:
    name: build docker image
    dockerfile: ./docker/Dockerfile
    output: !RegistryOutput
-      tags: hrms-git.bangkok.go.th/bma-hrms/hrms-user:@build_version@ hrms-git.bangkok.go.th/bma-hrms/hrms-user:latest
+      tags: '@server@/bma-hrms/hrms-user:@build_version@ @server@/bma-hrms/hrms-user:latest'
    condition: ALL_PREVIOUS_STEPS_WERE_SUCCESSFUL
  triggers:
  - !TagCreateTrigger
--- a/src/api/appeal/api.appeal.ts
+++ b/src/api/appeal/api.appeal.ts
@ -7,15 +7,7 @@ export default {
  profileBykeycloak: () => `${profile}`,
  // positionBykeycloak: () => `${env.API_URI}/org/profile/keycloak/position`,

-  appealMainList: (
-    status: string,
-    type: string,
-    year: number,
-    page: number,
-    pageSize: number,
-    keyword: string
-  ) =>
-    `${appeal}/user?status=${status}&type=${type}&year=${year}&page=${page}&pageSize=${pageSize}&keyword=${keyword}`,
+  appealMainList: () => `${appeal}/user`,
  appealAdd: () => `${appeal}`,

  appealByID: (id: string) => `${appeal}/${id}`,
--- a/src/components/TableD.vue
+++ b/src/components/TableD.vue
@ -138,9 +138,9 @@ function onRequest(requestProp: any) {
    ...newPagination,
  };

-  if (isPageChange) {
-    emit("request", requestProp);
-  }
+  // if (isPageChange) {
+  emit("request", requestProp);
+  // }
 }

 function handlePageChange(newPage: number) {
--- a/src/components/Workflow/DialogSelectPerson.vue
+++ b/src/components/Workflow/DialogSelectPerson.vue
@ -7,9 +7,9 @@ import http from "@/plugins/http";
 import config from "@/app.config";

 import type { QTableProps } from "quasar";
-import type { Pagination } from "@/components/Workflow/interface/index/Main";
 import type { DataQuery } from "@/components/Workflow/interface/request/Main";
 import type { DataCommander } from "@/components/Workflow/interface/response/Main";
+import type { PropsTable } from "@/interface/PropsTable";

 import DialogHeader from "@/components/DialogHeader.vue";

@ -76,17 +76,19 @@ const columns = ref<QTableProps["columns"]>([
    style: "font-size: 14px",
  },
 ]);
-
-const total = ref<number>(0);
-const totalList = ref<number>(1);
+const pagination = ref<PropsTable.Pagination>({
+  sortBy: "",
+  descending: true,
+  page: 1,
+  rowsPerPage: 10,
+  rowsNumber: 0,
+});

 const isAcceptSetting = ref<boolean>(false);
 const isApproveSetting = ref<boolean>(false);
 const isReasonSetting = ref<boolean>(false);

 const formDataQuery = reactive<DataQuery>({
-  page: 1,
-  pageSize: 10,
  isAct: false,
  keyword: "",
 });
@ -97,12 +99,11 @@ async function fetchLists() {
    .put(config.API.workflow + `commander/${props.type}`, {
      ...formDataQuery,
      keycloakId: props.keycloakId,
+      page: pagination.value.page,
+      pageSize: pagination.value.rowsPerPage,
    })
    .then(async (res) => {
-      totalList.value = Math.ceil(
-        res.data.result.total / formDataQuery.pageSize
-      );
-      total.value = res.data.result.total;
+      pagination.value.rowsNumber = res.data.result.total;
      rows.value = res.data.result.data;
    })
    .catch((err) => {
@ -139,7 +140,7 @@ function onSubmit() {
 }

 function onSearchData() {
-  formDataQuery.page = 1;
+  pagination.value.page = 1;
  fetchLists();
 }

@ -150,32 +151,25 @@ function onCloseModal() {
  isAcceptSetting.value = false;
  isApproveSetting.value = false;
  isReasonSetting.value = false;
-  formDataQuery.page = 1;
-  formDataQuery.pageSize = 10;
  formDataQuery.isAct = false;
  formDataQuery.keyword = "";
 }

+/**
+ * ฟังก์ชันรับ request จากตาราง เมื่อมีการเปลี่ยน pagination
+ * @param requestProps ข้อมูลการร้องขอจากตาราง
+ */
+function onTableRequest(requestProps: PropsTable.RequestProps) {
+  const newPagination = requestProps?.pagination || requestProps;
+  if (!newPagination?.page || !newPagination?.rowsPerPage) return;
+  pagination.value = { ...newPagination };
+}
+
 watch(modal, (val) => {
  if (val) {
    fetchLists();
  }
 });
-
-// watch(
-//   () => [formDataQuery.isAct, formDataQuery.pageSize],
-//   () => {
-//     onSearchData();
-//   }
-// );
-
-/**
- * function updatePagination
- * @param newPagination ข้อมูล Pagination ใหม่
- */
-function updatePagination(newPagination: Pagination) {
-  formDataQuery.pageSize = newPagination.rowsPerPage;
-}
 </script>

 <template>
@ -231,7 +225,8 @@ function updatePagination(newPagination: Pagination) {
            :rows-per-page-options="[10, 25, 50, 100]"
            selection="single"
            v-model:selected="selected"
-            @update:pagination="updatePagination"
+            v-model:pagination="pagination"
+            @request="onTableRequest"
          >
            <template v-slot:header-selection="scope">
              <q-checkbox
@ -266,21 +261,6 @@ function updatePagination(newPagination: Pagination) {
                </q-td>
              </q-tr>
            </template>
-
-            <template v-slot:pagination="scope">
-              ทั้งหมด {{ total }} รายการ
-              <q-pagination
-                v-model="formDataQuery.page"
-                active-color="primary"
-                color="dark"
-                :max="Number(totalList)"
-                size="sm"
-                boundary-links
-                direction-links
-                :max-pages="5"
-                @update:model-value="fetchLists()"
-              ></q-pagination>
-            </template>
          </d-table>
          <div class="q-gutter-xs q-pt-sm">
            <div>
--- a/src/components/Workflow/interface/request/Main.ts
+++ b/src/components/Workflow/interface/request/Main.ts
@ -1,6 +1,4 @@
 interface DataQuery {
-  page: number;
-  pageSize: number;
  isAct: boolean;
  keyword: string;
 }
--- a/src/modules/05_leave/components/FormLeave/Form.vue
+++ b/src/modules/05_leave/components/FormLeave/Form.vue
@ -44,11 +44,11 @@ const columns = ref<QTableProps["columns"]>([
    style: "font-size: 14px",
  },
  {
-    name: "fullName",
+    name: "firstName",
    align: "left",
    label: "ชื่อ-นามสกุล",
    sortable: true,
-    field: "fullName",
+    field: "firstName",
    format(val, row) {
      return `${row.prefix}${row.firstName} ${row.lastName}`;
    },
@ -66,7 +66,7 @@ const columns = ref<QTableProps["columns"]>([
  },
 ]);
 const pagination = ref<PropsTable.Pagination>({
-  sortBy: "createdAt",
+  sortBy: "",
  descending: true,
  page: 1,
  rowsPerPage: 10,
@ -83,6 +83,10 @@ async function getCommander() {
      page: pagination.value.page,
      pageSize: pagination.value.rowsPerPage,
      keycloakId: storeData.formData.keycloakId,
+      ...(pagination.value.sortBy && {
+        sortBy: pagination.value.sortBy,
+        descending: pagination.value.descending,
+      }),
      type:
        storeData.officerType.toLocaleUpperCase() == "OFFICER"
          ? "officer"
@ -117,7 +121,7 @@ function closeDialog() {
  rows.value = [];
  selected.value = [];
  pagination.value = {
-    sortBy: "createdAt",
+    sortBy: "",
    descending: true,
    page: 1,
    rowsPerPage: 10,
--- a/src/modules/05_leave/components/ListView.vue
+++ b/src/modules/05_leave/components/ListView.vue
@ -37,6 +37,8 @@ const maxPage = ref<number>(1);
 const page = ref<number>(1);
 const pageSize = ref<number>(10);
 const total = ref<number>(0);
+const sortBy = ref<string>("dateSendLeave");
+const descending = ref<boolean>(true);
 /** function เรียกข้อมูลการลา*/
 async function fetchDataTable() {
  isLoading.value = true;
@ -47,6 +49,10 @@ async function fetchDataTable() {
    page: page.value.toString(), //*หน้า
    pageSize: pageSize.value.toString(), //*จำนวนแถวต่อหน้า
    keyword: filter.value, //keyword ค้นหา
+    ...(sortBy.value && {
+      sortBy: sortBy.value,
+      descending: descending.value,
+    }),
  };
  await http
    .post(config.API.leaveTableList(), body)
@ -141,9 +147,14 @@ async function updateFilterTable(y: number, t: string, s: string, k: string) {
 * function updatePagination
 * @param p หน้า
 * @param ps แถวต่อหน้า
+ * @param s เรียงลำดับตาม
+ * @param d เรียงลำดับจากน้อยไปมาก
 */
-async function updatePagination(p: number, ps: number) {
-  (page.value = p), (pageSize.value = ps);
+async function updatePagination(p: number, ps: number, s: string, d: boolean) {
+  page.value = p;
+  pageSize.value = ps;
+  sortBy.value = s;
+  descending.value = d;
  await fetchDataTable();
 }

@ -188,6 +199,8 @@ onMounted(async () => {
    :pageSize="pageSize"
    :leaveType="leaveType"
    :total="total"
+    :sortBy="sortBy"
+    :descending="descending"
    :isloadingData="isLoading"
  >
    <template #columns="props">
@ -215,7 +228,7 @@ onMounted(async () => {
          }}
        </q-td>
        <q-td
-          key="dateLeave"
+          key="leaveStartDate"
          :props="props"
          @click="onClickView(props.row.id, props.row.status)"
        >
--- a/src/modules/05_leave/components/Table.vue
+++ b/src/modules/05_leave/components/Table.vue
@ -38,6 +38,14 @@ const props = defineProps({
    type: Boolean,
    default: false,
  },
+  sortBy: {
+    type: String,
+    default: "dateSendLeave",
+  },
+  descending: {
+    type: Boolean,
+    default: true,
+  },
 });

 /**
@ -56,11 +64,10 @@ const table = ref<any>(null);
 const currentPage = ref<number>(1);

 const pagination = ref<PropsTable.Pagination>({
-  sortBy: "dateSendLeave",
-  descending: true,
+  sortBy: props.sortBy,
+  descending: props.descending,
  page: 1,
  rowsPerPage: Number(props.pageSize),
-
  rowsNumber: Number(props.total),
 });

@ -94,9 +101,20 @@ function filterTable() {
  );
 }

-/** function updatePagination*/
-function updatePagination(p: number, ps: number) {
-  emit("update:Pagination", p, ps);
+/**
+ * ฟังก์ชันอัปเดตการแบ่งหน้า
+ * @param p หน้า
+ * @param ps ขนาดหน้า
+ * @param sortBy เรียงลำดับตาม
+ * @param descending เรียงลำดับจากน้อยไปมาก
+ */
+function updatePagination(
+  p: number,
+  ps: number,
+  sortBy?: string,
+  descending?: boolean
+) {
+  emit("update:Pagination", p, ps, sortBy, descending);
 }

 /**
@ -108,7 +126,12 @@ function onTableRequest(requestProps: PropsTable.RequestProps) {
  if (!newPagination?.page || !newPagination?.rowsPerPage) return;
  currentPage.value = newPagination.page;
  pagination.value = { ...newPagination };
-  updatePagination(newPagination.page, newPagination.rowsPerPage);
+  updatePagination(
+    newPagination.page,
+    newPagination.rowsPerPage,
+    newPagination.sortBy,
+    newPagination.descending
+  );
 }
 </script>

--- a/src/modules/05_leave/store.ts
+++ b/src/modules/05_leave/store.ts
@ -200,7 +200,7 @@ export const useLeaveStore = defineStore("Leave", () => {
    "leaveTypeName",
    "dateSendLeave",
    "status",
-    "dateLeave",
+    "leaveStartDate",
  ]);

  const columns = ref<QTableProps["columns"]>([
@ -208,7 +208,7 @@ export const useLeaveStore = defineStore("Leave", () => {
      name: "no",
      align: "left",
      label: "ลำดับ",
-      sortable: true,
+      sortable: false,
      field: "no",
      headerStyle: "font-size: 14px",
      style: "font-size: 14px; width:5%;",
@ -223,7 +223,7 @@ export const useLeaveStore = defineStore("Leave", () => {
      style: "font-size: 14px; width:15%;",
    },
    {
-      name: "dateLeave",
+      name: "leaveStartDate",
      align: "left",
      label: "วันที่ลา",
      sortable: true,
@ -259,7 +259,6 @@ export const useLeaveStore = defineStore("Leave", () => {
   */
  function typeConvert(item: string, subitem: any) {
    typeLeave.value = convertSubtitle(item);
-    // }
    typeId.value = convertId(item);
  }

--- a/src/modules/06_evaluate/components/TableListEvaluate.vue
+++ b/src/modules/06_evaluate/components/TableListEvaluate.vue
@ -35,13 +35,13 @@ const props = defineProps({
 const emit = defineEmits(["update:pagination"]);

 /** ค้นหาคอลัม */
-const visibleColumns = ref<string[]>(["no", "type_th", "dateSend", "status"]);
+const visibleColumns = ref<string[]>(["no", "type_th", "lastUpdatedAt", "status"]);
 const columns = ref<QTableProps["columns"]>([
  {
    name: "no",
    align: "left",
    label: "ลำดับ",
-    sortable: true,
+    sortable: false,
    field: "no",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px; ",
@ -50,13 +50,13 @@ const columns = ref<QTableProps["columns"]>([
    name: "type_th",
    align: "left",
    label: "ระดับที่ยื่นขอ",
-    sortable: true,
+    sortable: false,
    field: "type_th",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px; ",
  },
  {
-    name: "dateSend",
+    name: "lastUpdatedAt",
    align: "left",
    label: "วันที่ยื่นขอ",
    sortable: true,
@ -68,7 +68,7 @@ const columns = ref<QTableProps["columns"]>([
    name: "status",
    align: "left",
    label: "สถานะ",
-    sortable: true,
+    sortable: false,
    field: "status",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
@ -128,7 +128,7 @@ onMounted(() => {
  <d-table
    ref="table"
    flat
-    bordere
+    bordered
    :columns="columns"
    :rows="store.row"
    dense
--- a/src/modules/06_evaluate/views/EvaluateMain.vue
+++ b/src/modules/06_evaluate/views/EvaluateMain.vue
@ -52,7 +52,7 @@ const listMenu = ref<ListMenu[]>([
 ]);

 const pagination = ref<PropsTable.Pagination>({
-  sortBy: "createdAt",
+  sortBy: "",
  descending: true,
  page: 1,
  rowsPerPage: 10,
@ -81,7 +81,12 @@ async function fetchEvaluteList() {
    pageSize: pagination.value.rowsPerPage,
    keyword: store.filterKeyword,
    status: selectedStatus.value,
+    ...(pagination.value.sortBy && {
+      sortBy: pagination.value.sortBy,
+      descending: pagination.value.descending,
+    }),
  };
+
  await http
    .put(config.API.evaluationList(), body)
    .then(async (res) => {
@ -216,6 +221,8 @@ onMounted(async () => {
      </div>
    </div>

+    
+
    <div class="col-xs-12 col-sm-12 col-md-11 row q-col-gutter-md">
      <div class="col-12 row">
        <q-card bordered class="col-12 row caedNone q-pa-md">
--- a/src/modules/07_appealComplain/views/Main.vue
+++ b/src/modules/07_appealComplain/views/Main.vue
@ -1,7 +1,7 @@
 useA
 <script setup lang="ts">
 import type { QTableProps } from "quasar";
-import { ref, onMounted, reactive, watch } from "vue";
+import { ref, onMounted, reactive } from "vue";
 import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";

@ -28,7 +28,7 @@ const type = ref<DataOption[]>([

 const isload = ref<boolean>(false);
 const pagination = ref<PropsTable.Pagination>({
-  sortBy: "createdAt",
+  sortBy: "",
  descending: true,
  page: 1,
  rowsPerPage: 10,
@ -56,7 +56,7 @@ const columns = ref<QTableProps["columns"]>([
    name: "no",
    align: "left",
    label: "ลำดับ",
-    sortable: true,
+    sortable: false,
    field: "no",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px; width:5px;",
@ -74,7 +74,7 @@ const columns = ref<QTableProps["columns"]>([
    name: "type",
    align: "left",
    label: "ประเภท",
-    sortable: true,
+    sortable: false,
    field: "type",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px; width:15%;",
@ -83,7 +83,7 @@ const columns = ref<QTableProps["columns"]>([
    name: "year",
    align: "left",
    label: "ปีงบประมาณ",
-    sortable: true,
+    sortable: false,
    field: "year",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
@ -149,23 +149,28 @@ const columns = ref<QTableProps["columns"]>([
 //นำข้อมูลมาแสดง
 async function getData() {
  isload.value = true;
+  const params = new URLSearchParams({
+    status: formData.status,
+    type: formData.type,
+    year: String(formData.year),
+    page: String(pagination.value.page),
+    pageSize: String(pagination.value.rowsPerPage),
+    keyword: filterKeyword.value,
+  });
+
+  if (pagination.value.sortBy) {
+    params.append("sortBy", pagination.value.sortBy);
+    params.append("descending", String(pagination.value.descending));
+  }
+
  await http
-    .get(
-      config.API.appealMainList(
-        formData.status,
-        formData.type,
-        formData.year,
-        pagination.value.page,
-        pagination.value.rowsPerPage,
-        filterKeyword.value
-      )
-    )
+    .get(config.API.appealMainList() + `?${params.toString()}`)
    .then(async (res) => {
      const result = res.data.result;
      pagination.value.rowsNumber = result.total;
      dataStore.fetchAppealComplain(result.data);
    })
-    .catch((e: any) => {
+    .catch((e) => {
      messageError($q, e);
    })
    .finally(() => {
--- a/src/modules/08_KPI/components/Evaluator/01_TabAll.vue
+++ b/src/modules/08_KPI/components/Evaluator/01_TabAll.vue
@ -27,8 +27,8 @@ const props = defineProps({
 });

 const pagination = ref<PropsTable.Pagination>({
-  sortBy: "desc",
-  descending: false,
+  sortBy: formQuery.value.sortBy,
+  descending: formQuery.value.descending,
  page: formQuery.value.page,
  rowsPerPage: formQuery.value.pageSize,
  rowsNumber: total.value,
@ -48,6 +48,8 @@ function onTableRequest(requestProps: PropsTable.RequestProps) {
  if (!newPagination?.page || !newPagination?.rowsPerPage) return;
  formQuery.value.page = newPagination.page;
  formQuery.value.pageSize = newPagination.rowsPerPage;
+  formQuery.value.sortBy = newPagination.sortBy;
+  formQuery.value.descending = newPagination.descending;
  props?.fetchList?.();
 }

@ -96,7 +98,7 @@ watch(
            :key="col.id"
            @click="redirectViewDetail(props.row.id)"
          >
-            <div v-if="col.name === 'name'">
+            <div v-if="col.name === 'firstName'">
              {{
                `${props.row.prefix}${props.row.firstname}  ${props.row.lastname}`
              }}
--- a/src/modules/08_KPI/components/Evaluator/02_TabOther.vue
+++ b/src/modules/08_KPI/components/Evaluator/02_TabOther.vue
@ -41,8 +41,8 @@ const props = defineProps({
 });

 const pagination = ref<PropsTable.Pagination>({
-  sortBy: "desc",
-  descending: false,
+  sortBy: formQuery.value.sortBy,
+  descending: formQuery.value.descending,
  page: formQuery.value.page,
  rowsPerPage: formQuery.value.pageSize,
  rowsNumber: total.value,
@ -115,6 +115,8 @@ function onTableRequest(requestProps: PropsTable.RequestProps) {
  if (!newPagination?.page || !newPagination?.rowsPerPage) return;
  formQuery.value.page = newPagination.page;
  formQuery.value.pageSize = newPagination.rowsPerPage;
+  formQuery.value.sortBy = newPagination.sortBy;
+  formQuery.value.descending = newPagination.descending;
  props?.fetchList?.();
 }

@ -128,6 +130,8 @@ watch(
    pagination.value.page = page;
    pagination.value.rowsPerPage = pageSize;
    pagination.value.rowsNumber = total;
+    pagination.value.sortBy = formQuery.value.sortBy;
+    pagination.value.descending = formQuery.value.descending;
  }
 );
 </script>
@ -219,7 +223,7 @@ watch(
                  <q-item-label caption>{{ col.label }}</q-item-label>

                  <q-item-label>
-                    <div v-if="col.name === 'name'">
+                    <div v-if="col.name === 'firstName'">
                      {{
                        `${props.row.prefix}${props.row.firstname}  ${props.row.lastname}`
                      }}
--- a/src/modules/08_KPI/interface/request/index.ts
+++ b/src/modules/08_KPI/interface/request/index.ts
@ -69,11 +69,13 @@ interface FormQuery {
  pageSize: number;
  round: string;
  keyword: string;
+  sortBy?: string;
+  descending?: boolean;
 }

 interface ListTarget {
  id: string;
-  createdAt: string; 
+  createdAt: string;
  createdUserId: string;
  lastUpdatedAt: string;
  lastUpdateUserId: string;
@ -99,5 +101,5 @@ export type {
  FormComment,
  FormCommentByRole,
  FormQuery,
-  ListTarget
+  ListTarget,
 };
--- a/src/modules/08_KPI/store.ts
+++ b/src/modules/08_KPI/store.ts
@ -14,6 +14,8 @@ export const useKpiDataStore = defineStore("KPIDate", () => {
    pageSize: 10,
    round: "",
    keyword: "",
+    sortBy: "",
+    descending: false,
  });
  const selected = ref([]);
  const work = ref<boolean>(false);
--- a/src/modules/08_KPI/views/main.vue
+++ b/src/modules/08_KPI/views/main.vue
@ -50,8 +50,6 @@ const columns = ref<QTableProps["columns"]>([
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
    format: (v) => date2Thai(v),
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
  },
  {
    name: "year",
@ -62,8 +60,6 @@ const columns = ref<QTableProps["columns"]>([
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
    format: (v) => v + 543,
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
  },
  {
    name: "durationKPI",
@ -74,8 +70,6 @@ const columns = ref<QTableProps["columns"]>([
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
    format: (v) => (v == "OCT" ? "รอบที่ 2 ตุลาคม" : "รอบที่ 1 เมษายน"),
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
  },
  {
    name: "evaluationStatus",
@ -86,8 +80,6 @@ const columns = ref<QTableProps["columns"]>([
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
    format: (v) => store.convertStatus(v),
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
  },
  {
    name: "evaluationResults",
@ -98,8 +90,6 @@ const columns = ref<QTableProps["columns"]>([
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
    format: (v) => store.convertResults(v),
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
  },
 ]);

@ -147,7 +137,7 @@ const formQuery = reactive({
 const isRoundClose = ref<boolean>(false);

 const pagination = ref<PropsTable.Pagination>({
-  sortBy: "desc",
+  sortBy: "",
  descending: false,
  page: 1,
  rowsPerPage: 10,
@ -212,6 +202,10 @@ async function fetchList() {
    status: formQuery.status === "" ? undefined : formQuery.status,
    results: formQuery.results === "" ? undefined : formQuery.results,
    year: year.value,
+    ...(pagination.value.sortBy && {
+      sortBy: pagination.value.sortBy,
+      descending: pagination.value.descending,
+    }),
  };
  await http
    .get(config.API.kpiEvaluation, {
--- a/src/modules/08_KPI/views/mainEvaluator.vue
+++ b/src/modules/08_KPI/views/mainEvaluator.vue
@ -28,22 +28,20 @@ const dataListMain = ref<ResEvaluatorAssessor[]>([]);
 const roundOp = ref<DataOptions[]>([]);

 const visibleColumns = ref<string[]>([
-  "name",
+  "firstName",
  "createdAt",
  "evaluationStatus",
  "evaluationResults",
 ]);
 const columns = ref<QTableProps["columns"]>([
  {
-    name: "name",
+    name: "firstName",
    align: "left",
    label: "ผู้ขอรับการประเมิน",
    sortable: true,
-    field: "name",
+    field: "firstName",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
  },
  {
    name: "createdAt",
@ -54,8 +52,6 @@ const columns = ref<QTableProps["columns"]>([
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
    format: (v) => date2Thai(v),
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
  },
  {
    name: "evaluationStatus",
@ -66,8 +62,6 @@ const columns = ref<QTableProps["columns"]>([
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
    format: (v) => store.convertStatus(v),
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
  },
  {
    name: "evaluationResults",
@ -78,8 +72,6 @@ const columns = ref<QTableProps["columns"]>([
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
    format: (v) => store.convertResults(v),
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
  },
 ]);

@ -147,6 +139,10 @@ async function fetchList() {
        ? "SUMMARY"
        : undefined,
    reqedit: store.tabMainevaluator === "3" ? "NEW" : undefined,
+    ...(store.formQuery.sortBy && {
+      sortBy: store.formQuery.sortBy,
+      descending: store.formQuery.descending,
+    }),
  };

  await http
--- a/src/modules/10_registry/views/requestEditMain.vue
+++ b/src/modules/10_registry/views/requestEditMain.vue
@ -49,7 +49,7 @@ const columns = ref<QTableProps["columns"]>([
    name: "topic",
    align: "left",
    label: "ชื่อเรื่อง",
-    sortable: false,
+    sortable: true,
    field: "topic",
    format: (v) => (v ? v : "-"),
    headerStyle: "font-size: 14px",
@ -59,21 +59,13 @@ const columns = ref<QTableProps["columns"]>([
    name: "detail",
    align: "left",
    label: "รายละเอียด",
-    sortable: false,
+    sortable: true,
    field: "detail",
    format: (v) => (v ? v : "-"),
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
-  // {
-  //   name: "document",
-  //   align: "center",
-  //   label: "หลักฐานอ้างอิง",
-  //   sortable: false,
-  //   field: "document",
-  //   headerStyle: "font-size: 14px",
-  //   style: "font-size: 14px",
-  // },
+
  {
    name: "status",
    align: "left",
@ -88,7 +80,7 @@ const columns = ref<QTableProps["columns"]>([
    name: "remark",
    align: "left",
    label: "หมายเหตุ ",
-    sortable: false,
+    sortable: true,
    field: "remark",
    format: (v) => (v ? v : "-"),
    headerStyle: "font-size: 14px",
@ -106,6 +98,7 @@ const visibleColumns = ref<string[]>([
 const pagination = ref<PropsTable.Pagination>({
  descending: true,
  page: 1,
+  sortBy: "",
  rowsPerPage: 10,
  rowsNumber: 0,
 });
@ -122,17 +115,26 @@ function onClickAdd() {

 /** function fetch รายการข้อมูลการยื่นคำร้องขอแก้ไขข้อมูล*/
 async function fetchListRequset() {
-  let queryParams = {
-    page: pagination.value.page,
-    pageSize: pagination.value.rowsPerPage,
+  const queryParams = new URLSearchParams({
+    page: pagination.value.page.toString(),
+    pageSize: pagination.value.rowsPerPage.toString(),
    status: status.value,
    keyword: keyword.value,
-  };
+  });
+
+  if (pagination.value.sortBy) {
+    queryParams.append("sortBy", pagination.value.sortBy);
+    queryParams.append(
+      "descending",
+      pagination.value.descending ? "true" : "false"
+    );
+  }
  isLoading.value = true;
  await http
-    .get(config.API.requestEditByType(link.value) + `user`, {
-      params: queryParams,
-    })
+    .get(
+      config.API.requestEditByType(link.value) +
+        `user?${queryParams.toString()}`
+    )
    .then((res) => {
      const result = res.data.result;
      pagination.value.rowsNumber = result.total;
--- a/src/modules/13_portfolio/views/Main.vue
+++ b/src/modules/13_portfolio/views/Main.vue
@ -122,10 +122,6 @@ function onSearch() {
  );
 }

-function onTableRequest() {
-  console.log(1111);
-}
-
 /** Hook Lifecycle */
 onMounted(async () => {
  await fecthList();
@ -213,7 +209,6 @@ onMounted(async () => {
              :rows-per-page-options="[10, 25, 50, 100]"
              :pagination="pagination"
              :loading="isLoading"
-              @request="onTableRequest"
            >
              <template v-slot:header="props">
                <q-tr :props="props">
--- a/src/modules/14_IDP/views/main.vue
+++ b/src/modules/14_IDP/views/main.vue
@ -23,7 +23,7 @@ const status = ref<string>("ALL"); // สถานะคำร้อง
 const statusOptions = ref<DataOption[]>(store.optionStatus);
 const rows = ref<RowsListMain[]>([]);
 const pagination = ref<PropsTable.Pagination>({
-  sortBy: "createdAt",
+  sortBy: "",
  descending: true,
  page: 1,
  rowsPerPage: 10,
@ -40,7 +40,7 @@ const visibleColumns = ref<string[]>([
  "detail",
  "document",
  "status",
-  "remark",
+  "reason",
 ]);
 const columns = ref<QTableProps["columns"]>([
  {
@ -67,7 +67,7 @@ const columns = ref<QTableProps["columns"]>([
    name: "developmentProjects",
    align: "left",
    label: "วิธีการพัฒนา",
-    sortable: true,
+    sortable: false,
    field: "developmentProjects",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
@ -120,18 +120,18 @@ const columns = ref<QTableProps["columns"]>([
    name: "status",
    align: "left",
    label: "สถานะคำร้อง",
-    sortable: true,
+    sortable: false,
    field: "status",
    format: (v) => store.convertStatus(v),
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
  {
-    name: "remark",
+    name: "reason",
    align: "left",
    label: "หมายเหตุ ",
    sortable: true,
-    field: "remark",
+    field: "reason",
    format: (v) => (v ? v : "-"),
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
@ -177,12 +177,21 @@ function onDelete(id: string) {
 /** list รายการ */
 async function getListData() {
  isLoading.value = true;
+  const params = new URLSearchParams({
+    status: status.value,
+    keyword: filterKeyword.value,
+    page: pagination.value.page.toString(),
+    pageSize: pagination.value.rowsPerPage.toString(),
+  });
+
+  if (pagination.value.sortBy) {
+    params.append("sortBy", pagination.value.sortBy);
+    params.append("descending", pagination.value.descending ? "true" : "false");
+  }
+
  await http
-    .get(
-      config.API.developmentRequest +
-        `/user?status=${status.value}&keyword=${filterKeyword.value}&page=${pagination.value.page}&pageSize=${pagination.value.rowsPerPage}
-  `
-    )
+    .get(config.API.developmentRequest + `/user?${params.toString()}`)
+
    .then(async (res) => {
      const result = await res.data.result;
      pagination.value.rowsNumber = result.total;
@ -247,6 +256,7 @@ async function downloadUrl(id: string, fileName: string) {
 */
 function onTableRequest(requestProps: PropsTable.RequestProps) {
  const newPagination = requestProps?.pagination || requestProps;
+
  if (!newPagination?.page || !newPagination?.rowsPerPage) return;
  pagination.value = { ...newPagination };
  getListData();
--- a/src/views/MainLayout.vue
+++ b/src/views/MainLayout.vue
@ -247,6 +247,14 @@ const landingPageUrl = ref<string>(configParam.landingPageUrl);
 function onViewDetailNoti(url: string) {
  window.open(url, "_blank");
 }
+
+/** ดูการเปลี่ยน route name เพื่อเปลี่ยน tab */
+watch(
+  () => route.name,
+  (newVal) => {
+    tab.value = newVal;
+  }
+);
 </script>

 <!-- โครงเว็บ -->