ฟิลเตอร์ วินัย/การลา

src/modules/11_discipline/components/3_InvestigateDisciplinary/Form.vue

@@ -40,7 +40,7 @@ import type { OptionData } from "@/modules/07_insignia/interface/index/Main";
 
 const modalPersonal = ref<boolean>(false);
 const personId = ref<string>("");
-const isSaveInfo = defineModel<boolean>('isSaveInfo')
+const isSaveInfo = defineModel<boolean>("isSaveInfo");
 const calendarModal = ref<boolean>(false);
 const calendarModalclose = () => (calendarModal.value = !calendarModal.value);
 const modalPopup = ref<boolean>(false);
@@ -211,7 +211,7 @@ function onSubmit() {
 
     emit("submit:disciplinary", formData);
     isSave.value = false;
-    isSaveInfo.value = false
+    isSaveInfo.value = false;
     extendStatus.value = false;
   });
 }
@@ -233,7 +233,7 @@ async function fetchDatadetail() {
     if (countNum.value === 1) {
       isReadonly.value = props.data.status != "NEW" ?? true;
       isSave.value = false;
-      isSaveInfo.value = false
+      isSaveInfo.value = false;
       formData.respondentType = props.data.respondentType;
       formData.organizationId = props.data.organizationId;
       formData.organization = props.data.organization;
@@ -525,7 +525,7 @@ async function selectComplainant(val: string) {
 /** ฟังก์ชั่นเช็คการแก้ไขฟอร์มแล้วไม่ได้กดบันทึก */
 function changeFormData() {
   isSave.value = true;
-  isSaveInfo.value = true
+  isSaveInfo.value = true;
   if (formData.disciplinaryFaultLevel !== "อื่นๆ") {
     formData.disciplinaryFaultLevelOther = "";
   }
@@ -539,7 +539,7 @@ function changeFormData() {
 /** เช็ควันที่สิ้นสุดต้องมากกว่า หรือเท่ากับวันเริ่ม */
 function changeFormDataDate() {
   isSave.value = true;
-  isSaveInfo.value = true
+  isSaveInfo.value = true;
   const startDate = new Date(formData.disciplinaryDateStart as Date);
   const endDate = new Date(formData.disciplinaryDateEnd as Date);
 
@@ -678,6 +678,21 @@ function deletePerson(id: string) {
   mainStore.rowsAdd = updatedRows;
 }
 
+
+const option = ref<any[]>(mainStore.statusResultOptions);
+/**
+ * function ค้นหาข้อมูลใน option
+ * @param val คำค้นหา
+ * @param update function
+ */
+ function filterOptionFn(val: string, update: Function) {
+  update(() => {
+    option.value = mainStore.statusResultOptions.filter(
+      (e: any) => e.name.search(val) !== -1
+    );
+  });
+}
+
 /** Hook */
 onMounted(async () => {
   mainStore.rowsAdd = [];
@@ -1468,7 +1483,7 @@ onMounted(async () => {
                               {{ props.rowIndex + 1 }}
                             </div>
                             <div v-else class="table_ellipsis2">
-                              {{ col.value?col.value:'-' }}
+                              {{ col.value ? col.value : "-" }}
                             </div>
                           </q-td>
                           <q-td class="text-right">
@@ -1675,7 +1690,7 @@ onMounted(async () => {
                         :readonly="isReadonly"
                         ref="disciplinaryStatusResultRef"
                         v-model="formData.disciplinaryStatusResult"
-                        :options="mainStore.statusResultOptions"
+                        :options="option"
                         label="ผลการสอบสวน"
                         emit-value
                         hide-bottom-space
@@ -1683,9 +1698,7 @@ onMounted(async () => {
                         option-label="name"
                         option-value="id"
                         use-input
-                        @filter="(inputValue: any,
-                doneFn: Function) => investigateDis.filterFnOptionsType(inputValue, doneFn, 'offenseDetailsOps'
-                )"
+                        @filter="filterOptionFn"
                         @update:model-value="changeFormData()"
                         ><template v-slot:no-option>
                           <q-item>

src/modules/11_discipline/components/3_InvestigateDisciplinary/Table.vue

@@ -10,7 +10,7 @@ const attrs = ref<any>(useAttrs());
 const paging = ref<boolean>(true);
 const currentPage = ref<number>(1);
 const statusFilter = ref<string>("NEW");
-
+const option = ref<any[]>(dataInvestigateDis.statusOptions);
 /** รับ props มาจากหน้าหลัก */
 const props = defineProps({
   count: Number,
@@ -128,6 +128,20 @@ function dataUpdate() {
 function filterFn() {
   props.fetchListDisciplinary?.();
 }
+
+/**
+ * function ค้นหาข้อมูลใน option
+ * @param val คำค้นหา
+ * @param update function
+ */
+function filterOptionFn(val: string, update: Function) {
+  statusFilter.value = "";
+  update(() => {
+    option.value = dataInvestigateDis.statusOptions.filter(
+      (e: any) => e.name.search(val) !== -1
+    );
+  });
+}
 </script>
 
 <template>
@@ -142,16 +156,24 @@ function filterFn() {
         map-options
         option-label="name"
         option-value="id"
-        :options="dataInvestigateDis.statusOptions"
+        :options="option"
         @update:model-value="dataUpdate"
+        use-input
+        @filter="filterOptionFn"
       >
+        <template v-slot:no-option>
+          <q-item>
+            <q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
+          </q-item>
+        </template>
         <template v-if="statusFilter !== 'ALL'" v-slot:append>
           <q-icon
             name="cancel"
-            @click.stop.prevent="(statusFilter = 'ALL'), dataUpdate()"
+            @click.stop.prevent="(option = dataInvestigateDis.statusOptions),(statusFilter = 'ALL'), dataUpdate()"
             class="cursor-pointer"
           />
         </template>
+
       </q-select>
     </div>
     <q-space />