From 13203150cc1e5be492b4788c01d0f86897e75cbf Mon Sep 17 00:00:00 2001
From: waruneeta <warunee.auy@gmail.com>
Date: Sun, 24 Sep 2023 11:16:05 +0700
Subject: [PATCH] =?UTF-8?q?exit=20interview=20=E0=B8=84=E0=B8=A7=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=A1=E0=B8=84=E0=B8=B4=E0=B8=94=E0=B9=80=E0=B8=AB=E0=B9=87?=
 =?UTF-8?q?=E0=B8=99=20=E0=B9=81=E0=B8=A5=E0=B8=B0=E0=B9=81=E0=B8=81?=
 =?UTF-8?q?=E0=B9=84=E0=B8=82=E0=B8=84=E0=B8=B3=E0=B8=96=E0=B8=B2=E0=B8=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/ExitInterview/EditQuestion.vue | 571 ++++++++++++++++++
 .../components/ExitInterview/exitMain.vue     |   4 +-
 .../components/ExitInterview/exitRegistry.vue | 320 +++++-----
 .../interface/index/ExitInterviewQuestion.ts  |  13 +
 src/modules/06_retirement/router.ts           |  23 +-
 .../storeExitInterviewQuestion.ts             |  17 +
 6 files changed, 757 insertions(+), 191 deletions(-)
 create mode 100644 src/modules/06_retirement/components/ExitInterview/EditQuestion.vue
 create mode 100644 src/modules/06_retirement/interface/index/ExitInterviewQuestion.ts
 create mode 100644 src/modules/06_retirement/storeExitInterviewQuestion.ts

