แก้ฟิลเตอร์

src/modules/12_evaluatePersonal/components/Detail/viewTab2/CardDirector.vue

@@ -9,7 +9,7 @@ import config from "@/app.config";
 
 /** importType*/
 import type { QTableProps } from "quasar";
-import type { Director } from "@/modules/11_discipline/interface/request/disciplinary";
+import type { Director } from "@/modules/11_discipline/interface/request/Disciplinary";
 import type { Directors } from "@/modules/12_evaluatePersonal/interface/response/Main";
 
 /** importComponents*/
@@ -91,6 +91,7 @@ const page = ref<number>(1); //หน้า
 const rowsPerPage = ref<number>(10); //จำนวนต่อหน้า
 const maxPage = ref<number>(1); //จำนนวนหน้าทั้งหมด
 const listDirector = ref<Directors[]>([]); //รายชื่อกรรมการ
+const listDirectorData = ref<Directors[]>([]); //รายชื่อกรรมการ
 
 /**
  * ฟังก์เปิด popup เพิ่มรายชื่อกรรมการ
@@ -152,7 +153,7 @@ async function getList() {
     .get(config.API.evaluateDirectorMain() + `/admin`)
     .then(async (res) => {
       const data = await res.data.result;
-      listDirector.value = data.map((item: Directors) => ({
+      const listData = data.map((item: Directors) => ({
         id: item.id,
         name: `${item.prefix}${item.firstName} ${item.lastName}`,
         createdAt: item.createdAt,
@@ -168,6 +169,8 @@ async function getList() {
         email: item.email == "" ? "-" : item.email,
         position: item.position == "" ? "-" : item.position,
       }));
+      listDirector.value = listData;
+      listDirectorData.value = listData;
     })
     .catch((e) => {
       messageError($q, e);
@@ -262,7 +265,8 @@ watch(
     v-model:Modal="modalAddDirector"
     v-model:filter-keyword2="filter"
     :click-close="onClickClose"
-    :rows2="listDirector"
+    v-model:rows="listDirector"
+    v-model:rows-data="listDirectorData"
     :rows-per-page="rowsPerPage"
     :page="page"
     :max-page="maxPage"

src/modules/12_evaluatePersonal/components/Detail/viewTab2/CardMeet.vue

@@ -120,6 +120,7 @@ const page = ref<number>(1); //หน้า
 const rowsPerPage = ref<number>(10); //จำนวนต่อหน้า
 const maxPage = ref<number>(1); //จำนนวนหน้าทั้งหมด
 const listMeet = ref<Meetings[]>([]); //รายชื่อประชุม
+const listMeetData = ref<Meetings[]>([]); //รายชื่อประชุม
 
 /**
  * ฟังก์เปิด popup เพิ่มการประชุม
@@ -178,7 +179,7 @@ async function getList() {
     .get(config.API.meeting() + `/admin`)
     .then((res) => {
       const data = res.data.result;
-      listMeet.value = data.map((item: Meetings) => ({
+      const listData = data.map((item: Meetings) => ({
         id: item.id,
         createdAt: item.createdAt,
         createdUserId: item.createdUserId,
@@ -196,6 +197,8 @@ async function getList() {
         result: item.result,
         timePeriod: item.duration,
       }));
+      listMeet.value = listData;
+      listMeetData.value = listData;
     })
     .catch((e) => {
       messageError($q, e);
@@ -286,8 +289,9 @@ watch(
   <DialogMeet
     v-model:Modal="modalAdd"
     :clickClose="onClickClose"
-    :rows2="listMeet"
-    v-model:filterKeyword2="filter"
+    v-model:filterKeyword="filter"
+    v-model:rows="listMeet"
+    v-model:rowsData="listMeetData"
     :rowsPerPage="rowsPerPage"
     :page="page"
     :maxPage="maxPage"

src/modules/12_evaluatePersonal/components/Detail/viewTab2/DialogDirector.vue

@@ -1,22 +1,30 @@
 <script setup lang="ts">
 import { ref, watchEffect, watch, type PropType } from "vue";
 
+import { useCounterMixin } from "@/stores/mixin";
 /** importType*/
 import type { QTableProps } from "quasar";
 import type { directorType } from "@/modules/11_discipline/interface/index/Main";
