From 9ab5d441e232735ea10721d1fc090a13878235fe Mon Sep 17 00:00:00 2001
From: AnandaTon <125332905+anandaAiemvong@users.noreply.github.com>
Date: Wed, 16 Aug 2023 17:12:32 +0700
Subject: [PATCH] =?UTF-8?q?api=20=E0=B8=9B=E0=B8=A5=E0=B8=94=E0=B8=AD?=
 =?UTF-8?q?=E0=B8=AD=E0=B8=81=20=E0=B9=84=E0=B8=A5=E0=B9=88=E0=B8=AD?=
 =?UTF-8?q?=E0=B8=AD=E0=B8=81=20=E0=B9=83=E0=B8=AB=E0=B9=89=E0=B8=AD?=
 =?UTF-8?q?=E0=B8=AD=E0=B8=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

 เพิ่ม form / q dialogmassage delete
---
 src/api/06_retirement/api.retirement.ts       |   6 +-
 .../components/Discharged/dischargedMain.vue  |  82 +++-----
 .../Discharged/dischargedRegistry.vue         | 195 ++++++++++++++++--
 .../components/DismissOrder/DismissOrder.vue  |  80 +++----
 .../components/DismissOrder/outRegistry.vue   | 191 +++++++++++++++--
 .../components/Expulsion/expulsionMain.vue    |  80 +++----
 .../Expulsion/expulsionRegistry.vue           | 191 +++++++++++++++--
 7 files changed, 630 insertions(+), 195 deletions(-)

