From 6aa8a61b4087fe191ba6195367d321a4491d956a Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Fri, 16 Jan 2026 09:49:12 +0700
Subject: [PATCH 1/2] feat

---
 .../components/DialogResingn.vue              | 217 ++++++++++++++++++
 .../components/DialogTransfer.vue             | 118 ++++++++++
 .../04_registryPerson/views/detailView.vue    |  29 ++-
 3 files changed, 362 insertions(+), 2 deletions(-)
 create mode 100644 src/modules/04_registryPerson/components/DialogResingn.vue
 create mode 100644 src/modules/04_registryPerson/components/DialogTransfer.vue

diff --git a/src/modules/04_registryPerson/components/DialogResingn.vue b/src/modules/04_registryPerson/components/DialogResingn.vue
new file mode 100644
index 000000000..88505c136
--- /dev/null
+++ b/src/modules/04_registryPerson/components/DialogResingn.vue
@@ -0,0 +1,217 @@
+<script setup lang="ts">
+import { ref, reactive } from "vue";
+import { useQuasar } from "quasar";
+
+import { useRouter, useRoute } from "vue-router";
+import { useCounterMixin } from "@/stores/mixin";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+/** import components*/
+import DialogHeader from "@/components/DialogHeader.vue";
+
+import type { DataOption } from "@/modules/04_registryPerson/interface/index/Main";
+
+//use
+const $q = useQuasar();
+const router = useRouter();
+const route = useRoute();
+const { showLoader, hideLoader, messageError, date2Thai, dateToISO } =
+  useCounterMixin();
+
+//props
+const modal = defineModel<boolean>("modal", { required: true });
+
+const form = reactive({
+  location: "",
+  activeDate: null as Date | null,
+  reason: "",
+  files: null as File | null,
+  remark: "",
+});
+
+const reasonOp = ref<DataOption[]>([
+  {
+    id: "CAREER",
+    name: "ประกอบอาชีพอื่น",
+  },
+  {
+    id: "MOVE",
+    name: "รับราชการสังกัดอื่น",
+  },
+  {
+    id: "FAMILY",
+    name: "ดูแลบิดามารดา",
+  },
+  {
+    id: "EDUCATION",
+    name: "ศึกษาต่อ",
+  },
+  {
+    id: "OTHER",
+    name: "อื่น ๆ",
+  },
+]);
+
+async function onSubmit() {
+  try {
+    showLoader();
+    const formData = new FormData();
+    formData.append("Location", form.location);
+    formData.append(
+      "ActiveDate",
+      form.activeDate !== null ? dateToISO(form.activeDate) : ""
+    );
+    formData.append("Reason", form.reason);
+    if (form.files) {
+      formData.append("file", form.files);
+    }
+    if (form.reason === "OTHER") {
+      formData.append("remark", form.remark);
+    }
+
+    // await http.post(config.API.listtransfer(), formData);
+    // success($q, "บันทึกข้อมูลสำเร็จ");
+  } catch (error) {
+    messageError($q, error);
+  } finally {
+    hideLoader();
+  }
+}
+
+/** function ปิด popup*/
+function closeDialog() {
+  modal.value = false;
+}
+</script>
+
+<template>
+  <q-dialog v-model="modal" persistent>
+    <q-card style="width: 40vw; max-width: 50vw">
+      <q-form greedy @submit.prevent="onSubmit">
+        <DialogHeader :tittle="'ขอลาออก'" :close="closeDialog" />
+        <q-separator />
+
+        <q-card-section class="q-pa-md">
+          <div class="col-12 row q-col-gutter-sm">
+            <div class="col-md-9 col-sm-12">
+              <q-input
+                class="inputgreen"
+                dense
+                outlined
+                v-model="form.location"
+                hide-bottom-space
+                label="สถานที่ยื่นขอลาออกจากราชการ"
+                :rules="[(val:string) => !!val || `${'กรุณากรอกสถานที่ยื่นขอลาออกจากราชการ'}`]"
+              />
+            </div>
+
+            <div class="col-md-3 col-sm-12">
+              <datepicker
+                class="inputgreen"
+                menu-class-name="modalfix"
+                v-model="form.activeDate"
+                :locale="'th'"
+                autoApply
+                borderless
+                :enableTimePicker="false"
+                week-start="0"
+              >
+                <template #year="{ year }">
+                  {{ year + 543 }}
+                </template>
+                <template #year-overlay-value="{ value }">
+                  {{ parseInt(value + 543) }}
+                </template>
+                <template #trigger>
+                  <q-input
+                    outlined
+                    dense
+                    hide-bottom-space
+                    class="full-width"
+                    :model-value="
+                      form.activeDate != null
+                        ? date2Thai(form.activeDate)
+                        : null
+                    "
+                    :label="`${'วันที่ขอลาออกจากราชการ'}`"
+                    :rules="[
+                              (val: string) =>
+                                !!val || `${'กรุณาเลือกวันที่ขอลาออกจากราชการ'}`,
+                            ]"
+                  >
+                    <template v-slot:prepend>
+                      <q-icon
+                        name="event"
+                        class="cursor-pointer"
+                        style="color: var(--q-primary)"
+                      >
+                      </q-icon>
+                    </template>
+                  </q-input>
+                </template>
+              </datepicker>
+            </div>
+
+            <div class="col-12">
+              <q-select
+                v-model="form.reason"
+                class="inputgreen'"
+                dense
+                outlined
+                emit-value
+                map-options
+                hide-bottom-space
+                option-label="name"
+                option-value="id"
+                :options="reasonOp"
+                label="เหตุผลที่ลาออกจากราชการ"
+                :rules="[
+                          (val: string) => !!val || `${'กรุณาเลือกเหตุผลที่ลาออกจากราชการ'}`,
+                        ]"
+              />
+            </div>
+
+            <div class="col-12" v-if="form.reason == 'OTHER'">
+              <q-input
+                class="inputgreen'"
+                v-model="form.remark"
+                outlined
+                hide-bottom-space
+                dense
+                type="textarea"
+                label="ระบุเหตุผล"
+                :rules="[
+                          (val: string) => !!val || `${'กรุณาระบุเหตุผล'}`,
+                        ]"
+              />
+            </div>
+
+            <div class="col-12">
+              <q-file
+                v-model="form.files"
+                class="inputgreen"
+                outlined
+                dense
+                accept=".pdf"
+                label="เอกสารเพิ่มเติม"
+              >
+                <template v-slot:prepend>
+                  <q-icon name="attach_file" /> </template
+              ></q-file>
+            </div>
+          </div>
+        </q-card-section>
+        <q-separator />
+
+        <q-card-actions align="right">
+          <q-btn type="submit" :label="`บันทึก`" color="public">
+            <q-tooltip>บันทึก</q-tooltip>
+          </q-btn>
+        </q-card-actions>
+      </q-form>
+    </q-card>
+  </q-dialog>
+</template>
+
+<style scoped></style>
diff --git a/src/modules/04_registryPerson/components/DialogTransfer.vue b/src/modules/04_registryPerson/components/DialogTransfer.vue
new file mode 100644
index 000000000..836e5fedd
--- /dev/null
+++ b/src/modules/04_registryPerson/components/DialogTransfer.vue
@@ -0,0 +1,118 @@
+div
+<script setup lang="ts">
+import { reactive, ref } from "vue";
+import { useQuasar } from "quasar";
+
+import { useRouter, useRoute } from "vue-router";
+import { useCounterMixin } from "@/stores/mixin";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+/** import components*/
+import DialogHeader from "@/components/DialogHeader.vue";
+
+//use
+const $q = useQuasar();
+const router = useRouter();
+const route = useRoute();
+const { showLoader, hideLoader, messageError, success } = useCounterMixin();
+
+//props
+const modal = defineModel<boolean>("modal", { required: true });
+
+const form = reactive({
+  tranferOrg: "",
+  noteReason: "",
+  files: null as File | null,
+});
+
+async function onSubmit() {
+  try {
+    showLoader();
+    const formData = new FormData();
+    formData.append("Organization", form.tranferOrg);
+    formData.append("Reason", form.noteReason);
+    if (form.files) {
+      formData.append("file", form.files);
+    }
+
+    // await http.post(config.API.listtransfer(), formData);
+    // success($q, "บันทึกข้อมูลสำเร็จ");
+  } catch (error) {
+    messageError($q, error);
+  } finally {
+    hideLoader();
+  }
+}
+
+/** function ปิด popup*/
+function closeDialog() {
+  modal.value = false;
+  form.tranferOrg = "";
+  form.noteReason = "";
+  form.files = null;
+}
+</script>
+
+<template>
+  <q-dialog v-model="modal" persistent>
+    <q-card style="width: 40vw; max-width: 50vw">
+      <q-form greedy @submit.prevent="onSubmit">
+        <DialogHeader :tittle="'ขอโอน'" :close="closeDialog" />
+        <q-separator />
+
+        <q-card-section class="q-pa-md">
+          <div class="col-12 row q-col-gutter-sm">
+            <div class="col-12">
+              <q-input
+                class="inputgreen"
+                dense
+                outlined
+                v-model="form.tranferOrg"
+                hide-bottom-space
+                label="หน่วยงานที่ขอโอนไป"
+                :rules="[(val:string) => !!val || `${'กรุณากรอกหน่วยงานที่ขอโอนไป'}`]"
+              />
+            </div>
+
+            <div class="col-12">
+              <q-input
+                class="inputgreen"
+                dense
+                outlined
+                v-model="form.noteReason"
+                label="เหตุผล"
+                hide-bottom-space
+                type="textarea"
+                :rules="[(val:string) => !!val || `${'กรุณากรอกเหตุผล'}`]"
+              />
+            </div>
+
+            <div class="col-12">
+              <q-file
+                v-model="form.files"
+                class="inputgreen"
+                outlined
+                dense
+                accept=".pdf"
+                label="เอกสารเพิ่มเติม"
+              >
+                <template v-slot:prepend>
+                  <q-icon name="attach_file" /> </template
+              ></q-file>
+            </div>
+          </div>
+        </q-card-section>
+        <q-separator />
+
+        <q-card-actions align="right">
+          <q-btn type="submit" :label="`บันทึก`" color="public">
+            <q-tooltip>บันทึก</q-tooltip>
+          </q-btn>
+        </q-card-actions>
+      </q-form>
+    </q-card>
+  </q-dialog>
+</template>
+
+<style scoped></style>
diff --git a/src/modules/04_registryPerson/views/detailView.vue b/src/modules/04_registryPerson/views/detailView.vue
index 51132ac2e..527c4b5ae 100644
--- a/src/modules/04_registryPerson/views/detailView.vue
+++ b/src/modules/04_registryPerson/views/detailView.vue
@@ -33,10 +33,15 @@ const DialogHeader = defineAsyncComponent(
 const TabMain = defineAsyncComponent(
   () => import("@/modules/04_registryPerson/components/detail/TabMain.vue")
 );
-
 const DialogRetired = defineAsyncComponent(
   () => import("@/modules/04_registryPerson/components/DialogRetired.vue")
 );
+const DialogResign = defineAsyncComponent(
+  () => import("@/modules/04_registryPerson/components/DialogResingn.vue")
+);
+const DialogTransfer = defineAsyncComponent(
+  () => import("@/modules/04_registryPerson/components/DialogTransfer.vue")
+);
 
 /** use*/
 const $q = useQuasar();
@@ -72,7 +77,10 @@ const reasonDeath = ref(""); //เหตุผลการเสียชีว
 const dialogImage = ref<boolean>(false); //แสดงเลือกรูปภาพ
 const formDetail = ref<ResponseObject>(); //ข้อมูลส่วนตัว
 
-const modalDialogRetired = ref<boolean>(false);
+const modalDialogResign = ref<boolean>(false); //ป๊อบอัพขอลาออก
+const modalDialogTransfer = ref<boolean>(false); //ป๊อบอัพขอโอน
+const modalDialogRetired = ref<boolean>(false); //ป๊อบอัพข้อมูลการพ้นจากราชการ
+
 //รายการเมนูออกคำสั่งข้าราชการ
 const baseItemsMenu = ref<DataOptionSys[]>([
   {
@@ -95,6 +103,8 @@ const baseItemsMenu = ref<DataOptionSys[]>([
     name: "ให้ออกจากราชการ",
     system: "SYS_DISMISS",
   },
+  { id: "7", name: "ขอโอน", system: "SYS_TRANSFER_REQ" },
+  { id: "8", name: "ขอลาออก", system: "SYS_RESIGN" },
   {
     id: "6",
     name: "อื่นๆ",
@@ -765,6 +775,14 @@ const titleName = computed(() => {
     : "ทะเบียนประวัติ";
 });
 
+function openDialogSendTransferResign(
+  system: "SYS_TRANSFER_REQ" | "SYS_RESIGN"
+) {
+  system === "SYS_TRANSFER_REQ"
+    ? (modalDialogTransfer.value = true)
+    : (modalDialogResign.value = true);
+}
+
 onMounted(async () => {
   await fetchDataPersonal();
 });
@@ -830,6 +848,9 @@ onMounted(async () => {
                 ? outPost()
                 : item.name == 'อื่นๆ'
                 ? otherPost()
+                : item.system === 'SYS_TRANSFER_REQ' ||
+                  item.system === 'SYS_RESIGN'
+                ? openDialogSendTransferResign(item.system)
                 : null
             "
             v-close-popup
@@ -1211,6 +1232,10 @@ onMounted(async () => {
 
   <!-- Dialog ข้อมูลการพ้นจากราชการ -->
   <DialogRetired v-model:modal="modalDialogRetired" :data="formDetail" />
+  <!-- ลาออก -->
+  <DialogResign v-model:modal="modalDialogResign" />
+  <!-- ขอโอน -->
+  <DialogTransfer v-model:modal="modalDialogTransfer" />
 </template>
 
 <style scoped>

From 99cba9f3bded59d5747cc7efed303fb0a8d807f3 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Fri, 16 Jan 2026 16:00:24 +0700
Subject: [PATCH 2/2] fix:API

---
 src/api/05_placement/api.placement.ts         |  3 +-
 src/api/06_retirement/api.retirement.ts       |  2 ++
 .../components/DialogResingn.vue              | 28 +++++++++++++++----
 .../components/DialogTransfer.vue             |  8 ++++--
 .../04_registryPerson/views/detailView.vue    |  5 +++-
 5 files changed, 37 insertions(+), 9 deletions(-)

diff --git a/src/api/05_placement/api.placement.ts b/src/api/05_placement/api.placement.ts
index 2a83e2200..503c64a92 100644
--- a/src/api/05_placement/api.placement.ts
+++ b/src/api/05_placement/api.placement.ts
@@ -165,7 +165,6 @@ export default {
   otherByid: (id: string) => `${placemenOther}/${id}`,
   otherPositionUse: () => `${placemenOther}/use`,
 
-
   userPlacement: (id: string) => `${placement}/user/${id}`,
 
   // orderForm
@@ -184,4 +183,6 @@ export default {
 
   //รายงาน
   placementReport: `${report}`,
+
+  transferAdmin: `${transfer}/admin`,
 };
diff --git a/src/api/06_retirement/api.retirement.ts b/src/api/06_retirement/api.retirement.ts
index d0991a12f..3dbe84071 100644
--- a/src/api/06_retirement/api.retirement.ts
+++ b/src/api/06_retirement/api.retirement.ts
@@ -110,4 +110,6 @@ export default {
     `${retirement}/${path}/admin-update/resign-info/${id}`,
 
   exRetirement: `${env.API_URI}/org/ex/retirement`,
+
+  resignAdmin: (typeEmp: string) => `${retirement}/resign${typeEmp}/admin`,
 };
diff --git a/src/modules/04_registryPerson/components/DialogResingn.vue b/src/modules/04_registryPerson/components/DialogResingn.vue
index 88505c136..d9bd78997 100644
--- a/src/modules/04_registryPerson/components/DialogResingn.vue
+++ b/src/modules/04_registryPerson/components/DialogResingn.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, reactive } from "vue";
+import { ref, reactive, computed } from "vue";
 import { useQuasar } from "quasar";
 
 import { useRouter, useRoute } from "vue-router";
@@ -16,11 +16,22 @@ import type { DataOption } from "@/modules/04_registryPerson/interface/index/Mai
 const $q = useQuasar();
 const router = useRouter();
 const route = useRoute();
-const { showLoader, hideLoader, messageError, date2Thai, dateToISO } =
-  useCounterMixin();
+const {
+  showLoader,
+  hideLoader,
+  messageError,
+  date2Thai,
+  dateToISO,
+  pathRegistryEmp,
+  success,
+} = useCounterMixin();
 
 //props
 const modal = defineModel<boolean>("modal", { required: true });
+const profileId = ref<string>(route.params.id?.toString() ?? ""); //ProfileId
+const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? "")); //ประเภทข้าราชการ
+
+const isEmployee = computed(() => empType.value !== "");
 
 const form = reactive({
   location: "",
@@ -57,6 +68,7 @@ async function onSubmit() {
   try {
     showLoader();
     const formData = new FormData();
+    formData.append("ProfileId", profileId.value);
     formData.append("Location", form.location);
     formData.append(
       "ActiveDate",
@@ -70,8 +82,9 @@ async function onSubmit() {
       formData.append("remark", form.remark);
     }
 
-    // await http.post(config.API.listtransfer(), formData);
-    // success($q, "บันทึกข้อมูลสำเร็จ");
+    await http.post(config.API.resignAdmin(empType.value), formData);
+    router.push({ name: isEmployee.value ? "resignEmployee" : "resign" });
+    success($q, "บันทึกข้อมูลสำเร็จ");
   } catch (error) {
     messageError($q, error);
   } finally {
@@ -82,6 +95,11 @@ async function onSubmit() {
 /** function ปิด popup*/
 function closeDialog() {
   modal.value = false;
+  form.location = "";
+  form.activeDate = null;
+  form.reason = "";
+  form.files = null;
+  form.remark = "";
 }
 </script>
 
diff --git a/src/modules/04_registryPerson/components/DialogTransfer.vue b/src/modules/04_registryPerson/components/DialogTransfer.vue
index 836e5fedd..5d54e07c4 100644
--- a/src/modules/04_registryPerson/components/DialogTransfer.vue
+++ b/src/modules/04_registryPerson/components/DialogTransfer.vue
@@ -20,6 +20,8 @@ const { showLoader, hideLoader, messageError, success } = useCounterMixin();
 //props
 const modal = defineModel<boolean>("modal", { required: true });
 
+const profileId = ref<string>(route.params.id?.toString() ?? ""); //ProfileId
+
 const form = reactive({
   tranferOrg: "",
   noteReason: "",
@@ -30,14 +32,16 @@ async function onSubmit() {
   try {
     showLoader();
     const formData = new FormData();
+    formData.append("ProfileId", profileId.value);
     formData.append("Organization", form.tranferOrg);
     formData.append("Reason", form.noteReason);
     if (form.files) {
       formData.append("file", form.files);
     }
 
-    // await http.post(config.API.listtransfer(), formData);
-    // success($q, "บันทึกข้อมูลสำเร็จ");
+    await http.post(config.API.transferAdmin, formData);
+    router.push({ name: "transfer" });
+    success($q, "บันทึกข้อมูลสำเร็จ");
   } catch (error) {
     messageError($q, error);
   } finally {
diff --git a/src/modules/04_registryPerson/views/detailView.vue b/src/modules/04_registryPerson/views/detailView.vue
index 527c4b5ae..90f40f839 100644
--- a/src/modules/04_registryPerson/views/detailView.vue
+++ b/src/modules/04_registryPerson/views/detailView.vue
@@ -145,6 +145,7 @@ const itemsMenuEmployee = ref<DataOptionSys[]>([
     name: "ให้ออกจากราชการ",
     system: "SYS_DISMISS_EMP",
   },
+  { id: "4", name: "ขอลาออก", system: "SYS_RESIGN_EMP" },
 ]);
 
 const uploadUrl = ref<string>(""); //URL อัปโหลดรูป
@@ -776,7 +777,7 @@ const titleName = computed(() => {
 });
 
 function openDialogSendTransferResign(
-  system: "SYS_TRANSFER_REQ" | "SYS_RESIGN"
+  system: "SYS_TRANSFER_REQ" | "SYS_RESIGN" | "SYS_RESIGN_EMP"
 ) {
   system === "SYS_TRANSFER_REQ"
     ? (modalDialogTransfer.value = true)
@@ -890,6 +891,8 @@ onMounted(async () => {
                 ? clickPassaway()
                 : item.name == 'ให้ออกจากราชการ'
                 ? outPost()
+                : item.system === 'SYS_RESIGN_EMP'
+                ? openDialogSendTransferResign(item.system)
                 : null
             "
             v-close-popup