no message

src/modules/04_registryPerson/components/detail/Employee/01_DataEmployee.vue

@@ -36,7 +36,7 @@ const profileId = ref<string>(
 /**
  * props
  */
- const isLeave = defineModel<boolean>("isLeave", {
+const isLeave = defineModel<boolean>("isLeave", {
   required: true,
 });
 
@@ -283,7 +283,8 @@ function onClickHistory() {
       const data = res.data.result;
       rows.value = data.sort(
         (a: any, b: any) =>
-          new Date(b.lastUpdatedAt).getTime() - new Date(a.lastUpdatedAt).getTime()
+          new Date(b.lastUpdatedAt).getTime() -
+          new Date(a.lastUpdatedAt).getTime()
       );
     })
     .catch((err) => {
@@ -578,7 +579,7 @@ onMounted(() => {
     <q-card style="min-width: 80%">
       <DialogHeader
         tittle="ประวัติแก้ไขข้อมูลส่วนตัว"
-        :close="() => (modalHistory = false)"
+        :close="() => ((modalHistory = false), (filter = ''), (rows = []))"
       />
       <q-separator />
 
@@ -595,18 +596,7 @@ onMounted(() => {
             debounce="300"
           >
             <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"
-              />
+              <q-icon name="search" />
             </template>
           </q-input>
           <q-select
@@ -620,7 +610,6 @@ onMounted(() => {
             map-options
             :options="columns"
             option-value="name"
-            
             style="min-width: 140px"
           />
         </div>
@@ -634,7 +623,7 @@ onMounted(() => {
           :rows="rows"
           :rows-per-page-options="[10, 25, 50, 100]"
           :visible-columns="visibleColumns"
-          :filter="filter"
+          :filter="filter.trim()"
         >
           >
           <template v-slot:header="props">

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">