เพิ่ม clear

src/modules/13_salary/components/salaryEmployeeChart/TabCriteria.vue

@@ -5,7 +5,10 @@ import type {
   ListData,
   ResponseData,
 } from "@/modules/13_salary/interface/index/EmployeeChart";
-import type { NewPagination,DataOption } from "@/modules/13_salary/interface/index/Main";
+import type {
+  NewPagination,
+  DataOption,
+} from "@/modules/13_salary/interface/index/Main";
 import DialogFormCriteria from "@/modules/13_salary/components/salaryEmployeeChart/DialogFormCriteria.vue";
 
 /** importType*/
@@ -17,7 +20,7 @@ import { useCounterMixin } from "@/stores/mixin";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-const posTypeOp = ref<DataOption[]>([])
+const posTypeOp = ref<DataOption[]>([]);
 const posType = ref<string>("");
 const maxPage = ref<number>(1);
 const $q = useQuasar();
@@ -167,7 +170,6 @@ function getData() {
         `/?page=${formFilter.page}&pageSize=${formFilter.pageSize}&keyword=${formFilter.keyword}&posTypeId=${posType.value}`
     )
     .then((res) => {
-
       const data = res.data.result.data;
       const total = res.data.result.total;
       maxPage.value = Math.ceil(res.data.result.total / formFilter.pageSize);
@@ -229,25 +231,25 @@ watch(
 );
 
 /** ดึงข้อมูลกลุ่มงาน */
-function getPosType(){
+function getPosType() {
   http
-  .get(config.API.salaryEmployeePosType())
-  .then((res)=>{
-    const data = res.data.result
-    posTypeOp.value = data.map((item:any)=>({
-      id:item.id,
-      name:item.posTypeName
-    }))
-  }).catch((e)=>{
-    messageError($q,e)
-  }).finally(()=>{
-
-  })
+    .get(config.API.salaryEmployeePosType())
+    .then((res) => {
+      const data = res.data.result;
+      posTypeOp.value = data.map((item: any) => ({
+        id: item.id,
+        name: item.posTypeName,
+      }));
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {});
 }
 
 onMounted(() => {
   getData();
-  getPosType()
+  getPosType();
 });
 </script>
 
@@ -265,7 +267,15 @@ onMounted(() => {
         emit-value
         map-options
         @update:model-value="getData"
-      />
+      >
+        <template v-if="posType" v-slot:append>
+          <q-icon
+            name="cancel"
+            @click.stop.prevent="posType = '';getData()"
+            class="cursor-pointer"
+          />
+        </template>
+      </q-select>
     </div>
     <q-btn flat round dense icon="add" @click="() => (modalForm = true)">
       <q-tooltip>เพิ่ม </q-tooltip>