ต่อ api บรรจุ

src/modules/05_placement/components/PersonalDetail/Qualification.vue

@@ -1,46 +1,69 @@
 <script setup lang="ts">
-import { ref } from 'vue';
-import type { CheckboxItem } from "@/modules/05_placement/interface/index/Main";
-import type { QForm } from 'quasar';
+import { ref, onMounted } from "vue";
 import { useQuasar } from "quasar";
 import { useCounterMixin } from "@/stores/mixin";
+import { useRoute } from "vue-router";
+
 import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
+
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+import type { PropType } from "vue";
+import type { Property } from "@/modules/05_placement/interface/index/Main";
+
 const $q = useQuasar();
 const mixin = useCounterMixin();
-const {
-  modalError,
-} = mixin;
+const route = useRoute();
+const { showLoader, hideLoader, messageError, success } = mixin;
 
 const props = defineProps({
   statusEdit: {
     type: Boolean,
     required: true,
   },
-  notiNoEdit: {
+  data: {
+    type: Array as PropType<Property[]>,
+    default: [],
+  },
+  fetch: {
     type: Function,
     default: () => console.log("not function"),
   },
 });
-const emit = defineEmits(["update:statusEdit"]);
+const emit = defineEmits(["update:statusEdit", "update:data"]);
 
 const edit = ref<boolean>(false);
-const myform = ref<QForm | null>(null);
+
+onMounted(() => {
+  emit("update:statusEdit", false);
+});
+
 const saveData = async () => {
-  if (myform.value != null) {
-    await myform.value.validate().then(async (success: boolean) => {
-      if (success) {
-        await editData();
-      } else {
-      }
+  showLoader();
+  await http
+    .put(
+      config.API.placementPropertyId(route.params.personalId.toString()),
+      props.data
+    )
+    .then((res: any) => {
+      success($q, "แก้ไขข้อมูลสำเร็จ");
+    })
+    .catch((e: any) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      await props.fetch();
+      edit.value = false;
+      hideLoader();
+      changeBtn();
     });
-  }
 };
 
 const changeBtn = async () => {
   if (edit.value == true) {
     if (props.statusEdit === true) {
       edit.value = false;
-      props.notiNoEdit();
     } else {
       emit("update:statusEdit", true);
     }
@@ -49,43 +72,34 @@ const changeBtn = async () => {
   }
 };
 
-const editData = async () => {
-  modalError($q, "พบข้อผิดพลาด", "วันเกิดไม่ถูกต้อง");
-}
-
 const onCancel = async () => {
-  if (myform.value != null) {
-    myform.value.reset();
-  }
-  //   await fetchData();
+  await props.fetch();
 };
-
-
-const selection = ref([]);
-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: 'เป็นผู้เคยกระทำการทุจริตในการสอบเข้ารับราชการ หรือเข้าปฏิบัติงานใน หน่วยงานของรัฐ' },
-]
 </script>
 <template>
   <div class="row col-12 q-px-lg q-pt-lg q-pb-sm no-border">
-    <HeaderTop v-model:edit="edit" header="การคัดกรองคุณสมบัติ" icon="mdi-account-search" :save="saveData"
-      :history="false" :changeBtn="changeBtn" :disable="statusEdit" :cancel="onCancel" />
+    <HeaderTop
+      v-model:edit="edit"
+      header="การคัดกรองคุณสมบัติ"
+      icon="mdi-account-search"
+      :save="saveData"
+      :history="false"
+      :changeBtn="changeBtn"
+      :disable="statusEdit"
+      :cancel="onCancel"
+    />
   </div>
   <div class="row q-px-lg">
-    <div v-for="item of checkboxItems" :key="item.id" class="col-12 q-pt-sm">
-      <q-checkbox size="xs" v-model="selection" :val="item.id" :label="item.label" keep-color color="gray-5"
-        :disable="!statusEdit" />
+    <div v-for="item of props.data" :key="item.name" class="col-12 q-pt-sm">
+      <q-checkbox
+        size="xs"
+        v-model="item.value"
+        :label="item.name"
+        keep-color
+        color="gray-5"
+        :disable="!statusEdit"
+      />
       <q-separator />
     </div>
   </div>
-</template>
+</template>