+import type { Directors } from "@/modules/12_evaluatePersonal/interface/response/Main";
 
 /** importComponents*/
 import DialogHeader from "@/components/DialogHeader.vue";
 
+const mixin = useCounterMixin();
+const { onSearchDataTable } = mixin;
 const selected = ref<directorType[]>([]);
 
+const rows = defineModel<Directors[]>("rows", { required: true });
+const rowsData = defineModel<Directors[]>("rowsData", { required: true });
+const filterKeyword2 = defineModel<string>("filterKeyword2", {
+  required: true,
+});
+
 /** รับ props มาจากหน้าหลัก */
 const props = defineProps({
   Modal: Boolean,
   clickClose: Function,
   getData: Function,
-  rows2: Array,
-  filterKeyword2: String,
   filterTable: {
     type: String,
     default: "",
@@ -145,6 +153,14 @@ function updateProp(newPagination: number, page: number) {
   emit("update:pagination", newPagination, page);
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword2.value,
+    rowsData.value,
+    columns2.value ? columns2.value : []
+  );
+}
+
 /**
  * เช็คค่า props.Modal === true
  */
@@ -187,9 +203,9 @@ watch(
           class="col-12 q-mb-sm"
           debounce="300"
           :model-value="filterKeyword2"
-          @update:model-value="updateInput"
           placeholder="ค้นหารายชื่อ"
           style="max-width: 100%"
+          @keydown.enter="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
@@ -198,8 +214,7 @@ watch(
 
         <d-table
           :columns="columns2"
-          :rows="rows2"
-          :filter="filterKeyword2?.trim()"
+          :rows="rows"
           row-key="id"
           :visible-columns="visibleColumns2"
           selection="multiple"

src/modules/12_evaluatePersonal/components/Detail/viewTab2/DialogMeet.vue

@@ -1,20 +1,26 @@
 <script setup lang="ts">
 import { ref, watchEffect, watch, type PropType } from "vue";
 
+import { useCounterMixin } from "@/stores/mixin";
 /** importType*/
 import type { QTableProps } from "quasar";
 import type { Meeting } from "@/modules/12_evaluatePersonal/interface/index/Main";
+import type { Meetings } from "@/modules/12_evaluatePersonal/interface/response/Main";
 
 /** importComponents*/
 import DialogHeader from "@/components/DialogHeader.vue";
 
+const mixin = useCounterMixin();
+const { onSearchDataTable } = mixin;
+const filterKeyword = defineModel<string>("filterKeyword", { required: true });
+const rows = defineModel<Meetings[]>("rows", { required: true });
+const rowsData = defineModel<Meetings[]>("rowsData", { required: true });
+
 /** รับ props มาจากหน้าหลัก */
 const props = defineProps({
   Modal: Boolean,
   clickClose: Function,
   getData: Function,
-  rows2: Array,
-  filterKeyword2: String,
   filterTable: {
     type: String,
     default: "",
@@ -149,6 +155,14 @@ function updateProp(newPagination: number, page: number) {
   emit("update:pagination", newPagination, page);
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /** เช็คค่า props.Modal === true */
 watchEffect(() => {
   if (props.Modal === true) {
@@ -188,10 +202,10 @@ watch(
           dense
           class="col-12 q-mb-sm"
           debounce="300"
-          :model-value="filterKeyword2"
-          @update:model-value="updateInput"
+          :model-value="filterKeyword"
           placeholder="ค้นหารายการประชุม"
           style="max-width: 100%"
+          @keydown.enter="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
@@ -200,8 +214,7 @@ watch(
 
         <d-table
           :columns="columns"
-          :rows="rows2"
-          :filter="filterKeyword2?.trim()"
+          :rows="rows"
           row-key="id"
           selection="multiple"
           v-model:selected="selected"