diff --git a/src/api/05_placement/api.placement.ts b/src/api/05_placement/api.placement.ts
index bd9f76127..e85136e1a 100644
--- a/src/api/05_placement/api.placement.ts
+++ b/src/api/05_placement/api.placement.ts
@@ -3,4 +3,12 @@
  */
 import env from "../index";
 
-export default {};
+const placement = `${env.API_URI}/Placement/placement`
+
+
+export default {
+    getDatapersonal: (id: string) => `${placement}/personal/${id}`,
+    putProperty: (id: string) => `${placement}/property/${id}`
+
+
+};
diff --git a/src/modules/01_metadata/components/positionEmployee/Group.vue b/src/modules/01_metadata/components/positionEmployee/Group.vue
index 00c538863..7d8f70425 100644
--- a/src/modules/01_metadata/components/positionEmployee/Group.vue
+++ b/src/modules/01_metadata/components/positionEmployee/Group.vue
@@ -437,7 +437,7 @@ const fetchHistory = async () => {
     .catch((e) => {
       messageError($q, e);
     })
-    .finally(async () => {
+    .finally(() => {
       hideLoader();
     });
 };
diff --git a/src/modules/05_placement/components/pass/TableDetail.vue b/src/modules/05_placement/components/pass/TableDetail.vue
index b031d2121..fe29b5037 100644
--- a/src/modules/05_placement/components/pass/TableDetail.vue
+++ b/src/modules/05_placement/components/pass/TableDetail.vue
@@ -1,14 +1,16 @@
 <script setup lang="ts">
-import { ref } from "vue";
+import { ref, watch } from "vue";
 import DialogHeader from "@/modules/05_placement/components/pass/DialogHeader.vue";
 import { useQuasar } from "quasar";
 import DialogFooter from "@/modules/05_placement/components/pass/DialogFooter.vue";
 import type { QTableProps } from "quasar";
 import type { CheckboxItem } from "@/modules/05_placement/interface/index/Main";
 import { useCounterMixin } from "@/stores/mixin";
+import http from "@/plugins/http";
+import config from "@/app.config";
 const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
 const modal = ref<boolean>();
-const { success } = mixin;
+const { success, showLoader, hideLoader, date2Thai, modalConfirm } = mixin;
 const save = ref<boolean>(true);
 const props = defineProps({
   Modal: Boolean,
@@ -26,13 +28,10 @@ const props = defineProps({
   },
 });
 const rows = ref<any[]>([
-  {
-    university: props.getdetail.university || "-",
-    degree: props.getdetail.degree || "-",
-    major: props.getdetail.major || "-",
-    graduation: "2022-01-01",
-  },
-
+  // university: props.getdetail.university || "-",
+  // degree: props.getdetail.degree || "-",
+  // major: props.getdetail.major || "-",
+  // graduation: "2022-01-01",
 ]);
 const columns = ref<QTableProps["columns"]>([
   {
@@ -76,86 +75,157 @@ const columns = ref<QTableProps["columns"]>([
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
 ]);
-const myForm = ref<any>();
-const checkValidate = ref<boolean>(false);
-const selection = ref<number[]>([]);
+const myForm = ref<any>([]);
+const personalForm = ref<any>([]);
+// const checkValidate = ref<boolean>(false);
+const selection = ref<any>([]);
 
-const checkboxItems: CheckboxItem[] = [
-  { id: 1, label: "ไม่เป็นผู้ดำรงตำแหน่งทางการเมือง" },
-  {
-    id: 2,
-    label:
-      "ไม่เป็นคนไร้ความสามารถ คนเสมือนไร้ความสามารถ คนวิกลจริตหรือจิตฟั่นเฟือน ไม่สมประกอบหรือเป็นโรคตามที่กำหนดในกฎ ก.พ.",
-  },
-  {
-    id: 3,
-    label:
-      "ไม่เป็นผู้อยู่ในระหว่างถูกสั่งพักราชการหรือถูกสั่งให้ออกจากราชการไว้ก่อนตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น",
-  },
-  { id: 4, label: "ไม่เป็นผู้บกพร่องในศีลธรรมอันดีจนเป็นที่รังเกียจของสังคม" },
-  {
-    id: 5,
-    label:
-      "ไม่เป็นกรรมการหรือผู้ดำรงตำแหน่งที่รับผิดชอบในการบริหารพรรคการเมือง หรือเจ้าหน้าที่ในพรรคการเมือง",
-  },
-  { id: 6, label: "ไม่เป็นบุคคลล้มละลาย" },
-  {
-    id: 7,
-    label:
-      "ไม่เป็นผู้เคยต้องรับโทษจำคุกโดยคำพิพากษาถึงที่สุดให้จำคุกเพราะกระทำความผิดทางอาญา เว้นแต่เป็นโทษสำหรับความผิดที่ใด้กระทำโดยประมาทหรือความผิดลหุโทษ",
-  },
-  {
-    id: 8,
-    label:
-      "ไม่เป็นผู้เคยถูกลงโทษให้ออก ปลดออก หรือไล่ออกจากรัฐวิสาหกิจ หรือ หน่วยงานอื่นของรัฐ",
-  },
-  {
-    id: 9,
-    label:
-      "เป็นผู้เคยถูลงโทษให้ออก หรือปลดออก เพราะกระทำผิตวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น",
-  },
-  {
-    id: 10,
-    label:
-      "เป็นผู้เคยถูกลงโทษไล่ออก เพราะกระทำผิดวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น",
-  },
-  {
-    id: 11,
-    label:
-      "เป็นผู้เคยกระทำการทุจริตในการสอบเข้ารับราชการ หรือเข้าปฏิบัติงานใน หน่วยงานของรัฐ",
-  },
-];
+// const checkboxItems: CheckboxItem[] = [
+//   { id: 1, label: "ไม่เป็นผู้ดำรงตำแหน่งทางการเมือง" },
+//   {
+//     id: 2,
+//     label:
+//       "ไม่เป็นคนไร้ความสามารถ คนเสมือนไร้ความสามารถ คนวิกลจริตหรือจิตฟั่นเฟือน ไม่สมประกอบหรือเป็นโรคตามที่กำหนดในกฎ ก.พ.",
+//   },
+//   {
+//     id: 3,
+//     label:
+//       "ไม่เป็นผู้อยู่ในระหว่างถูกสั่งพักราชการหรือถูกสั่งให้ออกจากราชการไว้ก่อนตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น",
+//   },
+//   { id: 4, label: "ไม่เป็นผู้บกพร่องในศีลธรรมอันดีจนเป็นที่รังเกียจของสังคม" },
+//   {
+//     id: 5,
+//     label:
+//       "ไม่เป็นกรรมการหรือผู้ดำรงตำแหน่งที่รับผิดชอบในการบริหารพรรคการเมือง หรือเจ้าหน้าที่ในพรรคการเมือง",
+//   },
+//   { id: 6, label: "ไม่เป็นบุคคลล้มละลาย" },
+//   {
+//     id: 7,
+//     label:
+//       "ไม่เป็นผู้เคยต้องรับโทษจำคุกโดยคำพิพากษาถึงที่สุดให้จำคุกเพราะกระทำความผิดทางอาญา เว้นแต่เป็นโทษสำหรับความผิดที่ใด้กระทำโดยประมาทหรือความผิดลหุโทษ",
+//   },
+//   {
+//     id: 8,
+//     label:
+//       "ไม่เป็นผู้เคยถูกลงโทษให้ออก ปลดออก หรือไล่ออกจากรัฐวิสาหกิจ หรือ หน่วยงานอื่นของรัฐ",
+//   },
+//   {
+//     id: 9,
+//     label:
+//       "เป็นผู้เคยถูลงโทษให้ออก หรือปลดออก เพราะกระทำผิตวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น",
+//   },
+//   {
+//     id: 10,
+//     label:
+//       "เป็นผู้เคยถูกลงโทษไล่ออก เพราะกระทำผิดวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น",
+//   },
+//   {
+//     id: 11,
+//     label:
+//       "เป็นผู้เคยกระทำการทุจริตในการสอบเข้ารับราชการ หรือเข้าปฏิบัติงานใน หน่วยงานของรัฐ",
+//   },
+// ];
 const $q = useQuasar();
+
 function isRequired(val: any): boolean | string {
   return !!val || "กรุณาเลือกไฟล์เอกสารหลักฐาน";
 }
-const validateData = () => {
-  const selectedIds = selection.value;
-  const selectedItems = checkboxItems.filter((item) =>
-    selectedIds.includes(item.id)
-  );
 
+watch(props, () => {
+  if (props.Modal === true) {
+    console.log(props.getdetail);
+    fetchData();
+  }
+});
+
+const validateData = () => {
+  const selectedIds = personalForm.value.isProperty;
+
+  const selectedItems = personalForm.value.isProperty.filter(
+    (item) => item.value === true
+    // selectedIds.includes(item.value)
+  );
   return (
-    selectedItems.length > 0 && selectedItems.length === selectedIds.length
+    selectedItems.length > 0 || selectedItems.length === selectedIds.length
   );
 };
 
 const ClickSave = () => {
   const isValid = validateData();
+
   if (isValid) {
-    console.log(selection.value);
-    console.log("rerer", props.Modal);
-    props.close();
-    props.validate();
-    selection.value = [];
+    // props.close();
+    // props.validate();
+    // putpersonalForm();
+    modalConfirm(
+      $q,
+      "การยืนยัน",
+      "ยืนยันการบันทึกการคัดกรองคุณสมบัติ",
+      putpersonalForm
+    );
   } else {
     success($q, "กรอกให้ครบ");
+    console.log();
+  }
+};
+const fetchData = async () => {
+  showLoader();
+  await http
+    .get(config.API.getDatapersonal("0a846508-4932-40de-9a9e-5b519492217c"))
+    .then((res) => {
+      personalForm.value = res.data.result;
+      personalForm.value.education.map((e) => {
+        rows.value.push({
+          university: e.name,
+          degree: e.degree,
+          major: e.field,
+          graduation: e.finishDate,
+        });
+      });
+    })
+    .catch((e) => {
+      console.log("e", e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+};
+const formBmaofficer = (val: string) => {
+  switch (val) {
+    case "officer":
+      return "ขรก.กทม. สามัญ";
+      break;
+    case "employee_perm":
+      return "ลูกจ้างประจำ";
+      break;
+    case "employee_temp":
+      return "ลูกจ้างชั่วคราว";
+      break;
+    default:
+      "";
   }
 };
-
 const close = async () => {
   props.close();
   selection.value = [];
+  rows.value = [];
+};
+const putpersonalForm = async () => {
+  await http
+    .put(
+      config.API.putProperty("0a846508-4932-40de-9a9e-5b519492217c"),
+      personalForm.value.isProperty
+    )
+    .then((res) => {
+      success($q, res.data.message);
+    })
+    .catch((e) => {
+      console.log(e);
+    })
+    .finally(() => {
+      props.close();
+      props.validate();
+    });
 };
 </script>
 <template>
@@ -164,7 +234,7 @@ const close = async () => {
       <q-form ref="myForm">
         <div class="row">
           <DialogHeader
-            :title="`รายละเอียดของ ${props.getdetail.fullName}`"
+            :title="`รายละเอียดของ ${personalForm.fullName}`"
             @click="close"
           />
         </div>
@@ -176,7 +246,10 @@ const close = async () => {
               <div class="row items-center q-pa-xs header-text">
                 ข้อมูลทั่วไป
                 <span class="check-officer"
-                  ><q-icon name="mdi-check" /> ข้าราชการฯ กทม</span
+                  ><q-icon
+                    name="mdi-check"
+                    v-if="personalForm.bmaofficer !== null && ''"
+                  />{{ formBmaofficer(personalForm.bmaofficer) }}</span
                 >
               </div>
               <div class="row q-pa-xs">
@@ -186,10 +259,10 @@ const close = async () => {
                 </div>
                 <div class="col-4 sub-text">
                   <div class="q-pb-md">
-                    {{ props.getdetail.profileID }}
+                    {{ personalForm.idCard }}
                   </div>
                   <div>
-                    {{ props.getdetail.dateOfBirth }}
+                    {{ date2Thai(personalForm.dateOfBirth) }}
                   </div>
                 </div>
                 <div class="col-2 header-sub-text">
@@ -198,10 +271,10 @@ const close = async () => {
                 </div>
                 <div class="col-3 sub-text">
                   <div class="q-pb-md">
-                    {{ props.getdetail.fullName }}
+                    {{ personalForm.fullName }}
                   </div>
                   <div>
-                    {{ props.getdetail.gender }}
+                    {{ personalForm.gender }}
                   </div>
                 </div>
               </div>
@@ -213,7 +286,7 @@ const close = async () => {
               <div class="row q-pa-xs">
                 <div class="col-3 header-sub-text">ที่อยู่</div>
                 <div class="col-9 sub-text">
-                  {{ props.getdetail.address }}
+                  {{ personalForm.address }}
                 </div>
               </div>
             </q-card>
@@ -252,31 +325,31 @@ const close = async () => {
                       <div class="col-4 q-pa-xs">
                         <div class="header-sub-text-exam-2">คะแนนที่ได้</div>
                         <div class="sub-text-exam">
-                          {{ props.getdetail.scoreResult.scoreAFull }}
+                          {{ personalForm.pointTotalA }}
                         </div>
                         <div class="sub-text-exam">
-                          {{ props.getdetail.scoreResult.scoreBFull }}
+                          {{ personalForm.pointTotalB }}
                         </div>
                         <div class="sub-text-exam">
-                          {{ props.getdetail.scoreResult.scoreCFull }}
+                          {{ personalForm.pointTotalC }}
                         </div>
                         <div class="sub-text-exam">
-                          {{ props.getdetail.scoreResult.scoreSumFull }}
+                          {{ personalForm.pointTotal }}
                         </div>
                       </div>
                       <div class="col-4 q-pa-xs header-sub-text-exam-2">
                         <div class="header-sub-text-exam-2">ผลการสอบ</div>
                         <div class="sub-text-exam">
-                          {{ props.getdetail.scoreResult.scoreA }}
+                          {{ personalForm.pointA }}
                         </div>
                         <div class="sub-text-exam">
-                          {{ props.getdetail.scoreResult.scoreB }}
+                          {{ personalForm.pointB }}
                         </div>
                         <div class="sub-text-exam">
-                          {{ props.getdetail.scoreResult.scoreC }}
+                          {{ personalForm.pointC }}
                         </div>
                         <div class="sub-text-exam">
-                          {{ props.getdetail.scoreResult.scoreSum }}
+                          {{ personalForm.point }}
                         </div>
                       </div>
                     </div>
@@ -292,10 +365,10 @@ const close = async () => {
                     </div>
                     <div class="col-5 sub-text-exam">
                       <div class="q-pb-sm">
-                        {{ props.getdetail.scoreResult.examResult }}
+                        {{ personalForm.pass }}
                       </div>
-                      <div class="q-pb-sm">{{ props.getdetail.number }}</div>
-                      <div class="q-pb-sm">{{ props.getdetail.examCount }}</div>
+                      <div class="q-pb-sm">{{ personalForm.examNumber }}</div>
+                      <div class="q-pb-sm">{{ personalForm.examRound }}</div>
                     </div>
                   </div>
                 </div>
@@ -308,12 +381,16 @@ const close = async () => {
               <div class="col-12 row items-center q-pa-sm header-text">
                 การคัดกรองคุณสมบัติ
               </div>
-              <div v-for="item of checkboxItems" :key="item.id" class="q-pa-sm">
+              <div
+                v-for="(item, index) of personalForm.isProperty"
+                :key="index"
+                class="q-pa-sm"
+              >
                 <q-checkbox
                   size="xs"
-                  v-model="selection"
-                  :val="item.id"
-                  :label="item.label"
+                  v-model="item.value"
+                  :val="item.value"
+                  :label="item.name"
                   keep-color
                   color="teal"
                   :rules="[isRequired]"