diff --git a/src/modules/06_retirement/components/ExitInterview/EditQuestion.vue b/src/modules/06_retirement/components/ExitInterview/EditQuestion.vue
new file mode 100644
index 000000000..21f3f64ee
--- /dev/null
+++ b/src/modules/06_retirement/components/ExitInterview/EditQuestion.vue
@@ -0,0 +1,571 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from "vue";
+import { useQuasar } from "quasar";
+import { 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 router = useRouter();
+const mixin = useCounterMixin();
+
+const { messageError, showLoader, hideLoader } = mixin;
+
+const myForm = ref<QForm | null>(null);
+
+// set คำถามที่ 1
+const question1Desc = ref<string>("เหตุใดท่านจึงตัดสินใจร่วมงานกับกรุงเทพมหานคร (เลือกได้มากกว่า 1 ข้อ)")
+const question1Score = ref<number>(5)
+const question1Answer = ref<any>([
+  "ความมั่นคงในการทำงาน",
+  "สิทธิประโยชน์/สวัสดิการ",
+  "อัตราเงินเดือน",
+  "ลักษณะงาน",
+  "วัฒนธรรมการทำงานของข้าราชการ",
+  "นโยบายของหน่วยงาน",
+  "ระบบการทำงาน",
+  "สมดุลชีวิตการทำงาน",
+  "บรรยากาศในการทำงาน",
+  "การพัฒนาในสายอาชีพ",
+  "โอกาสความก้าวหน้า",
+  "การได้รับการยอมรับจากสังคม",
+  // "อื่น ๆ (ระบุ)",
+])
+
+// set คำถามที่ 2
+const question2Desc = ref<string>("สำหรับการลาออกในครั้งนี ท่านได้คิดทบทวนอย่างจริงจังเป็นระยะเวลานานเท่าใด")
+const question2Score = ref<number>(5)
+const question2Answer = ref<any>([
+  "น้อยกว่า 2 สัปดาห์",
+  "1 เดือน - 3 เดือน",
+  "3 เดือน - 6 เดือน",
+  "6 เดือนขึ้นไป",
+])
+
+// set คำถามที่ 3
+const question3Desc = ref<string>("ปัจจัยใดที่ทำให้ท่านตัดสินใจลาออกจากราชการ (เลือกได้มากกว่า 1 ข้อ)")
+const question3Score = ref<number>(5)
+const question3Answer = ref<any>([
+  "อัตราเงินเดือน",
+  "สวัสดิการ",
+  "ลักษณะงาน",
+  "ระบบการทำงาน",
+  "ระบบสนับสนุนการปฏิบัติงาน",
+  "การมอบหมายงานที่ชัดเจนและเหมาะสม",
+  "การบริหารงานของผู้บังคับบัญช",
+  "การทำงานเป็นทีมกับเพื่อนร่วมงาน",
+  "ระบบบริหารงานภายในหน่วยงาน",
+  "บรรยากาศในการทำงาน",
+  "การปฏิบัติอย่างเป็นธรรม",
+  "การยอมรับความแตกต่างหลากหลาย",
+  "การดูแลและให้ความช่วยเหลือในช่วงเริ่มต้นปฏิบัติงาน",
+  "การพัฒนาอย่างเป็นระบบและต่อเนื่อง",
+  "โอกาสความก้าวหน้า",
+])
+
+// set คำถามที่ 4
+const question4Desc = ref<string>("อะไรคือสิ่งที่ท่านเห็นว่าควรปรับปรุง (เลือกได้มากกว่า 1 ข้อ)")
+const question4Score = ref<number>(5)
+const question4Answer = ref<any>([
+  "อัตราเงินเดือน ",
+  "สวัสดิการ",
+  "ลักษณะงาน",
+  "ระบบการทำงาน",
+  "ระบบสนับสนุนการปฏิบัติงาน",
+  "การมอบหมายงานที่ชัดเจนและเหมาะสม",
+  "การบริหารงานของผู้บังคับบัญช",
+  "การทำงานเป็นทีมกับเพื่อนร่วมงาน",
+  "ระบบบริหารงานภายในหน่วยงาน",
+  "บรรยากาศในการทำงาน",
+  "การปฏิบัติอย่างเป็นธรรม",
+  "การยอมรับความแตกต่างหลากหลาย",
+  "การดูแลและให้ความช่วยเหลือในช่วงเริ่มต้นปฏิบัติงาน",
+  "การพัฒนาอย่างเป็นระบบและต่อเนื่อง",
+  "โอกาสความก้าวหน้า",
+])
+
+// set คำถามที่ 5
+const question5Desc = ref<string>("โปรดระบุสาเหตุที่แท้จริง ที่ทำให้ท่านตัดสินใจลาออกจากการปฏิบัติราชการกับกรุงเทพมหานคร ?")
+const question5Score = ref<number>(5)
+// set คำถามที่ 6
+const question6Desc = ref<string>("ปัจจัยใดที่จะช่วยทำให้ท่านเปลี่ยนใจ ไม่อยากลาออกจากการปฏิบัติราชการกับกรุงเทพมหานคร")
+const question6Score = ref<number>(5)
+// set คำถามที่ 7
+const question7Desc = ref<string>("ท่านมีงานใหม่หรือไม่ ถ้ามี (โปรดระบุ ชื่อบริษัทเอกชน/หน่วยงานภาครัฐ) และอะไรคือสิ่งที่ที่ทำงานใหม่ให้กับท่าน ซึ่งท่านรู้สึกว่าเป็นที่น่าพอใจมากกว่าการปฏิบัติราชการกับกรุงเทพมหานคร")
+const question7Score = ref<number>(5)
+const question7Answer = ref<any>([
+  "มี (ระบุ)",
+  "ไม่มี",
+])
+
+// set คำถามที่ 8
+const question8Desc = ref<string>("ท่านจะแนะนำเพื่อนให้มาร่วมงานกับกรุงเทพมหานครหรือไม่ (ถ้าไม่ โปรดระบุเหตุผล)")
+const question8Score = ref<number>(5)
+const question8Answer = ref<any>([
+  "แนะนำ",
+  "ไม่แนะนำ (ระบุ)",
+])
+
+// set คำถามที่ 9
+const question9Desc = ref<string>("หากท่านมีโอกาสในอนาคต ท่านอยากกลับมาร่วมงานกับกรุงเทพมหานครหรือไม่ (ถ้าไม่ โปรดระบุเหตุผล)")
+const question9Score = ref<number>(5)
+const question9Answer = ref<any>([
+  "อยาก",
+  "ไม่อยาก (ระบุ)",
+])
+// set คำถามที่ 10
+const question10Desc = ref<string>("ความคิดเห็นและข้อเสนอแนะอื่น ๆ")
+const question10Score = ref<number>(5)
+
+const exitFactor = ref<any>([]);
+const reasonWork = ref<any>([]);
+const adjust = ref<any>([]);
+const timeThink = 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 suggestFriendsReason = ref("");
+const suggestFriends_option = ref<any>([
+  { label: "แนะนำ  ", value: true },
+  { label: "ไม่แนะนำ (ระบุ)", value: false },
+]);
+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 () => {
+  await getData();
+});
+
+//นำข้อมูลมาแสดง
+const getData = async () => {
+  // showLoader();
+  // await http
+  //   .get(config.API.xxx)
+  //   .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 icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
+    แก้ไขคำถาม
+  </div>
+
+  <q-card bordered class="row col-12 text-dark q-mt-sm">
+    <div class="col-12"><q-separator /></div>
+    <q-form ref="myForm">
+
+      <div class="col-12 row q-col-gutter-md q-pa-md">
+        <div class="col-xs-12 col-sm-12">
+          <q-card bordered flat>
+            <div class="q-pa-xs bg-grey-2 row q-py-sm q-px-md text-bold">
+              คำถามข้อที่ 1
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+              <div class="col-10 text-top0">
+                <q-input v-model="question1Desc" label="คำถามข้อที่ 1" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคำถามข้อที่ 1',
+                  ]" />
+              </div>
+              <div class="col-2 text-top0">
+                <q-input v-model="question1Score" label="กรอกคะแนน" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคะแนน',
+                  ]" />
+              </div>
+
+              <div v-for="(data, index) in question1Answer" :key="index" class="row col-12">
+                <div class="col-6">
+                  <q-input v-model="question1Answer[index]" :label="`คำตอบที่ ${index + 1}`" dense lazy-rules type="text"
+                    autogrow hide-bottom-space outlined class="bg-white" :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกคำตอบ',
+                    ]" />
+                </div>
+              </div>
+            </div>
+          </q-card>
+        </div>
+      </div>
+
+      <div class="col-12 row q-col-gutter-md q-pa-md">
+        <div class="col-xs-12 col-sm-12">
+          <q-card bordered flat>
+            <div class="q-pa-xs bg-grey-2 row q-py-sm q-px-md text-bold">
+              คำถามข้อที่ 2
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+              <div class="col-10 text-top0">
+                <q-input v-model="question2Desc" label="คำถามข้อที่ 2" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคำถามข้อที่ 2',
+                  ]" />
+              </div>
+              <div class="col-2 text-top0">
+                <q-input v-model="question2Score" label="กรอกคะแนน" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคะแนน',
+                  ]" />
+              </div>
+
+              <div v-for="(data, index) in question2Answer" :key="index" class="row col-12">
+                <div class="col-6">
+                  <q-input v-model="question2Answer[index]" :label="`คำตอบที่ ${index + 1}`" dense lazy-rules type="text"
+                    autogrow hide-bottom-space outlined class="bg-white" :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกคำตอบ',
+                    ]" />
+                </div>
+              </div>
+            </div>
+          </q-card>
+        </div>
+      </div>
+
+      <div class="col-12 row q-col-gutter-md q-pa-md">
+        <div class="col-xs-12 col-sm-12">
+          <q-card bordered flat>
+            <div class="q-pa-xs bg-grey-2 row q-py-sm q-px-md text-bold">
+              คำถามข้อที่ 3
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+              <div class="col-10 text-top0">
+                <q-input v-model="question3Desc" label="คำถามข้อที่ 3" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคำถามข้อที่ 3',
+                  ]" />
+              </div>
+              <div class="col-2 text-top0">
+                <q-input v-model="question3Score" label="กรอกคะแนน" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคะแนน',
+                  ]" />
+              </div>
+
+              <div v-for="(data, index) in question3Answer" :key="index" class="row col-12">
+                <div class="col-6">
+                  <q-input v-model="question3Answer[index]" :label="`คำตอบที่ ${index + 1}`" dense lazy-rules type="text"
+                    autogrow hide-bottom-space outlined class="bg-white" :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกคำตอบ',
+                    ]" />
+                </div>
+              </div>
+            </div>
+          </q-card>
+        </div>
+      </div>
+
+      <div class="col-12 row q-col-gutter-md q-pa-md">
+        <div class="col-xs-12 col-sm-12">
+          <q-card bordered flat>
+            <div class="q-pa-xs bg-grey-2 row q-py-sm q-px-md text-bold">
+              คำถามข้อที่ 4
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+              <div class="col-10 text-top0">
+                <q-input v-model="question4Desc" label="คำถามข้อที่ 4" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคำถามข้อที่ 4',
+                  ]" />
+              </div>
+              <div class="col-2 text-top0">
+                <q-input v-model="question4Score" label="กรอกคะแนน" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคะแนน',
+                  ]" />
+              </div>
+
+              <div v-for="(data, index) in question4Answer" :key="index" class="row col-12">
+                <div class="col-6">
+                  <q-input v-model="question4Answer[index]" :label="`คำตอบที่ ${index + 1}`" dense lazy-rules type="text"
+                    autogrow hide-bottom-space outlined class="bg-white" :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกคำตอบ',
+                    ]" />
+                </div>
+              </div>
+            </div>
+          </q-card>
+        </div>
+      </div>
+
+      <div class="col-12 row q-col-gutter-md q-pa-md">
+        <div class="col-xs-12 col-sm-12">
+          <q-card bordered flat>
+            <div class="q-pa-xs bg-grey-2 row q-py-sm q-px-md text-bold">
+              คำถามข้อที่ 5
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+              <div class="col-10 text-top0">
+                <q-input v-model="question5Desc" label="คำถามข้อที่ 5" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคำถามข้อที่ 5',
+                  ]" />
+              </div>
+
+              <div class="col-2 text-top0">
+                <q-input v-model="question5Score" label="กรอกคะแนน" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคะแนน',
+                  ]" />
+              </div>
+            </div>
+          </q-card>
+        </div>
+      </div>
+
+      <div class="col-12 row q-col-gutter-md q-pa-md">
+        <div class="col-xs-12 col-sm-12">
+          <q-card bordered flat>
+            <div class="q-pa-xs bg-grey-2 row q-py-sm q-px-md text-bold">
+              คำถามข้อที่ 6
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+              <div class="col-10 text-top0">
+                <q-input v-model="question6Desc" label="คำถามข้อที่ 6" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคำถามข้อที่ 6',
+                  ]" />
+              </div>
+
+              <div class="col-2 text-top0">
+                <q-input v-model="question6Score" label="กรอกคะแนน" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคะแนน',
+                  ]" />
+              </div>
+            </div>
+          </q-card>
+        </div>
+      </div>
+
+      <div class="col-12 row q-col-gutter-md q-pa-md">
+        <div class="col-xs-12 col-sm-12">
+          <q-card bordered flat>
+            <div class="q-pa-xs bg-grey-2 row q-py-sm q-px-md text-bold">
+              คำถามข้อที่ 7
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+              <div class="col-10 text-top0">
+                <q-input v-model="question7Desc" label="คำถามข้อที่ 7" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคำถามข้อที่ 7',
+                  ]" />
+              </div>
+              <div class="col-2 text-top0">
+                <q-input v-model="question7Score" label="กรอกคะแนน" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคะแนน',
+                  ]" />
+              </div>
+
+              <div v-for="(data, index) in question7Answer" :key="index" class="row col-12">
+                <div class="col-6">
+                  <q-input v-model="question7Answer[index]" :label="`คำตอบที่ ${index + 1}`" dense lazy-rules type="text"
+                    autogrow hide-bottom-space outlined class="bg-white" :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกคำตอบ',
+                    ]" />
+                </div>
+              </div>
+            </div>
+          </q-card>
+        </div>
+      </div>
+
+      <div class="col-12 row q-col-gutter-md q-pa-md">
+        <div class="col-xs-12 col-sm-12">
+          <q-card bordered flat>
+            <div class="q-pa-xs bg-grey-2 row q-py-sm q-px-md text-bold">
+              คำถามข้อที่ 8
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+              <div class="col-10 text-top0">
+                <q-input v-model="question8Desc" label="คำถามข้อที่ 8" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคำถามข้อที่ 8',
+                  ]" />
+              </div>
+
+              <div class="col-2 text-top0">
+                <q-input v-model="question8Score" label="กรอกคะแนน" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคะแนน',
+                  ]" />
+              </div>
+
+              <div v-for="(data, index) in question8Answer" :key="index" class="row col-12">
+                <div class="col-6">
+                  <q-input v-model="question8Answer[index]" :label="`คำตอบที่ ${index + 1}`" dense lazy-rules type="text"
+                    autogrow hide-bottom-space outlined class="bg-white" :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกคำตอบ',
+                    ]" />
+                </div>
+              </div>
+
+            </div>
+          </q-card>
+        </div>
+      </div>
+
+      <div class="col-12 row q-col-gutter-md q-pa-md">
+        <div class="col-xs-12 col-sm-12">
+          <q-card bordered flat>
+            <div class="q-pa-xs bg-grey-2 row q-py-sm q-px-md text-bold">
+              คำถามข้อที่ 9
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+              <div class="col-10 text-top0">
+                <q-input v-model="question9Desc" label="คำถามข้อที่ 9" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคำถามข้อที่ 9',
+                  ]" />
+              </div>
+
+              <div class="col-2 text-top0">
+                <q-input v-model="question9Score" label="กรอกคะแนน" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคะแนน',
+                  ]" />
+              </div>
+
+              <div v-for="(data, index) in question9Answer" :key="index" class="row col-12">
+                <div class="col-6">
+                  <q-input v-model="question9Answer[index]" :label="`คำตอบที่ ${index + 1}`" dense lazy-rules type="text"
+                    autogrow hide-bottom-space outlined class="bg-white" :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกคำตอบ',
+                    ]" />
+                </div>
+              </div>
+
+            </div>
+          </q-card>
+        </div>
+      </div>
+
+      <div class="col-12 row q-col-gutter-md q-pa-md">
+        <div class="col-xs-12 col-sm-12">
+          <q-card bordered flat>
+            <div class="q-pa-xs bg-grey-2 row q-py-sm q-px-md text-bold">
+              คำถามข้อที่ 10
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+              <div class="col-10 text-top0">
+                <q-input v-model="question10Desc" label="คำถามข้อที่ 10" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคำถามข้อที่ 10',
+                  ]" />
+              </div>
+
+              <div class="col-2 text-top0">
+                <q-input v-model="question10Score" label="กรอกคะแนน" dense lazy-rules type="text" autogrow
+                  hide-bottom-space outlined class="bg-white" :rules="[
+                    (val) => (val && val.length > 0) || 'กรุณากรอกคะแนน',
+                  ]" />
+              </div>
+            </div>
+          </q-card>
+        </div>
+      </div>
+
+      <div class="col-12"><q-separator /></div>
+
+      <q-card-actions class="text-primary q-pa-md">
+        <q-space />
+        <q-btn unelevated label="บันทึก" color="public" @click="">
+        </q-btn>
+
+      </q-card-actions>
+
+    </q-form>
+  </q-card>
+</template>
+
+<style lang="scss" scope>
+.q-img {
+  border-radius: 5px;
+  height: 70px;
+}
+
+.text-top {
+  color: gray;
+  font-weight: 400;
+  padding-bottom: 3px;
+}
+
+.text-detail {
+  font-weight: 500;
+}
+</style>
diff --git a/src/modules/06_retirement/components/ExitInterview/exitMain.vue b/src/modules/06_retirement/components/ExitInterview/exitMain.vue
index 04f55a95b..bb2a74ce4 100644
--- a/src/modules/06_retirement/components/ExitInterview/exitMain.vue
+++ b/src/modules/06_retirement/components/ExitInterview/exitMain.vue
@@ -277,7 +277,9 @@ const openModalCalendar = (rows: any) => {
     <div class="col-12 row q-pa-md">
       <div class="row col-12">
         <div class="row col-12 q-col-gutter-sm">
-          <q-btn color="blue-7" flat dense>แก้ไขคำถาม</q-btn>
+          <div>
+            <q-btn color="info" @click="$router.push('/exit-Interview/edit-question')">แก้ไขคำถาม</q-btn>
+          </div>
           <q-space />
           <q-input class="col-xs-12 col-sm-3 col-md-2" standout dense v-model="filterKeyword" ref="filterRef" outlined
             debounce="300" placeholder="ค้นหา">
diff --git a/src/modules/06_retirement/components/ExitInterview/exitRegistry.vue b/src/modules/06_retirement/components/ExitInterview/exitRegistry.vue
index a2e3d6286..021ed848e 100644
--- a/src/modules/06_retirement/components/ExitInterview/exitRegistry.vue
+++ b/src/modules/06_retirement/components/ExitInterview/exitRegistry.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, ref } from "vue";
+import { onMounted, reactive, ref, watch } from "vue";
 import { useQuasar } from "quasar";
 import { useRoute, useRouter } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
