sort สรรหา

src/components/TableView.vue

@@ -325,6 +325,7 @@ import { useCounterMixin } from "@/stores/mixin";
 import { useQuasar } from "quasar";
 
 const filter = defineModel<string>("filter", { required: true });
+const sortBy = defineModel<string>("sortBy");
 
 const $q = useQuasar();
 const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
@@ -337,7 +338,7 @@ const modalPublish = ref<boolean>(false);
 const modalDelete = ref<boolean>(false);
 
 const pagination = ref({
-  sortBy: "desc",
+  sortBy: sortBy.value ? sortBy.value : "desc",
   descending: false,
   page: 1,
   rowsPerPage: 10,

src/modules/03_recruiting/components/Table.vue

@@ -6,10 +6,10 @@ import type { Pagination } from "@/modules/03_recruiting/interface/index/Main";
 const attrs = ref<any>(useAttrs());
 const table = ref<any>(null);
 const filterRef = ref<any>(null);
-const initialPagination = ref<Pagination>({
+
-  rowsPerPage: 0,
-});
 const filter = defineModel<string>("filter", { required: true });
+const pagination = defineModel<Pagination>('pagination',{required:true})
+
 const props = defineProps({
   onSearch: Function,
   count: Number,
@@ -175,7 +175,7 @@ function resetFilter() {
     :virtual-scroll-sticky-size-start="48"
     dense
     :pagination-label="paginationLabel"
-    :pagination="initialPagination"
+    v-model:pagination="pagination"
     :rows-per-page-options="[0]"
   >
     <template v-slot:header="props">

src/modules/03_recruiting/interface/index/Main.ts

@@ -1,6 +1,7 @@
 import { ref } from "vue";
 interface Pagination {
   rowsPerPage: number;
+  sortBy: string;
 }
 
 interface DataDateMonthObject {

src/modules/03_recruiting/views/01_compete/Detail.vue

@@ -12,6 +12,7 @@ import { useQuasar } from "quasar";
 import type { RecruitDetailResponse } from "@/modules/03_recruiting/interface/response/Period";
 import Table from "@/modules/03_recruiting/components/Table.vue";
 import genReportXLSX from "@/plugins/genreportxlsx";
+import type { Pagination } from "@/modules/03_recruiting/interface/index/Main";
 
 const $q = useQuasar();
 const router = useRouter();
@@ -20,6 +21,10 @@ const mixin = useCounterMixin();
 const { messageError, success, showLoader, hideLoader, onSearchDataTable } =
   mixin;
 
+const initialPagination = ref<Pagination>({
+  rowsPerPage: 0,
+  sortBy: "year",
+});
 const year = ref<string>("");
 const round = ref<string>("");
 const name = ref<string>("");
@@ -475,6 +480,7 @@ onMounted(async () => {
         :visible-columns="visibleColumns"
         v-model:inputfilter="filter"
         v-model:inputvisible="visibleColumns"
+        v-model:pagination="initialPagination"
         :nornmalData="false"
         :conclude="true"
       >

src/modules/03_recruiting/views/01_compete/ImportData.vue

@@ -8,6 +8,7 @@ import { useQuasar } from "quasar";
 import { useCounterMixin } from "@/stores/mixin";
 
 import Table from "@/modules/03_recruiting/components/Table.vue";
+import type { Pagination } from "@/modules/03_recruiting/interface/index/Main";
 
 const mixin = useCounterMixin();
 const { onSearchDataTable } = mixin;
@@ -15,6 +16,10 @@ const $q = useQuasar(); // show dialog
 const router = useRouter();
 const file = ref<boolean>(true);
 const filter = ref<string>(""); //search data table
+  const initialPagination = ref<Pagination>({
+  rowsPerPage: 0,
+  sortBy: "year",
+});
 const visibleColumns = ref<String[]>([
   "no",
   "year",
@@ -156,6 +161,7 @@ function onSearch() {
         :visible-columns="visibleColumns"
         v-model:inputfilter="filter"
         v-model:inputvisible="visibleColumns"
+        v-model:pagination="initialPagination"
         :nornmalData="false"
       >
         <template #columns="props">

src/modules/03_recruiting/views/01_compete/Period.vue

@@ -53,6 +53,7 @@ const rows = ref<ResponseRecruitPeriod[]>([]);
 const rowsData = ref<ResponseRecruitPeriod[]>([]);
 const initialPagination = ref<Pagination>({
   rowsPerPage: 0,
+  sortBy: "year",
 });
 const visibleColumns = ref<String[]>([
   "no",
@@ -99,6 +100,7 @@ const columns = ref<QTableProps["columns"]>([
     field: "year",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    sort: (a: number, b: number) => b - a,
   },
   {
     name: "examCount",

src/modules/03_recruiting/views/02_qualify/DisableDetail.vue

@@ -10,6 +10,8 @@ import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
 
 import type { RecruitDetailResponse } from "@/modules/03_recruiting/interface/response/Period";
+import type { Pagination } from "@/modules/03_recruiting/interface/index/Main";
+
 import Table from "@/modules/03_recruiting/components/Table.vue";
 import genReportXLSX from "@/plugins/genreportxlsx";
 
@@ -23,6 +25,10 @@ const { messageError, success, showLoader, hideLoader, onSearchDataTable } =
 const year = ref<string>("2566");
 const round = ref<string>("1");
 const name = ref<string>("");
+const initialPagination = ref<Pagination>({
+  rowsPerPage: 0,
+  sortBy: "examID",
+});
 
 const count = ref<number>(0);
 const pass = ref<number>(0);
@@ -410,6 +416,7 @@ onMounted(async () => {
         :columns="columns"
         v-model:filter="filter"
         :onSearch="onSearch"
+        :pagination="initialPagination"
         :visible-columns="visibleColumns"
         v-model:inputfilter="filter"
         v-model:inputvisible="visibleColumns"

src/modules/03_recruiting/views/02_qualify/DisablePeriod.vue

@@ -56,6 +56,7 @@ const textTittleScore = ref<string>("");
 const textTittleCandidate = ref<string>("");
 const initialPagination = ref<Pagination>({
   rowsPerPage: 0,
+  sortBy: "year",
 });
 const visibleColumns = ref<String[]>([
   "no",
@@ -105,6 +106,7 @@ const columns = ref<QTableProps["columns"]>([
     format(val, row) {
       return `${row.year + 543}`;
     },
+    sort: (a: number, b: number) => b - a,
   },
   {
     name: "examCount",
@@ -442,7 +444,7 @@ onMounted(async () => {
         :visible-columns="visibleColumns"
         v-model:inputfilter="filter"
         v-model:inputvisible="visibleColumns"
-        :pagination="initialPagination"
+        v-model:pagination="initialPagination"
         :nornmalData="true"
         :add="clickAdd"
         :paging="true"

src/modules/03_recruiting/views/02_qualify/Manage.vue

@@ -24,6 +24,7 @@ const rows = ref<ResponsePeriodExam[]>([]);
 const rowsData = ref<ResponsePeriodExam[]>([]);
 const initialPagination = ref<Pagination>({
   rowsPerPage: 0,
+  sortBy: "dateRegister",
 });
 const filter = ref<string>(""); //search data table
 const visibleColumns = ref<String[]>([
@@ -90,8 +91,6 @@ const columns = ref<QTableProps["columns"]>([
     field: "dateRegister",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "datePayment",
@@ -228,6 +227,7 @@ onMounted(async () => {
       :pagination="initialPagination"
       :nornmalData="true"
       :paging="true"
+      :sortBy="'dateRegister'"
       name="qualify"
     >
       <template #columns="props">

src/modules/03_recruiting/views/02_qualify/Period.vue

@@ -33,11 +33,12 @@ const {
   messageError,
   showLoader,
   hideLoader,
-  onSearchDataTable
+  onSearchDataTable,
 } = mixin;
 const filter = ref<string>(""); //search data table
 const initialPagination = ref<Pagination>({
   rowsPerPage: 0,
+  sortBy: "dateRegister",
 });
 const examData = ref<ResponsePeriodExam[]>([]);
 const examDataData = ref<ResponsePeriodExam[]>([]);