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

src/modules/05_placement/components/AppointMent/DialogOrders.vue

@@ -19,11 +19,7 @@ const $q = useQuasar();
 const storeFn = useTransferDataStore();
 const storeCommand = useCommandMainStore();
 const { statusText } = storeFn;
-const {
-  dialogConfirm,
-
-  date2Thai,
-} = useCounterMixin();
+const { dialogConfirm, onSearchDataTable, date2Thai } = useCounterMixin();
 
 /**
  * props
@@ -34,8 +30,6 @@ const props = defineProps({
   fetchData: Function,
   nextPage: Function,
   optionsType: Array,
-  rows2: Array as PropType<PersonData[]>,
-  filterKeyword2: String,
   type: String,
 });
 const emit = defineEmits([
@@ -44,10 +38,14 @@ const emit = defineEmits([
   "update:selected",
 ]);
 
+const filterKeyword2 = defineModel<string>("filterKeyword2", {
+  required: true,
+});
+const rows = defineModel<PersonData[]>("rows", { required: true });
+const rowsData = defineModel<PersonData[]>("rowsData", { required: true });
 /**
  * table
  */
-const rows = ref<PersonData[]>([]); //ราชชื่อส่งไปออกคำสั่ง
 const selected = ref<PersonData[]>([]); //ราชชื่อที่เลือกส่งไปออกคำสั่ง
 const dataMapToSend = computed(() => {
   return selected.value.map((i: any) => ({
@@ -96,6 +94,11 @@ const columns2 = ref<QTableProps["columns"]>([
     field: "fullname",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format: (val, row) => {
+      return row.firstName
+        ? `${row.prefix}${row.firstName} ${row.lastName}`
+        : "-";
+    },
   },
   {
     name: "organizationName",
@@ -170,7 +173,7 @@ function sendToCommand() {
 
 /**  ฟังก์ชันเลือกประเภทคำสั่ง */
 function filterSelectOrder() {
-  const data = props.rows2 ? props.rows2 : [];
+  const data = rowsData.value;
   selected.value = [];
   rows.value = data.filter((v: PersonData) => {
     switch (commandType.value) {
@@ -202,6 +205,14 @@ function filterSelector(val: string, update: Function) {
   });
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword2.value,
+    rowsData.value,
+    columns2.value ? columns2.value : []
+  );
+}
+
 /**
  * เมื่อ props.modal เป็น true
  * กำหนดให้  selected เป็นค่าว่าง
@@ -210,9 +221,6 @@ watch(
   () => props.Modal,
   async () => {
     if (props.Modal === true) {
-      rows.value = props.rows2 ? props.rows2 : [];
-      console.log(rows.value);
-
       selected.value = [];
       commandType.value = "";
       const data = await storeCommand.getCommandTypes();
@@ -267,9 +275,9 @@ watch(
                   outlined
                   dense
                   debounce="300"
-                  :model-value="filterKeyword2"
-                  @update:model-value="updateInput"
+                  v-model="filterKeyword2"
                   placeholder="ค้นหา"
+                  @keydown.enter="onSearch"
                 >
                   <template v-slot:append>
                     <q-icon name="search" />
@@ -295,7 +303,6 @@ watch(
               <d-table
                 :columns="columns2"
                 :rows="rows"
-                :filter="filterKeyword2"
                 row-key="profileId"
                 flat
                 :visible-columns="visibleColumns2"
@@ -329,15 +336,6 @@ watch(
                       <div v-if="col.name == 'no'">
                         {{ props.rowIndex + 1 }}
                       </div>
-                      <div v-else-if="col.name == 'fullname'">
-                        {{
-                          props.row.firstName
-                            ? `${props.row.prefix ?? ""}${
-                                props.row.firstName ?? ""
-                              } ${props.row.lastName ?? ""}`
-                            : "-"
-                        }}
-                      </div>
 
                       <div v-else-if="col.name == 'status'">
                         {{