@@ -37,6 +37,20 @@ const haveJob = ref<any>();
 const suggestFriends = ref<any>();
 const futureWork = ref<any>();
 const suggestion = ref<any>("");
+const comment = ref<string>("");
+const score = reactive([
+  { no: 1, score: 0 },
+  { no: 2, score: 0 },
+  { no: 3, score: 0 },
+  { no: 4, score: 0 },
+  { no: 5, score: 0 },
+  { no: 6, score: 0 },
+  { no: 7, score: 0 },
+  { no: 8, score: 0 },
+  { no: 9, score: 0 },
+  { no: 10, score: 0 },
+]);
+const scoreTotal = ref<number>(0);
 
 const reasonWorkOther = ref("");
 const reasonWork_option = ref<any>([
@@ -158,19 +172,16 @@ const getData = async () => {
       hideLoader();
     });
 };
+
+watch(score, () => {
+  scoreTotal.value = score.reduce((accumulator, object) => {
+    return accumulator + Number(object.score);
+  }, 0);
+})
 </script>
 <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="router.go(-1)"
-    />
+    <q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
     รายละเอียด Exit interview ของ {{ prefix }} {{ fullname }}
   </div>
   <q-card bordered class="row col-12 text-dark">
@@ -227,252 +238,191 @@ const getData = async () => {
       <div class="col-12 row q-col-gutter-md q-pa-md">
         <div class="col-xs-12 col-sm-12">
           <q-card bordered flat>
-            <div
-              class="q-pa-xs bg-grey-2 row items-center q-py-sm q-px-md justify-center text-bold"
-            >
+            <div class="q-pa-xs bg-grey-2 row items-center q-py-sm q-px-md justify-center text-bold">
               แบบสอบถาม
             </div>
             <q-separator />
             <div class="col-12 row q-pa-sm q-col-gutter-sm">
-              <div class="col-12 text-top0 items-center">
+              <div class="col-10 text-top0 items-center">
                 1. เหตุใดท่านจึงตัดสินใจร่วมงานกับกรุงเทพมหานคร (เลือกได้มากกว่า
                 1 ข้อ)
               </div>
-              <q-option-group
-                :options="reasonWork_option"
-                type="checkbox"
-                v-model="reasonWork"
-                disable
-              />
+              <div class="col-2 text-top0 items-center">
+                <q-input dense outlined v-model="score[0].score" label="คะแนนข้อ 1" type="number" />
+              </div>
+
+              <q-option-group :options="reasonWork_option" type="checkbox" v-model="reasonWork" disable />
               <div class="col-12 text-top0 items-center">
                 <q-item-label>
-                  <q-input
-                    v-if="reasonWork.includes(12)"
-                    v-model="reasonWorkOther"
-                    disable
-                    label="กรอกข้อความ"
-                    dense
-                    lazy-rules
-                    type="text"
-                    autogrow
-                    hide-bottom-space
-                    outlined
-                    class="bg-white"
-                    :rules="[
+                  <q-input v-if="reasonWork.includes(12)" v-model="reasonWorkOther" disable label="กรอกข้อความ" dense
+                    lazy-rules type="text" autogrow hide-bottom-space outlined class="bg-white" :rules="[
                       (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                    ]"
-                  />
+                    ]" />
                 </q-item-label>
               </div>
