From 3210bbf68734d6bccf1e784ce7b1e9cbbc99e320 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Fri, 17 Oct 2025 10:02:24 +0700
Subject: [PATCH] fix:filter examResult

---
 .../03_recruiting/components/Table.vue        |  33 ++++-
 .../03_recruiting/views/01_compete/Detail.vue | 120 ++++--------------
 .../views/02_qualify/DisableDetail.vue        |  72 ++++-------
 3 files changed, 82 insertions(+), 143 deletions(-)

diff --git a/src/modules/03_recruiting/components/Table.vue b/src/modules/03_recruiting/components/Table.vue
index 7c7f200c8..847679f5c 100644
--- a/src/modules/03_recruiting/components/Table.vue
+++ b/src/modules/03_recruiting/components/Table.vue
@@ -7,7 +7,11 @@ const attrs = ref<any>(useAttrs());
 const table = ref<any>(null);
 const filterRef = ref<any>(null);
 
-const filter = defineModel<string>("filter", { required: true });
+const filter = defineModel<string>("filter", { required: false });
+const examResult = defineModel<string>("examResult", {
+  required: false,
+  default: "",
+});
 const pagination = defineModel<Pagination>("pagination", { required: true });
 
 const props = defineProps({
@@ -44,6 +48,13 @@ const props = defineProps({
   },
 });
 
+const optionsStatus = ref<any[]>([
+  { label: "ทั้งหมด", value: "" },
+  { label: "ขส.", value: "missed_exam" },
+  { label: "ผ่าน", value: "pass" },
+  { label: "ไม่ผ่าน", value: "notpass" },
+]);
+
 const emit = defineEmits([
   "update:inputfilter",
   "update:inputvisible",
@@ -92,6 +103,7 @@ watch(
   }
 );
 </script>
+
 <template>
   <div class="q-pb-sm row q-col-gutter-sm">
     <div
@@ -134,7 +146,6 @@ watch(
           />
         </div>
       </q-card>
-
       <q-card bordered flat class="q-px-md no-wrap row">
         <div class="col-12 text-subtitle2 row items-center">
           <span class="text-weight-medium text-dark">สอบไม่ผ่าน</span>
@@ -184,6 +195,24 @@ watch(
     </div>
     <q-space />
     <div class="items-center q-gutter-sm" style="display: flex">
+      <q-select
+        v-if="conclude"
+        dense
+        outlined
+        :options="optionsStatus"
+        option-value="value"
+        option-label="label"
+        label="ผลการสอบ"
+        map-options
+        emit-value
+        style="min-width: 140px"
+        :clearable="examResult !== ''"
+        @clear="examResult = ''"
+        v-model="examResult"
+        @update:model-value="
+          nornmalData ? props.onSearch?.() : getList('enter')
+        "
+      />
       <!-- ค้นหาข้อความใน table -->
       <q-input
         standout
diff --git a/src/modules/03_recruiting/views/01_compete/Detail.vue b/src/modules/03_recruiting/views/01_compete/Detail.vue
index 903288539..703aa73a1 100644
--- a/src/modules/03_recruiting/views/01_compete/Detail.vue
+++ b/src/modules/03_recruiting/views/01_compete/Detail.vue
@@ -42,6 +42,7 @@ const rows = ref<any[]>([]);
 const rowsData = ref<any[]>([]);
 const importId = ref<string>(route.params.id as string); // Period Import Id
 const filter = ref<string>(""); //search data table
+const examResult = ref<string>(""); // สถานะการสอบ
 const visibleColumns = ref<String[]>([
   "examID",
   "profileID",
@@ -60,7 +61,7 @@ const visibleColumns = ref<String[]>([
   "examAttribute",
   "examScore",
   "examResult",
-  "exam_order",
+  "number",
   "applyDate",
 ]);
 const columns = ref<QTableProps["columns"]>([
@@ -68,21 +69,16 @@ const columns = ref<QTableProps["columns"]>([
     name: "examID",
     align: "left",
     label: "เลขประจำตัวสอบ",
-    sortable: true,
+    sortable: false,
     field: "examID",
     headerStyle: "font-size: 14px; min-width: 20px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "profileID",
     align: "left",
     label: "เลขประจำตัวประชาชน",
-    sortable: true,
+    sortable: false,
     field: "profileID",
     headerStyle: "font-size: 14px; min-width: 20px",
     style: "font-size: 14px; ",
@@ -91,7 +87,7 @@ const columns = ref<QTableProps["columns"]>([
     name: "fullName",
     align: "left",
     label: "ชื่อ-นามสกุล",
-    sortable: true,
+    sortable: false,
     field: "personName",
     headerStyle: "font-size: 14px; min-width: 250px",
     style: "font-size: 14px; ",
@@ -100,7 +96,7 @@ const columns = ref<QTableProps["columns"]>([
     name: "hddPosition",
     align: "left",
     label: "บัญชีสอบ",
-    sortable: true,
+    sortable: false,
     field: "hddPosition",
     headerStyle: "font-size: 14px; min-width: 250px",
     style: "font-size: 14px; ",
@@ -109,161 +105,106 @@ const columns = ref<QTableProps["columns"]>([
     name: "dateOfBirth",
     align: "left",
     label: "วัน เดือน ปีเกิด",
-    sortable: true,
+    sortable: false,
     field: "dateOfBirth",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "gender",
     align: "left",
     label: "เพศ",
-    sortable: true,
+    sortable: false,
     field: "gender",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "position_name",
     align: "left",
     label: "ตำแหน่งที่สมัคร",
-    sortable: true,
+    sortable: false,
     field: "position_name",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "position_type",
     align: "left",
     label: "ประเภทที่สมัคร",
-    sortable: true,
+    sortable: false,
     field: "position_type",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "position_level",
     align: "left",
     label: "ระดับที่สมัคร",
-    sortable: true,
+    sortable: false,
     field: "position_level",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "university",
     align: "left",
     label: "สถานศึกษา",
-    sortable: true,
+    sortable: false,
     field: "university",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "degree",
     align: "left",
     label: "วุฒิการศึกษา",
-    sortable: true,
+    sortable: false,
     field: "degree",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "major",
     align: "left",
     label: "สาขาวิชาเอก",
-    sortable: true,
+    sortable: false,
     field: "major",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "certificateNo",
     align: "left",
     label: "เลขที่ใบประกอบวิชาชีพ",
-    sortable: true,
+    sortable: false,
     field: "certificateNo",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "certificateIssueDate",
     align: "left",
     label: "วันที่ได้รับใบประกอบวิชาชีพฯ",
-    sortable: true,
+    sortable: false,
     field: "certificateIssueDate",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "examAttribute",
     align: "left",
     label: "สถานะการคัดกรองคุณสมบัติ",
-    sortable: true,
+    sortable: false,
     field: "examAttribute",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
     name: "examScore",
     align: "left",
     label: "คะแนนรวม",
-    sortable: true,
+    sortable: false,
     field: "examScore",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
@@ -276,18 +217,13 @@ const columns = ref<QTableProps["columns"]>([
     field: "examResult",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
   {
-    name: "exam_order",
+    name: "number",
     align: "center",
     label: "ลำดับที่สอบได้",
-    sortable: true,
-    field: "exam_order",
+    sortable: false,
+    field: "number",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
@@ -295,15 +231,10 @@ const columns = ref<QTableProps["columns"]>([
     name: "applyDate",
     align: "left",
     label: "วันที่สมัครสอบ",
-    sortable: true,
+    sortable: false,
     field: "applyDate",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, {
-        numeric: true,
-        sensitivity: "base",
-      }),
   },
 ]);
 const modalCandidates = ref(false); // dialog บรรจุผู้ผ่านการสอบแข่งขัน
@@ -369,7 +300,7 @@ async function fetchData() {
     .post(config.API.getExamResultById(importId.value), {
       examAttribute: "",
       keyword: filter.value,
-      examResult: "",
+      examResult: examResult.value ? examResult.value : "",
       page: initialPagination.value.page,
       pageSize: initialPagination.value.rowsPerPage,
     })
@@ -535,6 +466,7 @@ onMounted(async () => {
         v-model:totalList="totalList"
         v-model:total="total"
         v-model:pagination="initialPagination"
+        v-model:exam-result="examResult"
         :nornmalData="false"
         :conclude="true"
         :fetchData="fetchData"
@@ -582,8 +514,8 @@ onMounted(async () => {
               <div v-else-if="col.name == 'c5'">
                 <q-checkbox disable v-model="props.row.c5" />
               </div>
-              <div v-else-if="col.name == 'exam_order'">
-                {{ col.value ? col.value : " " }}
+              <div v-else-if="col.name == 'number'">
+                {{ col.value ? col.value : "" }}
               </div>
               <div v-else>
                 {{ col.value ? col.value : "-" }}
diff --git a/src/modules/03_recruiting/views/02_qualify/DisableDetail.vue b/src/modules/03_recruiting/views/02_qualify/DisableDetail.vue
index 04ea13ceb..10aeb9776 100644
--- a/src/modules/03_recruiting/views/02_qualify/DisableDetail.vue
+++ b/src/modules/03_recruiting/views/02_qualify/DisableDetail.vue
@@ -43,6 +43,7 @@ const totalList = ref<number>(0);
 const importId = ref<string>(route.params.id as string); // Period Import Id
 
 const filter = ref<string>(""); //search data table
+const examResult = ref<string>(""); // กรองผลการสอบ
 const visibleColumns = ref<String[]>([
   "examID",
   "profileID",
@@ -59,7 +60,7 @@ const visibleColumns = ref<String[]>([
   "examAttribute",
   "examScore",
   "examResult",
-  "exam_order",
+  "number",
   "applyDate",
 ]);
 const columns = ref<QTableProps["columns"]>([
@@ -67,18 +68,16 @@ const columns = ref<QTableProps["columns"]>([
     name: "examID",
     align: "left",
     label: "เลขประจำตัวสอบ",
-    sortable: true,
+    sortable: false,
     field: "examID",
     headerStyle: "font-size: 14px; min-width: 20px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "profileID",
     align: "left",
     label: "เลขประจำตัวประชาชน",
-    sortable: true,
+    sortable: false,
     field: "profileID",
     headerStyle: "font-size: 14px; min-width: 20px",
     style: "font-size: 14px; ",
@@ -87,7 +86,7 @@ const columns = ref<QTableProps["columns"]>([
     name: "fullName",
     align: "left",
     label: "ชื่อ-นามสกุล",
-    sortable: true,
+    sortable: false,
     field: "personName",
     headerStyle: "font-size: 14px; min-width: 250px",
     style: "font-size: 14px; ",
@@ -96,7 +95,7 @@ const columns = ref<QTableProps["columns"]>([
     name: "hddPosition",
     align: "left",
     label: "บัญชีสอบ",
-    sortable: true,
+    sortable: false,
     field: "hddPosition",
     headerStyle: "font-size: 14px; min-width: 250px",
     style: "font-size: 14px; ",
@@ -105,106 +104,88 @@ const columns = ref<QTableProps["columns"]>([
     name: "dateOfBirth",
     align: "left",
     label: "วัน เดือน ปีเกิด",
-    sortable: true,
+    sortable: false,
     field: "dateOfBirth",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "gender",
     align: "left",
     label: "เพศ",
-    sortable: true,
+    sortable: false,
     field: "gender",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "position_name",
     align: "left",
     label: "ตำแหน่งที่สมัคร",
-    sortable: true,
+    sortable: false,
     field: "position_name",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "university",
     align: "left",
     label: "สถานศึกษา",
-    sortable: true,
+    sortable: false,
     field: "university",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "degree",
     align: "left",
     label: "วุฒิการศึกษา",
-    sortable: true,
+    sortable: false,
     field: "degree",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "major",
     align: "left",
     label: "สาขาวิชาเอก",
-    sortable: true,
+    sortable: false,
     field: "major",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "certificateNo",
     align: "left",
     label: "เลขที่ใบประกอบวิชาชีพ",
-    sortable: true,
+    sortable: false,
     field: "certificateNo",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "certificateIssueDate",
     align: "left",
     label: "วันที่ได้รับใบประกอบวิชาชีพฯ",
-    sortable: true,
+    sortable: false,
     field: "certificateIssueDate",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "examAttribute",
     align: "left",
     label: "สถานะการคัดกรองคุณสมบัติ",
-    sortable: true,
+    sortable: false,
     field: "examAttribute",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "examScore",
     align: "left",
     label: "คะแนนรวม",
-    sortable: true,
+    sortable: false,
     field: "examScore",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
@@ -213,19 +194,17 @@ const columns = ref<QTableProps["columns"]>([
     name: "examResult",
     align: "left",
     label: "ผลการสอบ",
-    sortable: true,
+    sortable: false,
     field: "examResult",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "exam_order",
+    name: "number",
     align: "center",
     label: "ลำดับที่สอบได้",
-    sortable: true,
-    field: "exam_order",
+    sortable: false,
+    field: "number",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
@@ -233,12 +212,10 @@ const columns = ref<QTableProps["columns"]>([
     name: "applyDate",
     align: "left",
     label: "วันที่สมัครสอบ",
-    sortable: true,
+    sortable: false,
     field: "applyDate",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
 ]);
 const rows = ref<RecruitDetailResponse[]>([]);
@@ -310,7 +287,7 @@ async function fetchData() {
     .post(config.API.getDisableExamResultById(importId.value), {
       examAttribute: "",
       keyword: filter.value,
-      examResult: "",
+      examResult: examResult.value ? examResult.value : "",
       page: initialPagination.value.page,
       pageSize: initialPagination.value.rowsPerPage,
     })
@@ -469,6 +446,7 @@ onMounted(async () => {
         v-model:inputfilter="filter"
         v-model:total="total"
         v-model:inputvisible="visibleColumns"
+        v-model:exam-result="examResult"
         :nornmalData="false"
         :conclude="true"
         :fetchData="fetchData"
@@ -516,8 +494,8 @@ onMounted(async () => {
               <div v-else-if="col.name == 'c5'">
                 <q-checkbox disable v-model="props.row.c5" />
               </div>
-              <div v-else-if="col.name == 'exam_order'">
-                {{ col.value ? col.value : " " }}
+              <div v-else-if="col.name == 'number'">
+                {{ col.value ? col.value : "" }}
               </div>
               <div v-else>
                 {{ col.value ? col.value : "-" }}