หน้ารายละเอียดตรง ยับยั้ง กับ อนุมัติให้ใส่เหตุผล,แก้ไขทะเบียนประวัติลูกจ้าง

src/modules/06_retirement/components/resign/ResignByid.vue

@@ -454,13 +454,40 @@
       </q-form>
     </q-card>
   </q-dialog> -->
+  <q-dialog v-model="modal" persistent>
+    <q-card style="width: 800px">
+      <q-form ref="myFormConfirm">
+        <DialogHeader
+          :title="`${actionPass ? 'การอนุมัติการลาออก' : 'การยับยั้งการลาออก'}`"
+          :close="closeModal"
+        />
+        <q-separator />
+        <q-card-section class="q-p-sm">
+          <div class="col-xs-12 col-sm-12 col-md-12">
+            <q-input
+              hide-bottom-space
+              dense
+              outlined
+              lazy-rules
+              :rules="[(val) => !!val || 'กรุณากรอกเหตุผล']"
+              v-model="reasonReign"
+              :label="`${'กรอกเหตุผล'}`"
+              type="textarea"
+            />
+          </div>
+        </q-card-section>
+        <q-separator />
+        <DialogFooter :editvisible="true" :save="conditionPopup" />
+      </q-form>
+    </q-card>
+  </q-dialog>
 </template>
 <script setup lang="ts">
 import { useRouter, useRoute } from "vue-router";
 import { useQuasar, QForm } from "quasar";
 import { ref, onMounted } from "vue";
-// import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
-// import DialogHeader from "@/modules/05_placement/components/PersonalList/DialogHeader.vue";
+import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
+import DialogHeader from "@/modules/05_placement/components/PersonalList/DialogHeader.vue";
 import { useCounterMixin } from "@/stores/mixin";
 import { useRetirementDataStore } from "@/modules/06_retirement/store";
 
@@ -487,6 +514,7 @@ const { statusText } = RetirementData;
 
 const id = ref<string>(route.params.id.toString());
 const myForm = ref<QForm | null>(null);
+const myFormConfirm = ref<QForm | null>(null);
 const edit = ref<boolean>(false);
 const dataDetail = ref<ResponseItems>({
   datetext: "",
@@ -522,6 +550,13 @@ const reason = ref<string>("");
 const location = ref<string>("");
 const status = ref<string>("");
 
+const modal = ref<boolean>(false);
+const actionPass = ref<boolean>(false);
+const reasonReign = ref<string>("");
+
+const closeModal = () => (modal.value = false);
+const openModal = () => (modal.value = true);
+
 // const modalPass = ref<boolean>(false);
 // const modalPassNot = ref<boolean>(false);
 onMounted(() => {
@@ -558,39 +593,60 @@ const fetchData = async (id: string) => {
 };
 
 const popUp = (action: "pass" | "passNot") => {
-  if (action === "pass") {
-    $q.dialog({
-      title: "ยืนยันการอนุมัติการลาออก",
-      message: "ต้องการยืนยันอนุมัติการลาออกนี้ใช่หรือไม่?",
-      cancel: {
-        flat: true,
-        color: "negative",
-      },
-      persistent: true,
-    }).onOk(async () => {
-      confirmpopUp();
-    });
-  } else if (action === "passNot") {
-    $q.dialog({
-      title: "ยืนยันการยับยั้งการลาออก",
-      message: "ต้องการยืนยันการยับยั้งการลาออกนี้ใช่หรือไม่?",
-      cancel: {
-        flat: true,
-        color: "negative",
-      },
-      persistent: true,
-    }).onOk(async () => {
-      rejectpopUp();
+  reasonReign.value = "";
+  actionPass.value = action === "pass";
+  openModal();
+  //   if (action === "pass") {
+  //     $q.dialog({
+  //       title: "ยืนยันการอนุมัติการลาออก",
+  //       message: "ต้องการยืนยันอนุมัติการลาออกนี้ใช่หรือไม่?",
+  //       cancel: {
+  //         flat: true,
+  //         color: "negative",
+  //       },
+  //       persistent: true,
+  //     }).onOk(async () => {
+  //       confirmpopUp();
+  //     });
+  //   } else if (action === "passNot") {
+  //     $q.dialog({
+  //       title: "ยืนยันการยับยั้งการลาออก",
+  //       message: "ต้องการยืนยันการยับยั้งการลาออกนี้ใช่หรือไม่?",
+  //       cancel: {
+  //         flat: true,
+  //         color: "negative",
+  //       },
+  //       persistent: true,
+  //     }).onOk(async () => {
+  //       rejectpopUp();
+  //     });
+  //   }
+};
+
+const conditionPopup = () => {
+  if (myFormConfirm.value !== null) {
+    myFormConfirm.value.validate().then(async (check) => {
+      if (check) {
+        if (actionPass.value) {
+          await confirmpopUp();
+        } else {
+          await rejectpopUp();
+        }
+      }
     });
   }
 };
 
 const confirmpopUp = async () => {
+  const body = {
+    reason: reasonReign.value,
+  };
   await http
-    .get(config.API.resignConfirm(id.value))
+    .put(config.API.resignConfirm(id.value), body)
     .then(() => {
       console.log("ยืนยัน");
-      success($q, "บันทึกสำเร็จ");
+      success($q, "การอนุมัติสำเร็จ");
+      closeModal();
     })
     .catch((e) => {
       console.log(e);
@@ -602,11 +658,14 @@ const confirmpopUp = async () => {
 };
 
 const rejectpopUp = async () => {
-  console.log("ยกเลิก");
+  const body = {
+    reason: reasonReign.value,
+  };
   await http
-    .get(config.API.resignReject(id.value))
+    .put(config.API.resignReject(id.value), body)
     .then(() => {
-      success($q, "บันทึกสำเร็จ");
+      success($q, "การยับยั้งสำเร็จ");
+      closeModal();
     })
     .catch((e) => {
       messageError($q, e);