filter dateAppoint

src/modules/04_registryPerson/components/TableView.vue

@@ -23,7 +23,7 @@ import DialogHeader from "@/components/DialogHeader.vue";
 
 const $q = useQuasar();
 const mixin = useCounterMixin();
-const { messageError } = mixin;
+const { messageError, date2Thai } = mixin;
 const store = useRegistryNewDataStore();
 const router = useRouter();
 
@@ -60,62 +60,52 @@ const columns = ref<QTableProps["columns"]>([
     name: "no",
     align: "left",
     label: "ลำดับ",
-    sortable: true,
+    sortable: false,
     field: "no",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "fullName",
     align: "left",
     label: "ชื่อ-นามสกุล",
-    sortable: true,
+    sortable: false,
     field: "fullName",
     headerStyle: "font-size: 14px; min-width: 200px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "posNo",
     align: "left",
     label: "ตำแหน่งเลขที่",
-    sortable: true,
+    sortable: false,
     field: "posNo",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "position",
     align: "left",
     label: "ตำแหน่งในสายงาน",
-    sortable: true,
+    sortable: false,
     field: "position",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "posPath",
     align: "left",
     label: "ตำแหน่งประเภท",
-    sortable: true,
+    sortable: false,
     field: "posType",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "posLevel",
     align: "left",
     label: "ระดับ",
-    sortable: true,
+    sortable: false,
     field: "posLevel",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
@@ -124,19 +114,27 @@ const columns = ref<QTableProps["columns"]>([
         ? row.posTypeShortName + " " + row.posLevel
         : row.posLevel;
     },
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "org",
     align: "left",
     label: "สังกัด",
-    sortable: true,
+    sortable: false,
     field: "org",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
+  },
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  {
+    name: "dateAppoint",
+    align: "left",
+    label: "วันที่บรรจุ",
+    sortable: false,
+    field: "dateAppoint",
+    headerStyle: "font-size: 14px",
+    format(val, row) {
+      return date2Thai(val);
+    },
+    style: "font-size: 14px",
   },
   // {
   //   name: "year",
@@ -170,6 +168,7 @@ const visibleColumns = ref<string[]>([
   "posType",
   "posLevel",
   "org",
+  "dateAppoint",
 ]);
 const pagination = ref({
   page: formFilter.value.page,

src/modules/04_registryPerson/interface/request/Main.ts

@@ -58,6 +58,8 @@ interface QueryParams {
   isAll?: boolean;
   retireType?: string | null;
   dateAppoint?: string;
+  sortBy?: string;
+  sort?: string;
 }
 
 interface FormChangeName {

src/modules/04_registryPerson/store.ts

@@ -132,8 +132,8 @@ export const useRegistryNewDataStore = defineStore("registryNew", () => {
   ]);
 
   const displayOrderOps = ref<DataOption[]>([
-    { id: "ASC", name: "เรียงตามวันที่บรรจุแต่งตั้ง (ล่าสุด-เก่า)" },
+    { id: "DESC", name: "เรียงตามวันที่บรรจุแต่งตั้ง (ล่าสุด-เก่า)" },
-    { id: "DESC", name: "เรียงตามวันที่บรรจุแต่งตั้ง (เก่า-ล่าสุด)" },
+    { id: "ASC", name: "เรียงตามวันที่บรรจุแต่งตั้ง (เก่า-ล่าสุด)" },
   ]);
 
   return {

src/modules/04_registryPerson/views/listView.vue

@@ -129,7 +129,8 @@ async function fetchDataPerson() {
   }
 
   if (store.formFilter.dateAppoint) {
-    queryParams.dateAppoint = store.formFilter.dateAppoint;
+    queryParams.sortBy = "profile.dateAppoint";
+    queryParams.sort = store.formFilter.dateAppoint;
   }
 
   await http