-              <div class="col-12 text-top0 items-center">
+              <div class="col-10 text-top0 items-center">
                 2. สำหรับการลาออกในครั้งนี้
                 ท่านได้คิดทบทวนอย่างจริงจังเป็นระยะเวลานานเท่าใด
               </div>
-              <q-option-group
-                :options="timeThink_option"
-                type="radio"
-                v-model="timeThink"
-                disable
-              />
+              <div class="col-2 text-top0 items-center">
+                <q-input dense outlined v-model="score[1].score" label="คะแนนข้อ 2" type="number" />
+              </div>
 
-              <div class="col-12 text-top0 items-center">
+              <div class="col-12">
+                <q-option-group :options="timeThink_option" type="radio" v-model="timeThink" disable />
+              </div>
+
+              <div class="col-10 text-top0 items-center">
                 3. ปัจจัยใดที่ทำให้ท่านตัดสินใจลาออกจากราชการ (เลือกได้มากกว่า 1
                 ข้อ )
               </div>
-              <q-option-group
-                :options="exitFactor_option"
-                type="checkbox"
-                v-model="exitFactor"
-                disable
-              />
+
+              <div class="col-2 text-top0 items-center">
+                <q-input dense outlined v-model="score[2].score" label="คะแนนข้อ 3" type="number" />
+              </div>
+
+              <q-option-group :options="exitFactor_option" type="checkbox" v-model="exitFactor" disable />
+
               <div class="col-12 text-top0 items-center">
                 <q-item-label>
