แก้ฟิลเตอร์ จากล่างขึ้นบนถึง พ้นราชการ

src/modules/06_retirement/components/01_retirement/RetirementDetail.vue

@@ -31,6 +31,7 @@ const {
   date2Thai,
   dateToISO,
   findOrgName,
+  onSearchDataTable,
 } = mixin;
 const myForm = ref<QForm | null>(null);
 
@@ -120,6 +121,7 @@ const columns = ref<any["columns"]>([
   },
 ]);
 const rows = ref<RetirementList[]>([]);
+const rowsData = ref<RetirementList[]>([]);
 const visibleColumns = ref<string[]>([
   "order",
   "name",
@@ -157,7 +159,7 @@ async function fetchlistprofile(id: string) {
 
       // รายชื่อผู้เกษียณอายุราชการ
       if (data.profile !== null) {
-        rows.value = data.profile.map((e: any) => ({
+        const listData = data.profile.map((e: any) => ({
           id: e.id,
           profileId: e.profileId,
           order: e.order,
@@ -183,6 +185,8 @@ async function fetchlistprofile(id: string) {
           child4: e.child4,
           child4Id: e.child4Id,
         }));
+        rows.value = listData;
+        rowsData.value = listData;
       }
 
       if (statusReport.value == false) {
@@ -407,6 +411,14 @@ function updatemodalPersonal(modal: boolean) {
   modalPersonal.value = modal;
 }
 
+async function onSearch() {
+  rows.value = onSearchDataTable(
+    filter.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /** Hook */
 onMounted(async () => {
   retireld.value = retireld_params.toString();
@@ -517,6 +529,7 @@ onMounted(async () => {
               placeholder="ค้นหา"
               style="max-width: 200px"
               class="q-ml-sm"
+              @keydown.enter="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
@@ -549,7 +562,6 @@ onMounted(async () => {
           :rows="rows"
           :columns="columns"
           row-key="order"
-          :filter="filter.trim()"
           :visible-columns="visibleColumns"
           no-data-label="ไม่มีข้อมูล"
           :pagination-label="paginationLabel"

src/modules/06_retirement/components/02_resign/Table.vue

@@ -23,10 +23,11 @@ const stroeResign = useDataStore();
 const { statusText } = stroe;
 const router = useRouter();
 const mixin = useCounterMixin();
-const { messageError, date2Thai, showLoader, hideLoader } = mixin;
+const { messageError, date2Thai, showLoader, hideLoader,onSearchDataTable } = mixin;
 
 /** Table */
 const rows = ref<ResponseItems[]>([]);
+const rowsData = ref<ResponseItems[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -196,6 +197,7 @@ async function fecthlist() {
     .then(async (res) => {
       const data = await res.data.result;
       rows.value = data;
+      rowsData.value = data;
     })
     .catch((e) => {
       messageError($q, e);
@@ -223,6 +225,14 @@ function onRedirectToDetail(type: string, id: string) {
   router.push(`/retirement/${type}${test}/${id}`);
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /**Hook */
 onMounted(async () => {
   status.value = stroeResign.formQurey.status;
@@ -283,6 +293,7 @@ onMounted(async () => {
             outlined
             debounce="300"
             placeholder="ค้นหา"
+            @keydown.enter="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
@@ -309,7 +320,6 @@ onMounted(async () => {
         <d-table
           :columns="columns"
           :rows="rows"
-          :filter="filterKeyword.trim()"
           row-key="id"
           :visible-columns="visibleColumns"
           v-model:pagination="pagination"

src/modules/06_retirement/components/03_resignEmp/Table.vue

@@ -23,10 +23,11 @@ const stroeResign = useDataStore();
 const { statusText } = stroe;
 const router = useRouter();
 const mixin = useCounterMixin();
-const { messageError, date2Thai, showLoader, hideLoader } = mixin;
+const { messageError, date2Thai, showLoader, hideLoader,onSearchDataTable } = mixin;
 
 /** Table */
 const rows = ref<ResponseItems[]>([]);
+const rowsData = ref<ResponseItems[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -195,6 +196,7 @@ async function fecthlist() {
     .then(async (res) => {
       const data = await res.data.result;
       rows.value = data;
+      rowsData.value = data;
     })
     .catch((e) => {
       messageError($q, e);
@@ -223,6 +225,14 @@ function onRedirectToDetail(type: string, id: string) {
   router.push(`/retirement/${type}${test}/${id}`);
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /**Hook */
 onMounted(async () => {
   statusEMP.value = stroeResign.formQureyEMP.status;
@@ -284,15 +294,10 @@ onMounted(async () => {
             outlined
             debounce="300"
             placeholder="ค้นหา"
+            @keydown.enter="onSearch"
           >
             <template v-slot:append>
-              <q-icon v-if="filterKeyword == ''" name="search" />
+              <q-icon name="search" />
-              <q-icon
-                v-if="filterKeyword !== ''"
-                name="clear"
-                class="cursor-pointer"
-                @click="filterKeyword = ''"
-              />
             </template>
           </q-input>
 
@@ -316,7 +321,6 @@ onMounted(async () => {
         <d-table
           :columns="columns"
           :rows="rows"
-          :filter="filterKeyword.trim()"
           row-key="id"
           :visible-columns="visibleColumns"
           v-model:pagination="pagination"

src/modules/06_retirement/components/06_dismissOrder/DialogSendToCommand.vue

@@ -9,10 +9,22 @@ import { useCounterMixin } from "@/stores/mixin";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 
 import type { ResponseItems } from "@/modules/06_retirement/interface/response/Main";
+import type { ResponseData } from "@/modules/06_retirement/interface/response/out";
 
 import DialogCreateCommand from "@/modules/18_command/components/DialogCreateCommand.vue";
 import DialogHeader from "@/components/DialogHeader.vue";
 
+/** props*/
+const props = defineProps({
+  closeModal: Function,
+  fecthlistRecevice: Function,
+});
+
+const modal = defineModel<boolean>("modal", { required: true });
+const rows = defineModel<ResponseData[]>("rows", { required: true });
+const rowsData = defineModel<ResponseData[]>("rowsData", { required: true });
+const filterKeyword = defineModel<string>("filterKeyword2", { required: true });
+
 /** use */
 const $q = useQuasar();
 const { statusText } = useTransferDataStore();
@@ -36,10 +48,11 @@ const {
   dialogConfirm,
   hideLoader,
   date2Thai,
+  onSearchDataTable,
 } = mixin;
 
 /** คอลัมน์ */
-const columns2 = ref<QTableProps["columns"]>([
+const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
     align: "left",
@@ -112,7 +125,7 @@ const columns2 = ref<QTableProps["columns"]>([
   },
 ]);
 /** คอลัมน์ที่แสดง */
-const visibleColumns2 = ref<string[]>([
+const visibleColumns = ref<string[]>([
   "no",
   "fullname",
   "positionLevel",
@@ -121,15 +134,6 @@ const visibleColumns2 = ref<string[]>([
   "status",
 ]);
 
-/** props*/
-const props = defineProps({
-  modal: Boolean,
-  closeModal: Function,
-  fecthlistRecevice: Function,
-  rows2: Array,
-  filterKeyword2: String,
-});
-
 const modalCommand = ref<boolean>(false);
 
 /**
@@ -164,15 +168,23 @@ function Reset() {
   emit("update:filterKeyword2", "");
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 watchEffect(() => {
-  if (props.modal === true) {
+  if (modal.value === true) {
     selected.value = [];
     updateInput("");
   }
 });
 </script>
 <template>
-  <q-dialog v-model="props.modal" persistent>
+  <q-dialog v-model="modal" persistent>
     <q-card style="width: 1200px; max-width: 80vw">
       <DialogHeader tittle="ส่งไปออกคำสั่งให้ออก" :close="closeModal" />
       <q-separator />
@@ -185,16 +197,16 @@ watchEffect(() => {
               outlined
               dense
               debounce="300"
-              :model-value="filterKeyword2"
+              v-model="filterKeyword"
-              @update:model-value="updateInput"
               placeholder="ค้นหา"
+              @keydown.enter="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
               </template>
             </q-input>
             <q-select
-              v-model="visibleColumns2"
+              v-model="visibleColumns"
               multiple
               outlined
               dense
@@ -202,7 +214,7 @@ watchEffect(() => {
               :display-value="$q.lang.table.columns"
               emit-value
               map-options
-              :options="columns2"
+              :options="columns"
               option-value="name"
               style="min-width: 140px"
               class="gt-xs q-ml-sm"
@@ -211,11 +223,10 @@ watchEffect(() => {
 
           <div class="col-12">
             <d-table
-              :columns="columns2"
+              :columns="columns"
-              :rows="rows2"
+              :rows="rows"
-              :filter="filterKeyword2?.trim()"
               row-key="id"
-              :visible-columns="visibleColumns2"
+              :visible-columns="visibleColumns"
               selection="multiple"
               v-model:selected="selected"
             >

src/modules/06_retirement/views/01_retirement.vue

@@ -21,7 +21,8 @@ const mixin = useCounterMixin();
 const useStoreRetire = useDataStoreRetirement();
 const { tab, type } = storeToRefs(useDataStoreRetirement());
 const { clickTab } = useStoreRetire;
-const { messageError, date2Thai, showLoader, hideLoader } = mixin;
+const { messageError, date2Thai, showLoader, hideLoader, onSearchDataTable } =
+  mixin;
 
 const fiscalyear = ref<number>(); // ปี
 const yearOptionsFilter = ref<any>({
@@ -91,6 +92,7 @@ const columns = ref<QTableProps["columns"]>([
 // ข้อมูลตาราง (จำลอง)
 const currentYear = new Date().getFullYear();
 const rows = ref<resMain[]>([]);
+const rowsData = ref<resMain[]>([]);
 const yearOptions = ref<any>([{ id: "", year: "ทั้งหมด" }]);
 
 // ประกาศเกษียณอายุราชการ
@@ -101,7 +103,7 @@ async function fetchRetirement(type: string, year: any) {
     .get(config.API.retirement(type, year))
     .then((res) => {
       let data = res.data.result;
-      rows.value = data.map((items: any) => ({
+      const listData = data.map((items: any) => ({
         id: items.id,
         signDate: date2Thai(items.signDate) ?? "-",
         Date: date2Thai(items.createdAt),
@@ -113,6 +115,9 @@ async function fetchRetirement(type: string, year: any) {
         json: items.json,
         document: items.document,
       }));
+      rows.value = listData;
+      rowsData.value = listData;
+
       let option: any[] = [];
       data.map((items: any) => {
         option.push({
@@ -215,6 +220,14 @@ function typeReportChangeName(val: string) {
   }
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 watch(type, () => {
   fetchRetirement(type.value, currentYear);
 });
@@ -309,6 +322,7 @@ onMounted(async () => {
                 outlined
                 debounce="300"
                 placeholder="ค้นหา"
+                @keydown.enter="onSearch"
               >
                 <template v-slot:append>
                   <q-icon name="search" />
@@ -336,7 +350,6 @@ onMounted(async () => {
               ref="table"
               :columns="columns"
               :rows="rows"
-              :filter="filterKeyword.trim()"
               row-key="name"
               flat
               bordered

src/modules/06_retirement/views/04_exitInterview.vue

@@ -26,10 +26,12 @@ const {
   hideLoader,
   success,
   dialogConfirm,
+  onSearchDataTable
 } = mixin;
 
 /** คอลัมน์ */
 const rows = ref<ResponseItems[]>([]);
+const rowsData = ref<ResponseItems[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -186,6 +188,7 @@ async function fecthlist() {
         });
       });
       rows.value = list;
+      rowsData.value = list;
       console.log(rows.value);
 
       filters.value = list;
@@ -279,6 +282,14 @@ function openModalCalendar(rows: any) {
   daterow.value = convertThaiDateToNumeric(rows.datetext);
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /** HOOK */
 onMounted(async () => {
   await fecthlist();
@@ -319,6 +330,7 @@ onMounted(async () => {
               outlined
               debounce="300"
               placeholder="ค้นหา"
+              @keydown.enter="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
@@ -344,7 +356,6 @@ onMounted(async () => {
           <d-table
             :columns="columns"
             :rows="rows"
-            :filter="filterKeyword.trim()"
             row-key="id"
             :visible-columns="visibleColumns"
           >

src/modules/06_retirement/views/05_deceased.vue

@@ -13,10 +13,11 @@ import { checkPermission } from "@/utils/permissions";
 const $q = useQuasar();
 const router = useRouter();
 const mixin = useCounterMixin();
-const { showLoader, hideLoader, messageError, date2Thai, findOrgName } = mixin;
+const { showLoader, hideLoader, messageError, date2Thai, findOrgName ,onSearchDataTable} = mixin;
 
 /** คอลัมน์ */
 const rows = ref<any[]>([]);
+const rowsData = ref<any[]>([]);
 const pagination = ref({
   sortBy: "createdAt",
   descending: true,
@@ -118,6 +119,7 @@ async function fectListDecased() {
     .then((res) => {
       const data = res.data.result;
       rows.value = data;
+      rowsData.value = data;
     })
     .catch((e) => {
       messageError($q, e);
@@ -135,6 +137,14 @@ function nextPage(id: string) {
   router.push("/retirement/deceased/" + id);
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /**Hook */
 onMounted(() => {
   fectListDecased();
@@ -159,6 +169,7 @@ onMounted(() => {
               outlined
               debounce="300"
               placeholder="ค้นหา"
+              @keydown.enter="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
@@ -185,7 +196,6 @@ onMounted(() => {
             ref="table"
             :columns="columns"
             :rows="rows"
-            :filter="filterKeyword.trim()"
             row-key="fullname"
             flat
             bordered

src/modules/06_retirement/views/06_dismissOrder.vue

@@ -25,7 +25,7 @@ const {
   showLoader,
   hideLoader,
   success,
-
+  onSearchDataTable,
   dialogRemove,
 } = mixin;
 const { statusText } = transferStore;
@@ -48,7 +48,9 @@ const filterRef = ref<any>(null);
 
 //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
 const rows = ref<ResponseData[]>([]);
+const rowsData = ref<ResponseData[]>([]);
 const rows2 = ref<ResponseData[]>([]);
+const rowsData2 = ref<ResponseData[]>([]);
 const filters = ref<ResponseData[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
@@ -145,6 +147,7 @@ function openModalOrder() {
       r.date
   );
   rows2.value = row;
+  rowsData2.value = row;
 }
 
 //นำข้อมูลมาแสดง
@@ -155,6 +158,7 @@ async function getData() {
     .then((res: any) => {
       const data = res.data.result;
       rows.value = data;
+      rowsData.value = data;
       filters.value = data;
     })
     .catch((e) => {
@@ -191,6 +195,14 @@ function closeModal() {
   modal.value = false;
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 onMounted(async () => {
   await getData();
 });
@@ -225,6 +237,7 @@ onMounted(async () => {
               outlined
               debounce="300"
               placeholder="ค้นหา"
+              @keydown.enter="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
@@ -251,7 +264,6 @@ onMounted(async () => {
           <d-table
             :columns="columns"
             :rows="rows"
-            :filter="filterKeyword.trim()"
             row-key="id"
             :visible-columns="visibleColumns"
             v-model:pagination="pagination"
@@ -345,7 +357,8 @@ onMounted(async () => {
   <DialogSendToCommand
     v-model:modal="modal"
     :closeModal="closeModal"
-    :rows2="rows2"
+    v-model:rows="rows2"
+    v-model:rowsData="rowsData2"
     v-model:filterKeyword2="filterKeyword2"
     :fecthlistRecevice="getData"
   />

src/modules/07_insignia/components/2_Manage/Tab1.vue

@@ -41,6 +41,7 @@ const {
   messageError,
   success,
   dialogMessageNotify,
+  onSearchDataTable,
 } = mixin;
 
 /**
@@ -795,6 +796,14 @@ watch(
   }
 );
 
+function onSearch() {
+  DataStore.rows = onSearchDataTable(
+    filterKeyword.value,
+    DataStore.rowsData,
+    columns.value ? columns.value : []
+  );
+}
+
 /** Hook*/
 onMounted(async () => {
   filterOrganizationOP.value = await DataStore.optionsTypeOc;
@@ -853,6 +862,7 @@ onMounted(async () => {
           outlined
           debounce="300"
           placeholder="ค้นหา"
+          @keydown.enter="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
@@ -1010,7 +1020,6 @@ onMounted(async () => {
           ref="table"
           :columns="columns"
           :rows="DataStore.rows"
-          :filter="filterKeyword"
           row-key="name"
           flat
           bordered

src/modules/07_insignia/components/2_Manage/Tab2.vue

@@ -4,6 +4,7 @@ import { onMounted, ref, watch } from "vue";
 import { checkPermission } from "@/utils/permissions";
 import { useInsigniaDataStore } from "@/modules/07_insignia/store";
 import { useroleUserDataStore } from "@/stores/roleUser";
+import { useCounterMixin } from "@/stores/mixin";
 
 /** import Type*/
 import type { QTableProps } from "quasar";
@@ -13,6 +14,8 @@ import type { OptionData } from "@/modules/07_insignia/interface/index/Main";
 import DialogInformation from "@/components/Dialogs/Information.vue";
 import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
 
+const mixin = useCounterMixin()
+const { onSearchDataTable } = mixin
 /** useStore*/
 const roleDataStore = useroleUserDataStore();
 const DataStore = useInsigniaDataStore();
@@ -254,6 +257,14 @@ function clearInsigniaFilters(name: string) {
   }
 }
 
+function onSearch() {
+  DataStore.rows = onSearchDataTable(
+    filterKeyword.value,
+    DataStore.rowsData,
+    columns.value ? columns.value : []
+  );
+}
+
 /*** Hook*/
 onMounted(async () => {
   filterOrganizationOP.value = await DataStore.optionsTypeOc;
@@ -316,6 +327,7 @@ watch(
           outlined
           debounce="300"
           placeholder="ค้นหา"
+          @keydown.enter="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
@@ -440,7 +452,6 @@ watch(
           ref="table"
           :columns="columns"
           :rows="DataStore.rows"
-          :filter="filterKeyword"
           row-key="name"
           flat
           bordered

src/modules/07_insignia/components/2_Manage/Tab3.vue

@@ -3,6 +3,7 @@ import { onMounted, ref, watch } from "vue";
 
 import { checkPermission } from "@/utils/permissions";
 import { useInsigniaDataStore } from "@/modules/07_insignia/store";
+import { useCounterMixin } from "@/stores/mixin";
 
 /** import Type*/
 import type { QTableProps } from "quasar";
@@ -12,6 +13,8 @@ import type { OptionData } from "@/modules/07_insignia/interface/index/Main";
 import DialogInformation from "@/components/Dialogs/Information.vue";
 import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
 
+const mixin = useCounterMixin();
+const { onSearchDataTable } = mixin;
 /** useStore*/
 const DataStore = useInsigniaDataStore();
 
@@ -251,6 +254,22 @@ function clearInsigniaFilters(name: string) {
   }
 }
 
+function onSearch() {
+  DataStore.rows = onSearchDataTable(
+    filterKeyword.value,
+    DataStore.rowsData,
+    columns.value ? columns.value : []
+  );
+}
+
+watch(
+  () => DataStore.typeOc,
+  async () => {
+    filterOrganizationOP.value = await DataStore.optionsTypeOc;
+    organization.value = await DataStore.typeOc;
+  }
+);
+
 /** Hook*/
 onMounted(async () => {
   filterOrganizationOP.value = await DataStore.optionsTypeOc;
@@ -267,14 +286,6 @@ onMounted(async () => {
     }
   }
 });
-
-watch(
-  () => DataStore.typeOc,
-  async () => {
-    filterOrganizationOP.value = await DataStore.optionsTypeOc;
-    organization.value = await DataStore.typeOc;
-  }
-);
 </script>
 
 <template>
@@ -314,6 +325,7 @@ watch(
           outlined
           debounce="300"
           placeholder="ค้นหา"
+          @keydown.enter="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
@@ -434,7 +446,6 @@ watch(
           ref="table"
           :columns="columns"
           :rows="DataStore.rows"
-          :filter="filterKeyword"
           row-key="name"
           flat
           bordered

src/modules/07_insignia/store.ts

@@ -31,6 +31,7 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
   const typeOc = ref<string>("");
   const agency = ref<string>("");
   const rows = ref<DataManageList[]>([]);
+  const rowsData = ref<DataManageList[]>([]);
   const listinsignia = ref<DataManageList[]>([]);
   const typeinsignia = ref<string>("all");
   const typeinsigniaOptions = ref<OptionData[]>([
@@ -119,12 +120,15 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
       }
 
       rows.value = datalist;
+      rowsData.value = datalist;
       listinsignia.value = item;
       searchDataTable(typeinsignia.value, employeeClass.value);
       filtertypeInsignia();
-    } else rows.value = [];
+    } else {
+      rows.value = [];
+      rowsData.value = [];
+    }
   }
-
   /**
    * function เรียกข้อมูลรอบการเสนอขอ
    * @param data ข้อมูลราบการเสนอขอ
@@ -187,21 +191,28 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
     typeinsignia.value = type;
     employeeClass.value = employeeClasstype;
     if (type !== "all" && employeeClasstype !== "all") {
-      rows.value = listinsignia.value.filter(
+      const listData = listinsignia.value.filter(
         (e: DataManageList) =>
           e.insigniaCheck === type &&
           e.employeeType === profileType(employeeClasstype)
       );
+      rows.value = listData;
+      rowsData.value = listData;
     } else if (type !== "all" && employeeClasstype === "all") {
-      rows.value = listinsignia.value.filter(
+      const listData = listinsignia.value.filter(
         (e: DataManageList) => e.insigniaCheck === type
       );
+      rows.value = listData;
+      rowsData.value = listData;
     } else if (type === "all" && employeeClasstype !== "all") {
-      rows.value = listinsignia.value.filter(
+      const listData = listinsignia.value.filter(
         (e: DataManageList) => e.employeeType === profileType(employeeClasstype)
       );
+      rows.value = listData;
+      rowsData.value = listData;
     } else if (type === "all" && employeeClasstype === "all") {
       rows.value = listinsignia.value;
+      rowsData.value = listinsignia.value;
     }
   }
 
@@ -252,6 +263,7 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
     mainTab,
     typeOc,
     rows,
+    rowsData,
     typeinsigniaOptions,
     typeinsignia,
     agency,

src/modules/07_insignia/views/01_RoundMain.vue

@@ -25,10 +25,12 @@ const {
   showLoader,
   hideLoader,
   dialogRemove,
+  onSearchDataTable,
 } = mixin;
 
 /** Table */
 const rows = ref<FormProprsalsRound2[]>([]); //รายการรอบการเสนอขอพระราชทานเครื่องราชอิสริยาภรณ์
+const rowsData = ref<FormProprsalsRound2[]>([]); //รายการรอบการเสนอขอพระราชทานเครื่องราชอิสริยาภรณ์
 const filterKeyword = ref<string>(""); //คำค้นหาข้อมูลในตาราง
 const filterRef = ref<HTMLInputElement | null>(null);
 const columns = ref<QTableProps["columns"]>([
@@ -110,7 +112,7 @@ async function fetchData() {
     .get(config.API.listRoundInsignia(), { params: { path: "ROUND" } })
     .then(async (res) => {
       const data = res.data.result;
-      rows.value = await data.map((e: FormProprsalsRound2) => ({
+      const listData = await data.map((e: FormProprsalsRound2) => ({
         period_id: e.period_id,
         period_name: e.period_name,
         period_year: e.period_year + 543,
@@ -124,6 +126,9 @@ async function fetchData() {
         period_status: e.period_status,
         statusRoyal: storeInsignia.convertStatus(e.period_status),
       }));
+
+      rows.value = listData;
+      rowsData.value = listData;
     })
     .catch((e) => {
       messageError($q, e);
@@ -176,6 +181,14 @@ function onOpenFormDetail(action: string = "", id: string = "") {
   roundId.value = id;
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /**
  * ทำงานเมื่อ Componenets ถูกเรียกใช้งาน
  */
@@ -213,6 +226,7 @@ onMounted(async () => {
           outlined
           debounce="300"
           placeholder="ค้นหา"
+          @keydown.enter="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
@@ -238,7 +252,6 @@ onMounted(async () => {
           ref="table"
           :columns="columns"
           :rows="rows"
-          :filter="filterKeyword.trim()"
           row-key="Order"
           flat
           bordered

src/modules/09_leave/stores/RoundStores.ts

@@ -58,6 +58,7 @@ export const useRoundDataStore = defineStore("roundWorkStore", () => {
 
   /** ข้อมูลในตาราง */
   const rows = ref<dataRowRound[]>([]);
+  const rowsData = ref<dataRowRound[]>([]);
   /**
    * Function รับข้อมูลจาก API map
    * @param data รับข้อมูลจาก API
@@ -85,12 +86,14 @@ export const useRoundDataStore = defineStore("roundWorkStore", () => {
       };
     });
     rows.value = datalist;
+    rowsData.value = datalist;
   }
 
   return {
     visibleColumns,
     columns,
     rows,
+    rowsData,
     fetchData,
   };
 });

src/modules/09_leave/views/01_RoundMain.vue

@@ -17,7 +17,7 @@ const attrs = ref<any>(useAttrs());
 const mixin = useCounterMixin();
 const dataStore = useRoundDataStore();
 const { fetchData } = dataStore;
-const { showLoader, hideLoader, messageError, dialogRemove, success } = mixin;
+const { showLoader, hideLoader, messageError, dialogRemove, success,onSearchDataTable } = mixin;
 
 const modal = ref<boolean>(false);
 const isRead = ref<boolean>(false);
@@ -113,6 +113,14 @@ const pagination = ref({
   rowsPerPage: 10,
 });
 
+function onSearch() {
+  dataStore.rows = onSearchDataTable(
+    filterKeyword.value,
+    dataStore.rowsData,
+    dataStore.columns ? dataStore.columns : []
+  );
+}
+
 /** Hook*/
 onMounted(async () => {
   await fetchListRound();
@@ -150,6 +158,7 @@ onMounted(async () => {
         outlined
         debounce="300"
         placeholder="ค้นหา"
+        @keydown.enter="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
@@ -177,7 +186,6 @@ onMounted(async () => {
         ref="table"
         :columns="dataStore.columns"
         :rows="dataStore.rows"
-        :filter="filterKeyword.trim()"
         row-key="interrogated"
         flat
         bordered

src/modules/11_discipline/components/6_BasicInformation/Channel/MainPage.vue

@@ -19,7 +19,7 @@ const dataStore = useDisciplineChannelDataStore();
 const mainStore = useDisciplineMainStore();
 const route = useRoute();
 const mixin = useCounterMixin();
-const { dialogRemove, showLoader, messageError, hideLoader, success } = mixin;
+const { dialogRemove, showLoader, messageError, hideLoader, success,onSearchDataTable } = mixin;
 
 const modal = ref<boolean>(false);
 const isEdit = ref<boolean>(false);
@@ -160,6 +160,14 @@ function onSubmit() {
     });
 }
 
+function onSearch() {
+  dataStore.rows = onSearchDataTable(
+    filterKeyword.value,
+    dataStore.rowsData,
+    dataStore.columns ? dataStore.columns : []
+  );
+}
+
 /**เมื่อเริ่มโหลดหน้า เรียกใช้ฟังชั่น*/
 onMounted(() => {
   getComplaintChanal();
@@ -196,6 +204,7 @@ onMounted(() => {
         outlined
         debounce="300"
         placeholder="ค้นหา"
+        @keydown.enter="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
@@ -223,7 +232,6 @@ onMounted(() => {
         :columns="dataStore.columns"
         :rows="dataStore.rows"
         row-key="id"
-        :filter="filterKeyword.trim()"
         :visible-columns="dataStore.visibleColumns"
         v-model:pagination="pagination"
       >

src/modules/11_discipline/store/ChannelStore.ts

@@ -44,6 +44,7 @@ export const useDisciplineChannelDataStore = defineStore(
       type.value = data;
     }
     const rows = ref<ChannelRows[]>([]);
+    const rowsData = ref<ChannelRows[]>([]);
 
     /**
      * รับค่าจาก API เก็บไว้ใน rows
@@ -51,12 +52,14 @@ export const useDisciplineChannelDataStore = defineStore(
      */
     function fetchData(data: ChannelRows[]) {
       rows.value = data;
+      rowsData.value = data;
     }
 
     return {
       visibleColumns,
       columns,
       rows,
+      rowsData,
       fetchData,
       type,
       getType,

src/modules/12_evaluatePersonal/components/Director/MainPage.vue

@@ -23,7 +23,14 @@ import { useCounterMixin } from "@/stores/mixin";
 const $q = useQuasar();
 const dataStore = useEvaluateDirectorDataStore();
 const mixin = useCounterMixin();
-const { messageError, showLoader, hideLoader, dialogRemove, success } = mixin;
+const {
+  messageError,
+  showLoader,
+  hideLoader,
+  dialogRemove,
+  success,
+  onSearchDataTable,
+} = mixin;
 
 const modalDetail = ref<boolean>(false); //แสดงรายละเอียด
 const directorId = ref<string>(""); //id กรรมการ
@@ -104,6 +111,14 @@ function resetFilter() {
   }
 }
 
+function onSearch() {
+  dataStore.rows = onSearchDataTable(
+    filterKeyword.value,
+    dataStore.rowsData,
+    dataStore.columns ? dataStore.columns : []
+  );
+}
+
 onMounted(() => {
   dataStore.rows = [];
   getList();
@@ -137,6 +152,7 @@ onMounted(() => {
         outlined
         debounce="300"
         placeholder="ค้นหา"
+        @keydown.enter="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
@@ -163,7 +179,6 @@ onMounted(() => {
       <d-table
         :columns="dataStore.columns"
         :rows="dataStore.rows"
-        :filter="filterKeyword.trim()"
         row-key="tb-list"
         flat
         bordered

src/modules/12_evaluatePersonal/components/Meeting/MainPage.vue

@@ -16,7 +16,7 @@ import { useEvaluateMeetingDataStore } from "@/modules/12_evaluatePersonal/store
 const $q = useQuasar();
 const dataStore = useEvaluateMeetingDataStore();
 const mixin = useCounterMixin();
-const { messageError, showLoader, hideLoader, dialogRemove, success } = mixin;
+const { messageError, showLoader, hideLoader, dialogRemove, success,onSearchDataTable } = mixin;
 
 /**
  * function fetch ข้อมูลรายการการประชุม
@@ -78,6 +78,14 @@ const pagination = ref({
   rowsPerPage: 10,
 });
 
+function onSearch() {
+  dataStore.rows = onSearchDataTable(
+    filterKeyword.value,
+    dataStore.rowsData,
+    dataStore.columns ? dataStore.columns : []
+  );
+}
+
 /**เมื่อเริ่มโหลดหน้า
  * ส่งข้อมูลจำลองไปยัง store
  */
@@ -111,6 +119,7 @@ onMounted(() => {
         outlined
         debounce="300"
         placeholder="ค้นหา"
+        @keydown.enter="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
@@ -137,7 +146,6 @@ onMounted(() => {
       <d-table
         :columns="dataStore.columns"
         :rows="dataStore.rows"
-        :filter="filterKeyword.trim()"
         row-key="tb-list"
         flat
         bordered

src/modules/12_evaluatePersonal/store/DirectorStore.ts

@@ -73,6 +73,7 @@ export const useEvaluateDirectorDataStore = defineStore(
 
     // ข้อมูลในตาราง
     const rows = ref<MainList[]>([]);
+    const rowsData = ref<MainList[]>([]);
     function fetchData(data: DataResponseList[]) {
       const dataList: MainList[] = data.map((item: DataResponseList) => ({
         id: item.id,
@@ -92,12 +93,14 @@ export const useEvaluateDirectorDataStore = defineStore(
         lastUpdatedAt: item.lastUpdatedAt,
       }));
       rows.value = dataList;
+      rowsData.value = dataList;
     }
 
     return {
       visibleColumns,
       columns,
       rows,
+      rowsData,
       fetchData,
     };
   }

src/modules/12_evaluatePersonal/store/MeetingStore.ts

@@ -55,6 +55,7 @@ export const useEvaluateMeetingDataStore = defineStore(
 
     // ข้อมูลในตาราง
     const rows = ref<any[]>([]);
+    const rowsData = ref<any[]>([]);
     function fetchData(data: any[]) {
       const dataList: any[] = data.map((item: any) => ({
         id: item.id,
@@ -75,12 +76,14 @@ export const useEvaluateMeetingDataStore = defineStore(
         duration: item.duration,
       }));
       rows.value = dataList;
+      rowsData.value = dataList;
     }
 
     return {
       visibleColumns,
       columns,
       rows,
+      rowsData,
       fetchData,
     };
   }