From 9c72cd249d2a739343fcc79b769f9ec4b96ba42a Mon Sep 17 00:00:00 2001
From: setthawutttty <trx.setthawut@gmail.com>
Date: Thu, 6 Mar 2025 09:55:28 +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=20=E0=B8=AA=E0=B8=96=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=99=E0=B8=A0=E0=B8=B2=E0=B8=9E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../09_leave/components/05_Leave/Tab1.vue     |  1 +
 .../09_leave/components/05_Leave/Tab2.vue     |  1 +
 .../components/05_Leave/ToolBarLeave.vue      | 57 ++++++++++++++++++-
 .../09_leave/interface/request/leave.ts       |  1 +
 src/modules/09_leave/stores/LeaveStore.ts     |  1 +
 5 files changed, 59 insertions(+), 2 deletions(-)

diff --git a/src/modules/09_leave/components/05_Leave/Tab1.vue b/src/modules/09_leave/components/05_Leave/Tab1.vue
index b3d426161..086f6c17d 100644
--- a/src/modules/09_leave/components/05_Leave/Tab1.vue
+++ b/src/modules/09_leave/components/05_Leave/Tab1.vue
@@ -30,6 +30,7 @@ const querySting = reactive<QuerySting>({
   page: 1, //*สถานะการของลา
   pageSize: 10, //*สถานะการของลา
   keyword: leaveStore.filter.keyword, //keyword ค้นหา
+  profileType: '', //profileType
 });
 
 //** เรียกข้อมูลจาก API*/
diff --git a/src/modules/09_leave/components/05_Leave/Tab2.vue b/src/modules/09_leave/components/05_Leave/Tab2.vue
index 4394ec295..c46822b76 100644
--- a/src/modules/09_leave/components/05_Leave/Tab2.vue
+++ b/src/modules/09_leave/components/05_Leave/Tab2.vue
@@ -33,6 +33,7 @@ const querySting = reactive<QuerySting>({
   page: 1, //*สถานะการของลา
   pageSize: 10, //*สถานะการของลา
   keyword: leaveStore.filter.keyword, //keyword ค้นหา
+  profileType: '', //profileType
 });
 //** เรียกข้อมูลจาก API*/
 async function fecthLeaveList() {
diff --git a/src/modules/09_leave/components/05_Leave/ToolBarLeave.vue b/src/modules/09_leave/components/05_Leave/ToolBarLeave.vue
index 16621aa43..72350d583 100644
--- a/src/modules/09_leave/components/05_Leave/ToolBarLeave.vue
+++ b/src/modules/09_leave/components/05_Leave/ToolBarLeave.vue
@@ -23,6 +23,12 @@ const props = defineProps({
 });
 
 /** Option*/
+const roleMainOp = ref<DataOption[]>([
+  { id: "OFFICER", name: "ข้าราชการ กทม. สามัญ" },
+  { id: "EMPLOYEE", name: "ลูกจ้างประจำ กทม." },
+]);
+const roleOp = ref<DataOption[]>();
+
 const optionTypeMain = ref<DataOption[]>([]);
 const optionType = ref<DataOption[]>([]);
 const optionStatus = ref<DataOption[]>([
@@ -91,6 +97,18 @@ function filterOption(val: string, update: any, name: string) {
   });
 }
 
+/**
+ * function ค้นหาข้อมูลใน option
+ * @param val คำค้นหา
+ * @param update function
+ */
+function filterOptionFn(val: string, update: Function) {
+  update(() => {
+    const data = roleMainOp.value;
+    roleOp.value = data.filter((e: any) => e.name.search(val) !== -1);
+  });
+}
+
 watch(
   async () => props.dataToobar,
   () => {
@@ -116,6 +134,42 @@ watch(
 <template>
   <div class="row col-12 q-col-gutter-sm q-mb-sm">
     <div class="col-xs-12 col-sm-3 col-md-2">
+      <q-select
+        emit-value
+        map-options
+        outlined
+        dense
+        option-value="id"
+        option-label="name"
+        label="สถานภาพ"
+        use-input
+        :model-value="
+          querySting.profileType == '' ? 'ทั้งหมด' : querySting.profileType
+        "
+        hide-selected
+        fill-input
+        :options="roleOp"
+        @update:model-value="(value:any)=>(querySting.profileType = value,props.getSearch?.())"
+        @filter="(inputValue:string,
+                    doneFn:Function) => filterOptionFn(inputValue,doneFn)"
+      >
+        <template v-slot:no-option>
+          <q-item>
+            <q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
+          </q-item>
+        </template>
+        <template v-if="querySting.profileType !== ''" v-slot:append>
+          <q-icon
+            name="cancel"
+            @click.stop.prevent="
+              (querySting.profileType = ''), props.getSearch?.()
+            "
+            class="cursor-pointer"
+          />
+        </template>
+      </q-select>
+    </div>
+    <div class="col-xs-12 col-sm-3 col-md-1">
       <datepicker
         menu-class-name="modalfix"
         v-model="querySting.year"
@@ -245,7 +299,7 @@ watch(
         </template>
       </q-input>
     </div>
-    <div class="col-xs-12 col-sm-3 col-md-2">
+    <div class="col-xs-12 col-sm-3 col-md-1">
       <q-select
         for="visibleColumns"
         v-model="leaveStore.visibleColumns"
@@ -256,7 +310,6 @@ watch(
         :display-value="$q.lang.table.columns"
         emit-value
         map-options
-        style="min-width: 140px"
         :options="leaveStore.columns"
         option-value="name"
       />
diff --git a/src/modules/09_leave/interface/request/leave.ts b/src/modules/09_leave/interface/request/leave.ts
index d59f634a1..59d29d7ac 100644
--- a/src/modules/09_leave/interface/request/leave.ts
+++ b/src/modules/09_leave/interface/request/leave.ts
@@ -12,6 +12,7 @@ interface QuerySting {
   page: number; //*หน้า
   pageSize: number; //*จำนวนแถวต่อหน้า
   keyword: string; //keyword ค้นหา
+  profileType: string;
 }
 
 interface DateFilter {
diff --git a/src/modules/09_leave/stores/LeaveStore.ts b/src/modules/09_leave/stores/LeaveStore.ts
index a77c55b4e..f0ae0f0e0 100644
--- a/src/modules/09_leave/stores/LeaveStore.ts
+++ b/src/modules/09_leave/stores/LeaveStore.ts
@@ -79,6 +79,7 @@ export const useLeavelistDataStore = defineStore("leave", () => {
   async function fetchListLeaveReject(data: any[]) {
     let datalist = data.map((e: FremData) => ({
       id: e.id,
+      profileType: e.profileType ?? '-',
       leaveTypeName: e.leaveTypeName,
       leaveTypeId: e.leaveTypeId,
       fullName: e.fullName,