From 992541eded6158184dc08e557e1774f62775ca4a Mon Sep 17 00:00:00 2001
From: setthawutttty <trx.setthawut@gmail.com>
Date: Wed, 4 Dec 2024 13:47:44 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=9F=E0=B8=B4=E0=B8=A5=E0=B9=80=E0=B8=95?=
 =?UTF-8?q?=E0=B8=AD=E0=B8=A3=E0=B9=8C=E0=B8=A3=E0=B8=B0=E0=B8=9A=E0=B8=9A?=
 =?UTF-8?q?=20=E0=B8=9A=E0=B8=A3=E0=B8=A3=E0=B8=88=E0=B8=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Dialogs/DialogOrgSelect.vue    | 759 +++++++++---------
 .../Dialogs/DialogOrgSelectEmployee.vue       |  18 +-
 .../AppointEmployee/DialogOrders.vue          |  40 +-
 .../components/AppointMent/DialogOrders.vue   |  46 +-
 .../Help-Government/DialogOrders.vue          |  22 +-
 .../components/Other/DialogOrders.vue         |  27 +-
 .../components/PersonalList/DialogOrders.vue  |  17 +-
 .../components/PersonalList/Table.vue         |  12 +-
 .../components/PersonalList/TableView.vue     |   5 +
 .../components/Receive/DialogOrders.vue       |  21 +-
 .../components/Repatriate/DialogOrders.vue    |  36 +-
 .../components/Transfer/DialogOrders.vue      |  15 +-
 src/modules/05_placement/views/01_Main.vue    |  18 +-
 .../05_placement/views/02_transferMain.vue    |   5 +-
 .../05_placement/views/03_receiveMain.vue     |  20 +-
 .../views/04_helpGovernmentMain.vue           |  18 +-
 .../05_placement/views/05_repatriateMain.vue  |  18 +-
 .../views/06_appointPromoteMain.vue           |  22 +-
 .../views/07_appointEmployeeMain.vue          |  22 +-
 .../05_placement/views/08_otherMain.vue       |  21 +-
 20 files changed, 674 insertions(+), 488 deletions(-)

diff --git a/src/components/Dialogs/DialogOrgSelect.vue b/src/components/Dialogs/DialogOrgSelect.vue
index dc2ce42d9..b8362ad85 100644
--- a/src/components/Dialogs/DialogOrgSelect.vue
+++ b/src/components/Dialogs/DialogOrgSelect.vue
@@ -40,6 +40,7 @@ const {
   hideLoader,
   date2Thai,
   dialogMessageNotify,
+  onSearchDataTable,
 } = mixin;
 
 /** props*/
@@ -57,6 +58,7 @@ const isAll = ref<boolean>(false);
 const isBlank = ref<boolean>(false);
 const posMasterMain = ref<any>([]);
 const positionNo = ref<DataPositionNo[]>([]);
+const rowData = ref<DataPositionNo[]>([]);
 const itemTaps = ref<string[]>();
 const filters = ref<string>("");
 const positionId = ref<string>("");
@@ -293,6 +295,7 @@ async function getDataTable(id: string, level: number = 0) {
       }));
 
       positionNo.value = listPosNo;
+      rowData.value = listPosNo;
       // positionData.value = listPosNo;
 
       if (props.dataRows?.posmasterId) {
@@ -510,6 +513,14 @@ function onSubmit() {
   }
 }
 
