แก้บรรจุแต่งตั้ง ตามโครงสร้างใหม่ (change req)

src/modules/05_placement/components/PersonalList/CardPosition.vue

@@ -18,6 +18,8 @@ const positionId = defineModel<string>("positionId", { required: true });
 const seletcId = defineModel<string>("seletcId", { required: true });
 const date = defineModel<Date>("datePos", { required: true });
 const positionData = defineModel<any>("position", { required: true });
+const isAll = defineModel<boolean>("isAll", { required: true });
+const isBlank = defineModel<boolean>("isBlank", { required: true });
 
 const filters = ref<string>("");
 const rowsPosition = ref<Positions[]>([]);
@@ -204,6 +206,7 @@ onMounted(async () => {
   }
 });
 </script>
+
 <template>
   <div class="column q-col-gutter-sm" style="height: 70vh">
     <!-- เลือกเลขที่ตำแหน่ง -->
@@ -215,8 +218,29 @@ onMounted(async () => {
         <div class="col-12"><q-separator /></div>
         <div class="col-12 q-pa-md">
           <q-toolbar style="padding: 0px">
-            <q-space />
             <div class="row q-gutter-md">
+              <q-checkbox
+                keep-color
+                v-model="isBlank"
+                label="แสดงเฉพาะตำแหน่งว่าง"
+                color="primary"
+              >
+                <q-tooltip>แสดงเฉพาะตำแหน่งว่าง </q-tooltip>
+              </q-checkbox>
+            </div>
+            <q-space />
+
+            <div class="row q-gutter-md">
+              <q-checkbox
+                keep-color
+                v-model="isAll"
+                label="แสดงตำแหน่งทั้งหมด"
+                color="primary"
+              >
+                <q-tooltip
+                  >แสดงตำแหน่งทั้งหมดภายใต้หน่วยงาน/ส่วนราชการที่เลือก</q-tooltip
+                >
+              </q-checkbox>
               <div>
                 <q-input outlined dense v-model="filters" label="ค้นหา">
                   <template v-slot:append>