แก้ฟิลเตอร์ระบบ บรรจุ

src/modules/05_placement/components/PersonalDetail/Information/Certicate.vue

@@ -52,7 +52,7 @@ const mixin = useCounterMixin();
 const {
   date2Thai,
   success,
-
+  onSearchDataTable,
   messageError,
   showLoader,
   hideLoader,
@@ -82,6 +82,7 @@ const modalHistory = ref<boolean>(false); //modal ประวัติการ
 
 const profileId = ref<string>("");
 const rows = ref<Certificate[]>([]);
+const rowsData = ref<Certificate[]>([]);
 const filter = ref<string>(""); //search data table
 const visibleColumns = ref<String[]>([]);
 profileData.certicate.columns.length == 0
@@ -333,6 +334,7 @@ const saveData = async () => {
       await props.fetch("Certificate");
       await success($q, "บันทึกข้อมูลสำเร็จ");
       rows.value = props.data;
+      rowsData.value = props.data;
       modal.value = false;
     })
     .catch((e) => {
@@ -359,6 +361,7 @@ const editData = async () => {
       await props.fetch("Certificate");
       await success($q, "บันทึกข้อมูลสำเร็จ");
       rows.value = props.data;
+      rowsData.value = props.data;
       modal.value = false;
     })
     .catch((e) => {
@@ -384,6 +387,7 @@ const clickDelete = async () => {
         await props.fetch("Certificate");
         await success($q, "ลบข้อมูลสำเร็จ");
         rows.value = props.data;
+        rowsData.value = props.data;
         modal.value = false;
       })
       .catch((e) => {
@@ -488,6 +492,14 @@ const getClass = (val: boolean) => {
   };
 };
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filter.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 watch(visibleColumns, async (count: String[], prevCount: String[]) => {
   changeProfileColumns("certicate", count);
 });
@@ -497,6 +509,7 @@ onMounted(() => {
     profileId.value = route.params.personalId.toString();
   }
   rows.value = props.data;
+  rowsData.value = props.data;
 });
 </script>
 <template>
@@ -505,7 +518,7 @@ onMounted(() => {
       <ProfileTable
         :rows="rows"
         :columns="columns"
-        :filter="filter"
+        :on-search="onSearch"
         :visible-columns="visibleColumns"
         v-model:inputfilter="filter"
         v-model:inputvisible="visibleColumns"

src/modules/05_placement/components/PersonalDetail/Information/Education.vue

@@ -31,6 +31,7 @@ const mixin = useCounterMixin();
 const {
   success,
   dateToISO,
+  onSearchDataTable,
   date2Thai,
   messageError,
   showLoader,
@@ -95,6 +96,7 @@ const editRow = ref<boolean>(false); //เช็คมีการแก้ไ
 const checkValidate = ref<boolean>(false); //validate data ผ่านหรือไม่
 
 const rows = ref<Education[]>(props.data);
+const rowsData = ref<Education[]>(props.data);
 const filter = ref<string>(""); //search data table
 const visibleColumns = ref<String[]>([]);
 
@@ -456,6 +458,7 @@ const saveData = async () => {
     .then(async () => {
       await props.fetch("Education");
       rows.value = props.data;
+      rowsData.value = props.data;
       success($q, "บันทึกข้อมูลสำเร็จ");
       modal.value = false;
     })
@@ -501,6 +504,7 @@ const editData = async () => {
       await props.fetch("Education");
       success($q, "บันทึกข้อมูลสำเร็จ");
       rows.value = props.data;
+      rowsData.value = props.data;
       modal.value = false;
     })
     .catch((e) => {
@@ -524,6 +528,7 @@ const clickDelete = async () => {
         await success($q, "ลบข้อมูลสำเร็จ");
         modal.value = false;
         rows.value = props.data;
+        rowsData.value = props.data;
       })
       .catch((e) => {
         messageError($q, e);
@@ -669,6 +674,14 @@ const getClass = (val: boolean) => {
   };
 };
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filter.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 watch(startDate, (count, prevCount) => {
   minDate.value = new Date(`${startDate.value}-01-01`);
 });
@@ -691,8 +704,8 @@ onMounted(async () => {
     <q-form ref="myForm">
       <ProfileTable
         :rows="rows"
+        :on-search="onSearch"
         :columns="columns"
-        :filter="filter"
         :visible-columns="visibleColumns"
         v-model:inputfilter="filter"
         v-model:inputvisible="visibleColumns"

src/modules/05_placement/components/PersonalDetail/Information/TableEducation.vue

@@ -11,9 +11,10 @@ const initialPagination = ref<Pagination>({
   rowsPerPage: 0,
 });
 
+const inputfilter = defineModel<string>("inputfilter", { required: true });
 const props = defineProps({
-  inputfilter: String,
   name: String,
+  onSearch: Function,
   icon: String,
   inputvisible: Array,
   editvisible: Boolean,
@@ -99,22 +100,16 @@ const resetFilter = () => {
       <q-input
         standout
         dense
-        :model-value="inputfilter"
+        v-model="inputfilter"
         ref="filterRef"
-        @update:model-value="updateInput"
         outlined
         placeholder="ค้นหา"
         style="max-width: 200px"
         class="q-ml-sm"
+        @keydown.enter="props.onSearch?.()"
       >
         <template v-slot:append>
-          <q-icon v-if="inputfilter == ''" name="search" />
-          <q-icon
-            v-if="inputfilter !== ''"
-            name="clear"
-            class="cursor-pointer"
-            @click="resetFilter"
-          />
+          <q-icon name="search" />
         </template>
       </q-input>
       <!-- แสดงคอลัมน์ใน table -->