-                  <q-input
-                    v-if="exitFactor.includes(15)"
-                    v-model="exitFactorOther"
-                    label="กรอกข้อความ"
-                    dense
-                    disable
-                    lazy-rules
-                    type="text"
-                    autogrow
-                    hide-bottom-space
-                    outlined
-                    class="bg-white"
-                    :rules="[
+                  <q-input v-if="exitFactor.includes(15)" v-model="exitFactorOther" label="กรอกข้อความ" dense disable
+                    lazy-rules type="text" autogrow hide-bottom-space outlined class="bg-white" :rules="[
                       (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                    ]"
-                  />
+                    ]" />
                 </q-item-label>
               </div>
 
-              <div class="col-12 text-top0 items-center">
+              <div class="col-10 text-top0 items-center">
                 4. อะไรคือสิ่งที่ท่านเห็นว่าควรปรับปรุง (เลือกได้มากกว่า 1 ข้อ)
               </div>
+
+              <div class="col-2 text-top0 items-center">
+                <q-input dense outlined v-model="score[3].score" label="คะแนนข้อ 4" type="number" />
+              </div>
+
               <q-list>
-                <q-option-group
-                  :options="adjust_option"
-                  type="checkbox"
-                  v-model="adjust"
-                  disable
-                />
+                <q-option-group :options="adjust_option" type="checkbox" v-model="adjust" disable />
               </q-list>
               <div class="col-12 text-top0 items-center">
                 <q-item-label>
