diff --git a/src/modules/06_retirement/components/Discharged/dischargedMain.vue b/src/modules/06_retirement/components/Discharged/dischargedMain.vue
index 79bd53767..f307bfc5a 100644
--- a/src/modules/06_retirement/components/Discharged/dischargedMain.vue
+++ b/src/modules/06_retirement/components/Discharged/dischargedMain.vue
@@ -9,7 +9,6 @@ import { useTransferDataStore } from "@/modules/05_placement/store";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-import DialogFooter from "@/modules/06_retirement/components/DialogFooter.vue";
 import DialogHeader from "@/modules/06_retirement/components/DialogHeader.vue";
 
 import type { ResponseData } from "@/modules/06_retirement/interface/response/discharged";
@@ -63,9 +62,6 @@ const resetFilter = () => {
   filterRef.value.focus();
 };
 
-// const nextPage = (id:string) => {
-//   router.push("/retirement/resign/"+id);
-// };
 const rows = ref<ResponseData[]>([]);
 const rows2 = ref<ResponseData[]>([]);
 const filters = ref<ResponseData[]>([]);
@@ -216,7 +212,7 @@ const getData = async () => {
       let list: ResponseData[] = [];
       data.map((r: ResponseData) => {
         list.push({
-          createdAt:date2Thai(r.createdAt),
+          createdAt: date2Thai(r.createdAt),
           date: new Date(),
           firstName: r.firstName ?? "",
           id: r.id ?? "",
@@ -288,9 +284,7 @@ const saveOrder = async () => {
   showLoader();
   await http
     .post(config.API.dischargeReport, body)
-    .then((res: any) => {
-      //   const data = res.data.result;
-      //   console.log(data);
+    .then((any) => {
       success($q, "ส่งไปออกคำสั่งโอนออกสำเร็จ");
       closeModal();
     })
@@ -440,7 +434,7 @@ const pagination = ref({
                 <q-td
                   key="createdAt"
                   :props="props"
-                  @click="nextPage(props.row)"
+                  @click="router.push(`/retirement/discharged/${props.row.id}`)"
                 >
                   {{ props.row.createdAt }}
                 </q-td>
@@ -449,7 +443,10 @@ const pagination = ref({
                 </q-td>
                 <q-td auto-width>
                   <q-btn
-                  v-if="props.row.status !=='DONE' && props.row.status !=='REPORT'"
+                    v-if="
+                      props.row.status !== 'DONE' &&
+                      props.row.status !== 'REPORT'
+                    "
                     dense
                     size="12px"
                     flat
diff --git a/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue b/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue
index 2e9546b2f..38d2f7bc7 100644
--- a/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue
+++ b/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue
@@ -1,3 +1,165 @@
+<script setup lang="ts">
+import { onMounted, ref } from "vue";
+import { useQuasar } from "quasar";
+import { useRoute, useRouter } from "vue-router";
+import { useCounterMixin } from "@/stores/mixin";
+
+import CurrencyInput from "@/components/CurruncyInput.vue";
+import http from "@/plugins/http";
+import config from "@/app.config";
+import keycloak from "@/plugins/keycloak";
+
+import type { QForm } from "quasar";
+import type { ResponseDataDetail } from "@/modules/06_retirement/interface/response/discharged";
+
+const $q = useQuasar();
+const route = useRoute();
+const router = useRouter();
+const mixin = useCounterMixin();
+
+const dataId = route.params.id.toString();
+const {
+  date2Thai,
+  dialogMessage,
+  messageError,
+  showLoader,
+  hideLoader,
+  success,
+  dialogConfirm,
+} = mixin;
+
+const myForm = ref<QForm | null>(null);
+const roleAdmin = ref<boolean>(false);
+const edit = ref<boolean>(false);
+
+const organizationPositionOld = ref<string>("");
+const positionTypeOld = ref<string>("");
+const positionLevelOld = ref<string>("");
+const posNo = ref<string>("");
+const salary = ref<number>(0);
+const organization = ref<string>("");
+const date = ref<Date | null>(null);
+const reason = ref<string>("");
+
+const responseData = ref<ResponseDataDetail>({
+  personId: "",
+  avataPath: "",
+  createdAt: new Date(),
+  date: new Date(),
+  id: "",
+  organization: "",
+  organizationPositionOld: "",
+  positionLevelOld: "",
+  positionNumberOld: "",
+  positionTypeOld: "",
+  reason: "",
+  salary: 0,
+  status: "",
+  fullname: "",
+});
+
+onMounted(async () => {
+  if (keycloak.tokenParsed != null) {
+    roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
+    console.log("roleAdmin===>", roleAdmin.value);
+  }
+  await getData();
+});
+
+const getData = async () => {
+  showLoader();
+  await http
+    .get(config.API.dischargeByid(dataId))
+    .then((res: any) => {
+      const data = res.data.result;
+      responseData.value.personId = data.profileId;
+      responseData.value.createdAt = data.createdAt;
+      responseData.value.date =
+        data.date !== null ? new Date(data.date) : new Date();
+      responseData.value.id = data.id ?? "";
+      responseData.value.organization = data.organization ?? "";
+      responseData.value.organizationPositionOld =
+        data.organizationPositionOld ?? "";
+      responseData.value.positionLevelOld = data.positionLevelOld ?? "";
+      responseData.value.positionNumberOld = data.positionNumberOld ?? "";
+      responseData.value.positionTypeOld = data.positionTypeOld ?? "";
+      responseData.value.reason = data.reason ?? "";
+      responseData.value.salary = data.salary !== null ? data.salary : 0;
+      responseData.value.status = data.status ?? "";
+      responseData.value.avataPath = data.avatar ?? "";
+      responseData.value.fullname = `${data.firstName ?? "-"} ${
+        data.lastName ?? "-"
+      }`;
+      organizationPositionOld.value = data.organizationPositionOld ?? "";
+      positionTypeOld.value = data.positionTypeOld ?? "";
+      positionLevelOld.value = data.positionLevelOld ?? "";
+      posNo.value = data.posNo ?? "";
+      salary.value = data.salary ?? "";
+      organization.value = data.organization ?? "";
+      date.value = data.date !== null ? new Date(data.date) : null;
+      reason.value = data.reason ?? "";
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+};
+
+const conditionSave = async () => {
+  if (myForm.value !== null) {
+    myForm.value.validate().then((success) => {
+      if (success) {
+        dialogConfirm(
+          $q,
+          async () => {
+            await saveData();
+          },
+          "ยืนยันการแก้ไขข้อมูล",
+          "ต้องการยืนยันการแก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายหรือไม่?"
+        );
+      }
+    });
+  }
+};
+
+const saveData = async () => {
+  const body = {
+    organization: organization.value,
+    reason: reason.value,
+    organizationPositionOld: organizationPositionOld.value,
+    date: date.value,
+    positionTypeOld: positionTypeOld.value,
+    positionLevelOld: positionLevelOld.value,
+    positionNumberOld: posNo.value,
+    amountOld: salary.value,
+  };
+  showLoader();
+  await http
+    .put(config.API.dischargeByid(dataId), body)
+    .then((res: any) => {
+      //   const data = res.data.result;
+      //   console.log(data);
+      success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
+      edit.value = false;
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      await getData();
+      hideLoader();
+    });
+};
+
+const getClass = (val: boolean) => {
+  return {
+    "full-width inputgreen cursor-pointer": val,
+    "full-width cursor-pointer": !val,
+  };
+};
+</script>
 <template>
   <div class="toptitle text-dark col-12 row items-center">
     <q-btn
@@ -72,40 +234,44 @@
         แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย
       </div>
       <q-space />
-      <div v-if="responseData.status !=='DONE' && responseData.status !=='REPORT'">      
+      <div
+        v-if="
+          responseData.status !== 'DONE' && responseData.status !== 'REPORT'
+        "
+      >
         <div class="q-gutter-sm" v-if="!edit">
-        <q-btn
-          outline
-          color="primary"
-          dense
-          icon-right="mdi-file-edit-outline"
-          class="q-px-sm"
-          label="แก้ไข"
-          style="width: 80px"
-          @click="edit = !edit"
-        />
+          <q-btn
+            outline
+            color="primary"
+            dense
+            icon-right="mdi-file-edit-outline"
+            class="q-px-sm"
+            label="แก้ไข"
+            style="width: 80px"
+            @click="edit = !edit"
+          />
+        </div>
+        <div class="q-gutter-sm" v-else>
+          <q-btn
+            outline
+            color="public"
+            dense
+            class="q-px-sm"
+            label="บันทึก"
+            style="width: 80px"
+            @click="conditionSave"
+          />
+          <q-btn
+            outline
+            color="red"
+            dense
+            class="q-px-sm"
+            label="ยกเลิก"
+            style="width: 80px"
+            @click="edit = !edit"
+          />
+        </div>
       </div>
-      <div class="q-gutter-sm" v-else>
-        <q-btn
-          outline
-          color="public"
-          dense
-          class="q-px-sm"
-          label="บันทึก"
-          style="width: 80px"
-          @click="conditionSave"
-        />
-        <q-btn
-          outline
-          color="red"
-          dense
-          class="q-px-sm"
-          label="ยกเลิก"
-          style="width: 80px"
-          @click="edit = !edit"
-        />
-      </div></div>
-
     </div>
     <div class="col-12"><q-separator /></div>
     <q-form ref="myForm">
@@ -133,7 +299,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -149,7 +315,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -165,7 +331,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -181,21 +347,8 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <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"
-              /> -->
               <CurrencyInput
                 v-model="salary"
                 :edit="edit"
@@ -207,7 +360,7 @@
             </div>
           </div>
           <div class="col-12"><q-separator /></div>
-          <div class="col-xs-6 col-sm-6 row ">
+          <div class="col-xs-6 col-sm-6 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -223,7 +376,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-6 row ">
+          <div class="col-xs-6 col-sm-6 row">
             <div class="col-12">
               <datepicker
                 menu-class-name="modalfix"
@@ -288,205 +441,6 @@
     </q-form>
   </q-card>
 </template>
-<script setup lang="ts">
-import { onMounted, ref } from "vue";
-import { useQuasar } from "quasar";
-import { useRoute, useRouter } from "vue-router";
-import { useCounterMixin } from "@/stores/mixin";
-
-import CurrencyInput from "@/components/CurruncyInput.vue";
-import http from "@/plugins/http";
-import config from "@/app.config";
-import keycloak from "@/plugins/keycloak";
-
-import type { QTableProps, QForm } from "quasar";
-import type {
-  TypeFile,
-  ResponseDataDetail,
-} from "@/modules/06_retirement/interface/response/discharged";
-
-const $q = useQuasar();
-const route = useRoute();
-const router = useRouter();
-const mixin = useCounterMixin();
-
-const dataId = route.params.id.toString();
-const {
-  date2Thai,
-  dialogMessage,
-  messageError,
-  showLoader,
-  hideLoader,
-  success,
-} = mixin;
-
-const myForm = ref<QForm | null>(null);
-const roleAdmin = ref<boolean>(false);
-const edit = ref<boolean>(false);
-
-const organizationPositionOld = ref<string>("");
-const positionTypeOld = ref<string>("");
-const positionLevelOld = ref<string>("");
-const posNo = ref<string>("");
-const salary = ref<number>(0);
-const organization = ref<string>("");
-const date = ref<Date | null>(null);
-const reason = ref<string>("");
-
-const responseData = ref<ResponseDataDetail>({
-  personId: "",
-  avataPath: "",
-  createdAt: new Date(),
-  date: new Date(),
-  id: "",
-  organization: "",
-  organizationPositionOld: "",
-  positionLevelOld: "",
-  positionNumberOld: "",
-  positionTypeOld: "",
-  reason: "",
-  salary: 0,
-  status: "",
-  fullname: "",
-});
-
-const rows = ref<TypeFile[]>([]);
-const columns = ref<QTableProps["columns"]>([
-  {
-    name: "no",
-    align: "left",
-    label: "ลำดับ",
-    sortable: true,
-    field: "no",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "fileName",
-    align: "left",
-    label: "ชื่อไฟล์",
-    sortable: true,
-    field: "fileName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "btnMicrosoft",
-    align: "right",
-    label: "ปุ่ม",
-    sortable: true,
-    field: "btnMicrosoft",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-]);
-
-onMounted(async () => {
-  if (keycloak.tokenParsed != null) {
-    roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
-    console.log("roleAdmin===>", roleAdmin.value);
-  }
-  await getData();
-});
-
-const getData = async () => {
-  showLoader();
-  await http
-    .get(config.API.dischargeByid(dataId))
-    .then((res: any) => {
-      const data = res.data.result;
-
-      responseData.value.personId = data.profileId;
-      responseData.value.createdAt = data.createdAt;
-      responseData.value.date =
-        data.date !== null ? new Date(data.date) : new Date();
-      responseData.value.id = data.id ?? "";
-      responseData.value.organization = data.organization ?? "";
-      responseData.value.organizationPositionOld =
-        data.organizationPositionOld ?? "";
-      responseData.value.positionLevelOld = data.positionLevelOld ?? "";
-      responseData.value.positionNumberOld = data.positionNumberOld ?? "";
-      responseData.value.positionTypeOld = data.positionTypeOld ?? "";
-      responseData.value.reason = data.reason ?? "";
-      responseData.value.salary = data.salary !== null ? data.salary : 0;
-      responseData.value.status = data.status ?? "";
-      responseData.value.avataPath = data.avatar ?? "";
-      responseData.value.fullname = `${data.firstName ?? "-"} ${
-        data.lastName ?? "-"
-      }`;
-
-      organizationPositionOld.value = data.organizationPositionOld ?? "";
-      positionTypeOld.value = data.positionTypeOld ?? "";
-      positionLevelOld.value = data.positionLevelOld ?? "";
-      posNo.value = data.posNo ?? "";
-      salary.value = data.salary ?? "";
-      organization.value = data.organization ?? "";
-      date.value = data.date !== null ? new Date(data.date) : null;
-      reason.value = data.reason ?? "";
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
-    });
-};
-
-const conditionSave = async () => {
-  if (myForm.value !== null) {
-    myForm.value.validate().then((success) => {
-      if (success) {
-        dialogMessage(
-          $q,
-          "ต้องการแก้ไขข้อมูลหรือไม่?",
-          "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย",
-          "mdi-help-circle-outline",
-          "ตกลง",
-          "public",
-          async () => await saveData(),
-          undefined
-        );
-      }
-    });
-  }
-};
-
-const saveData = async () => {
-  const body = {
-    organization: organization.value,
-    reason: reason.value,
-    organizationPositionOld: organizationPositionOld.value,
-    date: date.value,
-    positionTypeOld: positionTypeOld.value,
-    positionLevelOld: positionLevelOld.value,
-    positionNumberOld: posNo.value,
-    amountOld: salary.value,
-  };
-  showLoader();
-  await http
-    .put(config.API.dischargeByid(dataId), body)
-    .then((res: any) => {
-      //   const data = res.data.result;
-      //   console.log(data);
-      success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
-      edit.value = false;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(async () => {
-      await getData();
-      hideLoader();
-    });
-};
-
-const getClass = (val: boolean) => {
-  return {
-    "full-width inputgreen cursor-pointer": val,
-    "full-width cursor-pointer": !val,
-  };
-};
-</script>
 <style lang="scss" scope>
 .q-img {
   border-radius: 5px;
diff --git a/src/modules/06_retirement/components/DismissOrder/DismissOrder.vue b/src/modules/06_retirement/components/DismissOrder/DismissOrder.vue
index 2914a3a20..faa59df51 100644
--- a/src/modules/06_retirement/components/DismissOrder/DismissOrder.vue
+++ b/src/modules/06_retirement/components/DismissOrder/DismissOrder.vue
@@ -9,7 +9,6 @@ import { useTransferDataStore } from "@/modules/05_placement/store";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-import DialogFooter from "@/modules/06_retirement/components/DialogFooter.vue";
 import DialogHeader from "@/modules/06_retirement/components/DialogHeader.vue";
 
 import type { ResponseData } from "@/modules/06_retirement/interface/response/out";
@@ -57,15 +56,7 @@ const visibleColumns2 = ref<string[]>([
 const filterKeyword = ref<string>("");
 const filterKeyword2 = ref<string>("");
 const filterRef = ref<any>(null);
-const resetFilter = () => {
-  filterKeyword.value = "";
-  filterKeyword2.value = "";
-  filterRef.value.focus();
-};
 
-// const nextPage = (id:string) => {
-//   router.push("/retirement/resign/"+id);
-// };
 const rows = ref<ResponseData[]>([]);
 const rows2 = ref<ResponseData[]>([]);
 const filters = ref<ResponseData[]>([]);
@@ -191,13 +182,9 @@ const columns2 = ref<QTableProps["columns"]>([
   },
 ]);
 
-const openModal = () => (modal.value = true);
-const closeModal = () => (modal.value = false);
-
 onMounted(async () => {
   await getData();
 });
-
 const openModalOrder = () => {
   openModal();
   const row = filters.value.filter(
@@ -206,7 +193,6 @@ const openModalOrder = () => {
   );
   rows2.value = row;
 };
-
 const getData = async () => {
   showLoader();
   await http
@@ -216,7 +202,7 @@ const getData = async () => {
       let list: ResponseData[] = [];
       data.map((r: ResponseData) => {
         list.push({
-          createdAt:date2Thai(r.createdAt),
+          createdAt: date2Thai(r.createdAt),
           date: new Date(),
           firstName: r.firstName ?? "",
           id: r.id ?? "",
@@ -250,7 +236,6 @@ const getData = async () => {
       hideLoader();
     });
 };
-
 const clickDelete = async (id: string) => {
   dialogMessage(
     $q,
@@ -263,7 +248,6 @@ const clickDelete = async (id: string) => {
     async () => await getData()
   );
 };
-
 const deleteData = async (id: string) => {
   await http
     .delete(config.API.outByid(id))
@@ -278,19 +262,15 @@ const deleteData = async (id: string) => {
       await getData();
     });
 };
-
 const saveOrder = async () => {
   const id = selected.value.map((r) => r.id);
   const body = {
     id,
   };
-
   showLoader();
   await http
     .post(config.API.outReport, body)
-    .then((res: any) => {
-      //   const data = res.data.result;
-      //   console.log(data);
+    .then(() => {
       success($q, "ส่งไปออกคำสั่งโอนออกสำเร็จ");
       closeModal();
     })
@@ -302,6 +282,14 @@ const saveOrder = async () => {
       hideLoader();
     });
 };
+const openModal = () => (modal.value = true);
+const closeModal = () => (modal.value = false);
+
+const resetFilter = () => {
+  filterKeyword.value = "";
+  filterKeyword2.value = "";
+  filterRef.value.focus();
+};
 const pagination = ref({
   sortBy: "createdAt",
   descending: true,
@@ -437,11 +425,7 @@ const pagination = ref({
                     </q-tooltip> -->
                   </div>
                 </q-td>
-                <q-td
-                  key="createdAt"
-                  :props="props"
-
-                >
+                <q-td key="createdAt" :props="props">
                   {{ props.row.createdAt }}
                 </q-td>
                 <q-td key="statustext" :props="props">
@@ -449,7 +433,10 @@ const pagination = ref({
                 </q-td>
                 <q-td auto-width>
                   <q-btn
-                  v-if="props.row.status !== 'DONE' && props.row.status !== 'REPORT'"
+                    v-if="
+                      props.row.status !== 'DONE' &&
+                      props.row.status !== 'REPORT'
+                    "
                     dense
                     size="12px"
                     flat
diff --git a/src/modules/06_retirement/components/DismissOrder/outRegistry.vue b/src/modules/06_retirement/components/DismissOrder/outRegistry.vue
index e56470f40..67c93f097 100644
--- a/src/modules/06_retirement/components/DismissOrder/outRegistry.vue
+++ b/src/modules/06_retirement/components/DismissOrder/outRegistry.vue
@@ -1,3 +1,166 @@
+<script setup lang="ts">
+import { onMounted, ref } from "vue";
+import { useQuasar } from "quasar";
+import { useRoute, useRouter } from "vue-router";
+import { useCounterMixin } from "@/stores/mixin";
+
+import CurrencyInput from "@/components/CurruncyInput.vue";
+import http from "@/plugins/http";
+import config from "@/app.config";
+import keycloak from "@/plugins/keycloak";
+
+import type { QForm } from "quasar";
+import type { ResponseDataDetail } from "@/modules/06_retirement/interface/response/expulsion";
+
+const $q = useQuasar();
+const route = useRoute();
+const router = useRouter();
+const mixin = useCounterMixin();
+
+const dataId = route.params.id.toString();
+const {
+  date2Thai,
+  dialogMessage,
+  messageError,
+  showLoader,
+  hideLoader,
+  success,
+} = mixin;
+
+const myForm = ref<QForm | null>(null);
+const roleAdmin = ref<boolean>(false);
+const edit = ref<boolean>(false);
+const organizationPositionOld = ref<string>("");
+const positionTypeOld = ref<string>("");
+const positionLevelOld = ref<string>("");
+const posNo = ref<string>("");
+const salary = ref<number>(0);
+const organization = ref<string>("");
+const date = ref<Date | null>(null);
+const reason = ref<string>("");
+
+const responseData = ref<ResponseDataDetail>({
+  personId: "",
+  avataPath: "",
+  createdAt: new Date(),
+  date: new Date(),
+  id: "",
+  organization: "",
+  organizationPositionOld: "",
+  positionLevelOld: "",
+  positionNumberOld: "",
+  positionTypeOld: "",
+  reason: "",
+  salary: 0,
+  status: "",
+  fullname: "",
+});
+
+onMounted(async () => {
+  if (keycloak.tokenParsed != null) {
+    roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
+    console.log("roleAdmin===>", roleAdmin.value);
+  }
+  await getData();
+});
+
+const getData = async () => {
+  showLoader();
+  await http
+    .get(config.API.outByid(dataId))
+    .then((res: any) => {
+      const data = res.data.result;
+      responseData.value.personId = data.profileId;
+      responseData.value.createdAt = data.createdAt;
+      responseData.value.date =
+        data.date !== null ? new Date(data.date) : new Date();
+      responseData.value.id = data.id ?? "";
+      responseData.value.organization = data.organization ?? "";
+      responseData.value.organizationPositionOld =
+        data.organizationPositionOld ?? "";
+      responseData.value.positionLevelOld = data.positionLevelOld ?? "";
+      responseData.value.positionNumberOld = data.positionNumberOld ?? "";
+      responseData.value.positionTypeOld = data.positionTypeOld ?? "";
+      responseData.value.reason = data.reason ?? "";
+      responseData.value.salary = data.salary !== null ? data.salary : 0;
+      responseData.value.status = data.status ?? "";
+      responseData.value.avataPath = data.avatar ?? "";
+      responseData.value.fullname = `${data.firstName ?? "-"} ${
+        data.lastName ?? "-"
+      }`;
+
+      organizationPositionOld.value = data.organizationPositionOld ?? "";
+      positionTypeOld.value = data.positionTypeOld ?? "";
+      positionLevelOld.value = data.positionLevelOld ?? "";
+      posNo.value = data.posNo ?? "";
+      salary.value = data.salary ?? "";
+      organization.value = data.organization ?? "";
+      date.value = data.date !== null ? new Date(data.date) : null;
+      reason.value = data.reason ?? "";
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+};
+
+const conditionSave = async () => {
+  if (myForm.value !== null) {
+    myForm.value.validate().then((success) => {
+      if (success) {
+        dialogMessage(
+          $q,
+          "ต้องการแก้ไขข้อมูลหรือไม่?",
+          "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย",
+          "mdi-help-circle-outline",
+          "ตกลง",
+          "public",
+          async () => await saveData(),
+          undefined
+        );
+      }
+    });
+  }
+};
+
+const saveData = async () => {
+  const body = {
+    organization: organization.value,
+    reason: reason.value,
+    organizationPositionOld: organizationPositionOld.value,
+    date: date.value,
+    positionTypeOld: positionTypeOld.value,
+    positionLevelOld: positionLevelOld.value,
+    positionNumberOld: posNo.value,
+    amountOld: salary.value,
+  };
+  showLoader();
+  await http
+    .put(config.API.outByid(dataId), body)
+    .then((res: any) => {
+      //   const data = res.data.result;
+      //   console.log(data);
+      success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
+      edit.value = false;
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      await getData();
+      hideLoader();
+    });
+};
+
+const getClass = (val: boolean) => {
+  return {
+    "full-width inputgreen cursor-pointer": val,
+    "full-width cursor-pointer": !val,
+  };
+};
+</script>
 <template>
   <div class="toptitle text-dark col-12 row items-center">
     <q-btn
@@ -137,7 +300,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -153,7 +316,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -169,7 +332,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -185,22 +348,8 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <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"
-              /> -->
-
               <CurrencyInput
                 v-model="salary"
                 :edit="edit"
@@ -212,7 +361,7 @@
             </div>
           </div>
           <div class="col-12"><q-separator /></div>
-          <div class="col-xs-6 col-sm-6 row ">
+          <div class="col-xs-6 col-sm-6 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -228,7 +377,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-6 row ">
+          <div class="col-xs-6 col-sm-6 row">
             <div class="col-12">
               <datepicker
                 menu-class-name="modalfix"
@@ -293,205 +442,6 @@
     </q-form>
   </q-card>
 </template>
-<script setup lang="ts">
-import { onMounted, ref } from "vue";
-import { useQuasar } from "quasar";
-import { useRoute, useRouter } from "vue-router";
-import { useCounterMixin } from "@/stores/mixin";
-
-import CurrencyInput from "@/components/CurruncyInput.vue";
-import http from "@/plugins/http";
-import config from "@/app.config";
-import keycloak from "@/plugins/keycloak";
-
-import type { QTableProps, QForm } from "quasar";
-import type {
-  TypeFile,
-  ResponseDataDetail,
-} from "@/modules/06_retirement/interface/response/expulsion";
-
-const $q = useQuasar();
-const route = useRoute();
-const router = useRouter();
-const mixin = useCounterMixin();
-
-const dataId = route.params.id.toString();
-const {
-  date2Thai,
-  dialogMessage,
-  messageError,
-  showLoader,
-  hideLoader,
-  success,
-} = mixin;
-
-const myForm = ref<QForm | null>(null);
-const roleAdmin = ref<boolean>(false);
-const edit = ref<boolean>(false);
-
-const organizationPositionOld = ref<string>("");
-const positionTypeOld = ref<string>("");
-const positionLevelOld = ref<string>("");
-const posNo = ref<string>("");
-const salary = ref<number>(0);
-const organization = ref<string>("");
-const date = ref<Date | null>(null);
-const reason = ref<string>("");
-
-const responseData = ref<ResponseDataDetail>({
-  personId: "",
-  avataPath: "",
-  createdAt: new Date(),
-  date: new Date(),
-  id: "",
-  organization: "",
-  organizationPositionOld: "",
-  positionLevelOld: "",
-  positionNumberOld: "",
-  positionTypeOld: "",
-  reason: "",
-  salary: 0,
-  status: "",
-  fullname: "",
-});
-
-const rows = ref<TypeFile[]>([]);
-const columns = ref<QTableProps["columns"]>([
-  {
-    name: "no",
-    align: "left",
-    label: "ลำดับ",
-    sortable: true,
-    field: "no",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "fileName",
-    align: "left",
-    label: "ชื่อไฟล์",
-    sortable: true,
-    field: "fileName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "btnMicrosoft",
-    align: "right",
-    label: "ปุ่ม",
-    sortable: true,
-    field: "btnMicrosoft",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-]);
-
-onMounted(async () => {
-  if (keycloak.tokenParsed != null) {
-    roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
-    console.log("roleAdmin===>", roleAdmin.value);
-  }
-  await getData();
-});
-
-const getData = async () => {
-  showLoader();
-  await http
-    .get(config.API.outByid(dataId))
-    .then((res: any) => {
-      const data = res.data.result;
-
-      responseData.value.personId = data.profileId;
-      responseData.value.createdAt = data.createdAt;
-      responseData.value.date =
-        data.date !== null ? new Date(data.date) : new Date();
-      responseData.value.id = data.id ?? "";
-      responseData.value.organization = data.organization ?? "";
-      responseData.value.organizationPositionOld =
-        data.organizationPositionOld ?? "";
-      responseData.value.positionLevelOld = data.positionLevelOld ?? "";
-      responseData.value.positionNumberOld = data.positionNumberOld ?? "";
-      responseData.value.positionTypeOld = data.positionTypeOld ?? "";
-      responseData.value.reason = data.reason ?? "";
-      responseData.value.salary = data.salary !== null ? data.salary : 0;
-      responseData.value.status = data.status ?? "";
-      responseData.value.avataPath = data.avatar ?? "";
-      responseData.value.fullname = `${data.firstName ?? "-"} ${
-        data.lastName ?? "-"
-      }`;
-
-      organizationPositionOld.value = data.organizationPositionOld ?? "";
-      positionTypeOld.value = data.positionTypeOld ?? "";
-      positionLevelOld.value = data.positionLevelOld ?? "";
-      posNo.value = data.posNo ?? "";
-      salary.value = data.salary ?? "";
-      organization.value = data.organization ?? "";
-      date.value = data.date !== null ? new Date(data.date) : null;
-      reason.value = data.reason ?? "";
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
-    });
-};
-
-const conditionSave = async () => {
-  if (myForm.value !== null) {
-    myForm.value.validate().then((success) => {
-      if (success) {
-        dialogMessage(
-          $q,
-          "ต้องการแก้ไขข้อมูลหรือไม่?",
-          "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย",
-          "mdi-help-circle-outline",
-          "ตกลง",
-          "public",
-          async () => await saveData(),
-          undefined
-        );
-      }
-    });
-  }
-};
-
-const saveData = async () => {
-  const body = {
-    organization: organization.value,
-    reason: reason.value,
-    organizationPositionOld: organizationPositionOld.value,
-    date: date.value,
-    positionTypeOld: positionTypeOld.value,
-    positionLevelOld: positionLevelOld.value,
-    positionNumberOld: posNo.value,
-    amountOld: salary.value,
-  };
-  showLoader();
-  await http
-    .put(config.API.outByid(dataId), body)
-    .then((res: any) => {
-      //   const data = res.data.result;
-      //   console.log(data);
-      success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
-      edit.value = false;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(async () => {
-      await getData();
-      hideLoader();
-    });
-};
-
-const getClass = (val: boolean) => {
-  return {
-    "full-width inputgreen cursor-pointer": val,
-    "full-width cursor-pointer": !val,
-  };
-};
-</script>
 <style lang="scss" scope>
 .q-img {
   border-radius: 5px;
diff --git a/src/modules/06_retirement/components/ExitInterview/exitMain.vue b/src/modules/06_retirement/components/ExitInterview/exitMain.vue
index 0872ebb6d..a1bd4991b 100644
--- a/src/modules/06_retirement/components/ExitInterview/exitMain.vue
+++ b/src/modules/06_retirement/components/ExitInterview/exitMain.vue
@@ -1,9 +1,8 @@
 <script setup lang="ts">
-import { ref, onMounted, computed } from "vue";
+import { ref, onMounted } from "vue";
 import { useQuasar, QForm } from "quasar";
 import { useRouter } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
-import { useRetirementDataStore } from "@/modules/06_retirement/store";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
@@ -13,13 +12,10 @@ import type { ResponseItems } from "@/modules/06_retirement/interface/response/e
 
 import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
 import DialogHeader from "@/modules/05_placement/components/PersonalList/DialogHeader.vue";
-import { identity } from "@fullcalendar/core/internal";
-import { tabList } from "@/interface/request/main/main";
 
 const $q = useQuasar(); //ใช้ noti quasar
 const router = useRouter();
 const mixin = useCounterMixin();
-const RetirementData = useRetirementDataStore();
 
 const myForm = ref<QForm>();
 
@@ -31,7 +27,6 @@ const {
   success,
   dialogConfirm,
 } = mixin;
-const { statusText } = RetirementData;
 
 const rows = ref<ResponseItems[]>([]);
 const columns = ref<QTableProps["columns"]>([
@@ -142,58 +137,15 @@ const dateBreak = ref<Date | null>(null);
 const daterow = ref<string | null>("");
 const id = ref<string>("");
 const filters = ref<ResponseItems[]>([]);
-const rows2 = ref<ResponseItems[]>([]);
-const columns2 = ref<QTableProps["columns"]>([]);
-const visibleColumns2 = ref<string[]>([
-  "no",
-  "prefix",
-  "fullname",
-  "futureWork",
-  "futureWorkReason",
-  "havejob",
-  "havejobReason",
-  "statustext",
-]);
-
 const modal = ref<boolean>(false);
-const filterKeyword2 = ref<string>("");
-//ค้นหา คอลัมน์ คอลัมน์ที่แสดง
 const filterKeyword = ref<string>("");
 const filterRef = ref<any>(null);
-const openModal = () => (modal.value = true);
-const closeModal = () => (modal.value = false);
-
-const selected = ref<ResponseItems[]>([]);
-const checkSelected = computed(() => {
-  if (selected.value.length === 0) {
-    return true;
-  }
-});
-
-const resetFilter = () => {
-  filterKeyword.value = "";
-  filterRef.value.focus();
-};
-
-const openModalCalendar = (rows: any) => {
-  openModal();
-  dateBreak.value = null;
-  id.value = rows.id;
-  daterow.value = convertThaiDateToNumeric(rows.datetext);
-};
-
-const openModalOrder = () => {
-  openModal();
-  const row = filters.value.filter(
-    (r: ResponseItems) =>
-      r.status == "WAITTING" || r.status == "PENDING" || r.status == "APPROVE"
-  );
-  rows2.value = row;
-};
 
 onMounted(async () => {
   await fecthlist();
-  visibleColumns.value = columns.value.map((r: any) => r.name);
+  if (columns.value) {
+    visibleColumns.value = columns.value.map((r: any) => r.name);
+  }
 });
 
 const fecthlist = async () => {
@@ -203,7 +155,6 @@ const fecthlist = async () => {
     .then((res: any) => {
       const data = res.data.result;
       let list: ResponseItems[] = [];
-
       data.map((r: ResponseItems) => {
         list.push({
           datetext: r.createdAt !== null ? date2Thai(r.createdAt) : "-",
@@ -223,7 +174,6 @@ const fecthlist = async () => {
           appointDate: date2Thai(r.appointDate),
         });
       });
-
       rows.value = list;
       filters.value = list;
     })
@@ -290,30 +240,18 @@ const convertThaiDateToNumeric = (thaiDate: string) => {
   const numericDate = `${year}${monthMap[month]}${day}`;
   return numericDate;
 };
-
-// const saveOrder = async () => {
-//   const id = selected.value.map((r) => r.id);
-//   const body = {
-//     id,
-//   };
-
-//   showLoader();
-//   await http
-//     .post(config.API.ExitInterviewReport, body)
-//     .then((res: any) => {
-//       //   const data = res.data.result;
-//       //   console.log(data);
-//       success($q, "ส่งไปออกคำสั่งลาออกสำเร็จ");
-//       closeModal();
-//     })
-//     .catch((e) => {
-//       messageError($q, e);
-//     })
-//     .finally(async () => {
-//       await fecthlist();
-//       hideLoader();
-//     });
-// };
+const openModal = () => (modal.value = true);
+const closeModal = () => (modal.value = false);
+const resetFilter = () => {
+  filterKeyword.value = "";
+  filterRef.value.focus();
+};
+const openModalCalendar = (rows: any) => {
+  openModal();
+  dateBreak.value = null;
+  id.value = rows.id;
+  daterow.value = convertThaiDateToNumeric(rows.datetext);
+};
 </script>
 <template v-slot:body="props">
   <div class="toptitle text-dark col-12 row items-center">
@@ -324,19 +262,7 @@ const convertThaiDateToNumeric = (thaiDate: string) => {
     <div class="col-12 row q-pa-md">
       <div class="row col-12">
         <div class="row col-12 q-col-gutter-sm">
-          <!-- <q-btn
-            @click="openModalOrder"
-            size="14px"
-            flat
-            round
-            color="add"
-            icon="mdi-account-arrow-right"
-          >
-            <q-tooltip>ส่งไปออกคำสั่งลาออก</q-tooltip>
-          </q-btn> -->
-
           <q-space />
-
           <q-input
             class="col-xs-12 col-sm-3 col-md-2"
             standout
@@ -357,7 +283,6 @@ const convertThaiDateToNumeric = (thaiDate: string) => {
               />
             </template>
           </q-input>
-
           <q-select
             v-model="visibleColumns"
             multiple
@@ -500,123 +425,6 @@ const convertThaiDateToNumeric = (thaiDate: string) => {
     </div>
   </q-card>
 
-  <!-- <q-dialog v-model="modal">
-    <q-card style="width: 1200px; max-width: 80vw">
-      <DialogHeader title="ส่งไปออกคำสั่งโอนออก" :close="closeModal" />
-      <q-separator />
-      <q-card-section class="q-pt-none">
-        <div class="row justify-end">
-          <div class="col-5">
-            <q-toolbar style="padding: 0">
-              <q-input
-                borderless
-                outlined
-                dense
-                debounce="300"
-                v-model="filterKeyword2"
-                placeholder="ค้นหา"
-                style="width: 850px; max-width: auto"
-              >
-                <template v-slot:append>
-                  <q-icon v-if="filterKeyword2 == ''" name="search" />
-                  <q-icon
-                    v-if="filterKeyword2 !== ''"
-                    name="clear"
-                    class="cursor-pointer"
-                    @click="resetFilter"
-                  />
-                </template>
-              </q-input>
-              <q-select
-                v-model="visibleColumns2"
-                multiple
-                outlined
-                dense
-                options-dense
-                :display-value="$q.lang.table.columns"
-                emit-value
-                map-options
-                :options="columns2"
-                option-value="name"
-                options-cover
-                style="min-width: 150px"
-                class="gt-xs q-ml-sm"
-              />
-            </q-toolbar>
-          </div>
-        </div>
-
-        <d-table
-          :columns="columns2"
-          :rows="rows2"
-          :filter="filterKeyword2"
-          row-key="id"
-          :visible-columns="visibleColumns2"
-          selection="multiple"
-          v-model:selected="selected"
-        >
-          <template v-slot:header-selection="scope">
-            <q-checkbox
-              keep-color
-              color="primary"
-              dense
-              v-model="scope.selected"
-            />
-          </template>
-
-          <template v-slot:body="props">
-            <q-tr :props="props" class="cursor-pointer">
-              <q-td>
-                <q-checkbox
-                  keep-color
-                  color="primary"
-                  dense
-                  v-model="props.selected"
-                />
-              </q-td>
-              <q-td key="no" :props="props">
-                {{ props.rowIndex + 1 }}
-              </q-td>
-              <q-td key="prefix" :props="props">
-                {{ props.row.prefix }}
-              </q-td>
-              <q-td key="fullname" :props="props">
-                {{ props.row.fullname }}
-              </q-td>
-              <q-td key="positionTypeOld" :props="props">
-                {{ props.row.positionTypeOld }}
-              </q-td>
-              <q-td key="futureWorkReason" :props="props">
-                {{ props.row.futureWorkReason }}
-              </q-td>
-              <q-td key="havejob" :props="props">
-                {{ props.row.havejob }}
-              </q-td>
-
-              <q-td key="havejobReason" :props="props">
-                <div class="table_ellipsis">
-                  {{ props.row.havejobReason }}
-                </div>
-              </q-td>
-              <q-td key="statustext" :props="props">
-                {{ props.row.statustext }}
-              </q-td>
-            </q-tr>
-          </template>
-        </d-table>
-      </q-card-section>
-
-      <q-card-actions align="right" class="bg-white text-teal">
-        <q-btn
-          label="ส่งไปออกคำสั่ง"
-          @click="saveOrder"
-          :disable="checkSelected"
-          color="public"
-        />
-      </q-card-actions>
-    </q-card>
-  </q-dialog> -->
-
   <q-dialog v-model="modal" persistent>
     <q-card style="width: 800px">
       <q-form ref="myForm">
@@ -640,9 +448,6 @@ const convertThaiDateToNumeric = (thaiDate: string) => {
                 parseInt(value + 543)
               }}</template>
               <template #trigger>
-                <!-- :rules="[
-                    (val) => !!val || `${'กรุณาเลือก วันสุดท้ายที่ยับยั้ง'}`,
-                  ]" -->
                 <q-input
                   outlined
                   dense
@@ -659,7 +464,6 @@ const convertThaiDateToNumeric = (thaiDate: string) => {
                       `${'วันที่นัดหมายต้องมากกว่าวันที่สร้าง'}`,
                   ]"
                 >
-                  <!-- :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]" -->
                   <template v-slot:prepend>
                     <q-icon
                       name="event"
@@ -674,15 +478,6 @@ const convertThaiDateToNumeric = (thaiDate: string) => {
           </div>
         </q-card-section>
         <q-separator />
-        <!-- <q-btn
-        flat
-        round
-        :color="'public'"
-        @click="saveAppoint"
-        icon="mdi-content-save-outline"
-      >
-        <q-tooltip>บันทึก</q-tooltip>
-      </q-btn> -->
         <DialogFooter :editvisible="true" :save="saveAppoint" />
       </q-form>
     </q-card>
diff --git a/src/modules/06_retirement/components/ExitInterview/exitRegistry.vue b/src/modules/06_retirement/components/ExitInterview/exitRegistry.vue
index 0f71df9fe..cd04abd18 100644
--- a/src/modules/06_retirement/components/ExitInterview/exitRegistry.vue
+++ b/src/modules/06_retirement/components/ExitInterview/exitRegistry.vue
@@ -1,3 +1,164 @@
+<script setup lang="ts">
+import { onMounted, ref } from "vue";
+import { useQuasar } from "quasar";
+import { useRoute, useRouter } from "vue-router";
+import { useCounterMixin } from "@/stores/mixin";
+
+import http from "@/plugins/http";
+import config from "@/app.config";
+import keycloak from "@/plugins/keycloak";
+
+import type { QForm } from "quasar";
+
+const $q = useQuasar();
+const route = useRoute();
+const router = useRouter();
+const mixin = useCounterMixin();
+
+const dataId = route.params.id.toString();
+const { messageError, showLoader, hideLoader } = mixin;
+
+const myForm = ref<QForm | null>(null);
+const roleAdmin = ref<boolean>(false);
+
+const Org = ref<string>("");
+const PositionLevel = ref<string>("");
+const Position = ref<string>("");
+const prefix = ref<string>("");
+const exitFactor = ref<any>([]);
+const reasonWork = ref<any>([]);
+const adjust = ref<any>([]);
+const timeThink = ref<any>([]);
+const fullname = ref<any>("");
+const avata = ref<any>("");
+const realReason = ref<any>("");
+const notExitFactor = ref<any>("");
+const haveJob = ref<any>("");
+const suggestFriends = ref<any>([]);
+const futureWork = ref<any>([]);
+const suggestion = ref<any>("");
+
+const reasonWorkOther = ref("");
+const reasonWork_option = ref<any>([
+  { label: "ความมั่นคงในการทำงาน ", value: 0 },
+  { label: "สิทธิประโยชน์/สวัสดิการ", value: 1 },
+  { label: "อัตราเงินเดือน ", value: 2 },
+  { label: "ลักษณะงาน ", value: 3 },
+  { label: "วัฒนธรรมการทำงานของข้าราชการ ", value: 4 },
+  { label: "นโยบายของหน่วยงาน ", value: 5 },
+  { label: "ระบบการทำงาน", value: 6 },
+  { label: "สมดุลชีวิตการทำงาน ", value: 7 },
+  { label: "บรรยากาศในการทำงาน  ", value: 8 },
+  { label: "การพัฒนาในสายอาชีพ  ", value: 9 },
+  { label: "โอกาสความก้าวหน้า  ", value: 10 },
+  { label: "การได้รับการยอมรับจากสังคม  ", value: 11 },
+  { label: "อื่น ๆ (ระบุ)  ", value: 12 },
+]);
+const exitFactorOther = ref("");
+const exitFactor_option = ref<any>([
+  { label: "อัตราเงินเดือน ", value: 0 },
+  { label: "สวัสดิการ", value: 1 },
+  { label: "ลักษณะงาน ", value: 2 },
+  { label: "ระบบการทำงาน ", value: 3 },
+  { label: "ระบบสนับสนุนการปฏิบัติงาน ", value: 4 },
+  { label: "การมอบหมายงานที่ชัดเจนและเหมาะสม ", value: 5 },
+  { label: "การบริหารงานของผู้บังคับบัญชา", value: 6 },
+  { label: "การทำงานเป็นทีมกับเพื่อนร่วมงาน ", value: 7 },
+  { label: "ระบบบริหารงานภายในหน่วยงาน  ", value: 8 },
+  { label: "บรรยากาศในการทำงาน  ", value: 9 },
+  { label: "การปฏิบัติอย่างเป็นธรรม  ", value: 10 },
+  { label: "การยอมรับความแตกต่างหลากหลาย  ", value: 11 },
+  { label: "การดูแลและให้ความช่วยเหลือในช่วงเริ่มต้นปฏิบัติงาน  ", value: 12 },
+  { label: "การพัฒนาอย่างเป็นระบบและต่อเนื่อง ", value: 13 },
+  { label: "โอกาสความก้าวหน้า  ", value: 14 },
+  { label: "อื่น ๆ (ระบุ)  ", value: 15 },
+]);
+const suggestFriendsReason = ref("");
+const suggestFriends_option = ref<any>([
+  { label: "แนะนำ  ", value: true },
+  { label: "ไม่แนะนำ (ระบุ)", value: false },
+]);
+const timeThink_option = ref<any>([
+  { label: "น้อยกว่า 2 สัปดาห์ ", value: 0 },
+  { label: "1 เดือน - 3 เดือน", value: 1 },
+  { label: "3 เดือน - 6 เดือน  ", value: 2 },
+  { label: "6 เดือนขึ้นไป  ", value: 3 },
+]);
+const haveJobReason = ref<any>("");
+const haveJob_option = ref<any>([
+  { label: "มี  (ระบุ) ", value: true },
+  { label: "ไม่มี", value: false },
+]);
+const futureWorkReason = ref<any>("");
+const futureWork_option = ref<any>([
+  { label: "อยาก  ", value: true },
+  { label: "ไม่อยาก (ระบุ)", value: false },
+]);
+const adjustOther = ref("");
+const adjust_option = ref<any>([
+  { label: "อัตราเงินเดือน ", value: 0 },
+  { label: "สวัสดิการ", value: 1 },
+  { label: "ลักษณะงาน ", value: 2 },
+  { label: "ระบบการทำงาน ", value: 3 },
+  { label: "ระบบสนับสนุนการปฏิบัติงาน ", value: 4 },
+  { label: "การมอบหมายงานที่ชัดเจนและเหมาะสม ", value: 5 },
+  { label: "การบริหารงานของผู้บังคับบัญชา", value: 6 },
+  { label: "การทำงานเป็นทีมกับเพื่อนร่วมงาน ", value: 7 },
+  { label: "ระบบบริหารงานภายในหน่วยงาน  ", value: 8 },
+  { label: "บรรยากาศในการทำงาน  ", value: 9 },
+  { label: "การปฏิบัติอย่างเป็นธรรม  ", value: 10 },
+  { label: "การยอมรับความแตกต่างหลากหลาย  ", value: 11 },
+  { label: "การดูแลและให้ความช่วยเหลือในช่วงเริ่มต้นปฏิบัติงาน  ", value: 12 },
+  { label: "การพัฒนาอย่างเป็นระบบและต่อเนื่อง ", value: 13 },
+  { label: "โอกาสความก้าวหน้า  ", value: 14 },
+  { label: "อื่น ๆ (ระบุ)  ", value: 15 },
+]);
+
+onMounted(async () => {
+  if (keycloak.tokenParsed != null) {
+    roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
+    console.log("roleAdmin===>", roleAdmin.value);
+  }
+  await getData();
+});
+
+const getData = async () => {
+  showLoader();
+  await http
+    .get(config.API.ExitInterviewByid(dataId))
+    .then((res: any) => {
+      const data = res.data.result;
+      avata.value = data.avatar ?? "";
+      Position.value = data.position ?? "";
+      PositionLevel.value = data.positionLevel ?? "";
+      Org.value = data.org ?? "";
+      fullname.value = data.fullname ?? "";
+      prefix.value = data.prefix ?? "";
+      reasonWork.value = data.reasonWork ?? [];
+      reasonWorkOther.value = data.reasonWorkOther ?? "";
+      timeThink.value = data.TimeThink ?? 0;
+      exitFactor.value = data.exitFactor ?? [];
+      exitFactorOther.value = data.exitFactorOther ?? 0;
+      adjust.value = data.adjust ?? [];
+      adjustOther.value = data.adjustOther ?? "";
+      realReason.value = data.realReason ?? "";
+      notExitFactor.value = data.notExitFactor ?? "";
+      haveJob.value = data.havejob ?? null;
+      haveJobReason.value = data.havejobReason ?? "";
+      suggestFriends.value = data.suggestFriends ?? null;
+      suggestFriendsReason.value = data.suggestFriendsReason ?? "";
+      futureWork.value = data.futureWork ?? null;
+      futureWorkReason.value = data.futureWorkReason ?? "";
+      suggestion.value = data.suggestion ?? "";
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+};
+</script>
 <template>
   <div class="toptitle text-dark col-12 row items-center">
     <q-btn
@@ -60,38 +221,6 @@
         ข้อมูลการตอบแบบสอบถาม
       </div>
       <q-space />
-      <!-- <div class="q-gutter-sm" v-if="!edit">
-        <q-btn
-          outline
-          color="primary"
-          dense
-          icon-right="mdi-file-edit-outline"
-          class="q-px-sm"
-          label="แก้ไข"
-          style="width: 80px"
-          @click="edit = !edit"
-        />
-      </div>
-      <div class="q-gutter-sm" v-else>
-        <q-btn
-          outline
-          color="public"
-          dense
-          class="q-px-sm"
-          label="บันทึก"
-          style="width: 80px"
-          @click="conditionSave"
-        />
-        <q-btn
-          outline
-          color="red"
-          dense
-          class="q-px-sm"
-          label="ยกเลิก"
-          style="width: 80px"
-          @click="edit = !edit"
-        />
-      </div> -->
     </div>
     <div class="col-12"><q-separator /></div>
     <q-form ref="myForm">
@@ -351,256 +480,6 @@
     </q-form>
   </q-card>
 </template>
-<script setup lang="ts">
-import { onMounted, ref } from "vue";
-import { useQuasar } from "quasar";
-import { useRoute, useRouter } from "vue-router";
-import { useCounterMixin } from "@/stores/mixin";
-
-import CurrencyInput from "@/components/CurruncyInput.vue";
-import http from "@/plugins/http";
-import config from "@/app.config";
-import keycloak from "@/plugins/keycloak";
-
-import type { QTableProps, QForm } from "quasar";
-import type {
-  TypeFile,
-  ResponseDataDetail,
-} from "@/modules/06_retirement/interface/response/exit";
-import PositionSide from "@/modules/01_metadata/components/positionEmployee/PositionSide.vue";
-import FullCalendarComponent from "@fullcalendar/vue3";
-
-const $q = useQuasar();
-const route = useRoute();
-const router = useRouter();
-const mixin = useCounterMixin();
-
-const dataId = route.params.id.toString();
-const {
-  date2Thai,
-  dialogMessage,
-  messageError,
-  showLoader,
-  hideLoader,
-  success,
-} = mixin;
-
-const myForm = ref<QForm | null>(null);
-const roleAdmin = ref<boolean>(false);
-const edit = ref<boolean>(false);
-const Org = ref<string>("");
-const PositionLevel = ref<string>("");
-const Position = ref<string>("");
-const prefix = ref<string>("");
-const exitFactor = ref<any>([]);
-const reasonWork = ref<any>([]);
-const adjust = ref<any>([]);
-const timeThink = ref<any>([]);
-const fullname = ref<any>("");
-const avata = ref<any>("");
-const realReason = ref<any>("");
-const notExitFactor = ref<any>("");
-const haveJob = ref<any>("");
-const suggestFriends = ref<any>([]);
-const futureWork = ref<any>([]);
-const suggestion = ref<any>("");
-
-const reasonWorkOther = ref("");
-const reasonWork_option = ref<any>([
-  { label: "ความมั่นคงในการทำงาน ", value: 0 },
-  { label: "สิทธิประโยชน์/สวัสดิการ", value: 1 },
-  { label: "อัตราเงินเดือน ", value: 2 },
-  { label: "ลักษณะงาน ", value: 3 },
-  { label: "วัฒนธรรมการทำงานของข้าราชการ ", value: 4 },
-  { label: "นโยบายของหน่วยงาน ", value: 5 },
-  { label: "ระบบการทำงาน", value: 6 },
-  { label: "สมดุลชีวิตการทำงาน ", value: 7 },
-  { label: "บรรยากาศในการทำงาน  ", value: 8 },
-  { label: "การพัฒนาในสายอาชีพ  ", value: 9 },
-  { label: "โอกาสความก้าวหน้า  ", value: 10 },
-  { label: "การได้รับการยอมรับจากสังคม  ", value: 11 },
-  { label: "อื่น ๆ (ระบุ)  ", value: 12 },
-]);
-const exitFactorOther = ref("");
-const exitFactor_option = ref<any>([
-  { label: "อัตราเงินเดือน ", value: 0 },
-  { label: "สวัสดิการ", value: 1 },
-  { label: "ลักษณะงาน ", value: 2 },
-  { label: "ระบบการทำงาน ", value: 3 },
-  { label: "ระบบสนับสนุนการปฏิบัติงาน ", value: 4 },
-  { label: "การมอบหมายงานที่ชัดเจนและเหมาะสม ", value: 5 },
-  { label: "การบริหารงานของผู้บังคับบัญชา", value: 6 },
-  { label: "การทำงานเป็นทีมกับเพื่อนร่วมงาน ", value: 7 },
-  { label: "ระบบบริหารงานภายในหน่วยงาน  ", value: 8 },
-  { label: "บรรยากาศในการทำงาน  ", value: 9 },
-  { label: "การปฏิบัติอย่างเป็นธรรม  ", value: 10 },
-  { label: "การยอมรับความแตกต่างหลากหลาย  ", value: 11 },
-  { label: "การดูแลและให้ความช่วยเหลือในช่วงเริ่มต้นปฏิบัติงาน  ", value: 12 },
-  { label: "การพัฒนาอย่างเป็นระบบและต่อเนื่อง ", value: 13 },
-  { label: "โอกาสความก้าวหน้า  ", value: 14 },
-  { label: "อื่น ๆ (ระบุ)  ", value: 15 },
-]);
-const suggestFriendsReason = ref("");
-const suggestFriends_option = ref<any>([
-  { label: "แนะนำ  ", value: true },
-  { label: "ไม่แนะนำ (ระบุ)", value: false },
-]);
-const timeThink_option = ref<any>([
-  { label: "น้อยกว่า 2 สัปดาห์ ", value: 0 },
-  { label: "1 เดือน - 3 เดือน", value: 1 },
-  { label: "3 เดือน - 6 เดือน  ", value: 2 },
-  { label: "6 เดือนขึ้นไป  ", value: 3 },
-]);
-const haveJobReason = ref<any>("");
-const haveJob_option = ref<any>([
-  { label: "มี  (ระบุ) ", value: true },
-  { label: "ไม่มี", value: false },
-]);
-const futureWorkReason = ref<any>("");
-const futureWork_option = ref<any>([
-  { label: "อยาก  ", value: true },
-  { label: "ไม่อยาก (ระบุ)", value: false },
-]);
-const adjustOther = ref("");
-const adjust_option = ref<any>([
-  { label: "อัตราเงินเดือน ", value: 0 },
-  { label: "สวัสดิการ", value: 1 },
-  { label: "ลักษณะงาน ", value: 2 },
-  { label: "ระบบการทำงาน ", value: 3 },
-  { label: "ระบบสนับสนุนการปฏิบัติงาน ", value: 4 },
-  { label: "การมอบหมายงานที่ชัดเจนและเหมาะสม ", value: 5 },
-  { label: "การบริหารงานของผู้บังคับบัญชา", value: 6 },
-  { label: "การทำงานเป็นทีมกับเพื่อนร่วมงาน ", value: 7 },
-  { label: "ระบบบริหารงานภายในหน่วยงาน  ", value: 8 },
-  { label: "บรรยากาศในการทำงาน  ", value: 9 },
-  { label: "การปฏิบัติอย่างเป็นธรรม  ", value: 10 },
-  { label: "การยอมรับความแตกต่างหลากหลาย  ", value: 11 },
-  { label: "การดูแลและให้ความช่วยเหลือในช่วงเริ่มต้นปฏิบัติงาน  ", value: 12 },
-  { label: "การพัฒนาอย่างเป็นระบบและต่อเนื่อง ", value: 13 },
-  { label: "โอกาสความก้าวหน้า  ", value: 14 },
-  { label: "อื่น ๆ (ระบุ)  ", value: 15 },
-]);
-
-const responseData = ref<any>({
-  Position: "",
-  PositionLevel: "",
-  Org: "",
-  Prefix: "",
-  Avatar: "",
-  reason: "",
-  salary: 0,
-  status: "",
-  fullname: "",
-  ReasonWork: 0,
-  ReasonWorkOther: "",
-  TimeThink: 0,
-  ExitFactor: 0,
-  ExitFactorOther: "",
-  Adjust: 0,
-  AdjustOther: "",
-  RealReason: "",
-  NotExitFactor: "",
-  Havejob: null,
-  HavejobReason: "",
-  SuggestFriends: null,
-  SuggestFriendsReason: "",
-  FutureWork: null,
-  FutureWorkReason: "",
-});
-
-onMounted(async () => {
-  if (keycloak.tokenParsed != null) {
-    roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
-    console.log("roleAdmin===>", roleAdmin.value);
-  }
-  await getData();
-});
-
-const getData = async () => {
-  showLoader();
-  await http
-    .get(config.API.ExitInterviewByid(dataId))
-    .then((res: any) => {
-      const data = res.data.result;
-      avata.value = data.avatar ?? "";
-      Position.value = data.position ?? "";
-      PositionLevel.value = data.positionLevel ?? "";
-      Org.value = data.org ?? "";
-    
-      fullname.value = data.fullname ?? "";
-      prefix.value = data.prefix ?? "";
-      reasonWork.value = data.reasonWork ?? [];
-      reasonWorkOther.value = data.reasonWorkOther ?? "";
-      timeThink.value = data.TimeThink ?? 0;
-      exitFactor.value = data.exitFactor ?? [];
-      exitFactorOther.value = data.exitFactorOther ?? 0;
-      adjust.value = data.adjust ?? [];
-      adjustOther.value = data.adjustOther ?? "";
-      realReason.value = data.realReason ?? "";
-      notExitFactor.value = data.notExitFactor ?? "";
-      haveJob.value = data.havejob ?? null;
-      haveJobReason.value = data.havejobReason ?? "";
-      suggestFriends.value = data.suggestFriends ?? null;
-      suggestFriendsReason.value = data.suggestFriendsReason ?? "";
-      futureWork.value = data.futureWork ?? null;
-      futureWorkReason.value = data.futureWorkReason ?? "";
-      suggestion.value = data.suggestion ?? "";
-      //   console.log(data.value);
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
-    });
-};
-
-const conditionSave = async () => {
-  if (myForm.value !== null) {
-    myForm.value.validate().then((success) => {
-      if (success) {
-        dialogMessage(
-          $q,
-          "ต้องการแก้ไขข้อมูลหรือไม่?",
-          "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย",
-          "mdi-help-circle-outline",
-          "ตกลง",
-          "public",
-          async () => await saveData(),
-          undefined
-        );
-      }
-    });
-  }
-};
-
-const saveData = async () => {
-  const body = {};
-  showLoader();
-  await http
-    .put(config.API.ExitInterviewByid(dataId), body)
-    .then((res: any) => {
-      //   const data = res.data.result;
-      //   console.log(data);
-      success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
-      edit.value = false;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(async () => {
-      await getData();
-      hideLoader();
-    });
-};
-
-const getClass = (val: boolean) => {
-  return {
-    "full-width inputgreen cursor-pointer": val,
-    "full-width cursor-pointer": !val,
-  };
-};
-</script>
 <style lang="scss" scope>
 .q-img {
   border-radius: 5px;
diff --git a/src/modules/06_retirement/components/Expulsion/expulsionMain.vue b/src/modules/06_retirement/components/Expulsion/expulsionMain.vue
index 9bd73b41b..f88ce7586 100644
--- a/src/modules/06_retirement/components/Expulsion/expulsionMain.vue
+++ b/src/modules/06_retirement/components/Expulsion/expulsionMain.vue
@@ -9,9 +9,7 @@ import { useTransferDataStore } from "@/modules/05_placement/store";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-import DialogFooter from "@/modules/06_retirement/components/DialogFooter.vue";
 import DialogHeader from "@/modules/06_retirement/components/DialogHeader.vue";
-
 import type { ResponseData } from "@/modules/06_retirement/interface/response/expulsion";
 
 const selected = ref<ResponseData[]>([]);
@@ -33,6 +31,7 @@ const {
   hideLoader,
   success,
   dialogMessage,
+  dialogRemove,
 } = mixin;
 const { statusText } = transferStore;
 
@@ -63,9 +62,6 @@ const resetFilter = () => {
   filterRef.value.focus();
 };
 
-// const nextPage = (id:string) => {
-//   router.push("/retirement/resign/"+id);
-// };
 const rows = ref<ResponseData[]>([]);
 const rows2 = ref<ResponseData[]>([]);
 const filters = ref<ResponseData[]>([]);
@@ -191,9 +187,6 @@ const columns2 = ref<QTableProps["columns"]>([
   },
 ]);
 
-const openModal = () => (modal.value = true);
-const closeModal = () => (modal.value = false);
-
 onMounted(async () => {
   await getData();
 });
@@ -216,7 +209,7 @@ const getData = async () => {
       let list: ResponseData[] = [];
       data.map((r: ResponseData) => {
         list.push({
-          createdAt:date2Thai(r.createdAt),
+          createdAt: date2Thai(r.createdAt),
           date: new Date(),
           firstName: r.firstName ?? "",
           id: r.id ?? "",
@@ -252,15 +245,13 @@ const getData = async () => {
 };
 
 const clickDelete = async (id: string) => {
-  dialogMessage(
+  dialogRemove(
     $q,
+    async () => {
+      await deleteData(id);
+    },
     `ลบข้อมูล`,
-    `ต้องการทำการลบข้อมูลนี้ใช่หรือไม่?`,
-    "delete",
-    "ยืนยัน",
-    "red",
-    async () => await deleteData(id),
-    async () => await getData()
+    `ต้องการทำการลบข้อมูลนี้ใช่หรือไม่?`
   );
 };
 
@@ -289,9 +280,7 @@ const saveOrder = async () => {
   showLoader();
   await http
     .post(config.API.expulsionReport, body)
-    .then((res: any) => {
-      //   const data = res.data.result;
-      //   console.log(data);
+    .then(() => {
       success($q, "ส่งไปออกคำสั่งโอนออกสำเร็จ");
       closeModal();
     })
@@ -303,6 +292,9 @@ const saveOrder = async () => {
       hideLoader();
     });
 };
+
+const openModal = () => (modal.value = true);
+const closeModal = () => (modal.value = false);
 const pagination = ref({
   sortBy: "createdAt",
   descending: true,
@@ -438,11 +430,7 @@ const pagination = ref({
                     </q-tooltip> -->
                   </div>
                 </q-td>
-                <q-td
-                  key="createdAt"
-                  :props="props"
-
-                >
+                <q-td key="createdAt" :props="props">
                   {{ props.row.createdAt }}
                 </q-td>
                 <q-td key="statustext" :props="props">
@@ -451,7 +439,10 @@ const pagination = ref({
 
                 <q-td auto-width>
                   <q-btn
-                  v-if="props.row.status !== 'DONE' && props.row.status !=='REPORT'"
+                    v-if="
+                      props.row.status !== 'DONE' &&
+                      props.row.status !== 'REPORT'
+                    "
                     dense
                     size="12px"
                     flat
diff --git a/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue b/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue
index fdb778936..1172a5b2e 100644
--- a/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue
+++ b/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue
@@ -1,3 +1,169 @@
+<script setup lang="ts">
+import { onMounted, ref } from "vue";
+import { useQuasar } from "quasar";
+import { useRoute, useRouter } from "vue-router";
+import { useCounterMixin } from "@/stores/mixin";
+import CurrencyInput from "@/components/CurruncyInput.vue";
+
+import http from "@/plugins/http";
+import config from "@/app.config";
+import keycloak from "@/plugins/keycloak";
+
+import type { QTableProps, QForm } from "quasar";
+import type {
+  TypeFile,
+  ResponseDataDetail,
+} from "@/modules/06_retirement/interface/response/expulsion";
+
+const $q = useQuasar();
+const route = useRoute();
+const router = useRouter();
+const mixin = useCounterMixin();
+
+const dataId = route.params.id.toString();
+const {
+  date2Thai,
+  dialogMessage,
+  messageError,
+  showLoader,
+  hideLoader,
+  success,
+  dialogConfirm,
+} = mixin;
+
+const myForm = ref<QForm | null>(null);
+const roleAdmin = ref<boolean>(false);
+const edit = ref<boolean>(false);
+
+const organizationPositionOld = ref<string>("");
+const positionTypeOld = ref<string>("");
+const positionLevelOld = ref<string>("");
+const posNo = ref<string>("");
+const salary = ref<number>(0);
+const organization = ref<string>("");
+const date = ref<Date | null>(null);
+const reason = ref<string>("");
+
+const responseData = ref<ResponseDataDetail>({
+  personId: "",
+  avataPath: "",
+  createdAt: new Date(),
+  date: new Date(),
+  id: "",
+  organization: "",
+  organizationPositionOld: "",
+  positionLevelOld: "",
+  positionNumberOld: "",
+  positionTypeOld: "",
+  reason: "",
+  salary: 0,
+  status: "",
+  fullname: "",
+});
+
+onMounted(async () => {
+  if (keycloak.tokenParsed != null) {
+    roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
+    console.log("roleAdmin===>", roleAdmin.value);
+  }
+  await getData();
+});
+
+const getData = async () => {
+  showLoader();
+  await http
+    .get(config.API.expulsionByid(dataId))
+    .then((res: any) => {
+      const data = res.data.result;
+
+      responseData.value.personId = data.profileId;
+      responseData.value.createdAt = data.createdAt;
+      responseData.value.date =
+        data.date !== null ? new Date(data.date) : new Date();
+      responseData.value.id = data.id ?? "";
+      responseData.value.organization = data.organization ?? "";
+      responseData.value.organizationPositionOld =
+        data.organizationPositionOld ?? "";
+      responseData.value.positionLevelOld = data.positionLevelOld ?? "";
+      responseData.value.positionNumberOld = data.positionNumberOld ?? "";
+      responseData.value.positionTypeOld = data.positionTypeOld ?? "";
+      responseData.value.reason = data.reason ?? "";
+      responseData.value.salary = data.salary !== null ? data.salary : 0;
+
+      responseData.value.status = data.status ?? "";
+      responseData.value.avataPath = data.avataPath ?? "";
+      responseData.value.fullname = `${data.firstName ?? "-"} ${
+        data.lastName ?? "-"
+      }`;
+
+      organizationPositionOld.value = data.organizationPositionOld ?? "";
+      positionTypeOld.value = data.positionTypeOld ?? "";
+      positionLevelOld.value = data.positionLevelOld ?? "";
+      posNo.value = data.posNo ?? "";
+      salary.value = data.salary ?? "";
+      organization.value = data.organization ?? "";
+      date.value = data.date !== null ? new Date(data.date) : null;
+      reason.value = data.reason ?? "";
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+};
+
+const conditionSave = async () => {
+  if (myForm.value !== null) {
+    myForm.value.validate().then((success) => {
+      if (success) {
+        dialogConfirm(
+          $q,
+          async () => {
+            await saveData();
+          },
+          "ยืนยันการแก้ไขข้อมูล",
+          "ต้องการแก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายหรือไม่?"
+        );
+      }
+    });
+  }
+};
+
+const saveData = async () => {
+  const body = {
+    organization: organization.value,
+    reason: reason.value,
+    organizationPositionOld: organizationPositionOld.value,
+    date: date.value,
+    positionTypeOld: positionTypeOld.value,
+    positionLevelOld: positionLevelOld.value,
+    positionNumberOld: posNo.value,
+    amountOld: salary.value,
+  };
+  showLoader();
+  await http
+    .put(config.API.expulsionByid(dataId), body)
+    .then(() => {
+      success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
+      edit.value = false;
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      await getData();
+      hideLoader();
+    });
+};
+
+const getClass = (val: boolean) => {
+  return {
+    "full-width inputgreen cursor-pointer": val,
+    "full-width cursor-pointer": !val,
+  };
+};
+</script>
 <template>
   <div class="toptitle text-dark col-12 row items-center">
     <q-btn
@@ -137,7 +303,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -153,7 +319,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -169,7 +335,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -185,7 +351,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-3 row ">
+          <div class="col-xs-6 col-sm-3 row">
             <div class="col-12">
               <!-- <q-input
                 :class="getClass(edit)"
@@ -212,7 +378,7 @@
             </div>
           </div>
           <div class="col-12"><q-separator /></div>
-          <div class="col-xs-6 col-sm-6 row ">
+          <div class="col-xs-6 col-sm-6 row">
             <div class="col-12">
               <q-input
                 :class="getClass(edit)"
@@ -228,7 +394,7 @@
               />
             </div>
           </div>
-          <div class="col-xs-6 col-sm-6 row ">
+          <div class="col-xs-6 col-sm-6 row">
             <div class="col-12">
               <datepicker
                 menu-class-name="modalfix"
@@ -293,206 +459,6 @@
     </q-form>
   </q-card>
 </template>
-<script setup lang="ts">
-import { onMounted, ref } from "vue";
-import { useQuasar } from "quasar";
-import { useRoute, useRouter } from "vue-router";
-import { useCounterMixin } from "@/stores/mixin";
-import CurrencyInput from "@/components/CurruncyInput.vue";
-
-import http from "@/plugins/http";
-import config from "@/app.config";
-import keycloak from "@/plugins/keycloak";
-
-import type { QTableProps, QForm } from "quasar";
-import type {
-  TypeFile,
-  ResponseDataDetail,
-} from "@/modules/06_retirement/interface/response/expulsion";
-
-const $q = useQuasar();
-const route = useRoute();
-const router = useRouter();
-const mixin = useCounterMixin();
-
-const dataId = route.params.id.toString();
-const {
-  date2Thai,
-  dialogMessage,
-  messageError,
-  showLoader,
-  hideLoader,
-  success,
-} = mixin;
-
-const myForm = ref<QForm | null>(null);
-const roleAdmin = ref<boolean>(false);
-const edit = ref<boolean>(false);
-
-const organizationPositionOld = ref<string>("");
-const positionTypeOld = ref<string>("");
-const positionLevelOld = ref<string>("");
-const posNo = ref<string>("");
-const salary = ref<number>(0);
-const organization = ref<string>("");
-const date = ref<Date | null>(null);
-const reason = ref<string>("");
-
-const responseData = ref<ResponseDataDetail>({
-  personId: "",
-  avataPath: "",
-  createdAt: new Date(),
-  date: new Date(),
-  id: "",
-  organization: "",
-  organizationPositionOld: "",
-  positionLevelOld: "",
-  positionNumberOld: "",
-  positionTypeOld: "",
-  reason: "",
-  salary: 0,
-  status: "",
-  fullname: "",
-});
-
-const rows = ref<TypeFile[]>([]);
-const columns = ref<QTableProps["columns"]>([
-  {
-    name: "no",
-    align: "left",
-    label: "ลำดับ",
-    sortable: true,
-    field: "no",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "fileName",
-    align: "left",
-    label: "ชื่อไฟล์",
-    sortable: true,
-    field: "fileName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "btnMicrosoft",
-    align: "right",
-    label: "ปุ่ม",
-    sortable: true,
-    field: "btnMicrosoft",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-]);
-
-onMounted(async () => {
-  if (keycloak.tokenParsed != null) {
-    roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
-    console.log("roleAdmin===>", roleAdmin.value);
-  }
-  await getData();
-});
-
-const getData = async () => {
-  showLoader();
-  await http
-    .get(config.API.expulsionByid(dataId))
-    .then((res: any) => {
-      const data = res.data.result;
-
-      responseData.value.personId = data.profileId;
-      responseData.value.createdAt = data.createdAt;
-      responseData.value.date =
-        data.date !== null ? new Date(data.date) : new Date();
-      responseData.value.id = data.id ?? "";
-      responseData.value.organization = data.organization ?? "";
-      responseData.value.organizationPositionOld =
-        data.organizationPositionOld ?? "";
-      responseData.value.positionLevelOld = data.positionLevelOld ?? "";
-      responseData.value.positionNumberOld = data.positionNumberOld ?? "";
-      responseData.value.positionTypeOld = data.positionTypeOld ?? "";
-      responseData.value.reason = data.reason ?? "";
-      responseData.value.salary = data.salary !== null ? data.salary : 0;
-
-      responseData.value.status = data.status ?? "";
-      responseData.value.avataPath = data.avataPath ?? "";
-      responseData.value.fullname = `${data.firstName ?? "-"} ${
-        data.lastName ?? "-"
-      }`;
-
-      organizationPositionOld.value = data.organizationPositionOld ?? "";
-      positionTypeOld.value = data.positionTypeOld ?? "";
-      positionLevelOld.value = data.positionLevelOld ?? "";
-      posNo.value = data.posNo ?? "";
-      salary.value = data.salary ?? "";
-      organization.value = data.organization ?? "";
-      date.value = data.date !== null ? new Date(data.date) : null;
-      reason.value = data.reason ?? "";
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
-    });
-};
-
-const conditionSave = async () => {
-  if (myForm.value !== null) {
-    myForm.value.validate().then((success) => {
-      if (success) {
-        dialogMessage(
-          $q,
-          "ต้องการแก้ไขข้อมูลหรือไม่?",
-          "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย",
-          "mdi-help-circle-outline",
-          "ตกลง",
-          "public",
-          async () => await saveData(),
-          undefined
-        );
-      }
-    });
-  }
-};
-
-const saveData = async () => {
-  const body = {
-    organization: organization.value,
-    reason: reason.value,
-    organizationPositionOld: organizationPositionOld.value,
-    date: date.value,
-    positionTypeOld: positionTypeOld.value,
-    positionLevelOld: positionLevelOld.value,
-    positionNumberOld: posNo.value,
-    amountOld: salary.value,
-  };
-  showLoader();
-  await http
-    .put(config.API.expulsionByid(dataId), body)
-    .then((res: any) => {
-      //   const data = res.data.result;
-      //   console.log(data);
-      success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
-      edit.value = false;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(async () => {
-      await getData();
-      hideLoader();
-    });
-};
-
-const getClass = (val: boolean) => {
-  return {
-    "full-width inputgreen cursor-pointer": val,
-    "full-width cursor-pointer": !val,
-  };
-};
-</script>
 <style lang="scss" scope>
 .q-img {
   border-radius: 5px;
diff --git a/src/modules/06_retirement/components/ListRetirement/TableList.vue b/src/modules/06_retirement/components/ListRetirement/TableList.vue
index 1e4159fdc..1a3136edb 100644
--- a/src/modules/06_retirement/components/ListRetirement/TableList.vue
+++ b/src/modules/06_retirement/components/ListRetirement/TableList.vue
@@ -15,11 +15,8 @@ const router = useRouter();
 const $q = useQuasar();
 const mixin = useCounterMixin();
 const { showLoader, hideLoader, messageError, success, dialogConfirm } = mixin;
-// const type_params = route.params.type;
-// const year_params = route.params.year;
+
 const retireld_params = route.params.retirementId;
-const orderCoverDocs = ref<string>("");
-const orderCoverPdf = ref<string>("");
 const modalNote = ref<boolean>(false);
 const note = ref<string>("");
 const retireProfileId = ref<string>("");
@@ -40,15 +37,6 @@ const columns = ref<any["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  /*  {
-     name: "fixname",
-     align: "left",
-     label: "คำนำหน้านาม",
-     title: "คำนำหน้านาม",
-     field: "fixname",
-     headerStyle: "font-size: 14px",
-     style: "font-size: 14px",
-   }, */
   {
     name: "name",
     align: "left",
@@ -158,8 +146,6 @@ const fileUpload = ref<any>(null);
 onMounted(() => {
   retireld.value = retireld_params.toString();
   fecthlistprofile(retireld.value);
-  // fetchReportCover("pdf", retireld.value);
-  // fetchReportCover("docx", retireld.value);
 });
 
 const closeDialog = () => {
@@ -247,8 +233,8 @@ const clickDelete = () => {
           modalNote.value = false;
         });
     })
-    .onCancel(() => { })
-    .onDismiss(() => { });
+    .onCancel(() => {})
+    .onDismiss(() => {});
 };
 // note
 // const fetchReason = async (prop: string) => {
@@ -293,8 +279,8 @@ const saveNote = () => {
           modalNote.value = false;
         });
     })
-    .onCancel(() => { })
-    .onDismiss(() => { });
+    .onCancel(() => {})
+    .onDismiss(() => {});
 };
 
 const UpdateListId = (retireld: string, pId: string) => {
@@ -362,30 +348,6 @@ const downloadFile = (response: any, filename: string) => {
   document.body.removeChild(link);
 };
 
-// const fetchReportCover = async (type: string, orderId: string) => {
-//   showLoader();
-//   await http
-//     .get(config.API.reportRetireList(type, orderId))
-//     .then(async (res) => {
-//       if (type == "pdf") {
-//         orderCoverPdf.value = res.data.result;
-//       } else {
-//         orderCoverDocs.value = res.data.result;
-//       }
-//     })
-//     .catch((e) => {
-//       // messageError($q, e);
-//     })
-//     .finally(() => {
-//       hideLoader();
-//     });
-// };
-
-// const classrow = (prop: any) => {
-//   if (profileId.value !== "" && prop.profileId === profileId.value) {
-//     return "color: #26a69a;";
-//   } else return "";
-// };
 const saveEdiitReport = (reason: string) => {
   const formdata = new FormData();
   formdata.append("Detail", reason);
@@ -431,77 +393,154 @@ const paginationLabel = (start: number, end: number, total: number) => {
 
 <template>
   <div class="toptitle text-dark col-12 row items-center">
-    <q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="backHistory" />
+    <q-btn
+      icon="mdi-arrow-left"
+      unelevated
+      round
+      dense
+      flat
+      color="primary"
+      class="q-mr-sm"
+      @click="backHistory"
+    />
     รายชื่อผู้เกษียณอายุราชการ
   </div>
   <div>
     <q-card class="col-12 q-pa-md">
       <div class="row col-12 q-pb-sm">
         <div class="row">
-          <AddList :dataProfile="dataProfile" :retireld="retireld" :profile-id="profileId" :UpdateListId="UpdateListId"
-            v-if="statusReport === false &&
+          <AddList
+            :dataProfile="dataProfile"
+            :retireld="retireld"
+            :profile-id="profileId"
+            :UpdateListId="UpdateListId"
+            v-if="
+              statusReport === false &&
               (typeReport == 'ADD' || typeReport == '' || typeReport == null) &&
               statusUpload !== true
-              " />
-
-          <!-- <q-btn flat round style="color: #016987;" icon="save" @click="saveList">
-          <q-tooltip>บันทึกข้อมูล</q-tooltip>
-        </q-btn> -->
+            "
+          />
           <q-btn color="primary" flat round icon="mdi-dots-vertical">
             <q-menu>
               <q-list style="min-width: 100px">
-                <q-item clickable v-close-popup type="a" @click="openmodalEditReport()" target="_blank">
-                  <q-item-section avatar><q-icon color="primary" name="mdi-pencil" /></q-item-section>
+                <q-item
+                  clickable
+                  v-close-popup
+                  type="a"
+                  @click="openmodalEditReport()"
+                  target="_blank"
+                >
+                  <q-item-section avatar
+                    ><q-icon color="primary" name="mdi-pencil"
+                  /></q-item-section>
                   <q-item-section>แก้ไข มติ อ.ก.ก. </q-item-section>
                 </q-item>
                 <q-separator />
-                <q-item clickable v-close-popup type="a" @click="downloadAttachment('pdf', retireld)" target="_blank">
-                  <q-item-section avatar><q-icon color="red" name="mdi-file-pdf" /></q-item-section>
+                <q-item
+                  clickable
+                  v-close-popup
+                  type="a"
+                  @click="downloadAttachment('pdf', retireld)"
+                  target="_blank"
+                >
+                  <q-item-section avatar
+                    ><q-icon color="red" name="mdi-file-pdf"
+                  /></q-item-section>
                   <q-item-section>ไฟล์ .PDF</q-item-section>
                 </q-item>
-                <q-item clickable v-close-popup type="a" @click="downloadAttachment('docx', retireld)" target="_blank">
-                  <q-item-section avatar><q-icon color="blue" name="mdi-file-word" /></q-item-section>
+                <q-item
+                  clickable
+                  v-close-popup
+                  type="a"
+                  @click="downloadAttachment('docx', retireld)"
+                  target="_blank"
+                >
+                  <q-item-section avatar
+                    ><q-icon color="blue" name="mdi-file-word"
+                  /></q-item-section>
                   <q-item-section>ไฟล์ .docx</q-item-section>
                 </q-item>
               </q-list>
             </q-menu>
             <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
           </q-btn>
-          <q-file bg-color="white" clearable outlined dense v-model="fileUpload" accept=".pdf"
-            :style="fileUpload === null ? 'width: 150px' : 'width: auto'" label="อัปโหลดไฟล์"
-            v-if="statusUpload !== true">
+          <q-file
+            bg-color="white"
+            clearable
+            outlined
+            dense
+            v-model="fileUpload"
+            accept=".pdf"
+            :style="fileUpload === null ? 'width: 150px' : 'width: auto'"
+            label="อัปโหลดไฟล์"
+            v-if="statusUpload !== true"
+          >
             <template v-slot:prepend>
               <q-icon color="light-blue" name="attach_file" />
               <q-tooltip>อัปโหลดไฟล์</q-tooltip>
             </template>
           </q-file>
-          <q-btn flat round color="light-blue" icon="upload" @click="uploadFile(fileUpload)" v-if="fileUpload !== null" />
+          <q-btn
+            flat
+            round
+            color="light-blue"
+            icon="upload"
+            @click="uploadFile(fileUpload)"
+            v-if="fileUpload !== null"
+          />
         </div>
         <q-space />
         <div class="row">
           <q-tabs shrink>
-            <q-input borderless outlined dense debounce="300" v-model="filter" placeholder="ค้นหา"
-              style="max-width: 200px" class="q-ml-sm">
+            <q-input
+              borderless
+              outlined
+              dense
+              debounce="300"
+              v-model="filter"
+              placeholder="ค้นหา"
+              style="max-width: 200px"
+              class="q-ml-sm"
+            >
               <template v-slot:append>
                 <q-icon name="search" />
               </template>
             </q-input>
-            <q-select v-model="visibleColumns" multiple outlined dense options-dense
-              :display-value="$q.lang.table.columns" emit-value map-options :options="columns" option-value="name"
-              options-cover style="min-width: 150px" class="gt-xs q-ml-sm">
-              <!-- <template v-slot:option="{ opt }">
-                <div>{{ opt.label }}</div>
-                <div class="sublabel">{{ opt.sublabel }}</div>
-              </template> -->
+            <q-select
+              v-model="visibleColumns"
+              multiple
+              outlined
+              dense
+              options-dense
+              :display-value="$q.lang.table.columns"
+              emit-value
+              map-options
+              :options="columns"
+              option-value="name"
+              options-cover
+              style="min-width: 150px"
+              class="gt-xs q-ml-sm"
+            >
             </q-select>
           </q-tabs>
         </div>
       </div>
 
       <div>
-        <q-table flat dense bordered :rows="rows" :columns="columns" row-key="order" class="custom-header-table"
-          :filter="filter" :visible-columns="visibleColumns" no-data-label="ไม่มีข้อมูล"
-          :pagination-label="paginationLabel" v-model:pagination="pagination">
+        <q-table
+          flat
+          dense
+          bordered
+          :rows="rows"
+          :columns="columns"
+          row-key="order"
+          class="custom-header-table"
+          :filter="filter"
+          :visible-columns="visibleColumns"
+          no-data-label="ไม่มีข้อมูล"
+          :pagination-label="paginationLabel"
+          v-model:pagination="pagination"
+        >
           <template v-slot:header="props">
             <q-tr :props="props">
               <q-th v-for="col in props.cols" :key="col.name" :props="props">
@@ -513,30 +552,45 @@ const paginationLabel = (start: number, end: number, total: number) => {
                 </div>
               </q-th>
               <q-th auto-width />
-              <q-th auto-width v-if="(typeReport === 'EDIT' ||
-                typeReport === null ||
-                typeReport === '') &&
-                statusReport === false &&
-                statusUpload !== true
-                " />
-              <q-th auto-width v-if="(typeReport === 'REMOVE' ||
-                typeReport === null ||
-                typeReport === '') &&
-                statusReport === false &&
-                statusUpload !== true
-                " />
+              <q-th
+                auto-width
+                v-if="
+                  (typeReport === 'EDIT' ||
+                    typeReport === null ||
+                    typeReport === '') &&
+                  statusReport === false &&
+                  statusUpload !== true
+                "
+              />
+              <q-th
+                auto-width
+                v-if="
+                  (typeReport === 'REMOVE' ||
+                    typeReport === null ||
+                    typeReport === '') &&
+                  statusReport === false &&
+                  statusUpload !== true
+                "
+              />
             </q-tr>
           </template>
           <template v-slot:body="props">
-            <q-tr :props="props" class="cursor-pointer" :style="props.row.profileId === profileId && 'color: #26a69a;'"
-              @click.stop="router.push(`/registry/${props.row.profileId}`)">
+            <q-tr
+              :props="props"
+              class="cursor-pointer"
+              :style="props.row.profileId === profileId && 'color: #26a69a;'"
+              @click.stop="router.push(`/registry/${props.row.profileId}`)"
+            >
               <q-td key="order" :props="props">{{ props.row.order }} </q-td>
-              <!-- <q-td key="fixname" :props="props">{{ props.row.fixname }}</q-td> -->
               <q-td key="name" :props="props">{{
                 props.row.fixname + props.row.name
               }}</q-td>
-              <q-td class="table_ellipsis" key="organizationOrganization" :props="props">{{
-                props.row.organizationOrganization }}</q-td>
+              <q-td
+                class="table_ellipsis"
+                key="organizationOrganization"
+                :props="props"
+                >{{ props.row.organizationOrganization }}</q-td
+              >
               <q-td key="positionType" :props="props">{{
                 props.row.positionType
               }}</q-td>
@@ -559,39 +613,69 @@ const paginationLabel = (start: number, end: number, total: number) => {
                 props.row.bureau
               }}</q-td>
 
-              <q-td auto-width v-if="(typeReport === 'EDIT' ||
+              <q-td
+                auto-width
+                v-if="
+                  (typeReport === 'EDIT' ||
                     typeReport === null ||
                     typeReport === '') &&
                   statusReport === false &&
                   statusUpload !== true
-                  ">
-                <q-btn flat round color="primary" icon="mdi-pencil" dense @click.stop="
-                  (modalNote = true),
-                  (note = props.row.reason),
-                  (action = 'edit'),
-                  (retireProfileId = props.row.id)
-                  ">
+                "
+              >
+                <q-btn
+                  flat
+                  round
+                  color="primary"
+                  icon="mdi-pencil"
+                  dense
+                  @click.stop="
+                    (modalNote = true),
+                      (note = props.row.reason),
+                      (action = 'edit'),
+                      (retireProfileId = props.row.id)
+                  "
+                >
                   <q-tooltip>กรอกเหตุผล</q-tooltip>
                 </q-btn>
               </q-td>
-              <q-td auto-width v-if="(typeReport === 'REMOVE' ||
-                typeReport === null ||
-                typeReport === '') &&
-                statusReport === false &&
-                statusUpload !== true
-                ">
-                <q-btn flat round class="text-red-14" icon="mdi-delete" dense @click.stop="
-                  (modalNote = true),
-                  (action = 'delete'),
-                  (note = props.row.reason),
-                  (retireProfileId = props.row.id)
-                  "><q-tooltip>ลบข้อมูล</q-tooltip></q-btn>
+              <q-td
+                auto-width
+                v-if="
+                  (typeReport === 'REMOVE' ||
+                    typeReport === null ||
+                    typeReport === '') &&
+                  statusReport === false &&
+                  statusUpload !== true
+                "
+              >
+                <q-btn
+                  flat
+                  round
+                  class="text-red-14"
+                  icon="mdi-delete"
+                  dense
+                  @click.stop="
+                    (modalNote = true),
+                      (action = 'delete'),
+                      (note = props.row.reason),
+                      (retireProfileId = props.row.id)
+                  "
+                  ><q-tooltip>ลบข้อมูล</q-tooltip></q-btn
+                >
               </q-td>
             </q-tr>
           </template>
           <template v-slot:pagination="scope">
-            <q-pagination v-model="pagination.page" color="primary" :max="scope.pagesNumber" :max-pages="5" size="sm"
-              boundary-links direction-links></q-pagination>
+            <q-pagination
+              v-model="pagination.page"
+              color="primary"
+              :max="scope.pagesNumber"
+              :max-pages="5"
+              size="sm"
+              boundary-links
+              direction-links
+            ></q-pagination>
           </template>
         </q-table>
       </div>
@@ -600,29 +684,52 @@ const paginationLabel = (start: number, end: number, total: number) => {
 
   <!-- note -->
   <q-dialog v-model="modalNote">
-    <q-card style="width: 50vw;">
+    <q-card style="width: 50vw">
       <DialogHeader tittle="กรอกเหตุผล" :close="closeDialog" />
       <q-separator />
       <q-card-section class="q-pt-none bg-grey-1">
         <div class="row q-col-gutter-sm">
           <div class="col-12">
-
-            <q-input outlined dense lazy-rules v-model="note" :rules="[(val) => !!val || 'กรุณากรอกเหตุผล']"
-              :label="`${'กรอกเหตุผล'}`" type="textarea" />
-
+            <q-input
+              outlined
+              dense
+              lazy-rules
+              v-model="note"
+              :rules="[(val) => !!val || 'กรุณากรอกเหตุผล']"
+              :label="`${'กรอกเหตุผล'}`"
+              type="textarea"
+            />
           </div>
         </div>
       </q-card-section>
 
       <q-card-actions align="right">
-        <q-btn v-if="action === 'delete'" label="บันทึก" color="secondary" :disable="visibleNote" @click="clickDelete" />
-        <q-btn v-else label="บักทึก" color="secondary" @click="saveNote" :disable="visibleNote" />
+        <q-btn
+          v-if="action === 'delete'"
+          label="บันทึก"
+          color="secondary"
+          :disable="visibleNote"
+          @click="clickDelete"
+        />
+        <q-btn
+          v-else
+          label="บักทึก"
+          color="secondary"
+          @click="saveNote"
+          :disable="visibleNote"
+        />
       </q-card-actions>
     </q-card>
   </q-dialog>
 
-  <DialogPopupReason :modal="modalEdit" title="แก้ไขมติ อ.ก.ก." label="มติ อ.ก.ก." :click-close="closemodalEditReport"
-    :savaForm="saveEdiitReport" :textReport="textReport" />
+  <DialogPopupReason
+    :modal="modalEdit"
+    title="แก้ไขมติ อ.ก.ก."
+    label="มติ อ.ก.ก."
+    :click-close="closemodalEditReport"
+    :savaForm="saveEdiitReport"
+    :textReport="textReport"
+  />
 </template>
 
 <style lang="scss" scope>