feat:filter holdPosition

src/modules/21_report/views/02_reportRegistry.vue

@@ -82,6 +82,14 @@ const positionExecutive = ref<string>(""); //ตำแหน่งทางก
 const executiveOps = ref<DataOption[]>([]); //ตัวเลือกรายการตำแหน่งทางการบริหาร
 const executiveOpsMain = ref<DataOption[]>([]); //ตัวเลือกรายการตำแหน่งทางการบริหาร
 
+const holdPosition = ref<string>(""); //ตำแหน่งทางการบริหาร
+const holdPositionOps = ref<DataOption[]>([]); //ตัวเลือกการครองตำแหน่ง
+const holdPositionOpsMain = ref<DataOption[]>([
+  { id: "", name: "ทั้งหมด" },
+  { id: "hold", name: "ครองตำแหน่ง" },
+  { id: "not-hold", name: "ไม่ครองตำแหน่ง" },
+]); //ตัวเลือกการครองตำแหน่ง
+
 /** สภานภาพ */
 const gender = ref<string>(""); //เพศ
 const genderOpsMain = ref<DataOption[]>([]); //ตัวเลือกหลัก เพศ
@@ -442,6 +450,10 @@ function filterOption(val: string, update: any, typeOp: string) {
           : retireTypeOpsMainEMP.value.filter(
               (v: DataOption) => v.name.indexOf(val) > -1
             );
+    } else if (typeOp == "holdPosition") {
+      holdPositionOps.value = holdPositionOpsMain.value.filter(
+        (v: DataOption) => v.name.indexOf(val) > -1
+      );
     }
   });
 }
@@ -557,6 +569,7 @@ async function onSearch() {
     posLevel: posLevel.value,
     position: position.value,
     positionExecutive: positionExecutive.value,
+    holdPosition: holdPosition.value,
     gender: gender.value,
     status: status.value,
     education: education.value.trim(),
@@ -754,6 +767,7 @@ function clearFilter() {
   posLevel.value = ""; //ระดับตำแหน่ง, ชั้นงาน
   position.value = ""; //ตำแหน่งในสายงาน
   positionExecutive.value = ""; //ตำแหน่งทางการบริหาร
+  holdPosition.value = ""; //การครองตำแหน่ง
   gender.value = ""; //เพศ
   status.value = ""; //สถานภาพ
   education.value = ""; //วุฒิการศึกษา
@@ -1244,6 +1258,48 @@ watch(
                         </template>
                       </q-select>
                     </div>
+
+                    <div class="col-12">
+                      <q-separator />
+                    </div>
+                    <div class="col-12 q-px-sm">
+                      <q-select
+                        label="การครองตำแหน่ง"
+                        :model-value="
+                          holdPosition == '' ? 'ทั้งหมด' : holdPosition
+                        "
+                        :options="holdPositionOps"
+                        emit-value
+                        dense
+                        borderless
+                        map-options
+                        option-label="name"
+                        option-value="name"
+                        fill-input
+                        use-input
+                        hide-selected
+                        bg-color="white"
+                        @filter="(inputValue:any,doneFn:Function) => filterOption(inputValue, doneFn,'holdPosition') "
+                        @update:model-value="(value:string)=>(holdPosition = value)"
+                      >
+                        <template v-slot:no-option>
+                          <q-item>
+                            <q-item-section class="text-grey">
+                              ไม่มีข้อมูล
+                            </q-item-section>
+                          </q-item>
+                        </template>
+                        <template v-if="holdPosition" v-slot:append>
+                          <q-icon
+                            name="cancel"
+                            @click.stop.prevent="holdPosition = ''"
+                            class="cursor-pointer"
+                            style="opacity: 0.6"
+                          />
+                        </template>
+                      </q-select>
+                    </div>
+
                     <div class="col-12"><q-separator /></div>
                     <div
                       class="col-12 q-px-sm"