-                  <q-input
-                    v-if="adjust.includes(15)"
-                    v-model="adjustOther"
-                    label="กรอกอื่นๆ"
-                    dense
-                    disable
-                    lazy-rules
-                    type="text"
-                    autogrow
-                    hide-bottom-space
-                    outlined
-                    class="bg-white"
-                    :rules="[
+                  <q-input v-if="adjust.includes(15)" v-model="adjustOther" label="กรอกอื่นๆ" dense disable lazy-rules
+                    type="text" autogrow hide-bottom-space outlined class="bg-white" :rules="[
                       (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                    ]"
-                  />
+                    ]" />
                 </q-item-label>
               </div>
-              <div class="col-12 text-top0 items-center">
+              <div class="col-10 text-top0 items-center">
                 5. โปรดระบุสาเหตุที่แท้จริง
                 ที่ทำให้ท่านตัดสินใจลาออกจากการปฏิบัติราชการกับกรุงเทพมหานคร ?
               </div>
-              <q-input
-                class="col-12"
-                dense
-                disable
-                outlined
-                v-model="realReason"
-                label="  "
-                type="textarea"
-              />
+              <div class="col-2 text-top0 items-center">
+                <q-input dense outlined v-model="score[4].score" label="คะแนนข้อ 5" type="number" />
+              </div>
 
-              <div class="col-12 text-top0 items-center">
+              <q-input class="col-12" dense disable outlined v-model="realReason" label="  " type="textarea" />
+
+              <div class="col-10 text-top0 items-center">
                 6. ปัจจัยใดที่จะช่วยทำให้ท่านเปลี่ยนใจ
                 ไม่อยากลาออกจากการปฏิบัติราชการกับกรุงเทพมหานคร
               </div>
-              <q-input
-                class="col-12"
-                dense
-                outlined
-                disable
-                v-model="notExitFactor"
-                label="  "
-                type="textarea"
-              />
+              <div class="col-2 text-top0 items-center">
+                <q-input dense outlined v-model="score[5].score" label="คะแนนข้อ 6" type="number" />
+              </div>
 
