no message

src/modules/04_registryPerson/components/detail/Employee/02_Employment.vue

@@ -247,20 +247,8 @@ onMounted(() => {
 
     <q-space />
     <div class="q-gutter-sm" style="display: flex">
-      <q-input outlined dense v-model="filter" label="ค้นหา">
-        <template v-slot:append>
-          <q-icon
-            v-if="filter == ''"
-            name="search"
-            @click.stop.prevent="filter = ''"
-            class="cursor-pointer"
-          />
-          <q-icon
-            v-if="filter"
-            name="cancel"
-            @click.stop.prevent="filter = ''"
-            class="cursor-pointer"
-          /> </template
+      <q-input outlined dense v-model="filter" label="ค้นหา" debounce="300">
+        <template v-slot:append> <q-icon name="search" /> </template
       ></q-input>
 
       <q-select
@@ -287,7 +275,7 @@ onMounted(() => {
       ref="table"
       :columns="columns?.slice(0, 2)"
       :rows="rows"
-      :filter="filter"
+      :filter="filter.trim()"
       row-key="dateEmployment"
       :paging="true"
       dense
@@ -431,7 +419,11 @@ onMounted(() => {
     <q-card style="min-width: 80%">
       <DialogHeader
         tittle="ประวัติแก้ไขข้อมูลส่วนตัว"
-        :close="() => (modalHistory = false)"
+        :close="
+          () => (
+            (modalHistory = false), (filterHistory = ''), (rowsHistory = [])
+          )
+        "
       />
       <q-separator />
 
@@ -447,18 +439,7 @@ onMounted(() => {
             debounce="300"
           >
             <template v-slot:append>
-              <q-icon
-                v-if="filterHistory == ''"
-                name="search"
-                @click.stop.prevent="filterHistory = ''"
-                class="cursor-pointer"
-              />
-              <q-icon
-                v-if="filterHistory"
-                name="cancel"
-                @click.stop.prevent="filterHistory = ''"
-                class="cursor-pointer"
-              />
+              <q-icon name="search" />
             </template>
           </q-input>
           <q-select
@@ -485,7 +466,7 @@ onMounted(() => {
           :rows="rowsHistory"
           :rows-per-page-options="[10, 25, 50, 100]"
           :visible-columns="visibleColumns"
-          :filter="filterHistory"
+          :filter="filterHistory.trim()"
         >
           >
           <template v-slot:header="props">