+function onSearch() {
+  positionNo.value = onSearchDataTable(
+    filters.value,
+    rowData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 onMounted(async () => {
   await fetchTree();
 });
@@ -517,389 +528,383 @@ onMounted(async () => {
 <template>
   <q-dialog v-model="modal" persistent full-width>
     <q-card class="no-scroll">
-      <q-form greedy @submit.prevent @validation-success="onSubmit">
-        <DialogHeader :tittle="title" :close="close" />
-        <q-separator />
-        <q-card-section style="max-height: 80vh" class="scroll">
-          <div class="row">
-            <q-card
-              bordered
-              class="col-12 col-sm-3 scroll q-pa-sm"
-              style="height: 75vh"
+      <DialogHeader :tittle="title" :close="close" />
+      <q-separator />
+      <q-card-section style="max-height: 80vh" class="scroll">
+        <div class="row">
+          <q-card
+            bordered
+            class="col-12 col-sm-3 scroll q-pa-sm"
+            style="height: 75vh"
+          >
+            <q-toolbar style="padding: 0">
+              <q-toolbar-title class="text-subtitle2 text-bold"
+                >เลือกหน่วยงาน/ส่วนราชการ</q-toolbar-title
+              >
+            </q-toolbar>
+
+            <q-input dense outlined v-model="filter" label="ค้นหา">
+              <template v-slot:append>
+                <q-icon
+                  v-if="filter !== ''"
+                  name="clear"
+                  class="cursor-pointer"
+                  @click="filter = ''"
+                />
+              </template>
+            </q-input>
+            <q-tree
+              class="q-pa-sm q-gutter-sm"
+              dense
+              :nodes="lazy"
+              node-key="orgTreeId"
+              label-key="labelName"
+              :filter="filter"
+              no-results-label="ไม่พบข้อมูลที่ค้นหา"
+              no-nodes-label="ไม่มีข้อมูล"
+              v-model:expanded="expanded"
             >
-              <q-toolbar style="padding: 0">
-                <q-toolbar-title class="text-subtitle2 text-bold"
-                  >เลือกหน่วยงาน/ส่วนราชการ</q-toolbar-title
+              <template v-slot:default-header="prop">
+                <q-item
+                  @click.stop="updateSelected(prop.node)"
+                  clickable
+                  :active="nodeId == prop.node.orgTreeId"
+                  active-class="my-list-link text-primary text-weight-medium"
+                  class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
                 >
-              </q-toolbar>
-
-              <q-input dense outlined v-model="filter" label="ค้นหา">
-                <template v-slot:append>
-                  <q-icon
-                    v-if="filter !== ''"
-                    name="clear"
-                    class="cursor-pointer"
-                    @click="filter = ''"
-                  />
-                </template>
-              </q-input>
-              <q-tree
-                class="q-pa-sm q-gutter-sm"
-                dense
-                :nodes="lazy"
-                node-key="orgTreeId"
-                label-key="labelName"
-                :filter="filter"
-                no-results-label="ไม่พบข้อมูลที่ค้นหา"
-                no-nodes-label="ไม่มีข้อมูล"
-                v-model:expanded="expanded"
-              >
-                <template v-slot:default-header="prop">
-                  <q-item
-                    @click.stop="updateSelected(prop.node)"
-                    clickable
-                    :active="nodeId == prop.node.orgTreeId"
-                    active-class="my-list-link text-primary text-weight-medium"
-                    class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
-                  >
-                    <div>
-                      <div class="text-weight-medium">
-                        {{ prop.node.orgTreeName }}
-                      </div>
-                      <div class="text-weight-light">
-                        {{
-                          prop.node.orgCode == null ? null : prop.node.orgCode
-                        }}
-                        {{
-                          prop.node.orgTreeShortName == null
-                            ? null
-                            : prop.node.orgTreeShortName
-                        }}
-                      </div>
+                  <div>
+                    <div class="text-weight-medium">
+                      {{ prop.node.orgTreeName }}
                     </div>
-                  </q-item>
-                </template>
-              </q-tree>
-            </q-card>
-            <q-card bordered class="col-12 col-sm-9 q-pa-sm">
-              <q-tab-panels
-                v-model="nodeId"
-                animated
-                transition-prev="jump-up"
-                transition-next="jump-up"
-              >
-                <q-tab-panel
-                  v-for="(item, index) in itemTaps"
-                  :key="index"
-                  :name="item"
-                >
-                  <div class="column q-col-gutter-sm">
-                    <!-- เลือกตำแหน่งเลขที่ -->
-                    <div class="col-7">
-                      <q-card
-                        bordered
-                        style="height: 100%; border: 1px solid #d6dee1"
-                      >
-                        <div
-                          class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
-                        >
-                          เลือกตำแหน่งเลขที่
-                        </div>
-                        <div class="col-12"><q-separator /></div>
-                        <div class="col-12 q-pa-md">
-                          <q-toolbar style="padding: 0px">
-                            <div class="row q-gutter-md">
-                              <q-checkbox
-                                keep-color
-                                v-model="isBlank"
-                                label="แสดงเฉพาะตำแหน่งว่าง"
-                                color="primary"
-                              >
-                                <q-tooltip>แสดงเฉพาะตำแหน่งว่าง </q-tooltip>
-                              </q-checkbox>
-                            </div>
-                            <q-space />
-
-                            <div class="row q-gutter-md">
-                              <q-checkbox
-                                keep-color
-                                v-model="isAll"
-                                label="แสดงตำแหน่งทั้งหมด"
-                                color="primary"
-                              >
-                                <q-tooltip
-                                  >แสดงตำแหน่งทั้งหมดภายใต้หน่วยงาน/ส่วนราชการที่เลือก</q-tooltip
-                                >
-                              </q-checkbox>
-                              <div>
-                                <q-input
-                                  outlined
-                                  dense
-                                  v-model="filters"
-                                  label="ค้นหา"
-                                >
-                                  <template v-slot:append>
-                                    <q-icon name="search" color="grey-5" />
-                                  </template>
-                                </q-input>
-                              </div>
-                              <div>
-                                <q-select
-                                  v-model="visibleColumns"
-                                  multiple
-                                  outlined
-                                  dense
-                                  options-dense
-                                  emit-value
-                                  :display-value="$q.lang.table.columns"
-                                  map-options
-                                  :options="columns"
-                                  option-value="name"
-                                  style="min-width: 140px"
-                                />
-                              </div>
-                            </div>
-                          </q-toolbar>
-                          <d-table
-                            ref="table"
-                            :columns="columns"
-                            :rows="positionNo"
-                            :filter="filters"
-                            row-key="id"
-                            flat
-                            bordered
-                            :paging="true"
-                            dense
-                            :rows-per-page-options="[10, 25, 50, 100]"
-                            class="tableTb"
-                            :visible-columns="visibleColumns"
-                          >
-                            <template v-slot:header="props">
-                              <q-tr :props="props">
-                                <q-th
-                                  v-for="col in props.cols"
-                                  :key="col.name"
-                                  :props="props"
-                                >
-                                  <span class="text-weight-medium">{{
-                                    col.label
-                                  }}</span>
-                                </q-th>
-                              </q-tr>
-                            </template>
-                            <template v-slot:body="props">
-                              <q-tr :props="props" class="cursor-pointer">
-                                <q-td
-                                  v-for="col in props.cols"
-                                  :key="col.name"
-                                  :props="props"
-                                  @click="onClickSelectPos(props.row.id)"
-                                  :class="{
-                                    'text-red': props.row.isCondition === true,
-                                    'bg-blue-2': props.row.id === positionId,
-                                  }"
-                                >
-                                  <div v-if="col.name == 'no'">
-                                    {{ props.rowIndex + 1 }}
-                                  </div>
-                                  <div v-else-if="col.name === 'posMasterNo'">
-                                    {{
-                                      props.row.isSit
-                                        ? col.value + " " + "(ทับที่)"
-                                        : col.value
-                                    }}
-                                  </div>
-                                  <div v-else-if="col.name === 'isPosition'">
-                                    <div v-if="col.value">
-                                      <q-icon
-                                        name="done"
-                                        color="primary"
-                                        size="24px"
-                                      >
-                                        <q-tooltip>ตรงตามตำแหน่ง </q-tooltip>
-                                      </q-icon>
-                                    </div>
-                                  </div>
-
-                                  <div v-else>
-                                    {{ col.value ? col.value : "-" }}
-                                  </div>
-                                </q-td>
-                              </q-tr>
-                            </template>
-                          </d-table>
-                        </div>
-                      </q-card>
-                    </div>
-
-                    <!-- เลือกตำแหน่ง -->
-                    <div class="col-5">
-                      <q-card
-                        bordered
-                        style="min-height: 30vh; border: 1px solid #d6dee1"
-                      >
-                        <div
-                          class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
-                        >
-                          เลือกตำแหน่ง
-                        </div>
-                        <div class="col-12"><q-separator /></div>
-                        <q-tab-panels
-                          v-model="positionId"
-                          animated
-                          swipeable
-                          vertical
-                          transition-prev="jump-up"
-                          transition-next="jump-up"
-                        >
-                          <q-tab-panel
-                            v-for="(item, index) in positionData"
-                            :key="index"
-                            :name="item.id"
-                          >
-                            <div class="col-12">
-                              <q-toolbar style="padding: 0px">
-                                <datepicker
-                                  menu-class-name="modalfix"
-                                  v-model="datePos"
-                                  :locale="'th'"
-                                  autoApply
-                                  borderless
-                                  :enableTimePicker="false"
-                                  week-start="0"
-                                  :min-date="datePos"
-                                >
-                                  <template #year="{ year }">
-                                    {{ year + 543 }}
-                                  </template>
-                                  <template #year-overlay-value="{ value }">
-                                    {{ parseInt(value + 543) }}
-                                  </template>
-                                  <template #trigger>
-                                    <q-input
-                                      ref="dateRef"
-                                      outlined
-                                      dense
-                                      hide-bottom-space
-                                      :model-value="
-                                        datePos != null
-                                          ? date2Thai(datePos)
-                                          : null
-                                      "
-                                      label="วันที่รายงานตัว"
-                                    >
-                                      <template v-slot:prepend>
-                                        <q-icon
-                                          name="event"
-                                          class="cursor-pointer"
-                                          style="color: var(--q-primary)"
-                                        >
-                                        </q-icon>
-                                      </template>
-                                    </q-input>
-                                  </template>
-                                </datepicker>
-                              </q-toolbar>
-                              <d-table
-                                ref="table"
-                                :columns="columnsPostition"
-                                :rows="rowsPosition"
-                                row-key="id"
-                                flat
-                                bordered
-                                :paging="true"
-                                dense
-                                :rows-per-page-options="[10, 25, 50, 100]"
-                                class="tableTb"
-                                selection="single"
-                                v-model:selected="selectedPos"
-                              >
-                                <template v-slot:header-selection="scope">
-                                  <q-checkbox
-                                    keep-color
-                                    color="primary"
-                                    dense
-                                    v-model="scope.checkBox"
-                                  />
-                                </template>
-                                <template v-slot:header="props">
-                                  <q-tr :props="props">
-                                    <q-th auto-width />
-                                    <q-th
-                                      v-for="col in props.cols"
-                                      :key="col.name"
-                                      :props="props"
-                                    >
-                                      <span class="text-weight-medium">{{
-                                        col.label
-                                      }}</span>
-                                    </q-th>
-                                  </q-tr>
-                                </template>
-                                <template v-slot:body="props">
-                                  <q-tr :props="props">
-                                    <q-td>
-                                      <q-checkbox
-                                        keep-color
-                                        color="primary"
-                                        dense
-                                        v-model="props.selected"
-                                      />
-                                    </q-td>
-                                    <q-td
-                                      v-for="col in props.cols"
-                                      :key="col.name"
-                                      :props="props"
-                                    >
-                                      <div v-if="col.name == 'no'">
-                                        {{ props.rowIndex + 1 }}
-                                      </div>
-                                      <div
-                                        v-else-if="col.name === 'posMasterNo'"
-                                      >
-                                        {{
-                                          props.row.isSit
-                                            ? col.value + " " + "(ทับที่)"
-                                            : col.value
-                                        }}
-                                      </div>
-                                      <div
-                                        v-else-if="col.name === 'positionArea'"
-                                        class="table_ellipsis"
-                                      >
-                                        {{
-                                          props.row.positionArea
-                                            ? props.row.positionArea
-                                            : "-"
-                                        }}
-                                      </div>
-
-                                      <div v-else>
-                                        {{ col.value ? col.value : "-" }}
-                                      </div>
-                                    </q-td>
-                                  </q-tr>
-                                </template>
-                              </d-table>
-                            </div>
-                          </q-tab-panel>
-                        </q-tab-panels>
-                      </q-card>
+                    <div class="text-weight-light">
+                      {{ prop.node.orgCode == null ? null : prop.node.orgCode }}
+                      {{
+                        prop.node.orgTreeShortName == null
+                          ? null
+                          : prop.node.orgTreeShortName
+                      }}
                     </div>
                   </div>
-                </q-tab-panel>
-              </q-tab-panels>
-            </q-card>
-          </div>
-        </q-card-section>
-        <q-separator />
+                </q-item>
+              </template>
+            </q-tree>
+          </q-card>
+          <q-card bordered class="col-12 col-sm-9 q-pa-sm">
+            <q-tab-panels
+              v-model="nodeId"
+              animated
+              transition-prev="jump-up"
+              transition-next="jump-up"
+            >
+              <q-tab-panel
+                v-for="(item, index) in itemTaps"
+                :key="index"
+                :name="item"
+              >
+                <div class="column q-col-gutter-sm">
+                  <!-- เลือกตำแหน่งเลขที่ -->
+                  <div class="col-7">
+                    <q-card
+                      bordered
+                      style="height: 100%; border: 1px solid #d6dee1"
+                    >
+                      <div
+                        class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
+                      >
+                        เลือกตำแหน่งเลขที่
+                      </div>
+                      <div class="col-12"><q-separator /></div>
+                      <div class="col-12 q-pa-md">
+                        <q-toolbar style="padding: 0px">
+                          <div class="row q-gutter-md">
+                            <q-checkbox
+                              keep-color
+                              v-model="isBlank"
+                              label="แสดงเฉพาะตำแหน่งว่าง"
+                              color="primary"
+                            >
+                              <q-tooltip>แสดงเฉพาะตำแหน่งว่าง </q-tooltip>
+                            </q-checkbox>
+                          </div>
+                          <q-space />
 
-        <q-card-actions align="right" class="bg-white text-teal">
-          <q-btn label="บันทึก" color="secondary" type="submit"
-            ><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
-          >
-        </q-card-actions>
-      </q-form>
+                          <div class="row q-gutter-md">
+                            <q-checkbox
+                              keep-color
+                              v-model="isAll"
+                              label="แสดงตำแหน่งทั้งหมด"
+                              color="primary"
+                            >
+                              <q-tooltip
+                                >แสดงตำแหน่งทั้งหมดภายใต้หน่วยงาน/ส่วนราชการที่เลือก</q-tooltip
+                              >
+                            </q-checkbox>
+                            <div>
+                              <q-input
+                                outlined
+                                dense
+                                v-model="filters"
+                                label="ค้นหา"
+                                @keydown.enter.prevent="onSearch"
+                              >
+                                <template v-slot:append>
+                                  <q-icon name="search" color="grey-5" />
+                                </template>
+                              </q-input>
+                            </div>
+                            <div>
+                              <q-select
+                                v-model="visibleColumns"
+                                multiple
+                                outlined
+                                dense
+                                options-dense
+                                emit-value
+                                :display-value="$q.lang.table.columns"
+                                map-options
+                                :options="columns"
+                                option-value="name"
+                                style="min-width: 140px"
+                              />
+                            </div>
+                          </div>
+                        </q-toolbar>
+                        <d-table
+                          ref="table"
+                          :columns="columns"
+                          :rows="positionNo"
+                          row-key="id"
+                          flat
+                          bordered
+                          :paging="true"
+                          dense
+                          :rows-per-page-options="[10, 25, 50, 100]"
+                          class="tableTb"
+                          :visible-columns="visibleColumns"
+                        >
+                          <template v-slot:header="props">
+                            <q-tr :props="props">
+                              <q-th
+                                v-for="col in props.cols"
+                                :key="col.name"
+                                :props="props"
+                              >
+                                <span class="text-weight-medium">{{
+                                  col.label
+                                }}</span>
+                              </q-th>
+                            </q-tr>
+                          </template>
+                          <template v-slot:body="props">
+                            <q-tr :props="props" class="cursor-pointer">
+                              <q-td
+                                v-for="col in props.cols"
+                                :key="col.name"
+                                :props="props"
+                                @click="onClickSelectPos(props.row.id)"
+                                :class="{
+                                  'text-red': props.row.isCondition === true,
+                                  'bg-blue-2': props.row.id === positionId,
+                                }"
+                              >
+                                <div v-if="col.name == 'no'">
+                                  {{ props.rowIndex + 1 }}
+                                </div>
+                                <div v-else-if="col.name === 'posMasterNo'">
+                                  {{
+                                    props.row.isSit
+                                      ? col.value + " " + "(ทับที่)"
+                                      : col.value
+                                  }}
+                                </div>
+                                <div v-else-if="col.name === 'isPosition'">
+                                  <div v-if="col.value">
+                                    <q-icon
+                                      name="done"
+                                      color="primary"
+                                      size="24px"
+                                    >
+                                      <q-tooltip>ตรงตามตำแหน่ง </q-tooltip>
+                                    </q-icon>
+                                  </div>
+                                </div>
+
+                                <div v-else>
+                                  {{ col.value ? col.value : "-" }}
+                                </div>
+                              </q-td>
+                            </q-tr>
+                          </template>
+                        </d-table>
+                      </div>
+                    </q-card>
+                  </div>
+
+                  <!-- เลือกตำแหน่ง -->
+                  <div class="col-5">
+                    <q-card
+                      bordered
+                      style="min-height: 30vh; border: 1px solid #d6dee1"
+                    >
+                      <div
+                        class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
+                      >
+                        เลือกตำแหน่ง
+                      </div>
+                      <div class="col-12"><q-separator /></div>
+                      <q-tab-panels
+                        v-model="positionId"
+                        animated
+                        swipeable
+                        vertical
+                        transition-prev="jump-up"
+                        transition-next="jump-up"
+                      >
+                        <q-tab-panel
+                          v-for="(item, index) in positionData"
+                          :key="index"
+                          :name="item.id"
+                        >
+                          <div class="col-12">
+                            <q-toolbar style="padding: 0px">
+                              <datepicker
+                                menu-class-name="modalfix"
+                                v-model="datePos"
+                                :locale="'th'"
+                                autoApply
+                                borderless
+                                :enableTimePicker="false"
+                                week-start="0"
+                                :min-date="datePos"
+                              >
+                                <template #year="{ year }">
+                                  {{ year + 543 }}
+                                </template>
+                                <template #year-overlay-value="{ value }">
+                                  {{ parseInt(value + 543) }}
+                                </template>
+                                <template #trigger>
+                                  <q-input
+                                    ref="dateRef"
+                                    outlined
+                                    dense
+                                    hide-bottom-space
+                                    :model-value="
+                                      datePos != null
+                                        ? date2Thai(datePos)
+                                        : null
+                                    "
+                                    label="วันที่รายงานตัว"
+                                  >
+                                    <template v-slot:prepend>
+                                      <q-icon
+                                        name="event"
+                                        class="cursor-pointer"
+                                        style="color: var(--q-primary)"
+                                      >
+                                      </q-icon>
+                                    </template>
+                                  </q-input>
+                                </template>
+                              </datepicker>
+                            </q-toolbar>
+                            <d-table
+                              ref="table"
+                              :columns="columnsPostition"
+                              :rows="rowsPosition"
+                              row-key="id"
+                              flat
+                              bordered
+                              :paging="true"
+                              dense
+                              :rows-per-page-options="[10, 25, 50, 100]"
+                              class="tableTb"
+                              selection="single"
+                              v-model:selected="selectedPos"
+                            >
+                              <template v-slot:header-selection="scope">
+                                <q-checkbox
+                                  keep-color
+                                  color="primary"
+                                  dense
+                                  v-model="scope.checkBox"
+                                />
+                              </template>
+                              <template v-slot:header="props">
+                                <q-tr :props="props">
+                                  <q-th auto-width />
+                                  <q-th
+                                    v-for="col in props.cols"
+                                    :key="col.name"
+                                    :props="props"
+                                  >
+                                    <span class="text-weight-medium">{{
+                                      col.label
+                                    }}</span>
+                                  </q-th>
+                                </q-tr>
+                              </template>
+                              <template v-slot:body="props">
+                                <q-tr :props="props">
+                                  <q-td>
+                                    <q-checkbox
+                                      keep-color
+                                      color="primary"
+                                      dense
+                                      v-model="props.selected"
+                                    />
+                                  </q-td>
+                                  <q-td
+                                    v-for="col in props.cols"
+                                    :key="col.name"
+                                    :props="props"
+                                  >
+                                    <div v-if="col.name == 'no'">
+                                      {{ props.rowIndex + 1 }}
+                                    </div>
+                                    <div v-else-if="col.name === 'posMasterNo'">
+                                      {{
+                                        props.row.isSit
+                                          ? col.value + " " + "(ทับที่)"
+                                          : col.value
+                                      }}
+                                    </div>
+                                    <div
+                                      v-else-if="col.name === 'positionArea'"
+                                      class="table_ellipsis"
+                                    >
+                                      {{
+                                        props.row.positionArea
+                                          ? props.row.positionArea
+                                          : "-"
+                                      }}
+                                    </div>
+
+                                    <div v-else>
+                                      {{ col.value ? col.value : "-" }}
+                                    </div>
+                                  </q-td>
+                                </q-tr>
+                              </template>
+                            </d-table>
+                          </div>
+                        </q-tab-panel>
+                      </q-tab-panels>
+                    </q-card>
+                  </div>
+                </div>
+              </q-tab-panel>
+            </q-tab-panels>
+          </q-card>
+        </div>
+      </q-card-section>
+      <q-separator />
+
+      <q-card-actions align="right" class="bg-white text-teal">
+        <q-btn label="บันทึก" color="secondary" type="submit" @click="onSubmit"
+          ><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
+        >
+      </q-card-actions>
     </q-card>
   </q-dialog>
 </template>
diff --git a/src/components/Dialogs/DialogOrgSelectEmployee.vue b/src/components/Dialogs/DialogOrgSelectEmployee.vue
index 90015b3bc..c551475ce 100644
--- a/src/components/Dialogs/DialogOrgSelectEmployee.vue
+++ b/src/components/Dialogs/DialogOrgSelectEmployee.vue
@@ -40,6 +40,7 @@ const {
   hideLoader,
   date2Thai,
   dialogMessageNotify,
+  onSearchDataTable
 } = mixin;
 
 const route = useRoute();
@@ -57,6 +58,7 @@ const isAll = ref<boolean>(false);
 const isBlank = ref<boolean>(false);
 const posMasterMain = ref<any[]>([]);
 const positionNo = ref<DataPositionNo[]>([]);
+const rowsData = ref<DataPositionNo[]>([]);
 const itemTaps = ref<string[]>();
 const filters = ref<string>("");
 const positionId = ref<string>("");
@@ -278,6 +280,7 @@ async function getDataTable(id: string, level: number = 0) {
       }));
 
       positionNo.value = listPosNo;