-              <div class="col-12 text-top0 items-center">
+              <q-input class="col-12" dense outlined disable v-model="notExitFactor" label="  " type="textarea" />
+
+              <div class="col-10 text-top0 items-center">
                 7. ท่านมีงานใหม่หรือไม่ ถ้ามี (โปรดระบุ
                 ชื่อบริษัทเอกชน/หน่วยงานภาครัฐ)
                 และอะไรคือสิ่งที่ที่ทำงานใหม่ให้กับท่าน
                 ซึ่งท่านรู้สึกว่าเป็นที่น่าพอใจมากกว่าการปฏิบัติราชการกับกรุงเทพมหานคร
               </div>
-              <q-option-group
-                :options="haveJob_option"
-                type="radio"
-                v-model="haveJob"
-                disable
-              />
+
+              <div class="col-2 text-top0 items-center">
+                <q-input dense outlined v-model="score[6].score" label="คะแนนข้อ 7" type="number" />
+              </div>
+
+              <q-option-group :options="haveJob_option" type="radio" v-model="haveJob" disable />
               <div class="col-12 text-top0 items-center">
                 <q-item-label>
-                  <q-input
-                    v-if="haveJob === true"
-                    v-model="haveJobReason"
-                    label="กรอกอื่นๆ"
-                    dense
-                    disable
-                    lazy-rules
-                    type="text"
-                    autogrow
-                    hide-bottom-space
-                    outlined
-                    class="bg-white"
-                    :rules="[
+                  <q-input v-if="haveJob === true" v-model="haveJobReason" label="กรอกอื่นๆ" dense disable lazy-rules
+                    type="text" autogrow hide-bottom-space outlined class="bg-white" :rules="[
                       (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                    ]"
-                  />
+                    ]" />
                 </q-item-label>
               </div>
-              <div class="col-12 text-top0 items-center">
+              <div class="col-10 text-top0 items-center">
                 8. ท่านจะแนะนำเพื่อนให้มาร่วมงานกับกรุงเทพมหานครหรือไม่ (ถ้าไม่
                 โปรดระบุเหตุผล)
               </div>
-              <q-option-group
-                :options="suggestFriends_option"
-                type="radio"
-                v-model="suggestFriends"
-                disable
-              />
+
+              <div class="col-2 text-top0 items-center">
+                <q-input dense outlined v-model="score[7].score" label="คะแนนข้อ 8" type="number" />
+              </div>
+
+              <q-option-group :options="suggestFriends_option" type="radio" v-model="suggestFriends" disable />
               <div class="col-12 text-top0 items-center">
                 <q-item-label>
-                  <q-input
-                    v-if="suggestFriends === false"
-                    v-model="suggestFriendsReason"
-                    label="กรอกข้อความ"
-                    dense
-                    lazy-rules
-                    disable
-                    type="text"
-                    autogrow
-                    hide-bottom-space
-                    outlined
-                    class="bg-white"
-                    :rules="[
+                  <q-input v-if="suggestFriends === false" v-model="suggestFriendsReason" label="กรอกข้อความ" dense
+                    lazy-rules disable type="text" autogrow hide-bottom-space outlined class="bg-white" :rules="[
                       (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                    ]"
-                  />
+                    ]" />
                 </q-item-label>
               </div>
-              <div class="col-12 text-top0 items-center">
+              <div class="col-10 text-top0 items-center">
                 9. หากท่านมีโอกาสในอนาคต
                 ท่านอยากกลับมาร่วมงานกับกรุงเทพมหานครหรือไม่ (ถ้าไม่
                 โปรดระบุเหตุผล)
               </div>
-              <q-option-group
-                :options="futureWork_option"
-                type="radio"
-                v-model="futureWork"
-                disable
-              />
+              <div class="col-2 text-top0 items-center">
+                <q-input dense outlined v-model="score[8].score" label="คะแนนข้อ 9" type="number" />
+              </div>
+
+              <q-option-group :options="futureWork_option" type="radio" v-model="futureWork" disable />
               <div class="col-12 text-top0 items-center">
                 <q-item-label>
-                  <q-input
-                    v-if="futureWork === false"
-                    v-model="futureWorkReason"
-                    label="กรอกข้อความ"
-                    dense
-                    lazy-rules
-                    type="text"
-                    autogrow
-                    hide-bottom-space
-                    outlined
-                    disable
-                    class="bg-white"
-                    :rules="[
+                  <q-input v-if="futureWork === false" v-model="futureWorkReason" label="กรอกข้อความ" dense lazy-rules
+                    type="text" autogrow hide-bottom-space outlined disable class="bg-white" :rules="[
                       (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                    ]"
-                  />
+                    ]" />
                 </q-item-label>
               </div>
 
-              <div class="col-12 text-top0 items-center">
+              <div class="col-10 text-top0 items-center">
                 10. ความคิดเห็นและข้อเสนอแนะอื่น ๆ
               </div>
