แก้ไขเรื่องร้องเรียน, สืบสวน, สอบสวน

src/modules/11_discipline/components/1_Complaint/EditPage.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { onMounted, reactive, ref } from "vue";
 import Form from "@/modules/11_discipline/components/1_Complaint/Form.vue";
-import Popup from "@/modules/11_discipline/components/1_Complaint/Popup.vue";
+import PopupSendToNext from "@/modules/11_discipline/components/PopupSendToNext.vue";
 import { useRouter, useRoute } from "vue-router";
 import { useQuasar } from "quasar";
 import type { QTableProps } from "quasar";
@@ -15,7 +15,10 @@ import type {
 } from "@/modules/11_discipline/interface/request/complaint";
 import { useCounterMixin } from "@/stores/mixin";
 import { useComplainstDataStore } from "@/modules/11_discipline/store/ComplaintsStore";
+import { useDisciplineMainStore } from "@/modules/11_discipline/store";
+
 const complainstStore = useComplainstDataStore();
+const mainStore = useDisciplineMainStore();
 const $q = useQuasar();
 const mixin = useCounterMixin();
 const {
@@ -34,6 +37,7 @@ const modalPopup = ref<boolean>(false);
 
 /** ข้อมูล v-model ของฟอร์ม */
 const personOj = reactive<ArrayPerson>({
+  id: "",
   personId: "",
   idcard: "",
   name: "",
@@ -74,67 +78,6 @@ const data = reactive<FormData>({
   disciplineComplaintDocs: [fileListOj],
 });
 
-/** ดึงค่าจาก api */
-// const fetchData = async () => {
-//   data.respondentType = "PERSON";
-//   data.organizationId = "0";
-//   data.consideredAgency = "2";
-//   data.title = "ทุจริตในหน้าที่";
-//   data.description = "มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน";
-//   data.dateReceived = new Date("2023-11-05");
-//   data.dateConsideration = new Date("2023-11-07T14:58:00");
-//   data.offenseDetails = "NOT_SPECIFIED";
-//   data.levelConsideration = "NORMAL";
-//   data.dateNotification = new Date("2023-11-07T14:58:00");
-//   data.complaintFrom = "สตง";
-//   data.appellant = "สมศรี สุขใจ";
-//   data.documentFile = "";
-//   data.complaintStatus = "NEW";
-//   (data.persons = [
-//     {
-//       idcard: "1529900022223",
-//       name: "นางศิรินภา คงน้อย",
-//       positionNo: "สกก.1",
-//       position: "ธุรการ",
-//       positionLevel: "ต้น",
-//       salary: "10000",
-//       organization: "สกจ.",
-//     },
-//   ]),
-//     (data.fileList = [
-//       {
-//         id: "08dbeb08-1931-487d-8989-0725ce48031d",
-//         file: "https://s3cluster.frappet.com/bma-ehr-fpt/edb095bf-8898-4ef8-ad60-daaf60991b8f?AWSAccessKeyId=frappet&Expires=1700657567&Signature=7Do0YexqpTJGA4DQPKzJ5YtvyJg%3D",
-//         fileName: "ex_slip.jpeg.png14",
-//         fileType: "image/png",
-//       },
-//       {
-//         id: "08dbeb08-392b-41b8-8970-78934f317469",
-//         file: "https://s3cluster.frappet.com/bma-ehr-fpt/5a32c821-46d6-4bbc-9824-b777f154702e?AWSAccessKeyId=frappet&Expires=1700657567&Signature=HlNAjybBNPqGAYJtHIefNRofz1E%3D",
-//         fileName: "17058616.jpg",
-//         fileType: "image/jpeg",
-//       },
-//       {
-//         id: "08dbeb08-3e41-4500-8476-6bdd76f0b6c8",
-//         file: "https://s3cluster.frappet.com/bma-ehr-fpt/1bf5ef61-05f3-4cb1-98a5-dd2698b49440?AWSAccessKeyId=frappet&Expires=1700657567&Signature=WAlAjPbX%2BUoO0zY7m1jDEb3ovvA%3D",
-//         fileName: "17058616.jpg",
-//         fileType: "image/jpeg",
-//       },
-//       {
-//         id: "08dbeb08-428f-483b-8d50-718e947d012e",
-//         file: "https://s3cluster.frappet.com/bma-ehr-fpt/d848952a-54af-4502-b235-1f01f441d86c?AWSAccessKeyId=frappet&Expires=1700657568&Signature=3L9QfaWLCHmZjeS2UttVM3se6W0%3D",
-//         fileName: "HybGoQu8osQ49G7AzCOvYF4G.png",
-//         fileType: "image/png",
-//       },
-//       {
-//         id: "08dbeb08-8aa5-4264-87bf-1794be50f0c7",
-//         file: "https://s3cluster.frappet.com/bma-ehr-fpt/ac55b1f8-54f6-43c4-9f85-c236d24e7d76?AWSAccessKeyId=frappet&Expires=1700657568&Signature=isN3RM3P4%2BP5lgK5%2F45h1U5pabI%3D",
-//         fileName: "1300399ปปปป.jpg",
-//         fileType: "image/jpeg",
-//       },
-//     ]);
-// };
-
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -271,28 +214,33 @@ async function onSubmit(data: any) {
 
 /** ยืนยัน มีมูลส่งไปสืบสวน */
 function sentInvestigate() {
-  if (complainstStore.rowsAdd.length > 0) {
+  if (mainStore.rowsAdd.length > 0) {
     modalPopup.value = true;
   } else {
-    dialogConfirm($q,()=>sentConfirm(),'ยืนยันส่งไปสืบสวน','ต้องการยืนยันยืนยันส่งไปสืบสวนใช่หรือไม่?')
+    dialogConfirm(
+      $q,
+      () => sentConfirmNoPerson(),
+      "ยืนยันส่งไปสืบสวน",
+      "ต้องการยืนยันยืนยันส่งไปสืบสวนใช่หรือไม่?"
+    );
   }
 }
 
-function sentConfirm(){
+function sentConfirmNoPerson() {
   showLoader();
-    http
-      .put(config.API.complaintApprove(id.value), {
-        persons: [],
-      })
-      .then((res) => {
-        router.push(`/discipline/complaints`);
-      })
-      .catch((e) => {
-        messageError($q, e);
-      })
-      .finally(() => {
-        hideLoader();
-      });
+  http
+    .put(config.API.complaintApprove(id.value), {
+      persons: [],
+    })
+    .then((res) => {
+      router.push(`/discipline/complaints`);
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
 }
 
 function closePopup() {
@@ -355,8 +303,9 @@ function confirmCancelInvestigate() {
  * ดึงข้อมูล จาก component เเล้ว update
  * @param data person data
  */
-function emitPerson(data: ArrayPerson[]) {
-  const dataMapId = data.map((item: ArrayPerson) => item.personId);
+function sendPersonToNext(data: ArrayPerson[]) {
+  const dataMapId = data.map((item: ArrayPerson) => item.id);
+
   showLoader();
   http
     .put(config.API.complaintApprove(id.value), {
@@ -379,6 +328,7 @@ onMounted(() => {
   getData();
 });
 </script>
+
 <template>
   <div class="col-xs-12 col-sm-12 col-md-11">
     <div class="toptitle col-12 row items-end">
@@ -417,11 +367,11 @@ onMounted(() => {
     </div>
 
     <Form :on-submit="onSubmit" :data="data" :get-data="getData" />
-    <Popup
+    <PopupSendToNext
       :modal="modalPopup"
       :close="closePopup"
-      @return-person="emitPerson"
-      :rows="complainstStore.rowsAdd"
+      @return-person="sendPersonToNext"
+      :rows="mainStore.rowsAdd"
       :columns="columns"
       :visibleColumns="visibleColumns"
     />

src/modules/11_discipline/components/1_Complaint/Form.vue

@@ -1,33 +1,31 @@
 <script setup lang="ts">
 import { ref, onMounted, reactive, watch, watchEffect } from "vue";
-import { is, useQuasar } from "quasar";
-import { useRouter } from "vue-router";
-import type { QTableProps } from "quasar";
+import { useQuasar } from "quasar";
 /** import Type */
 import type { DataOption } from "@/modules/11_discipline/interface/index/Main";
 import type {
   FormData,
   MyObjectComplaintsRef,
-  DataAddRequest,
-  ArrayPerson,
   ArrayFileList,
 } from "@/modules/11_discipline/interface/request/complaint";
 
 /** importStroe*/
 import { useCounterMixin } from "@/stores/mixin";
 import { useComplainstDataStore } from "@/modules/11_discipline/store/ComplaintsStore";
+import { useDisciplineMainStore } from "@/modules/11_discipline/store";
 
 import DialogAddPersonal from "@/components/Dialogs/AddPersonal.vue";
 import config from "@/app.config";
 import http from "@/plugins/http";
 
 const $q = useQuasar();
-const router = useRouter();
 const fileDocDataUpload = ref<File[]>([]);
 
 /** เรียกใช้ store */
 const mixin = useCounterMixin();
 const complainstStore = useComplainstDataStore();
+const mainStore = useDisciplineMainStore();
+
 const {
   date2Thai,
   dialogConfirm,
@@ -37,11 +35,10 @@ const {
   hideLoader,
   showLoader,
 } = mixin;
-const { selectComplainantTpye, filterSelector } = complainstStore; // function จาก store complainstStore
+const { filterSelector } = complainstStore; // function จาก store complainstStore
 
 /** validateForm */
 const respondentTypeRef = ref<Object | null>(null);
-const complainantRef = ref<Object | null>(null);
 const organizationIdRef = ref<Object | null>(null);
 const consideredAgencyRef = ref<Object | null>(null);
 const titleRef = ref<Object | null>(null);
@@ -56,6 +53,7 @@ const appellantRef = ref<Object | null>(null);
 const resultRef = ref<Object | null>(null);
 
 const isSave = ref<boolean>(false); // มีการแก้ไขรอบันทึก
+const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
 
 const fileList = ref<ArrayFileList[]>([]);
 /** รับ props มาจากหน้าหลัก */
@@ -112,132 +110,21 @@ const objectComplaintsRef: MyObjectComplaintsRef = {
   result: resultRef,
 };
 
-/** options ทั้งหมด*/
-const offenseDetailstoptions = ref<DataOption[]>([
-  { id: "NOT_SPECIFIED", name: "ยังไม่ระบุ" },
-  { id: "NOT_DEADLY", name: "ไม่ร้ายแรง" },
-  { id: "DEADLY", name: "ร้ายแรง" },
-]);
-const levelConsiderationtoptions = ref<DataOption[]>([
-  { id: "NORMAL", name: "ปกติ" },
-  { id: "URGENT", name: "ด่วน" },
-  { id: "VERY_URGENT", name: "ด่วนมาก" },
-]);
-const complaintFromtoptions = ref<DataOption[]>([]);
+// /**
+//  * รับค่าผู้ถูกร้องเรียน
+//  * @param val บุคคล หน่วยงาน กทม
+//  */
+// async function selectComplainant(val: string) {
+//   formData.organizationId = "";
+//   formData.consideredAgency = "";
 
-/** หัวตาราง */
-const columns = ref<QTableProps["columns"]>([
-  {
-    name: "info",
-    align: "left",
-    label: "",
-    sortable: false,
-    field: "info",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "no",
-    align: "left",
-    label: "ลำดับ",
-    sortable: false,
-    field: "no",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "idcard",
-    align: "left",
-    label: "เลขบัตรประชาชน",
-    sortable: true,
-    field: "idcard",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "name",
-    align: "left",
-    label: "ชื่อ - นามสกุล",
-    sortable: true,
-    field: "name",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "posNo",
-    align: "left",
-    label: "ตำแหน่งเลขที่",
-    sortable: true,
-    field: "posNo",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "position",
-    align: "left",
-    label: "ตำแหน่ง",
-    sortable: true,
-    field: "position",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "positionLevel",
-    align: "left",
-    label: "ระดับ",
-    sortable: true,
-    field: "positionLevel",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "salary",
-    align: "left",
-    label: "เงินเดือน",
-    sortable: true,
-    field: "salary",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "organization",
-    align: "left",
-    label: "หน่วยงาน",
-    sortable: true,
-    field: "organization",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-]);
+//   if (val === "1") {
+//     await fetchOffice(); // ถ้าเลือกหน่วยงานจะเรียก function fetchOffice  เรียกโครงสร้างสำนักงาน
+//   }
+// }
 
-/** หัวข้อที่เเสดงในตาราง */
-const visibleColumns = ref<string[]>([
-  "info",
-  "no",
-  "idcard",
-  "name",
-  "posNo",
-  "position",
-  "positionLevel",
-  "salary",
-  "organization",
-]);
-
-/**
- * รับค่าผู้ถูกร้องเรียน
- * @param val บุคคล หน่วยงาน กทม
- */
-async function selectComplainant(val: string) {
-  formData.organizationId = "";
-  formData.consideredAgency = "";
-
-  if (val === "1") {
-    await fetchOffice(); // ถ้าเลือกหน่วยงานจะเรียก function fetchOffice  เรียกโครงสร้างสำนักงาน
-  }
-}
-
-/** เรียกโครงสร้างสำนักงาน */
-async function fetchOffice() {}
+// /** เรียกโครงสร้างสำนักงาน */
+// async function fetchOffice() {}
 
 /**
  * ฟังชั่นอัปโหลดไฟล์
@@ -296,8 +183,8 @@ function onSubmit() {
   dialogConfirm(
     $q,
     async () => {
-      if (complainstStore.rowsAdd) {
-        formData.persons = complainstStore.rowsAdd;
+      if (mainStore.rowsAdd) {
+        formData.persons = mainStore.rowsAdd;
         props.onSubmit(formData);
       } else props.onSubmit(formData);
       // props.onSubmit(formData);
@@ -353,25 +240,30 @@ function confirmDelete(id: string) {
  * เก็บข้อมูลลง formData
  */
 watch(props.data, async () => {
-  fileList.value = props.data.disciplineComplaintDocs;
-  complainstStore.fetchComplainstAdd(props.data.persons);
+  if (props.data !== null) {
+    isReadonly.value = props.data.status != "NEW" ?? true;
+    isSave.value = false;
 
-  formData.id = props.data.id;
-  formData.respondentType = props.data.respondentType;
-  formData.organizationId = props.data.organizationId;
-  formData.consideredAgency = props.data.consideredAgency;
-  formData.title = props.data.title;
-  formData.description = props.data.description;
-  formData.dateReceived = props.data.dateReceived;
-  formData.dateConsideration = props.data.dateConsideration;
-  formData.offenseDetails = props.data.offenseDetails;
-  formData.levelConsideration = props.data.levelConsideration;
-  formData.dateNotification = props.data.dateNotification;
-  formData.complaintFrom = props.data.complaintFrom;
-  formData.appellant = props.data.appellant;
-  formData.status = props.data.status;
-  formData.result = props.data.result;
-  formData.persons = complainstStore.rowsAdd;
+    fileList.value = props.data.disciplineComplaintDocs;
+    mainStore.fetchData(props.data.persons);
+
+    formData.id = props.data.id;
+    formData.respondentType = props.data.respondentType;
+    formData.organizationId = props.data.organizationId;
+    formData.consideredAgency = props.data.consideredAgency;
+    formData.title = props.data.title;
+    formData.description = props.data.description;
+    formData.dateReceived = props.data.dateReceived;
+    formData.dateConsideration = props.data.dateConsideration;
+    formData.offenseDetails = props.data.offenseDetails;
+    formData.levelConsideration = props.data.levelConsideration;
+    formData.dateNotification = props.data.dateNotification;
+    formData.complaintFrom = props.data.complaintFrom;
+    formData.appellant = props.data.appellant;
+    formData.status = props.data.status;
+    formData.result = props.data.result;
+    formData.persons = mainStore.rowsAdd;
+  }
 });
 
 /**
@@ -383,6 +275,9 @@ function handleSave(returnData: any) {
   toggleModal();
 }
 
+/**
+ * ฟังก์ชั่นสำหรับอัพโหลดไฟล์เอกสารหลักฐาน
+ */
 function upLoadFileDoc() {
   const Data = new FormData();
   Data.append("file", formData.documentFile);
@@ -390,7 +285,7 @@ function upLoadFileDoc() {
   http
     .put(config.API.complaintFileUpload(formData.id), Data)
     .then((res) => {
-      success($q, "บันทึกข้อมูลสำเร็จ");
+      success($q, "อัพโหลดไฟล์สำเร็จ");
       props.getData();
     })
     .catch((e) => {
@@ -402,12 +297,17 @@ function upLoadFileDoc() {
     });
 }
 
+/**
+ * ฟังก์ชั่นเพิ่มรายชื่อผู้ถูกสอบสวนจาก popup มายังรายการผู้ถูกสอบสวนหน้าหลัก
+ * @param data ข้อมูลรายชื่อผู้ถูกสอบสวนเป็น array
+ */
 async function addPerson(data: any) {
   toggleModal();
   changeFormData();
-  await complainstStore.fetchComplainstAdd(data);
+  await mainStore.fetchData(data);
 }
 
+/** ดึงข้อมูลหน่วยงานจาก api */
 function getOc() {
   http.get(config.API.typeOc()).then((res) => {
     const data = res.data.result;
@@ -415,39 +315,43 @@ function getOc() {
   });
 }
 
+/**
+ * ฟังก์ชั่นลบผู้ถูกร้องเรียนออกจากรายการ
+ * @param id id ของผู้ถูกร้อง
+ */
 function deletePerson(id: string) {
-  dialogRemove($q, () => removePerson(id));
-}
-
-function removePerson(id: string) {
-  changeFormData();
-  const dataRow = complainstStore.rowsAdd;
-  const updatedRows = dataRow.filter((item: any) => item.personId !== id);
-  complainstStore.rowsAdd = updatedRows;
-}
-
-function getListChannel() {
-  http.get(config.API.complaintListOp()).then((res) => {
-    complaintFromtoptions.value = res.data.result.data;
+  dialogRemove($q, () => {
+    changeFormData();
+    const dataRow = mainStore.rowsAdd;
+    const updatedRows = dataRow.filter((item: any) => item.personId !== id);
+    mainStore.rowsAdd = updatedRows;
   });
 }
 
+/** ช่องทางการร้องเรียน และฟังก์ชั่นการดึงข้อมูลช่องทางการร้องเรียนมาจาก api*/
+const channelOptions = ref<DataOption[]>([]);
+function getListChannel() {
+  http.get(config.API.complaintListOp()).then((res) => {
+    channelOptions.value = res.data.result.data;
+  });
+}
+
+/** ฟังก์ชั่นเช็คการแก้ไขฟอร์มแล้วไม่ได้กดบันทึก */
 function changeFormData() {
   isSave.value = props.data != null ?? true;
 }
 
 onMounted(() => {
+  mainStore.rowsAdd = []
   getListChannel();
   getOc();
-  complainstStore.columns = columns.value;
-  complainstStore.visibleColumns = visibleColumns.value;
 });
 </script>
 
 <template>
   <div class="row col-12 bg-white">
     <div class="col-sm-12 col-md-9">
-      <div v-if="isSave === true" class="q-pa-sm q-gutter-sm">
+      <div v-if="isSave" class="q-pa-sm q-gutter-sm">
         <q-banner
           inline-actions
           bordered
@@ -470,9 +374,7 @@ onMounted(() => {
                     ref="respondentTypeRef"
                     dense
                     outlined
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     label="ผู้ถูกร้องเรียน"
                     option-value="id"
                     option-label="name"
@@ -509,9 +411,7 @@ onMounted(() => {
                     ref="organizationIdRef"
                     dense
                     hide-bottom-space
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     outlined
                     option-label="name"
                     option-value="id"
@@ -537,9 +437,7 @@ onMounted(() => {
                     label="หน่วยงานที่พิจารณา"
                     option-value="id"
                     option-label="name"
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     hide-bottom-space
                     emit-value
                     map-options
@@ -574,9 +472,7 @@ onMounted(() => {
                     >
                       ผู้ถูกร้องเรียน
                       <q-btn
-                        v-if="
-                          formData.status === 'NEW' || formData.status === ''
-                        "
+                        v-if="!isReadonly"
                         size="12px"
                         flat
                         round
@@ -593,15 +489,17 @@ onMounted(() => {
                     <div class="col-xs-12 q-pa-sm">
                       <d-table
                         ref="table"
-                        :columns="complainstStore.columns"
-                        :rows="complainstStore.rowsAdd"
+                        :columns="mainStore.columnsRespondent"
+                        :rows="mainStore.rowsAdd"
                         row-key="idcard"
                         flat
                         bordered
                         :paging="true"
                         dense
                         class="custom-header-table"
-                        :visible-columns="complainstStore.visibleColumns"
+                        :visible-columns="
+                          mainStore.visibleColumnsRespondent
+                        "
                       >
                         <template v-slot:header="props">
                           <q-tr :props="props">
@@ -651,10 +549,7 @@ onMounted(() => {
                             </q-td>
                             <q-td auto-width>
                               <q-btn
-                                v-if="
-                                  formData.status === 'NEW' ||
-                                  formData.status === ''
-                                "
+                                v-if="!isReadonly"
                                 size="12px"
                                 flat
                                 round
@@ -678,9 +573,7 @@ onMounted(() => {
                     ref="titleRef"
                     dense
                     outlined
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     hide-bottom-space
                     v-model="formData.title"
                     :rules="[(val) => !!val || 'กรุณาการข้อมูล']"
@@ -698,9 +591,7 @@ onMounted(() => {
                     ref="descriptionRef"
                     dense
                     outlined
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     hide-bottom-space
                     v-model="formData.description"
                     :rules="[(val) => !!val || 'กรุณาการข้อมูล']"
@@ -719,9 +610,7 @@ onMounted(() => {
                     :locale="'th'"
                     autoApply
                     borderless
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     :enableTimePicker="false"
                     week-start="0"
                     @update:model-value="changeFormData()"
@@ -738,9 +627,7 @@ onMounted(() => {
                         ref="dateReceivedRef"
                         outlined
                         dense
-                        :readonly="
-                          formData.status !== 'NEW' && formData.status !== ''
-                        "
+                        :readonly="isReadonly"
                         hide-bottom-space
                         class="full-width datepicker"
                         :model-value="
@@ -773,11 +660,9 @@ onMounted(() => {
                     ref="levelConsiderationRef"
                     dense
                     outlined
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     v-model="formData.levelConsideration"
-                    :options="levelConsiderationtoptions"
+                    :options="complainstStore.levelConsiderationtOptions"
                     label="ระดับการพิจารณา"
                     option-value="id"
                     option-label="name"
@@ -801,9 +686,7 @@ onMounted(() => {
                     v-model="formData.dateConsideration"
                     @update:model-value="changeFormData()"
                     :locale="'th'"
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     autoApply
                     borderless
                     :enableTimePicker="false"
@@ -827,9 +710,7 @@ onMounted(() => {
                             ? date2Thai(formData.dateConsideration)
                             : null
                         "
-                        :readonly="
-                          formData.status !== 'NEW' && formData.status !== ''
-                        "
+                        :readonly="isReadonly"
                         label="วันที่กำหนดวันพิจารณา"
                         hide-bottom-space
                         :rules="[
@@ -857,11 +738,9 @@ onMounted(() => {
                     ref="offenseDetailsRef"
                     dense
                     outlined
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     v-model="formData.offenseDetails"
-                    :options="offenseDetailstoptions"
+                    :options="mainStore.offenseDetailstOptions"
                     label="ลักษณะความผิด"
                     option-value="id"
                     option-label="name"
@@ -880,9 +759,7 @@ onMounted(() => {
                     v-model="formData.dateNotification"
                     :locale="'th'"
                     autoApply
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     borderless
                     :enableTimePicker="false"
                     week-start="0"
@@ -900,9 +777,7 @@ onMounted(() => {
                         ref="dateNotificationRef"
                         outlined
                         dense
-                        :readonly="
-                          formData.status !== 'NEW' && formData.status !== ''
-                        "
+                        :readonly="isReadonly"
                         hide-bottom-space
                         class="full-width datepicker"
                         :model-value="
@@ -935,12 +810,10 @@ onMounted(() => {
                     for="selectReceivecomplaints"
                     ref="complaintFromRef"
                     dense
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     outlined
                     v-model="formData.complaintFrom"
-                    :options="complaintFromtoptions"
+                    :options="channelOptions"
                     label="รับเรื่องร้องเรียน"
                     option-value="id"
                     option-label="name"
@@ -962,9 +835,7 @@ onMounted(() => {
                     dense
                     outlined
                     v-model="formData.appellant"
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     label="ผู้ร้องเรียน"
                     :rules="[(val) => !!val || `${'กรุณากรอกข้อมูล'}`]"
                     lazy-rules
@@ -976,9 +847,7 @@ onMounted(() => {
                 </div>
                 <div class="col-xs-12 col-sm-12">
                   <q-input
-                    :readonly="
-                      formData.status !== 'NEW' && formData.status !== ''
-                    "
+                    :readonly="isReadonly"
                     for="result"
                     ref="resultRef"
                     dense
@@ -1001,10 +870,7 @@ onMounted(() => {
         </div>
 
         <q-separator />
-        <div
-          class="row col-12 q-pa-sm"
-          v-if="formData.status === 'NEW' || formData.status === ''"
-        >
+        <div class="row col-12 q-pa-sm" v-if="!isReadonly">
           <q-space />
           <q-btn
             for="ButtonOnSubmit"
@@ -1029,22 +895,20 @@ onMounted(() => {
             >
               <div class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md">
                 {{
-                  formData.status === "NEW"
-                    ? "อัปโหลดไฟล์เอกสารหลักฐาน"
-                    : "ไฟล์เอกสารหลักฐาน"
+                  !isReadonly ? "อัปโหลดไฟล์เอกสารหลักฐาน" : "ไฟล์เอกสารหลักฐาน"
                 }}
               </div>
               <div class="col-12"><q-separator /></div>
 
-              <div v-if="formData.status === 'NEW'" class="col-12 q-pa-sm row">
+              <div
+                v-if="!isReadonly && formData.id !== ''"
+                class="col-12 q-pa-sm row"
+              >
                 <q-file
                   for="inputFiles"
                   class="col-11"
                   outlined
                   dense
-                  :readonly="
-                    formData.status !== 'NEW' && formData.status !== ''
-                  "
                   v-model="formData.documentFile"
                   @added="fileUploadDoc"
                   label="ไฟล์เอกสารหลักฐาน"
@@ -1094,7 +958,7 @@ onMounted(() => {
                       ><q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn
                     >
                     <q-btn
-                      v-if="formData.status === 'NEW'"
+                      v-if="!isReadonly"
                       size="12px"
                       flat
                       round
@@ -1109,7 +973,7 @@ onMounted(() => {
                 </q-list>
               </div>
 
-              <div class="col-12 q-pa-sm" v-if="fileList.length == 0">
+              <div class="col-12 q-pa-sm" v-else>
                 <q-card class="q-pa-md" bordered> ไม่มีรายการเอกสาร </q-card>
               </div>
             </q-card>
@@ -1119,11 +983,12 @@ onMounted(() => {
     </div>
   </div>
 
+  <!-- Popup ผู้ถูกร้องเรียน -->
   <DialogAddPersonal
     title="ผู้ถูกร้องเรียน"
-    :checkId="complainstStore.rowsAdd"
+    :checkId="mainStore.rowsAdd"
     :modal="modal"
-    btn-title="เพิ่มรายชื่อผู้ถูกสอบสวน"
+    btn-title="เพิ่มรายชื่อผู้ถูกร้องเรียน"
     :close="toggleModal"
     :save="addPerson"
     @returnData="handleSave"

src/modules/11_discipline/components/1_Complaint/MainPage.vue

@@ -59,7 +59,6 @@ async function getList() {
 
 /** ไปยังหน้าเพิ่มข้อมูล */
 function redirectToPageadd() {
-  complainstStore.fetchComplainstAdd([]);
   router.push(`/discipline/complaints/add`);
 }
 

src/modules/11_discipline/components/2_InvestigateFacts/EditPage.vue

@@ -2,11 +2,12 @@
 import { onMounted, reactive, ref, watch } from "vue";
 import FormComplaints from "@/modules/11_discipline/components/1_Complaint/Form.vue"; //เรื่องร้องเรียน
 import FormInvestigatefacts from "@/modules/11_discipline/components/2_InvestigateFacts/Form.vue"; //สืบสวนข้อเท็จจริง
-import { useRouter, useRoute } from "vue-router";
+import { useRoute } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
 import { useInvestigateFactStore } from "@/modules/11_discipline/store/InvestigateFactStore";
+import { useDisciplineMainStore } from "@/modules/11_discipline/store";
 import { useQuasar } from "quasar";
-import Popup from "@/modules/11_discipline/components/1_Complaint/Popup.vue";
+import PopupSendToNext from "@/modules/11_discipline/components/PopupSendToNext.vue";
 import type { FormData } from "@/modules/11_discipline/interface/request/investigateFact";
 import type {
   FormData as FormDataComplaint,
@@ -18,13 +19,12 @@ import type { QTableProps } from "quasar";
 import config from "@/app.config";
 import http from "@/plugins/http";
 
-const investigateFactStore = useInvestigateFactStore();
+const mainStore = useDisciplineMainStore();
 
 const $q = useQuasar();
 const mixin = useCounterMixin();
 const store = useInvestigateFactStore();
 const { dialogConfirm, showLoader, success, hideLoader, messageError } = mixin;
-const router = useRouter();
 const route = useRoute();
 const id = ref<string>(route.params.id as string);
 
@@ -40,10 +40,10 @@ const data = reactive<FormData>({
   investigationDetailOther: "",
   evidenceFiles: null,
   fileComplaint: null,
-  clickTime: false,
+  investigationExtendStatus: false,
   investigationDateStart: null,
   investigationDateEnd: null,
-  daysExtend: null,
+  investigationDaysExtend: null,
   investigationStatusResult: "",
   investigationCauseText: "",
   complaintStatus: "",
@@ -60,6 +60,7 @@ const data = reactive<FormData>({
 
 /** ข้อมูล v-model ของฟอร์มเรื่องร้องเรียน */
 const personObjComplaint = reactive<ArrayPerson>({
+  id: "",
   personId: "",
   idcard: "",
   name: "",
@@ -132,104 +133,6 @@ async function getDataComplaint() {
     });
 }
 
-/** หัวตาราง */
-const columns = ref<QTableProps["columns"]>([
-  {
-    name: "info",
-    align: "left",
-    label: "",
-    sortable: false,
-    field: "info",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "no",
-    align: "left",
-    label: "ลำดับ",
-    sortable: false,
-    field: "no",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "idcard",
-    align: "left",
-    label: "เลขบัตรประชาชน",
-    sortable: true,
-    field: "idcard",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "name",
-    align: "left",
-    label: "ชื่อ - นามสกุล",
-    sortable: true,
-    field: "name",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "posNo",
-    align: "left",
-    label: "ตำแหน่งเลขที่",
-    sortable: true,
-    field: "posNo",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "position",
-    align: "left",
-    label: "ตำแหน่ง",
-    sortable: true,
-    field: "position",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "positionLevel",
-    align: "left",
-    label: "ระดับ",
-    sortable: true,
-    field: "positionLevel",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "salary",
-    align: "left",
-    label: "เงินเดือน",
-    sortable: true,
-    field: "salary",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "organization",
-    align: "left",
-    label: "หน่วยงาน",
-    sortable: true,
-    field: "organization",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-]);
-
-/** หัวข้อที่เเสดงในตาราง */
-const visibleColumns = ref<string[]>([
-  "info",
-  "no",
-  "idcard",
-  "name",
-  "posNo",
-  "position",
-  "positionLevel",
-  "salary",
-  "organization",
-]);
-
 function getData() {
   showLoader();
   http
@@ -250,8 +153,11 @@ function getData() {
       data.result = dataList.result;
       data.directors = dataList.director;
       data.disciplineInvestigateDocs = dataList.disciplineInvestigateDocs;
-      data.disciplineInvestigateRelevantDocs = dataList.disciplineInvestigateRelevantDocs;
+      data.disciplineInvestigateRelevantDocs =
+        dataList.disciplineInvestigateRelevantDocs;
       data.investigationStatusResult = dataList.investigationStatusResult;
+      data.investigationExtendStatus = dataList.investigationExtendStatus;
+      data.investigationDaysExtend = dataList.investigationDaysExtend;
     })
     .catch((e) => {
       messageError($q, e);
@@ -378,7 +284,6 @@ function emitPerson(data: FormData[]) {
     });
 }
 
-
 /** โหลดข้อมูลเมื่อเข้าหน้านี้ */
 onMounted(() => {
   getData();
@@ -461,13 +366,13 @@ watch(
       </q-tab-panels>
     </q-card>
 
-    <Popup
+    <PopupSendToNext
       :modal="modalPopup"
       :close="closePopup"
       title="ส่งไปสอบสวน"
-      :rows="investigateFactStore.rowsAdd"
-      :columns="columns"
-      :visibleColumns="visibleColumns"
+      :rows="mainStore.rowsAdd"
+      :columns="mainStore.columnsDirector"
+      :visibleColumns="mainStore.visibleColumnsDirector"
       @return-person="emitPerson"
     />
   </div>

src/modules/11_discipline/components/3_InvestigateDisciplinary/EditPage.vue

@@ -5,20 +5,18 @@ import { useRouter, useRoute } from "vue-router";
 import type { QTableProps } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
-import Popup from "@/modules/11_discipline/components/1_Complaint/Popup.vue";
+import DialogDirector from "@/modules/11_discipline/components/DialogDirector.vue";
 /**import component*/
 import FormComplaints from "@/modules/11_discipline/components/1_Complaint/Form.vue"; //เรื่องร้องเรียน
 import FormInvestigatefacts from "@/modules/11_discipline/components/2_InvestigateFacts/Form.vue"; //สืบสวนข้อเท็จจริง
 import FormDisciplinary from "@/modules/11_discipline/components/3_InvestigateDisciplinary/Form.vue"; // สอบสวนความผิดทางวินัย
-import type {
-  FormData,
-  PersonsArray,
-} from "@/modules/11_discipline/interface/request/disciplinary";
+import type { PersonsArray } from "@/modules/11_discipline/interface/request/disciplinary";
 import type {
   FormData as FormDataComplaint,
   ArrayPerson,
   ArrayFileList,
 } from "@/modules/11_discipline/interface/request/complaint";
+import PopupSendToNext from "@/modules/11_discipline/components/PopupSendToNext.vue";
 
 import type { FormData as FormInvestigateFact } from "@/modules/11_discipline/interface/request/investigateFact";
 
@@ -38,6 +36,8 @@ const id = ref<string>(route.params.id as string);
 const data = ref<object>();
 const status = ref<string>("");
 
+const idInvestigate = ref<string>("");
+const idComplaint = ref<string>("");
 /** function fetchData สอบสวนความผิดทางวินัย*/
 async function fetchDetailDisciplinary() {
   showLoader();
@@ -46,6 +46,8 @@ async function fetchDetailDisciplinary() {
     .then((res) => {
       data.value = res.data.result;
       status.value = res.data.result.status;
+      idComplaint.value = res.data.result.idComplaint;
+      idInvestigate.value = res.data.result.idInvestigate;
     })
     .catch((err) => {
       messageError($q, err);
@@ -59,7 +61,7 @@ async function fetchDetailDisciplinary() {
 async function fetchDetailInvestigate() {
   showLoader();
   await http
-    .get(config.API.disciplineInvestigateById(id.value))
+    .get(config.API.investigateById(idInvestigate.value))
     .then((res) => {
       const dataList = res.data.result;
       dataInvestigatefacts.id = dataList.id;
@@ -85,6 +87,9 @@ async function fetchDetailInvestigate() {
         dataList.disciplineInvestigateRelevantDocs;
       dataInvestigatefacts.investigationStatusResult =
         dataList.investigationStatusResult;
+      dataInvestigatefacts.investigationExtendStatus = dataList.investigationExtendStatus;
+      dataInvestigatefacts.investigationDaysExtend =
+        dataList.investigationDaysExtend;
     })
     .catch((err) => {
       messageError($q, err);
@@ -98,7 +103,7 @@ async function fetchDetailInvestigate() {
 async function fetchDetailComplaints() {
   showLoader();
   await http
-    .get(config.API.disciplineComplaintsById(id.value))
+    .get(config.API.complaintbyId(idComplaint.value))
     .then((res) => {
       const dataList = res.data.result;
       dataComplaints.id = dataList.id;
@@ -169,11 +174,16 @@ function sentIssue() {
 }
 
 function sentIssueGate() {
-  dialogConfirm($q, () => confirmSentIssueGate(),'ยืนยันส่งไปสรุปผลการพิจารณา','ต้องการยืนยันส่งไปสรุปผลการพิจารณาใช่หรือไม่?');
+  dialogConfirm(
+    $q,
+    () => confirmSentIssueGate(),
+    "ยืนยันส่งไปสรุปผลการพิจารณา",
+    "ต้องการยืนยันส่งไปสรุปผลการพิจารณาใช่หรือไม่?"
+  );
 }
 
 function confirmSentIssueGate() {
-  showLoader()
+  showLoader();
   http
     .get(config.API.disciplinaryApprove(id.value))
     .then((res) => {})
@@ -271,6 +281,7 @@ watch(
 
 /** ข้อมูล v-model ของฟอร์มเรื่องร้องเรียน */
 const personObjComplaint = reactive<ArrayPerson>({
+  id: "",
   personId: "",
   idcard: "",
   name: "",
@@ -442,10 +453,10 @@ const dataInvestigatefacts = reactive<FormInvestigateFact>({
   investigationDetailOther: "",
   evidenceFiles: null,
   fileComplaint: null,
-  clickTime: false,
+  investigationExtendStatus: false,
   investigationDateStart: null,
   investigationDateEnd: null,
-  daysExtend: null,
+  investigationDaysExtend: null,
   investigationStatusResult: "",
   investigationCauseText: "",
   complaintStatus: "",
@@ -541,7 +552,7 @@ const dataInvestigatefacts = reactive<FormInvestigateFact>({
     </q-card>
   </div>
 
-  <Popup
+  <PopupSendToNext
     :modal="modalPopup"
     :close="closePopup"
     title="ส่งไปพักราชการ"

src/modules/11_discipline/components/3_InvestigateDisciplinary/Form.vue

@@ -23,7 +23,7 @@ import type { DataOptionRes } from "@/modules/11_discipline/interface/response/M
 
 /** import components*/
 import DialogAddPersonal from "@/components/Dialogs/AddPersonal.vue";
-import Dialogbody from "@/modules/11_discipline/components/3_InvestigateDisciplinary/Dialogbody.vue";
+import DialogDirector from "@/modules/11_discipline/components/DialogDirector.vue";
 import Table from "@/modules/11_discipline/components/3_InvestigateDisciplinary/DirectorTable.vue";
 import UploadFile from "@/modules/11_discipline/components/UploadFile.vue";
 
@@ -31,9 +31,12 @@ import UploadFile from "@/modules/11_discipline/components/UploadFile.vue";
 import { useCounterMixin } from "@/stores/mixin";
 import { useComplainstDataStore } from "@/modules/11_discipline/store/ComplaintsStore";
 import { useInvestigateDisStore } from "@/modules/11_discipline/store/InvestigateDisStore";
+import { useDisciplineMainStore } from "@/modules/11_discipline/store";
+import { co } from "@fullcalendar/core/internal-common";
 
 const complainstStore = useComplainstDataStore();
 const investigateDis = useInvestigateDisStore();
+const mainStore = useDisciplineMainStore();
 const { filterSelector } = complainstStore; // function จาก store complainstStore
 const mixin = useCounterMixin();
 const { date2Thai, showLoader, hideLoader, dialogConfirm, messageError } =
@@ -52,95 +55,13 @@ const modalPerson = ref<boolean>(false);
 /**  search data table*/
 const filter = ref<string>("");
 
+const isSave = ref<boolean>(false); // มีการแก้ไขรอบันทึก
+const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
+
 function toggleModal() {
   modalPerson.value = !modalPerson.value;
 }
 
-/** หัวตารางของรายการผู้ถูกสอบสวน กรณีบุคคล */
-const columnsPerson = ref<QTableProps["columns"]>([
-  {
-    name: "info",
-    align: "center",
-    label: "",
-    sortable: false,
-    field: "info",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "no",
-    align: "left",
-    label: "ลำดับ",
-    sortable: false,
-    field: "no",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "idcard",
-    align: "left",
-    label: "เลขบัตรประชาชน",
-    sortable: true,
-    field: "idcard",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "name",
-    align: "left",
-    label: "ชื่อ - นามสกุล",
-    sortable: true,
-    field: "name",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "posNo",
-    align: "left",
-    label: "ตำแหน่งเลขที่",
-    sortable: true,
-    field: "posNo",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "position",
-    align: "left",
-    label: "ตำแหน่ง",
-    sortable: true,
-    field: "position",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "positionLevel",
-    align: "left",
-    label: "ระดับ",
-    sortable: true,
-    field: "positionLevel",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "salary",
-    align: "left",
-    label: "เงินเดือน",
-    sortable: true,
-    field: "salary",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "organization",
-    align: "left",
-    label: "หน่วยงาน",
-    sortable: true,
-    field: "organization",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-]);
-
 /** formData*/
 const formData = reactive<FormData>({
   respondentType: "",
@@ -158,7 +79,7 @@ const formData = reactive<FormData>({
   result: "", // ผลการสอบสวน
   directors: [],
   persons: [],
-  clickTime: false,
+  extendStatus: false,
   disciplinaryDateStart: null, // วันที่เริ่มการสอบสวน
   disciplinaryDateEnd: null, // วันที่สิ้นสุดการสอบสวน
   daysExtend: 0,
@@ -167,21 +88,6 @@ const formData = reactive<FormData>({
   disciplinaryStatusResult: "",
   disciplinaryCauseText: "",
   disciplinaryResult: "",
-
-  // detailComplaint: "",
-  // whereInvestigate: "",
-  // trueDetail: "",
-  // evidence: "",
-  // recordAccuser: "",
-  // witnesses: "",
-  // InvestResults: "",
-  // complaintStatus: "",
-  // filesEvidence: null,
-  // filesRecordAccuser: null,
-  // filesWitnesses: null,
-  // filesEtc: null,
-  // organizationId: "",
-  // consideredAgency: "",
 });
 const disciplineDisciplinary_DocRelevants = ref<FileLists[]>([]); // ยังไม่มีรอ api
 const disciplineDisciplinary_DocSummaryEvidences = ref<FileLists[]>([]);
@@ -280,8 +186,7 @@ function validateForm() {
   }
   if (hasError.every((result) => result === true)) {
     onSubmit();
-  } else {
-    console.log("ไม่ผ่าน ");
+    isSave.value = false;
   }
 }
 
@@ -306,8 +211,6 @@ function onSubmit() {
   dialogConfirm(
     $q,
     async () => {
-      const dataList = formData.directors.map((item: any) => item.id);
-      formData.directors = dataList;
       emit("submit:disciplinary", formData);
     },
     "ยืนยันการบันทึกข้อมูล",
@@ -315,14 +218,23 @@ function onSubmit() {
   );
 }
 
-/** ฟังชั่น delect */
-async function deleteData(id: string) {
-  console.log("delete");
+/** ฟังชั่นลบข้อมูลกรรมการ */
+async function deleteDirector(id: string) {
+  changeFormData();
+  const dataRow = rows.value;
+  const updatedRows = dataRow.filter((item: any) => item.id !== id);
+  rows.value = updatedRows;
+
+  const dataList = updatedRows.map((item: any) => item.id);
+  formData.directors = dataList;
 }
 
 /** เรียกข้อมูลรายละเอียด*/
 async function fetchDatadetail() {
   if (props.data) {
+    isReadonly.value = props.data.status != "NEW" ?? true;
+    isSave.value = false;
+
     formData.respondentType = props.data.respondentType;
     formData.organizationId = props.data.organizationId;
     formData.consideredAgency = props.data.consideredAgency;
@@ -337,7 +249,6 @@ async function fetchDatadetail() {
     formData.disciplinaryRecordAccuser = props.data.disciplinaryRecordAccuser;
     formData.disciplinaryWitnesses = props.data.disciplinaryWitnesses;
     formData.result = props.data.result;
-    formData.directors = props.data.director ?? [];
     formData.persons = props.data.persons ?? [];
     formData.disciplinaryDateStart = props.data.disciplinaryDateStart ?? null;
     formData.disciplinaryDateEnd = props.data.disciplinaryDateEnd ?? null;
@@ -359,23 +270,25 @@ async function fetchDatadetail() {
 
     investigateDis.rowSent = formData.persons;
 
+    formData.disciplinaryStatusResult = props.data.disciplinaryStatusResult;
+    formData.disciplinaryCauseText = props.data.disciplinaryCauseText;
+    formData.disciplinaryResult = props.data.disciplinaryResult;
+
     /** MAP รายชื่อกรรมการ หน้าหลัก */
-    let datalistDirector: responseType[] = formData.directors.map(
-      (e: directorType) => ({
-        id: e.id,
-        directorId: e.directorId,
-        name: `${e.prefix}${e.firstName} ${e.lastName}`,
-        prefix: e.prefix,
-        firstName: e.firstName,
-        lastName: e.lastName,
-        position: e.position ? e.position : "-",
-        email: e.email ? e.email : "-",
-        phone: e.phone ? e.phone : "-",
-        total: Number(e.total) ?? "-",
-        duty: e.duty ? e.duty : "-",
-      })
-    );
-    rows.value = datalistDirector;
+    const dataMap = props.data.director.map((item: any) => ({
+      id: item.directorId,
+      name: `${item.prefix}${item.firstName} ${item.lastName}`,
+      prefix: item.prefix,
+      firstName: item.firstName,
+      lastName: item.lastName,
+      position: item.position,
+      email: item.email,
+      phone: item.phone,
+    }));
+
+    rows.value = dataMap;
+    const dataList = dataMap.map((item: any) => item.id);
+    formData.directors = dataList;
   }
 }
 
@@ -518,6 +431,11 @@ async function selectComplainant(val: string) {
   // }
 }
 
+/** ฟังก์ชั่นเช็คการแก้ไขฟอร์มแล้วไม่ได้กดบันทึก */
+function changeFormData() {
+  isSave.value = true;
+}
+
 /** Hook */
 onMounted(async () => {
   await fetchOrganization();
@@ -652,7 +570,7 @@ onMounted(async () => {
                     <div class="col-xs-12 q-pa-sm">
                       <d-table
                         ref="table"
-                        :columns="columnsPerson"
+                        :columns="mainStore.columnsRespondent"
                         :rows="formData.persons"
                         row-key="personId"
                         flat
@@ -730,16 +648,16 @@ onMounted(async () => {
                       class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
                     >
                       วันที่สอบสวน
-                      <!-- v-if="
-                        props.data.disciplinaryDateStart &&
-                        props.data.disciplinaryDateStart != null &&
-                        props.data.disciplinaryDateEnd != null
-                      " -->
 
                       <q-checkbox
-                        for="#clickTime"
+                        v-if="
+                          formData.disciplinaryDateStart != null &&
+                          formData.disciplinaryDateEnd != null &&
+                          ((isReadonly && formData.extendStatus) || !isReadonly)
+                        "
+                        for="#extendStatus"
                         size="md"
-                        v-model="formData.clickTime"
+                        v-model="formData.extendStatus"
                         label="ขยายเวลา"
                         color="primary"
                         dense
@@ -750,7 +668,7 @@ onMounted(async () => {
                     <div class="col-12"><q-separator /></div>
                     <div class="q-pa-sm">
                       <div class="q-col-gutter-sm row">
-                        <div class="col-3" v-if="!formData.clickTime">
+                        <div class="col-3" v-if="!formData.extendStatus">
                           <datepicker
                             menu-class-name="modalfix"
                             :readonly="isUpdate"
@@ -802,7 +720,7 @@ onMounted(async () => {
                           </datepicker>
                         </div>
 
-                        <div class="col-3" v-if="formData.clickTime">
+                        <div class="col-3" v-if="formData.extendStatus">
                           <q-selectinvestigateDis
                             for="#daysExtend"
                             outlined
@@ -817,7 +735,7 @@ onMounted(async () => {
                             map-options
                             :rules="[
                             (val: any) =>
-                              formData.clickTime
+                              formData.extendStatus
                                 ? !!val || 'กรุณาเลือกจำนวนวันที่ต้องการขยาย'
                                 : true,
                           ]"
@@ -1147,8 +1065,8 @@ onMounted(async () => {
                                 flat
                                 round
                                 color="red"
-                                @click="deleteData(props.row.id)"
-                                icon="mdi-delete"
+                                @click="deleteDirector(props.row.id)"
+                                icon="mdi-delete-outline"
                               >
                                 <q-tooltip>ลบข้อมูล</q-tooltip>
                               </q-btn>
@@ -1305,7 +1223,7 @@ onMounted(async () => {
                             :rules="[
                               (val) => !!val || `${'กรุณาเลือกผลการสอบสวน'}`,
                             ]"
-                            :options="investigateDis.offenseDetailsOps"
+                            :options="mainStore.statusResultOptions"
                             label="ผลการสอบสวน"
                             emit-value
                             map-options
@@ -1454,7 +1372,7 @@ onMounted(async () => {
     @returnData="handleSave"
   />
 
-  <Dialogbody
+  <DialogDirector
     v-model:Modal="modal"
     :clickClose="clickClose"
     :rows2="listDirector"
@@ -1464,6 +1382,7 @@ onMounted(async () => {
     :rowsPerPage="rowsPerPage"
     :page="page"
     :maxPage="maxPage"
+    :selected-row="rows"
     @update:pagination="updatePaging"
     @returnDirector="returnDirector"
   />

src/modules/11_discipline/components/4_Result/EditPage.vue

@@ -115,7 +115,7 @@ const dataInvestigatefacts = reactive<FormInvestigateFact>({
   investigationDetailOther: "",
   evidenceFiles: null,
   fileComplaint: null,
-  clickTime: false,
+  extendStatus: false,
   investigationDateStart: null,
   investigationDateEnd: null,
   daysExtend: null,
@@ -172,6 +172,7 @@ async function fetchDetailInvestigate() {
 }
 
 const personObjComplaint = reactive<ArrayPerson>({
+  id: "",
   personId: "",
   idcard: "",
   name: "",

src/modules/11_discipline/components/DialogDirector.vue

@@ -1,5 +1,12 @@
 <script setup lang="ts">
-import { ref, computed, watchEffect, watch, onMounted } from "vue";
+import {
+  ref,
+  computed,
+  watchEffect,
+  watch,
+  onMounted,
+  type PropType,
+} from "vue";
 import { useQuasar } from "quasar";
 import { useCounterMixin } from "@/stores/mixin";
 import type { QTableProps } from "quasar";
@@ -110,6 +117,10 @@ const props = defineProps({
     type: Function,
     default: () => "",
   },
+  selectedRow: {
+    type: Array as PropType<directorType[]>,
+    required: true,
+  },
 });
 
 const checkSelected = computed(() => {
@@ -118,18 +129,8 @@ const checkSelected = computed(() => {
   }
 });
 
-/** popup ยืนยันส่งัว */
-function saveDirector() {
-  dialogConfirm(
-    $q,
-    () => DirectorSave(),
-    "ยืนยันเพิ่มรายชื่อกรรมการ",
-    "ต้องการยืนยันเพิ่มรายชื่อกรรมการ?"
-  );
-}
-
-/** ส่งไปออกคำสั่ง */
-async function DirectorSave() {
+/** เลือกกรรมการ */
+async function directorSave() {
   emit("returnDirector", selected.value);
 }
 
@@ -152,7 +153,7 @@ function Reset() {
 /** เช็คค่า props.Modal === true */
 watchEffect(() => {
   if (props.Modal === true) {
-    // selected.value = [];
+    selected.value = props.selectedRow;
     props.getList();
   }
 });
@@ -184,6 +185,7 @@ watch(
   }
 );
 </script>
+
 <template>
   <q-dialog v-model="props.Modal">
     <q-card style="width: 1200px; max-width: 80vw">
@@ -259,7 +261,7 @@ watch(
       <q-card-actions align="right" class="bg-white text-teal">
         <q-btn
           label="เพิ่มรายชื่อกรรมการ"
-          @click="saveDirector"
+          @click="directorSave"
           :disable="checkSelected"
           color="public"
         />

src/modules/11_discipline/components/PopupSendToNext.vue

@@ -3,16 +3,13 @@ import { ref, watch } from "vue";
 import { useQuasar } from "quasar";
 import DialogHeader from "@/components/DialogHeader.vue";
 
-
-
 import { useCounterMixin } from "@/stores/mixin";
 import { useComplainstDataStore } from "@/modules/11_discipline/store/ComplaintsStore";
-const complainstStore = useComplainstDataStore();
 
 const mixin = useCounterMixin();
 const $q = useQuasar();
 
-const { dialogConfirm, dialogMessageNotify, success } = mixin;
+const { dialogConfirm } = mixin;
 
 const props = defineProps({
   title: {
@@ -63,8 +60,7 @@ function onclickSend() {
     dialogConfirm(
       $q,
       async () => {
-        success($q, `ส่งข้อมูล${props.title}สำเร็จ`);
-        console.log(selected.value);
+        // success($q, `ส่งข้อมูล${props.title}สำเร็จ`);
         emit("returnPerson", selected.value);
         props.close?.();
       },