+      rowsData.value = listPosNo;
       // positionData.value = listPosNo;
 
       if (props.dataRows?.posmasterId) {
@@ -485,6 +488,15 @@ function onSubmit() {
   }
 }
 
+function onSearch() {
+  positionNo.value = onSearchDataTable(
+    filters.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
+
 onMounted(() => {
   fetchTree();
 });
@@ -492,7 +504,6 @@ onMounted(() => {
 <template>
   <q-dialog v-model="modal" persistent full-width>
     <q-card class="no-scroll">
-      <q-form greedy @submit.prevent @validation-success="onSubmit">
         <DialogHeader :tittle="title" :close="close" />
         <q-separator />
         <q-card-section style="max-height: 80vh" class="scroll">
@@ -612,6 +623,7 @@ onMounted(() => {
                                   dense
                                   v-model="filters"
                                   label="ค้นหา"
+                                  @keydown.enter="onSearch"
                                 >
                                   <template v-slot:append>
                                     <q-icon name="search" color="grey-5" />
@@ -639,7 +651,6 @@ onMounted(() => {
                             ref="table"
                             :columns="columns"
                             :rows="positionNo.length !== 0 ? positionNo : []"
-                            :filter="filters"
                             row-key="id"
                             flat
                             bordered
@@ -862,11 +873,10 @@ onMounted(() => {
         <q-separator />
 
         <q-card-actions align="right" class="bg-white text-teal">
-          <q-btn label="บันทึก" color="secondary" type="submit"
+          <q-btn label="บันทึก" color="secondary" type="submit" @click="onSubmit"
             ><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
           >
         </q-card-actions>
-      </q-form>
     </q-card>
   </q-dialog>
 </template>
diff --git a/src/modules/05_placement/components/AppointEmployee/DialogOrders.vue b/src/modules/05_placement/components/AppointEmployee/DialogOrders.vue
index 9bc1dc0bb..5599bc583 100644
--- a/src/modules/05_placement/components/AppointEmployee/DialogOrders.vue
+++ b/src/modules/05_placement/components/AppointEmployee/DialogOrders.vue
@@ -15,7 +15,7 @@ import DialogCreateCommand from "@/modules/18_command/components/DialogCreateCom
 const $q = useQuasar();
 const storeCommand = useCommandMainStore();
 const mixin = useCounterMixin();
-const { dialogConfirm, date2Thai } = mixin;
+const { dialogConfirm, date2Thai,onSearchDataTable } = mixin;
 
 const props = defineProps({
   Modal: Boolean,
@@ -23,8 +23,6 @@ const props = defineProps({
   fetchData: Function,
   nextPage: Function,
   optionsType: Array,
-  rows2: Array as PropType<PersonData[]>,
-  filterKeyword2: String,
   type: String,
 });
 const emit = defineEmits([
@@ -33,7 +31,10 @@ const emit = defineEmits([
   "update:selected",
 ]);
 
-const rows = ref<PersonData[]>([]); //ราชชื่อส่งไปออกคำสั่ง
+const filterKeyword2 = defineModel<string>('filterKeyword2',{required:true})
+const rows = defineModel<PersonData[]>('rows',{required:true})
+const rowsData = defineModel<PersonData[]>('rowsData',{required:true})
+
 const selected = ref<PersonData[]>([]); //ราชชื่อที่เลือกส่งไปออกคำสั่ง
 const dataMapToSend = computed(() => {
   return selected.value.map((i: any) => ({
@@ -92,6 +93,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",
@@ -154,7 +160,7 @@ function clickAddlist() {
 
 /**  ฟังก์ชันเลือกประเภทคำสั่ง */
 function filterSelectOrder() {
-  const data = props.rows2 ? props.rows2 : [];
+  const data = rowsData.value ? rowsData.value : [];
   selected.value = [];
   rows.value = data.filter((v: PersonData) => {
     switch (commandType.value) {
@@ -183,6 +189,14 @@ function filterSelector(val: string, update: Function) {
   });
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword2.value,
+    rowsData.value,
+    columns2.value ? columns2.value : []
+  );
+}
+
 /**
  * เมื่อ props.modal เป็น true
  *
@@ -192,7 +206,7 @@ watch(
   () => props.Modal,
   async () => {
     if (props.Modal === true) {
-      rows.value = props.rows2 ? props.rows2 : [];
+      rows.value = rowsData.value ? rowsData.value : [];
       selected.value = [];
       commandType.value = "";
       const data = await storeCommand.getCommandTypes();
@@ -247,9 +261,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" />
@@ -275,7 +289,6 @@ watch(
               <d-table
                 :columns="columns2"
                 :rows="rows"
-                :filter="filterKeyword2"
                 row-key="profileId"
                 flat
                 :visible-columns="visibleColumns2"
@@ -308,15 +321,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'">
                   {{ props.row.status ? statusText(props.row.status) : "-" }}
diff --git a/src/modules/05_placement/components/AppointMent/DialogOrders.vue b/src/modules/05_placement/components/AppointMent/DialogOrders.vue
index 0e472a5a5..c5dcd384b 100644
--- a/src/modules/05_placement/components/AppointMent/DialogOrders.vue
+++ b/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'">
                         {{
diff --git a/src/modules/05_placement/components/Help-Government/DialogOrders.vue b/src/modules/05_placement/components/Help-Government/DialogOrders.vue
index a19d68754..c7dd0d610 100644
--- a/src/modules/05_placement/components/Help-Government/DialogOrders.vue
+++ b/src/modules/05_placement/components/Help-Government/DialogOrders.vue
@@ -16,7 +16,7 @@ import DialogCreateCommand from "@/modules/18_command/components/DialogCreateCom
 /** use*/
 const $q = useQuasar();
 const { statusText } = useTransferDataStore();
-const { dialogConfirm, findOrgNameOld, findPosMasterNoOld, date2Thai } =
+const { dialogConfirm, findOrgNameOld, findPosMasterNoOld, date2Thai,onSearchDataTable } =
   useCounterMixin();
 
 /** props*/
@@ -24,9 +24,12 @@ const props = defineProps({
   Modal: Boolean,
   closeModal: Function,
   getData: Function,
-  rows2: Array,
-  filterKeyword2: String,
 });
+
+const rows2 = defineModel<any[]>('rows2',{required:true})
+const rows2Data = defineModel<any[]>('rows2Data',{required:true})
+const filterKeyword2 = defineModel<string>('filterKeyword2',{required:true})
+
 const emit = defineEmits(["update:filterKeyword2", "update:selected"]);
 
 /** Table*/
@@ -214,6 +217,14 @@ watch(
     }
   }
 );
+
+function onSearch() {
+  rows2.value= onSearchDataTable(
+    filterKeyword2.value,
+    rows2Data.value,
+    columns2.value? columns2.value: []
+  );
+}
 </script>
 
 <template>
@@ -230,9 +241,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" /> </template>
             </q-input>
@@ -256,7 +267,6 @@ watch(
             <d-table
               :columns="columns2"
               :rows="rows2"
-              :filter="filterKeyword2"
               row-key="id"
               class="custom-header-table"
               :visible-columns="visibleColumns2"
diff --git a/src/modules/05_placement/components/Other/DialogOrders.vue b/src/modules/05_placement/components/Other/DialogOrders.vue
index da9e5173d..897dd1ddc 100644
--- a/src/modules/05_placement/components/Other/DialogOrders.vue
+++ b/src/modules/05_placement/components/Other/DialogOrders.vue
@@ -18,7 +18,7 @@ const $q = useQuasar();
 const storeCommand = useCommandMainStore();
 const storeFn = useTransferDataStore();
 const { statusText } = storeFn;
-const { dialogConfirm, date2Thai } = useCounterMixin();
+const { dialogConfirm, date2Thai, onSearchDataTable } = useCounterMixin();
 
 /**
  * props
@@ -29,8 +29,6 @@ const props = defineProps({
   resetFilter: Function,
   fecthlistOthet: Function,
   optionsType: Array,
-  rows2: Array as PropType<listMain[]>,
-  filterKeyword2: String,
   type: String,
 });
 const emit = defineEmits([
@@ -39,8 +37,12 @@ const emit = defineEmits([
   "update:selected",
 ]);
 
+const filterKeyword2 = defineModel<string>("filterKeyword2", {
+  required: true,
+});
+const rows = defineModel<listMain[]>("rows", { required: true });
+const rowsData = defineModel<listMain[]>("rowsData", { required: true });
 //Table
-const rows = ref<listMain[]>([]); //ราชชื่อส่งไปออกคำสั่ง
 const selected = ref<listMain[]>([]); //ราชชื่อที่เลือกส่งไปออกคำสั่ง
 const dataMapToSend = computed(() => {
   return selected.value.map((i: any) => ({
@@ -174,6 +176,14 @@ function filterSelector(val: string, update: Function) {
   });
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword2.value,
+    rowsData.value,
+    columns2.value ? columns2.value : []
+  );
+}
+
 /**
  * เมื่อ props.modal เป็น tru
  * กำหนดให้  selected เป็นค่าว่าง
@@ -182,7 +192,7 @@ watch(
   () => props.Modal,
   async () => {
     if (props.Modal === true) {
-      rows.value = props.rows2 ? props.rows2 : [];
+      rows.value = rowsData.value ? rowsData.value : [];
       selected.value = [];
       commandType.value = "";
       const data = await storeCommand.getCommandTypes();
@@ -239,9 +249,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" />
@@ -266,8 +276,7 @@ watch(
             <div class="col-12">
               <d-table
                 :columns="columns2"
-                :rows="props.rows2"
-                :filter="filterKeyword2"
+                :rows="rows"
                 row-key="profileId"
                 flat
                 :visible-columns="visibleColumns2"
diff --git a/src/modules/05_placement/components/PersonalList/DialogOrders.vue b/src/modules/05_placement/components/PersonalList/DialogOrders.vue
index edc93f2e1..0e49766dd 100644
--- a/src/modules/05_placement/components/PersonalList/DialogOrders.vue
+++ b/src/modules/05_placement/components/PersonalList/DialogOrders.vue
@@ -21,7 +21,7 @@ const mixin = useCounterMixin();
 const route = useRoute();
 const DataStore = usePlacementDataStore();
 const storeCommand = useCommandMainStore();
-const { dialogConfirm, dateText } = mixin;
+const { dialogConfirm, dateText,onSearchDataTable } = mixin;
 
 const modal = defineModel<boolean>("modal", { required: true });
 /** props */
@@ -32,6 +32,7 @@ const props = defineProps({
 
 const examId = route.params.examId;
 const rows = ref<any[]>([]);
+const rowsData = ref<any[]>([]);
 const commandType = ref<string>("");
 const commandOp = ref<ListCommand[]>([]);
 const listCommand = ref<ListCommand[]>([]); // เก็บคำสั่งทั้งหมด
@@ -175,6 +176,7 @@ function filterSelectOrder() {
   const data = props.rows ? props.rows : [];
   selected.value = [];
   rows.value = data;
+  rowsData.value = data;
 }
 
 /** ปิด Modal และล้างค่าที่เลือก */
@@ -182,6 +184,16 @@ function closeModal() {
   modal.value = false;
   commandType.value = "";
 }
+
+
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filter.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /**
  * เมื่อ props.modal เป็น true
  * กำหนดให้  selected เป็นค่าว่างและกำหนด filter ประเภทตำแหน่งตามประเภทการสอบ
@@ -191,6 +203,7 @@ watch(
   async () => {
     if (modal.value === true) {
       rows.value = props.rows ? props.rows : [];
+      rowsData.value = props.rows ? props.rows : [];
       selected.value = [];
       commandType.value = "";
       filter.value = "";
@@ -259,6 +272,7 @@ watch(
             v-model="filter"
             placeholder="ค้นหา"
             style="width: 200px; max-width: auto"
+            @keydown.enter="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
@@ -289,7 +303,6 @@ watch(
         <d-table
           :columns="columns"
           :rows="rows"
-          :filter="filter"
           row-key="personalId"
           :visible-columns="visibleColumns"
           selection="multiple"
diff --git a/src/modules/05_placement/components/PersonalList/Table.vue b/src/modules/05_placement/components/PersonalList/Table.vue
index e19c68464..ceb6a3684 100644
--- a/src/modules/05_placement/components/PersonalList/Table.vue
+++ b/src/modules/05_placement/components/PersonalList/Table.vue
@@ -36,6 +36,7 @@ const {
   success,
   dialogConfirm,
   date2Thai,
+  onSearchDataTable
 } = mixin;
 
 /** รับค่ามาจากหน้าหลัก */
@@ -63,6 +64,7 @@ const filter = ref<string>("");
 const Name = ref<string>();
 const rowsAll = ref<any>([]);
 const rows = ref<any[]>([]);
+const rowsData = ref<any[]>([]);
 const rowsAwait = ref<any[]>([]);
 const rowsFilter = ref<any>([]);
 const rowsOrder = ref<any[]>([]);
@@ -828,6 +830,14 @@ function updatemodalPersonal(modal: boolean) {
   modalPersonal.value = modal;
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filter.value,
+    rowsAwait.value,
+    columns.value ? columns.value : []
+  );
+}
+
 onMounted(async () => {
   await getWorkFlow();
   await getTable();
@@ -840,7 +850,6 @@ onMounted(async () => {
       :contain-status="containStatus"
       :rows="rows"
       :columns="columns"
-      :filter="filter"
       :visible-columns="visibleColumns"
       v-model:inputfilter="filter"
       v-model:inputvisible="visibleColumns"
@@ -849,6 +858,7 @@ onMounted(async () => {
       @update-modaladdlist="handleModalAddListUpdate"
       @update-modaladdSendPerson="openModalOrder"
       @update-new-Rows="onUpdateNewRows"
+      :onSearch="onSearch"
       :history="true"
       :boss="true"
       :saveNoDraft="true"
diff --git a/src/modules/05_placement/components/PersonalList/TableView.vue b/src/modules/05_placement/components/PersonalList/TableView.vue
index 463e780f7..457536704 100644
--- a/src/modules/05_placement/components/PersonalList/TableView.vue
+++ b/src/modules/05_placement/components/PersonalList/TableView.vue
@@ -77,6 +77,10 @@ const props = defineProps({
     type: Function,
     default: () => console.log("not function"),
   },
+  onSearch: {
+    type: Function,
+    default: () => console.log("not function"),
+  },
   edit: {
     type: Function,
     default: () => console.log("not function"),
@@ -238,6 +242,7 @@ function onUpdateNewRows() {
           placeholder="ค้นหา"
           style="max-width: 200px"
           class="q-ml-sm"
+          @keydown.enter="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
diff --git a/src/modules/05_placement/components/Receive/DialogOrders.vue b/src/modules/05_placement/components/Receive/DialogOrders.vue
index bf9388ab4..60afe1fa8 100644
--- a/src/modules/05_placement/components/Receive/DialogOrders.vue
+++ b/src/modules/05_placement/components/Receive/DialogOrders.vue
@@ -29,8 +29,13 @@ const dataMapToSend = computed(() => {
   }));
 });
 const mixin = useCounterMixin();
-const { dialogConfirm, date2Thai } = mixin;
+const { dialogConfirm, date2Thai, onSearchDataTable } = mixin;
 
+const rows = defineModel<any[]>("rows", { required: true });
+const rowsData = defineModel<any[]>("rowsData", { required: true });
+const filterKeyword2 = defineModel<string>("filterKeyword2", {
+  required: true,
+});
 /**
  * props
  */
@@ -39,8 +44,6 @@ const props = defineProps({
   clickClose: Function,
   fecthlistRecevice: Function,
   nextPage: Function,
-  rows2: Array,
-  filterKeyword2: String,
 });
 const emit = defineEmits(["update:filterKeyword2", "update:selected"]);
 
@@ -158,6 +161,14 @@ function onReset() {
   emit("update:filterKeyword2", "");
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword2.value,
+    rowsData.value,
+    columns2.value ? columns2.value : []
+  );
+}
+
 /**
  * เมื่อ props.modal เป็น true
  * กำหนดให้  selected เป็นค่าว่าง
@@ -186,6 +197,7 @@ watchEffect(() => {
               :model-value="filterKeyword2"
               @update:model-value="updateInput"
               placeholder="ค้นหา"
+              @keydown.enter="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
@@ -216,8 +228,7 @@ watchEffect(() => {
           <div class="col-12">
             <d-table
               :columns="columns2"
-              :rows="rows2"
-              :filter="filterKeyword2"
+              :rows="rows"
               row-key="id"
               flat
               :visible-columns="visibleColumns2"
diff --git a/src/modules/05_placement/components/Repatriate/DialogOrders.vue b/src/modules/05_placement/components/Repatriate/DialogOrders.vue
index 4fae816a1..7bcb8e053 100644
--- a/src/modules/05_placement/components/Repatriate/DialogOrders.vue
+++ b/src/modules/05_placement/components/Repatriate/DialogOrders.vue
@@ -16,17 +16,21 @@ import DialogCreateCommand from "@/modules/18_command/components/DialogCreateCom
 const $q = useQuasar();
 const { statusText } = useTransferDataStore();
 const mixin = useCounterMixin();
-const { dialogConfirm, findPosMasterNoOld, date2Thai } = mixin;
+const { dialogConfirm, findPosMasterNoOld, date2Thai, onSearchDataTable } =
+  mixin;
 
 /** props*/
 const props = defineProps({
   Modal: Boolean,
   closeModal: Function,
   getData: Function,
-  rows2: Array,
-  filterKeyword2: String,
 });
-const emit = defineEmits(["update:filterKeyword2", "update:selected"]);
+
+const rows = defineModel<any[]>("rows", { required: true });
+const rowsData = defineModel<any[]>("rowsData", { required: true });
+const filterKeyword2 = defineModel<string>("filterKeyword2", {
+  required: true,
+});
 
 //table
 const selected = ref<officerType[]>([]);
@@ -167,17 +171,12 @@ function saveOrder() {
   );
 }
 
-/**
- * อัปเดทค่า filter
- * @param value คำค้นหา
- */
-function updateInput(value: string | number | null) {
-  emit("update:filterKeyword2", value);
-}
-
-/** รีเซ็ตค่าในช่องค้นหา*/
-function Reset() {
-  emit("update:filterKeyword2", "");
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword2.value,
+    rowsData.value,
+    columns2.value ? columns2.value : []
+  );
 }
 
 watch(
@@ -203,9 +202,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" />
@@ -229,8 +228,7 @@ watch(
           <div class="col-12">
             <d-table
               :columns="columns2"
-              :rows="rows2"
-              :filter="filterKeyword2"
+              :rows="rows"
               row-key="id"
               class="custom-header-table"
               :visible-columns="visibleColumns2"
diff --git a/src/modules/05_placement/components/Transfer/DialogOrders.vue b/src/modules/05_placement/components/Transfer/DialogOrders.vue
index e906a0804..a59b5f3b0 100644
--- a/src/modules/05_placement/components/Transfer/DialogOrders.vue
+++ b/src/modules/05_placement/components/Transfer/DialogOrders.vue
@@ -14,16 +14,17 @@ import DialogCreateCommand from "@/modules/18_command/components/DialogCreateCom
 const $q = useQuasar();
 const mixin = useCounterMixin();
 const { statusText } = useTransferDataStore();
-const { dialogConfirm, date2Thai } = mixin;
+const { dialogConfirm, date2Thai,onSearchDataTable } = mixin;
 
 const modal = defineModel<boolean>("modal", { required: true });
 /** props */
 const props = defineProps({
   closeModal: Function,
   fetchData: Function,
-  rows: Array,
 });
 
+const rows = defineModel<any[]>('rows',{required:true})
+const rowsData = defineModel<any[]>('rowsData',{required:true})
 const modalCommand = ref<boolean>(false); //เปิด-ปิด modal สร้างคำสั่ง
 //Table
 const selected = ref<ResponseData[]>([]); //รายชื่อที่เลือก
@@ -140,6 +141,14 @@ function saveOrder() {
   );
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filter.value,
+    rowsData.value,
+    columns2.value ? columns2.value : []
+  );
+}
+
 /**
  * เมื่อ props.modal เป็น true
  * กำหนดให้  selected เป็นค่าว่าง
@@ -170,6 +179,7 @@ watch(
               debounce="300"
               v-model="filter"
               placeholder="ค้นหา"
+              @keydown.enter="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
@@ -201,7 +211,6 @@ watch(
             <d-table
               :columns="columns2"
               :rows="rows"
-              :filter="filter"
               row-key="id"
               :visible-columns="visibleColumns2"
               selection="multiple"
diff --git a/src/modules/05_placement/views/01_Main.vue b/src/modules/05_placement/views/01_Main.vue
index 6913ccea9..0532114ea 100644
--- a/src/modules/05_placement/views/01_Main.vue
+++ b/src/modules/05_placement/views/01_Main.vue
@@ -17,7 +17,7 @@ import config from "@/app.config";
 const DataStore = usePlacementDataStore();
 const $q = useQuasar();
 const mixin = useCounterMixin();
-const { showLoader, hideLoader, messageError, date2Thai } = mixin;
+const { showLoader, hideLoader, messageError, date2Thai,onSearchDataTable } = mixin;
 
 const searchYear = ref();
 const yearOptions = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
@@ -26,6 +26,7 @@ const yearOptionsFn = ref<any>([]);
 
 /**ข้อมูลตาราง (จำลอง)*/
 const rows = ref<QTableProps["rows"]>([]);
+const rowsData = ref<any[]>([]);
 
 /** ค้นหาในตาราง */
 const filterKeyword = ref<string>("");
@@ -164,7 +165,8 @@ async function fetchPlacementData(val: number) {
       const data = await res.data.result;
       dataPlacement.value = data;
       DataStore.DataMainOrig = dataPlacement.value;
-      rows.value = DataStore.DataMainOrig.map((e: any) => ({
+      const listData = 
+       DataStore.DataMainOrig.map((e: any) => ({
         id: e.id,
         examRound: e.examRound,
         examOrder: e.examOrder,
@@ -176,6 +178,8 @@ async function fetchPlacementData(val: number) {
         fiscalYear: e.fiscalYear,
         numberOfCandidates: e.numberOfCandidates,
       }));
+      rows.value = listData
+      rowsData.value = listData
       filterKeyword.value = "";
       examTime.value = "ทั้งหมด";
       examType.value = "ทั้งหมด";
@@ -374,6 +378,14 @@ function paginationLabel(start: number, end: number, total: number) {
   else return start + "-" + end + " ใน " + total;
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /**
  * เรียกใช้ฟังชั่น เมื่อเริ่มหน้านี้
  */
@@ -428,6 +440,7 @@ onMounted(async () => {
           outlined
           debounce="300"
           placeholder="ค้นหา"
+          @keydown.enter="onSearch"
         >
           <template v-slot:append>
             <q-icon  name="search" />
@@ -540,7 +553,6 @@ onMounted(async () => {
           ref="table"
           :rows="rows"
           :columns="columns"
-          :filter="filterKeyword"
           row-key="id"
           flat
           bordered
diff --git a/src/modules/05_placement/views/02_transferMain.vue b/src/modules/05_placement/views/02_transferMain.vue
index 84e854bb5..9ed682205 100644
--- a/src/modules/05_placement/views/02_transferMain.vue
+++ b/src/modules/05_placement/views/02_transferMain.vue
@@ -27,6 +27,7 @@ const dataTransfer = ref<ResponseData[]>([]); //ช่อมูลรายก
 const rows = ref<ResponseData[]>([]); //รายการขอโอน
 const filterMain = ref<string>(""); //คำค้นหารายการขอโอน
 const rowsOrder = ref<ResponseData[]>([]); //รายการส่งไปออกคำสั่ง
+const rowsOrderData = ref<ResponseData[]>([]); //รายการส่งไปออกคำสั่ง
 const filterOrder = ref<string>(""); //คำค้นหารายการส่งไปออกคำสั่ง
 const columns = ref<QTableProps["columns"]>([
   {
@@ -154,6 +155,7 @@ function openModalOrder() {
       r.date
   );
   rowsOrder.value = row;
+  rowsOrderData.value = row;
   modal.value = true;
 }
 
@@ -328,7 +330,8 @@ const filterAndApply = () => {
     v-model:filter-order="filterOrder"
     :fetch-data="fetchData"
     :close-modal="closeModal"
-    :rows="rowsOrder"
+    v-model:rows="rowsOrder"
+    v-model:rowsData="rowsOrderData"
   />
 </template>
 <style scoped lang="scss"></style>
diff --git a/src/modules/05_placement/views/03_receiveMain.vue b/src/modules/05_placement/views/03_receiveMain.vue
index b4c746064..15ab783ce 100644
--- a/src/modules/05_placement/views/03_receiveMain.vue
+++ b/src/modules/05_placement/views/03_receiveMain.vue
@@ -31,6 +31,7 @@ const {
   messageError,
   date2Thai,
   dialogRemove,
+  onSearchDataTable
 } = mixin;
 
 const dataRecevice = ref<ResponseData[]>([]); //ข้อมูลรายการรับโอน
@@ -52,7 +53,9 @@ const type = ref<string | null>(null);
 
 //Table
 const rows = ref<ResponseRow[]>([]); //รายการรับโอน
+const rowsData = ref<ResponseRow[]>([]); //รายการรับโอน
 const rows2 = ref<ResponseRow[]>([]); //รายการออกคำสั่ง
+const rows2Data = ref<ResponseRow[]>([]); //รายการออกคำสั่ง
 const filterKeyword = ref<string>(""); //คำค้นหารายการรับโอน
 const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
 const visibleColumns = ref<string[]>([
@@ -157,6 +160,7 @@ async function fecthlistRecevice() {
       const data = await res.data.result;
       dataRecevice.value = data;
       rows.value = data;
+      rowsData.value = data;
       filters.value = data;
     })
     .catch((e) => {
@@ -227,7 +231,6 @@ function openModalTree(id: string, data: any) {
   dataRows.value = data;
   modalTree.value = true;
   type.value = null;
-  dataRows.value = data;
   posType.value = data.posTypeOldId;
   posLevel.value = data.posLevelOldId;
   position.value = data.positionOld;
@@ -292,6 +295,7 @@ function openModalOrder() {
   );
 
   rows2.value = row;
+  rows2Data.value = row;
   modal.value = true;
 }
 
@@ -328,6 +332,15 @@ async function onSave(data: any) {
     });
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
+
 /**
  * ทำงานเมื่อมีการเรียกใช้ Components
  */
@@ -372,6 +385,7 @@ onMounted(() => {
             outlined
             debounce="300"
             placeholder="ค้นหา"
+            @keydown.enter="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
@@ -403,7 +417,6 @@ onMounted(() => {
           <d-table
             :columns="columns"
             :rows="rows"
-            :filter="filterKeyword"
             row-key="id"
             :visible-columns="visibleColumns"
           >
@@ -610,7 +623,8 @@ onMounted(() => {
     v-model:modal="modal"
     v-model:filter-keyword2="filterKeyword2"
     :click-close="clickClose"
-    :rows2="rows2"
+    v-model:rows="rows2"
+    v-model:rowsData="rows2Data"
     :fecthlist-recevice="fecthlistRecevice"
     :next-page="nextPage"
   />
diff --git a/src/modules/05_placement/views/04_helpGovernmentMain.vue b/src/modules/05_placement/views/04_helpGovernmentMain.vue
index 8c58b00e7..aad8b5e4a 100644
--- a/src/modules/05_placement/views/04_helpGovernmentMain.vue
+++ b/src/modules/05_placement/views/04_helpGovernmentMain.vue
@@ -34,6 +34,7 @@ const {
   dialogRemove,
   findOrgNameOld,
   findPosMasterNoOld,
+  onSearchDataTable
 } = mixin;
 
 /**
@@ -44,7 +45,9 @@ const modal = ref<boolean>(false); //แสดง popup ส่งไปออก
 const filterKeyword = ref<string>(""); //คำค้นหารายการช่วยราชการ
 const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
 const rows = ref<officerType[]>([]); //รายการช่วยราชการ
+const rowsData = ref<officerType[]>([]); //รายการช่วยราชการ
 const rows2 = ref<officerType[]>([]); //รายการออกคำสั่ง
+const rows2Data = ref<officerType[]>([]); //รายการออกคำสั่ง
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -192,6 +195,7 @@ async function getData() {
     .then(async (res) => {
       const data = await res.data.result;
       rows.value = data;
+      rowsData.value = data;
     })
     .catch((e) => {
       messageError($q, e);
@@ -246,6 +250,7 @@ function openModalOrder() {
       item.dateEnd
   );
   rows2.value = row;
+  rows2Data.value = row;
   modal.value = true;
 }
 
@@ -265,6 +270,14 @@ function resetFilter() {
   filterKeyword2.value = "";
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /**
  * ทำงานเมื่อมีการเรียกใช้ Components
  */
@@ -300,6 +313,7 @@ onMounted(() => {
             outlined
             debounce="300"
             placeholder="ค้นหา"
+            @keydown.enter="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
@@ -326,7 +340,6 @@ onMounted(() => {
           <d-table
             :columns="columns"
             :rows="rows"
-            :filter="filterKeyword"
             row-key="id"
             :visible-columns="visibleColumns"
           >
@@ -406,7 +419,8 @@ onMounted(() => {
     v-model:filter-keyword2="filterKeyword2"
     :get-data="getData"
     :close-modal="closeModal"
-    :rows2="rows2"
+    v-model:rows2="rows2"
+    v-model:rows2Data="rows2Data"
   />
 </template>
 <style scoped lang="scss"></style>
diff --git a/src/modules/05_placement/views/05_repatriateMain.vue b/src/modules/05_placement/views/05_repatriateMain.vue
index 7455c19da..18044a5c7 100644
--- a/src/modules/05_placement/views/05_repatriateMain.vue
+++ b/src/modules/05_placement/views/05_repatriateMain.vue
@@ -27,6 +27,7 @@ const {
   success,
   dialogRemove,
   findPosMasterNoOld,
+  onSearchDataTable
 } = useCounterMixin();
 
 const modal = ref<boolean>(false); //  ส่งไปออกคำสั่งส่งตัวกลับ
@@ -35,7 +36,9 @@ const modal = ref<boolean>(false); //  ส่งไปออกคำสั่
 const filterKeyword = ref<string>(""); //คำค้นหารายการส่งตัวกลับ
 const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
 const rows = ref<officerType[]>([]); //รายการส่งตัวกลับ
+const rowsData = ref<officerType[]>([]); //รายการส่งตัวกลับ
 const rows2 = ref<officerType[]>([]); //รายการออกคำสั่ง
+const rows2Data = ref<officerType[]>([]); //รายการออกคำสั่ง
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -157,6 +160,7 @@ async function getData() {
     .then(async (res) => {
       const data = await res.data.result;
       rows.value = data;
+      rowsData.value = data;
     })
     .catch((e) => {
       messageError($q, e);
@@ -206,6 +210,7 @@ function openModalOrder() {
   );
 
   rows2.value = row;
+  rows2Data.value = row;
   modal.value = true;
 }
 
@@ -225,6 +230,14 @@ function resetFilter() {
   filterKeyword2.value = "";
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /**
  * ทำงานเมื่อมีการเรียกใช้ Components
  */
@@ -260,6 +273,7 @@ onMounted(async () => {
             outlined
             debounce="300"
             placeholder="ค้นหา"
+            @keydown.enter="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
@@ -285,7 +299,6 @@ onMounted(async () => {
           <d-table
             :columns="columns"
             :rows="rows"
-            :filter="filterKeyword"
             row-key="id"
             :visible-columns="visibleColumns"
           >
@@ -362,7 +375,8 @@ onMounted(async () => {
     v-model:filter-keyword2="filterKeyword2"
     :get-data="getData"
     :close-modal="closeModal"
-    :rows2="rows2"
+    v-model:rows="rows2"
+    v-model:rowsData="rows2Data"
   />
 </template>
 
diff --git a/src/modules/05_placement/views/06_appointPromoteMain.vue b/src/modules/05_placement/views/06_appointPromoteMain.vue
index 45461b763..71d8cadb3 100644
--- a/src/modules/05_placement/views/06_appointPromoteMain.vue
+++ b/src/modules/05_placement/views/06_appointPromoteMain.vue
@@ -30,6 +30,7 @@ const {
   messageError,
   date2Thai,
   dialogRemove,
+  onSearchDataTable
 } = useCounterMixin();
 
 const modal = ref<boolean>(false); //แสดง popup ส่งไปออกคำสั่ง
@@ -48,7 +49,9 @@ const type = ref<string>("");
 
 //table
 const rows = ref<PersonData[]>([]); //รายการแต่งตั้ง-เลื่อน-ย้าย
+const rowsData = ref<PersonData[]>([]); //รายการแต่งตั้ง-เลื่อน-ย้าย
 const rows2 = ref<PersonData[]>([]); //รายการออกคำสั่ง
+const rows2Data = ref<PersonData[]>([]); //รายการออกคำสั่ง
 const filterKeyword = ref<string>(""); //คำค้นหารายการแต่งตั้ง-เลื่อน-ย้าย
 const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
 const columns = ref<QTableProps["columns"]>([
@@ -167,8 +170,10 @@ async function fecthlistappointment() {
       let response = res.data.result;
       listRecevice.value = response;
       rows.value = response;
+      rowsData.value = response;
       // รายชื่อ ส่งไปออกคำสั่ง
-      rows2.value = rows.value.filter(
+      const listData =
+       rows.value.filter(
         (e: any) =>
           e.root !== null &&
           e.status !== "REPORT" &&
@@ -180,6 +185,8 @@ async function fecthlistappointment() {
           e.positionNumberOld &&
           e.positionDate
       );
+      rows2.value = listData
+      rows2Data.value = listData
     })
     .catch((e) => {
       messageError($q, e);
@@ -277,6 +284,14 @@ function clickClose() {
   modal.value = false;
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /** ทำงานเมื่อมีการเรียกใช้ Components*/
 onMounted(() => {
   fecthlistappointment();
@@ -313,6 +328,7 @@ onMounted(() => {
             outlined
             debounce="300"
             placeholder="ค้นหา"
+            @keydown.enter="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
@@ -339,7 +355,6 @@ onMounted(() => {
           <d-table
             :columns="columns"
             :rows="rows"
-            :filter="filterKeyword"
             row-key="citizenId"
             :visible-columns="visibleColumns"
             v-model:pagination="pagination"
@@ -553,7 +568,8 @@ onMounted(() => {
     :options-type="optionsType"
     :next-page="nextPage"
     :fetch-data="fecthlistappointment"
-    :rows2="rows2"
+    v-model:rows="rows2"
+    v-model:rowsData="rows2Data"
   />
 
   <DialogOrgSelect
diff --git a/src/modules/05_placement/views/07_appointEmployeeMain.vue b/src/modules/05_placement/views/07_appointEmployeeMain.vue
index a0dc280da..6123de095 100644
--- a/src/modules/05_placement/views/07_appointEmployeeMain.vue
+++ b/src/modules/05_placement/views/07_appointEmployeeMain.vue
@@ -29,6 +29,7 @@ const {
   messageError,
   date2Thai,
   dialogRemove,
+  onSearchDataTable
 } = mixin;
 
 const personalId = ref<string>("");
@@ -47,7 +48,9 @@ const type = ref<string>("");
 
 // Table
 const rows = ref<PersonData[]>([]); //รายการปรับระดับชั้นงานลูกจ้าง
+const rowsData = ref<PersonData[]>([]); //รายการปรับระดับชั้นงานลูกจ้าง
 const rows2 = ref<PersonData[]>([]); //รายการออกคำสั่ง
+const rows2Data = ref<PersonData[]>([]); //รายการออกคำสั่ง
 const filterKeyword = ref<string>(""); //คำค้นหารายการปรับระดับชั้นงานลูกจ้าง
 const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
 const visibleColumns = ref<string[]>([
@@ -168,9 +171,11 @@ async function fecthlistappointment() {
       let response = await res.data.result;
       listRecevice.value = response;
       rows.value = response;
+      rowsData.value = response;
 
       //หารายชื่อส่งไปออกคำสั่ง
-      rows2.value = rows.value.filter(
+      const listData = 
+       rows.value.filter(
         (e: any) =>
           e.root !== null &&
           e.status !== "REPORT" &&
@@ -182,6 +187,8 @@ async function fecthlistappointment() {
           e.positionNumberOld &&
           e.positionDate
       );
+      rows2.value = listData
+      rows2Data.value = listData
     })
     .catch((e) => {
       messageError($q, e);
@@ -288,6 +295,14 @@ function onSave(data: any) {
     });
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 onMounted(() => {
   fecthlistappointment();
 });
@@ -323,6 +338,7 @@ onMounted(() => {
             outlined
             debounce="300"
             placeholder="ค้นหา"
+            @keydown.enter="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
@@ -349,7 +365,6 @@ onMounted(() => {
           <d-table
             :columns="columns"
             :rows="rows"
-            :filter="filterKeyword"
             row-key="citizenId"
             :visible-columns="visibleColumns"
             v-model:pagination="pagination"
@@ -534,7 +549,8 @@ onMounted(() => {
     :options-type="optionsType"
     :next-page="nextPage"
     :fetch-data="fecthlistappointment"
-    :rows2="rows2"
+    v-model:rows="rows2"
+    v-model:rowsData="rows2Data"
   />
 
   <DialogOrgSelectEmployee
diff --git a/src/modules/05_placement/views/08_otherMain.vue b/src/modules/05_placement/views/08_otherMain.vue
index e25bf343e..81df1f164 100644
--- a/src/modules/05_placement/views/08_otherMain.vue
+++ b/src/modules/05_placement/views/08_otherMain.vue
@@ -28,6 +28,7 @@ const {
   messageError,
   date2Thai,
   dialogRemove,
+  onSearchDataTable,
 } = useCounterMixin();
 
 const modal = ref<boolean>(false);
@@ -36,7 +37,9 @@ const modal = ref<boolean>(false);
  * Table
  */
 const rows = ref<listMain[]>([]); //รายการอื่นๆ
+const rowsData = ref<listMain[]>([]); //รายการอื่นๆ
 const rows2 = ref<listMain[]>([]); //รายการออกคำสั่ง
+const rows2Data = ref<listMain[]>([]); //รายการออกคำสั่ง
 const filterKeyword = ref<string>(""); //คำค้นหารายการอื่นๆ
 const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
 const visibleColumns = ref<string[]>([
@@ -138,8 +141,9 @@ async function fecthlistOthet() {
     .then((res) => {
       let response = res.data.result;
       rows.value = response;
+      rowsData.value = response;
       // หารายชื่อส่งไปออกคำสั่งอื่นๆ
-      rows2.value = rows.value.filter(
+      const listData = rows.value.filter(
         (e: listMain) =>
           e.status !== "REPORT" &&
           e.status !== "DONE" &&
@@ -150,6 +154,8 @@ async function fecthlistOthet() {
           e.positionDate &&
           e.leaveDate !== null
       );
+      rows2.value = listData;
+      rows2Data.value = listData;
     })
     .catch((e) => {
       messageError($q, e);
@@ -206,6 +212,14 @@ function nextPage(id: string) {
   });
 }
 
+function onSearch() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsData.value,
+    columns.value ? columns.value : []
+  );
+}
+
 onMounted(() => {
   fecthlistOthet();
 });
@@ -237,6 +251,7 @@ onMounted(() => {
             outlined
             debounce="300"
             placeholder="ค้นหา"
+            @keydown.enter="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
@@ -262,7 +277,6 @@ onMounted(() => {
           <d-table
             :columns="columns"
             :rows="rows"
-            :filter="filterKeyword"
             row-key="id"
             :visible-columns="visibleColumns"
             v-model:pagination="pagination"
@@ -338,7 +352,8 @@ onMounted(() => {
     v-model:Modal="modal"
     v-model:filter-keyword2="filterKeyword2"
     :click-close="clickClose"
-    :rows2="rows2"
+    v-model:rows="rows2"
+    v-model:rowsData="rows2Data"
     :fecthlistOthet="fecthlistOthet"
   />
 </template>