-              <q-input
-                class="col-12"
-                dense
-                disable
-                outlined
-                v-model="suggestion"
-                label="  "
-                type="textarea"
-              />
+              <div class="col-2 text-top0 items-center">
+                <q-input dense outlined v-model="score[9].score" label="คะแนนข้อ 10" type="number" />
+              </div>
+              <q-input class="col-12" dense disable outlined v-model="suggestion" label="  " type="textarea" />
+
+            </div>
+          </q-card>
+
+          <q-card bordered flat class="q-mt-md">
+            <div class="q-pa-xs bg-grey-2 row items-center q-py-sm q-px-md justify-center text-bold">
+              ความคิดเห็น
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+
+              <div class="row col-12 q-pa-sm q-col-gutter-sm">
+                <div class="col-10">
+                  <q-input dense outlined v-model="comment" label="กรอกความคิดเห็น" type="textarea" />
+                </div>
+                <div class="col-2 text-top0">
+                  <q-input dense outlined v-model="scoreTotal" label="คะแนนรวม" />
+                </div>
+              </div>
+
+              <div class="col-12"><q-separator /></div>
+
+              <q-card-actions class="col-12 text-primary q-pa-md">
+                <q-space />
+                <q-btn unelevated label="บันทึก" color="public" @click="">
+                </q-btn>
+              </q-card-actions>
 
-              <q-separator />
             </div>
           </q-card>
         </div>
@@ -485,11 +435,13 @@ const getData = async () => {
   border-radius: 5px;
   height: 70px;
 }
+
 .text-top {
   color: gray;
   font-weight: 400;
   padding-bottom: 3px;
 }
+
 .text-detail {
   font-weight: 500;
 }
diff --git a/src/modules/06_retirement/interface/index/ExitInterviewQuestion.ts b/src/modules/06_retirement/interface/index/ExitInterviewQuestion.ts
new file mode 100644
index 000000000..ec72b0e61
--- /dev/null
+++ b/src/modules/06_retirement/interface/index/ExitInterviewQuestion.ts
@@ -0,0 +1,13 @@
+interface Questions {
+  no: number;
+  desc: string;
+  score: number;
+  answers?: Answers;
+}
+
+interface Answers {
+  no: number;
+  desc: string;
+}
+
+export type {Questions};
diff --git a/src/modules/06_retirement/router.ts b/src/modules/06_retirement/router.ts
index 04a960f43..f5063f9a2 100644
--- a/src/modules/06_retirement/router.ts
+++ b/src/modules/06_retirement/router.ts
@@ -26,15 +26,16 @@ const dischargedDetails = () =>
     "@/modules/06_retirement/components/Discharged/dischargedRegistry.vue"
   );
 const expulsionMain = () =>
-  import("@/modules/06_retirement/components/Expulsion/ExpulsionMain.vue");
+  import("@/modules/06_retirement/components/Expulsion/expulsionMain.vue");
 
 const expulsionDetails = () =>
-  import("@/modules/06_retirement/components/Expulsion/ExpulsionRegistry.vue");
-
+  import("@/modules/06_retirement/components/Expulsion/expulsionRegistry.vue");
 const exitInterviewMain = () =>
-  import("@/modules/06_retirement/components/ExitInterview/exitMain.vue");
+  import("@/modules/06_retirement/components/ExitInterview/ExitMain.vue");
 const exitInterviewDetails = () =>
-  import("@/modules/06_retirement/components/ExitInterview/exitRegistry.vue");
+  import("@/modules/06_retirement/components/ExitInterview/ExitRegistry.vue");
+const exitInterviewEditQuestion = () =>
+  import("@/modules/06_retirement/components/ExitInterview/EditQuestion.vue");
 const detaildeceasedByid = () =>
   import("@/modules/06_retirement/components/resign/DetailByidDeceased.vue");
 
@@ -65,7 +66,17 @@ export default [
     component: exitInterviewDetails,
     meta: {
       Auth: true,
-      Key: [7.3],
+      Key: [7.4],
+      Role: "retirement",
+    },
+  },
+  {
+    path: "/exit-Interview/edit-question",
+    name: "ExitInterviewEditQuestion",
+    component: exitInterviewEditQuestion,
+    meta: {
+      Auth: true,
+      Key: [7.5],
       Role: "retirement",
     },
   },
diff --git a/src/modules/06_retirement/storeExitInterviewQuestion.ts b/src/modules/06_retirement/storeExitInterviewQuestion.ts
new file mode 100644
index 000000000..a59dfa195
--- /dev/null
+++ b/src/modules/06_retirement/storeExitInterviewQuestion.ts
@@ -0,0 +1,17 @@
+import { defineStore } from "pinia";
+import { reactive } from "vue";
+import type { Questions } from "@/modules/06_retirement/interface/index/ExitInterviewQuestion";
+
+export const useExitInterviewQuestionDataStore = defineStore("exitInterviewQuestion", () => {
+  const question = reactive<Questions[]>([
+    {
+      no: 1,
+      desc: 'เหตุใดท่านจึงตัดสินใจร่วมงานกับกรุงเทพมหานคร (เลือกได้มากกว่า 1 ข้อ)',
+      score: 5,
+    }
+  ])
+
+  return {
+    question,
+  };
+});