diff --git a/src/api/06_retirement/api.retirement.ts b/src/api/06_retirement/api.retirement.ts
index 24aea972b..8fff353c7 100644
--- a/src/api/06_retirement/api.retirement.ts
+++ b/src/api/06_retirement/api.retirement.ts
@@ -28,9 +28,9 @@ export default {
   resignReject: (id: string) => `${retirement}/resign/reject/${id}`,
   // ปลดออก
   retirementDischarge,
-  listDischared: () => `${retirement}/dischared`,
-  discharedByid: (id: string) => `${retirement}/dischared/${id}`,
-  discharedReport: `${retirement}/dischared/report`,
+  listDischarge: () => `${retirement}/discharge`,
+  dischargeByid: (id: string) => `${retirement}/discharge/${id}`,
+  dischargeReport: `${retirement}/discharge/report`,
 
   // ไล่ออก
   retirementExpulsion,
diff --git a/src/modules/06_retirement/components/Discharged/dischargedMain.vue b/src/modules/06_retirement/components/Discharged/dischargedMain.vue
index 38dee5be2..9096d94f5 100644
--- a/src/modules/06_retirement/components/Discharged/dischargedMain.vue
+++ b/src/modules/06_retirement/components/Discharged/dischargedMain.vue
@@ -26,7 +26,14 @@ const router = useRouter();
 const mixin = useCounterMixin();
 const transferStore = useTransferDataStore();
 
-const { date2Thai, messageError, showLoader, hideLoader, success } = mixin;
+const {
+  date2Thai,
+  messageError,
+  showLoader,
+  hideLoader,
+  success,
+  dialogMessage,
+} = mixin;
 const { statusText } = transferStore;
 
 const modal = ref<boolean>(false);
@@ -36,7 +43,6 @@ const visibleColumns = ref<string[]>([
   "position",
   "positionLevel",
   "organizationPositionOld",
-  "organization",
   "statustext",
 ]);
 const visibleColumns2 = ref<string[]>([
@@ -45,7 +51,6 @@ const visibleColumns2 = ref<string[]>([
   "position",
   "positionLevel",
   "organizationPositionOld",
-  "organization",
   "statustext",
 ]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
 const filterKeyword = ref<string>("");
@@ -109,15 +114,6 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "organization",
-    align: "left",
-    label: "หน่วยงานที่ขอโอนไป",
-    sortable: true,
-    field: "organization",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
   {
     name: "statustext",
     align: "left",
@@ -174,15 +170,6 @@ const columns2 = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "organization",
-    align: "left",
-    label: "หน่วยงานที่ขอโอนไป",
-    sortable: true,
-    field: "organization",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
   {
     name: "statustext",
     align: "left",
@@ -254,33 +241,32 @@ const getData = async () => {
     });
 };
 
-const clickDelete = (id: string) => {
-  $q.dialog({
-    title: "ยืนยันการลบข้อมูล",
-    message: "ต้องการลบข้อมูลนี้ใช่หรือไม่?",
-    cancel: {
-      flat: true,
-      color: "negative",
-    },
-    persistent: true,
-  })
-    .onOk(async () => {
-      showLoader();
-      await http
-        .delete(config.API.discharedByid(id))
-        .then((res) => {
-          success($q, "ลบข้อมูลสำเร็จ");
-          getData();
-        })
-        .catch((e) => {
-          messageError($q, e);
-        })
-        .finally(() => {
-          hideLoader();
-        });
+const clickDelete = async (name: string, id: string) => {
+  dialogMessage(
+    $q,
+    `ลบข้อมูล`,
+    `ต้องการทำการลบข้อมูลนี้ใช่หรือไม่?`,
+    "delete",
+    "ยืนยัน",
+    "red",
+    async () => await deleteData(id),
+    async () => await getData()
+  );
+};
+
+const deleteData = async (id: string) => {
+  await http
+    .delete(config.API.dischargeByid(id))
+    .then((res) => {
+      success($q, "ลบข้อมูลสำเร็จ");
+      console.log(res);
     })
-    .onCancel(() => {})
-    .onDismiss(() => {});
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      await getData();
+    });
 };
 
 const saveOrder = async () => {
@@ -291,7 +277,7 @@ const saveOrder = async () => {
 
   showLoader();
   await http
-    .post(config.API.discharedReport, body)
+    .post(config.API.dischargeReport, body)
     .then((res: any) => {
       //   const data = res.data.result;
       //   console.log(data);
diff --git a/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue b/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue
index 9d7047efc..d6ef47acd 100644
--- a/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue
+++ b/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue
@@ -66,7 +66,7 @@
     </div>
   </q-card>
 
-  <q-card bordered class="row col-12 text-dark q-mt-sm">
+  <!-- <q-card bordered class="row col-12 text-dark q-mt-sm">
     <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
       <div class="q-pl-sm text-weight-bold text-dark">ข้อมูลการปลดออก</div>
       <q-space />
@@ -146,7 +146,7 @@
         </template>
       </d-table>
     </div>
-  </q-card>
+  </q-card> -->
 
   <q-card bordered class="row col-12 text-dark q-mt-sm">
     <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
@@ -188,6 +188,175 @@
       </div>
     </div>
     <div class="col-12"><q-separator /></div>
+    <q-form ref="myForm">
+      <div class="row col-12 q-pa-md">
+        <div class="col-12 row bg-white q-col-gutter-md">
+          <div class="col-xs-12 row items-center">
+            <div class="col-12">
+              <div class="text-weight-bold text-grey">
+                ตำแหน่งและหน่วยงานเดิม
+              </div>
+            </div>
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="organizationPositionOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
+                hide-bottom-space
+                :label="`${'ตำแหน่ง/สังกัด'}`"
+                type="textarea"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="positionTypeOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งประเภท'}`]"
+                hide-bottom-space
+                :label="`${'ตำแหน่งประเภท'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="positionLevelOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกระดับ'}`]"
+                hide-bottom-space
+                :label="`${'ระดับ'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="posNo"
+                :rules="[(val) => !!val || `${'กรุณากรอกเลขที่'}`]"
+                hide-bottom-space
+                :label="`${'เลขที่'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="salary"
+                :rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
+                hide-bottom-space
+                :label="`${'เงินเดือน'}`"
+                type="number"
+              />
+            </div>
+          </div>
+          <div class="col-12"><q-separator /></div>
+          <div class="col-xs-6 col-sm-6 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="organization"
+                :rules="[(val) => !!val || `${'กรุณากรอกการปลดออก'}`]"
+                hide-bottom-space
+                :label="`${'การปลดออก'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-6 row items-center">
+            <div class="col-12">
+              <datepicker
+                menu-class-name="modalfix"
+                :readonly="!edit"
+                v-model="date"
+                :locale="'th'"
+                autoApply
+                :enableTimePicker="false"
+                week-start="0"
+              >
+                <template #year="{ year }">{{ year + 543 }}</template>
+                <template #year-overlay-value="{ value }">{{
+                  parseInt(value + 543)
+                }}</template>
+                <template #trigger>
+                  <q-input
+                    :class="getClass(edit)"
+                    :outlined="edit"
+                    dense
+                    lazy-rules
+                    :borderless="!edit"
+                    :model-value="date !== null ? date2Thai(date) : null"
+                    :rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
+                    hide-bottom-space
+                    :label="`${'ตั้งแต่วัน'}`"
+                  >
+                    <template v-slot:prepend>
+                      <q-icon
+                        name="event"
+                        class="cursor-pointer"
+                        :style="
+                          edit
+                            ? 'color: var(--q-primary)'
+                            : 'color: var(--q-grey)'
+                        "
+                      >
+                      </q-icon>
+                    </template>
+                  </q-input>
+                </template>
+              </datepicker>
+            </div>
+          </div>
+          <div class="col-12">
+            <q-input
+              :class="getClass(edit)"
+              :outlined="edit"
+              dense
+              lazy-rules
+              :readonly="!edit"
+              :borderless="!edit"
+              v-model="reason"
+              :rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
+              hide-bottom-space
+              :label="`${'หมายเหตุ '}`"
+              type="textarea"
+            />
+          </div>
+        </div>
+      </div>
+    </q-form>
   </q-card>
 </template>
 <script setup lang="ts">
@@ -292,20 +461,10 @@ onMounted(async () => {
 const getData = async () => {
   showLoader();
   await http
-    .get(config.API.discharedByid(personId.toString()))
+    .get(config.API.dischargeByid(personId.toString()))
     .then((res: any) => {
       const data = res.data.result;
-      //   console.log(data);
-      let list: TypeFile[] = [];
-      if (data.docs.length > 0) {
-        data.docs.map((doc: TypeFile) => {
-          list.push({
-            pathName: doc.pathName ?? "",
-            fileName: doc.fileName ?? "",
-          });
-        });
-      }
-      rows.value = list;
+
       responseData.value.createdAt = data.createdAt;
       responseData.value.date =
         data.date !== null ? new Date(data.date) : new Date();
@@ -320,9 +479,9 @@ const getData = async () => {
       responseData.value.salary = data.salary !== null ? data.salary : 0;
       responseData.value.status = data.status ?? "";
       responseData.value.avataPath = data.avataPath ?? "";
-      responseData.value.fullname = `${data.prefix ?? "-"} ${
-        data.firstName ?? "-"
-      } ${data.lastName ?? "-"}`;
+      responseData.value.fullname = `${data.firstName ?? "-"} ${
+        data.lastName ?? "-"
+      }`;
 
       organizationPositionOld.value = data.organizationPositionOld ?? "";
       positionTypeOld.value = data.positionTypeOld ?? "";
@@ -404,7 +563,7 @@ const saveData = async () => {
   };
   showLoader();
   await http
-    .put(config.API.discharedByid(personId.toString()), body)
+    .put(config.API.dischargeByid(personId.toString()), body)
     .then((res: any) => {
       //   const data = res.data.result;
       //   console.log(data);
diff --git a/src/modules/06_retirement/components/DismissOrder/DismissOrder.vue b/src/modules/06_retirement/components/DismissOrder/DismissOrder.vue
index 5a174a027..5d2104643 100644
--- a/src/modules/06_retirement/components/DismissOrder/DismissOrder.vue
+++ b/src/modules/06_retirement/components/DismissOrder/DismissOrder.vue
@@ -26,7 +26,14 @@ const router = useRouter();
 const mixin = useCounterMixin();
 const transferStore = useTransferDataStore();
 
-const { date2Thai, messageError, showLoader, hideLoader, success } = mixin;
+const {
+  date2Thai,
+  messageError,
+  showLoader,
+  hideLoader,
+  success,
+  dialogMessage,
+} = mixin;
 const { statusText } = transferStore;
 
 const modal = ref<boolean>(false);
@@ -36,7 +43,6 @@ const visibleColumns = ref<string[]>([
   "position",
   "positionLevel",
   "organizationPositionOld",
-  "organization",
   "statustext",
 ]);
 const visibleColumns2 = ref<string[]>([
@@ -45,7 +51,6 @@ const visibleColumns2 = ref<string[]>([
   "position",
   "positionLevel",
   "organizationPositionOld",
-  "organization",
   "statustext",
 ]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
 const filterKeyword = ref<string>("");
@@ -109,15 +114,6 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "organization",
-    align: "left",
-    label: "หน่วยงานที่ขอโอนไป",
-    sortable: true,
-    field: "organization",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
   {
     name: "statustext",
     align: "left",
@@ -174,15 +170,6 @@ const columns2 = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "organization",
-    align: "left",
-    label: "หน่วยงานที่ขอโอนไป",
-    sortable: true,
-    field: "organization",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
   {
     name: "statustext",
     align: "left",
@@ -254,33 +241,32 @@ const getData = async () => {
     });
 };
 
-const clickDelete = (id: string) => {
-  $q.dialog({
-    title: "ยืนยันการลบข้อมูล",
-    message: "ต้องการลบข้อมูลนี้ใช่หรือไม่?",
-    cancel: {
-      flat: true,
-      color: "negative",
-    },
-    persistent: true,
-  })
-    .onOk(async () => {
-      showLoader();
-      await http
-        .delete(config.API.outByid(id))
-        .then((res) => {
-          success($q, "ลบข้อมูลสำเร็จ");
-          getData();
-        })
-        .catch((e) => {
-          messageError($q, e);
-        })
-        .finally(() => {
-          hideLoader();
-        });
+const clickDelete = async (name: string, id: string) => {
+  dialogMessage(
+    $q,
+    `ลบข้อมูล`,
+    `ต้องการทำการลบข้อมูลนี้ใช่หรือไม่?`,
+    "delete",
+    "ยืนยัน",
+    "red",
+    async () => await deleteData(id),
+    async () => await getData()
+  );
+};
+
+const deleteData = async (id: string) => {
+  await http
+    .delete(config.API.outByid(id))
+    .then((res) => {
+      success($q, "ลบข้อมูลสำเร็จ");
+      console.log(res);
     })
-    .onCancel(() => {})
-    .onDismiss(() => {});
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      await getData();
+    });
 };
 
 const saveOrder = async () => {
diff --git a/src/modules/06_retirement/components/DismissOrder/outRegistry.vue b/src/modules/06_retirement/components/DismissOrder/outRegistry.vue
index 42287dfb1..b05ebdda3 100644
--- a/src/modules/06_retirement/components/DismissOrder/outRegistry.vue
+++ b/src/modules/06_retirement/components/DismissOrder/outRegistry.vue
@@ -66,7 +66,7 @@
     </div>
   </q-card>
 
-  <q-card bordered class="row col-12 text-dark q-mt-sm">
+  <!-- <q-card bordered class="row col-12 text-dark q-mt-sm">
     <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
       <div class="q-pl-sm text-weight-bold text-dark">ข้อมูลการให้ออก</div>
       <q-space />
@@ -146,7 +146,7 @@
         </template>
       </d-table>
     </div>
-  </q-card>
+  </q-card> -->
 
   <q-card bordered class="row col-12 text-dark q-mt-sm">
     <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
@@ -188,6 +188,175 @@
       </div>
     </div>
     <div class="col-12"><q-separator /></div>
+    <q-form ref="myForm">
+      <div class="row col-12 q-pa-md">
+        <div class="col-12 row bg-white q-col-gutter-md">
+          <div class="col-xs-12 row items-center">
+            <div class="col-12">
+              <div class="text-weight-bold text-grey">
+                ตำแหน่งและหน่วยงานเดิม
+              </div>
+            </div>
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="organizationPositionOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
+                hide-bottom-space
+                :label="`${'ตำแหน่ง/สังกัด'}`"
+                type="textarea"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="positionTypeOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งประเภท'}`]"
+                hide-bottom-space
+                :label="`${'ตำแหน่งประเภท'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="positionLevelOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกระดับ'}`]"
+                hide-bottom-space
+                :label="`${'ระดับ'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="posNo"
+                :rules="[(val) => !!val || `${'กรุณากรอกเลขที่'}`]"
+                hide-bottom-space
+                :label="`${'เลขที่'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="salary"
+                :rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
+                hide-bottom-space
+                :label="`${'เงินเดือน'}`"
+                type="number"
+              />
+            </div>
+          </div>
+          <div class="col-12"><q-separator /></div>
+          <div class="col-xs-6 col-sm-6 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="organization"
+                :rules="[(val) => !!val || `${'กรุณากรอกการให้ออกสังกัด'}`]"
+                hide-bottom-space
+                :label="`${'การให้ออกสังกัด'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-6 row items-center">
+            <div class="col-12">
+              <datepicker
+                menu-class-name="modalfix"
+                :readonly="!edit"
+                v-model="date"
+                :locale="'th'"
+                autoApply
+                :enableTimePicker="false"
+                week-start="0"
+              >
+                <template #year="{ year }">{{ year + 543 }}</template>
+                <template #year-overlay-value="{ value }">{{
+                  parseInt(value + 543)
+                }}</template>
+                <template #trigger>
+                  <q-input
+                    :class="getClass(edit)"
+                    :outlined="edit"
+                    dense
+                    lazy-rules
+                    :borderless="!edit"
+                    :model-value="date !== null ? date2Thai(date) : null"
+                    :rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
+                    hide-bottom-space
+                    :label="`${'ตั้งแต่วัน'}`"
+                  >
+                    <template v-slot:prepend>
+                      <q-icon
+                        name="event"
+                        class="cursor-pointer"
+                        :style="
+                          edit
+                            ? 'color: var(--q-primary)'
+                            : 'color: var(--q-grey)'
+                        "
+                      >
+                      </q-icon>
+                    </template>
+                  </q-input>
+                </template>
+              </datepicker>
+            </div>
+          </div>
+          <div class="col-12">
+            <q-input
+              :class="getClass(edit)"
+              :outlined="edit"
+              dense
+              lazy-rules
+              :readonly="!edit"
+              :borderless="!edit"
+              v-model="reason"
+              :rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
+              hide-bottom-space
+              :label="`${'หมายเหตุ '}`"
+              type="textarea"
+            />
+          </div>
+        </div>
+      </div>
+    </q-form>
   </q-card>
 </template>
 <script setup lang="ts">
@@ -295,17 +464,7 @@ const getData = async () => {
     .get(config.API.outByid(personId.toString()))
     .then((res: any) => {
       const data = res.data.result;
-      //   console.log(data);
-      let list: TypeFile[] = [];
-      if (data.docs.length > 0) {
-        data.docs.map((doc: TypeFile) => {
-          list.push({
-            pathName: doc.pathName ?? "",
-            fileName: doc.fileName ?? "",
-          });
-        });
-      }
-      rows.value = list;
+
       responseData.value.createdAt = data.createdAt;
       responseData.value.date =
         data.date !== null ? new Date(data.date) : new Date();
@@ -320,9 +479,9 @@ const getData = async () => {
       responseData.value.salary = data.salary !== null ? data.salary : 0;
       responseData.value.status = data.status ?? "";
       responseData.value.avataPath = data.avataPath ?? "";
-      responseData.value.fullname = `${data.prefix ?? "-"} ${
-        data.firstName ?? "-"
-      } ${data.lastName ?? "-"}`;
+      responseData.value.fullname = `${data.firstName ?? "-"} ${
+        data.lastName ?? "-"
+      }`;
 
       organizationPositionOld.value = data.organizationPositionOld ?? "";
       positionTypeOld.value = data.positionTypeOld ?? "";
diff --git a/src/modules/06_retirement/components/Expulsion/expulsionMain.vue b/src/modules/06_retirement/components/Expulsion/expulsionMain.vue
index 1e5895491..46ec6939e 100644
--- a/src/modules/06_retirement/components/Expulsion/expulsionMain.vue
+++ b/src/modules/06_retirement/components/Expulsion/expulsionMain.vue
@@ -26,7 +26,14 @@ const router = useRouter();
 const mixin = useCounterMixin();
 const transferStore = useTransferDataStore();
 
-const { date2Thai, messageError, showLoader, hideLoader, success } = mixin;
+const {
+  date2Thai,
+  messageError,
+  showLoader,
+  hideLoader,
+  success,
+  dialogMessage,
+} = mixin;
 const { statusText } = transferStore;
 
 const modal = ref<boolean>(false);
@@ -36,7 +43,6 @@ const visibleColumns = ref<string[]>([
   "position",
   "positionLevel",
   "organizationPositionOld",
-  "organization",
   "statustext",
 ]);
 const visibleColumns2 = ref<string[]>([
@@ -45,7 +51,6 @@ const visibleColumns2 = ref<string[]>([
   "position",
   "positionLevel",
   "organizationPositionOld",
-  "organization",
   "statustext",
 ]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
 const filterKeyword = ref<string>("");
@@ -109,15 +114,6 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "organization",
-    align: "left",
-    label: "หน่วยงานที่ขอโอนไป",
-    sortable: true,
-    field: "organization",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
   {
     name: "statustext",
     align: "left",
@@ -174,15 +170,6 @@ const columns2 = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "organization",
-    align: "left",
-    label: "หน่วยงานที่ขอโอนไป",
-    sortable: true,
-    field: "organization",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
   {
     name: "statustext",
     align: "left",
@@ -254,33 +241,32 @@ const getData = async () => {
     });
 };
 
-const clickDelete = (id: string) => {
-  $q.dialog({
-    title: "ยืนยันการลบข้อมูล",
-    message: "ต้องการลบข้อมูลนี้ใช่หรือไม่?",
-    cancel: {
-      flat: true,
-      color: "negative",
-    },
-    persistent: true,
-  })
-    .onOk(async () => {
-      showLoader();
-      await http
-        .delete(config.API.expulsionByid(id))
-        .then((res) => {
-          success($q, "ลบข้อมูลสำเร็จ");
-          getData();
-        })
-        .catch((e) => {
-          messageError($q, e);
-        })
-        .finally(() => {
-          hideLoader();
-        });
+const clickDelete = async (name: string, id: string) => {
+  dialogMessage(
+    $q,
+    `ลบข้อมูล`,
+    `ต้องการทำการลบข้อมูลนี้ใช่หรือไม่?`,
+    "delete",
+    "ยืนยัน",
+    "red",
+    async () => await deleteData(id),
+    async () => await getData()
+  );
+};
+
+const deleteData = async (id: string) => {
+  await http
+    .delete(config.API.expulsionByid(id))
+    .then((res) => {
+      success($q, "ลบข้อมูลสำเร็จ");
+      console.log(res);
     })
-    .onCancel(() => {})
-    .onDismiss(() => {});
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      await getData();
+    });
 };
 
 const saveOrder = async () => {
diff --git a/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue b/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue
index 11a0c84ce..77f132a3d 100644
--- a/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue
+++ b/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue
@@ -66,7 +66,7 @@
     </div>
   </q-card>
 
-  <q-card bordered class="row col-12 text-dark q-mt-sm">
+  <!-- <q-card bordered class="row col-12 text-dark q-mt-sm">
     <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
       <div class="q-pl-sm text-weight-bold text-dark">ข้อมูลการไล่ออก</div>
       <q-space />
@@ -146,7 +146,7 @@
         </template>
       </d-table>
     </div>
-  </q-card>
+  </q-card> -->
 
   <q-card bordered class="row col-12 text-dark q-mt-sm">
     <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
@@ -188,6 +188,175 @@
       </div>
     </div>
     <div class="col-12"><q-separator /></div>
+    <q-form ref="myForm">
+      <div class="row col-12 q-pa-md">
+        <div class="col-12 row bg-white q-col-gutter-md">
+          <div class="col-xs-12 row items-center">
+            <div class="col-12">
+              <div class="text-weight-bold text-grey">
+                ตำแหน่งและหน่วยงานเดิม
+              </div>
+            </div>
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="organizationPositionOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
+                hide-bottom-space
+                :label="`${'ตำแหน่ง/สังกัด'}`"
+                type="textarea"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="positionTypeOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งประเภท'}`]"
+                hide-bottom-space
+                :label="`${'ตำแหน่งประเภท'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="positionLevelOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกระดับ'}`]"
+                hide-bottom-space
+                :label="`${'ระดับ'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="posNo"
+                :rules="[(val) => !!val || `${'กรุณากรอกเลขที่'}`]"
+                hide-bottom-space
+                :label="`${'เลขที่'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="salary"
+                :rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
+                hide-bottom-space
+                :label="`${'เงินเดือน'}`"
+                type="number"
+              />
+            </div>
+          </div>
+          <div class="col-12"><q-separator /></div>
+          <div class="col-xs-6 col-sm-6 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="organization"
+                :rules="[(val) => !!val || `${'กรุณากรอกการไล่ออกจากสังกัด'}`]"
+                hide-bottom-space
+                :label="`${'ไล่ออกจากสังกัด'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-6 row items-center">
+            <div class="col-12">
+              <datepicker
+                menu-class-name="modalfix"
+                :readonly="!edit"
+                v-model="date"
+                :locale="'th'"
+                autoApply
+                :enableTimePicker="false"
+                week-start="0"
+              >
+                <template #year="{ year }">{{ year + 543 }}</template>
+                <template #year-overlay-value="{ value }">{{
+                  parseInt(value + 543)
+                }}</template>
+                <template #trigger>
+                  <q-input
+                    :class="getClass(edit)"
+                    :outlined="edit"
+                    dense
+                    lazy-rules
+                    :borderless="!edit"
+                    :model-value="date !== null ? date2Thai(date) : null"
+                    :rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
+                    hide-bottom-space
+                    :label="`${'ตั้งแต่วัน'}`"
+                  >
+                    <template v-slot:prepend>
+                      <q-icon
+                        name="event"
+                        class="cursor-pointer"
+                        :style="
+                          edit
+                            ? 'color: var(--q-primary)'
+                            : 'color: var(--q-grey)'
+                        "
+                      >
+                      </q-icon>
+                    </template>
+                  </q-input>
+                </template>
+              </datepicker>
+            </div>
+          </div>
+          <div class="col-12">
+            <q-input
+              :class="getClass(edit)"
+              :outlined="edit"
+              dense
+              lazy-rules
+              :readonly="!edit"
+              :borderless="!edit"
+              v-model="reason"
+              :rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
+              hide-bottom-space
+              :label="`${'หมายเหตุ '}`"
+              type="textarea"
+            />
+          </div>
+        </div>
+      </div>
+    </q-form>
   </q-card>
 </template>
 <script setup lang="ts">
@@ -295,17 +464,7 @@ const getData = async () => {
     .get(config.API.expulsionByid(personId.toString()))
     .then((res: any) => {
       const data = res.data.result;
-      //   console.log(data);
-      let list: TypeFile[] = [];
-      if (data.docs.length > 0) {
-        data.docs.map((doc: TypeFile) => {
-          list.push({
-            pathName: doc.pathName ?? "",
-            fileName: doc.fileName ?? "",
-          });
-        });
-      }
-      rows.value = list;
+
       responseData.value.createdAt = data.createdAt;
       responseData.value.date =
         data.date !== null ? new Date(data.date) : new Date();
@@ -320,9 +479,9 @@ const getData = async () => {
       responseData.value.salary = data.salary !== null ? data.salary : 0;
       responseData.value.status = data.status ?? "";
       responseData.value.avataPath = data.avataPath ?? "";
-      responseData.value.fullname = `${data.prefix ?? "-"} ${
-        data.firstName ?? "-"
-      } ${data.lastName ?? "-"}`;
+      responseData.value.fullname = `${data.firstName ?? "-"} ${
+        data.lastName ?? "-"
+      }`;
 
       organizationPositionOld.value = data.organizationPositionOld ?? "";
       positionTypeOld.value = data.positionTypeOld ?? "";