จัดโค้ด

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

@@ -2,12 +2,15 @@
 import { onMounted, reactive, ref, watch } from "vue";
 import { useQuasar } from "quasar";
 import { useRouter, useRoute } from "vue-router";
+
 import http from "@/plugins/http";
 import config from "@/app.config";
+
 /**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 {
   PersonsArray,
   Persons,
@@ -17,10 +20,10 @@ import type {
   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";
 
+import PopupSendToNext from "@/modules/11_discipline/components/PopupSendToNext.vue";
+
 /**import store*/
 import { useCounterMixin } from "@/stores/mixin";
 import { useInvestigateDisStore } from "@/modules/11_discipline/store/InvestigateDisStore";
@@ -42,6 +45,80 @@ const status = ref<string>("");
 
 const idInvestigate = ref<string>("");
 const idComplaint = ref<string>("");
+const respondentRows = ref<Persons[]>();
+const personObjComplaint = reactive<ArrayPerson>({
+  id: "",
+  personId: "",
+  idcard: "",
+  name: "",
+  prefix: "",
+  firstName: "",
+  lastName: "",
+  posNo: "",
+  position: "",
+  positionLevel: "",
+  salary: null,
+  organization: "",
+});
+
+const fileListObjComplaint = reactive<ArrayFileList>({
+  id: "",
+  pathName: "",
+  fileName: "",
+});
+
+const dataComplaints = reactive<FormDataComplaint>({
+  id: "",
+  respondentType: "",
+  organizationId: "",
+  consideredAgency: "",
+  title: "",
+  description: "",
+  dateReceived: null,
+  dateConsideration: null,
+  offenseDetails: "",
+  levelConsideration: "",
+  dateNotification: null,
+  complaintFrom: "",
+  appellant: "",
+  documentFile: null,
+  status: "",
+  persons: [personObjComplaint],
+  result: "",
+  disciplineComplaintDocs: [fileListObjComplaint],
+});
+
+/** ข้อมูล v-model ของฟอร์มสืบสวน */
+const dataInvestigatefacts = reactive<FormInvestigateFact>({
+  id: "",
+  idComplaint: "",
+  investigationDetail: "",
+  complaint: "",
+  complaintdetail: "",
+  investigationDescription: "",
+  fault: "",
+  investigationDetailOther: "",
+  evidenceFiles: null,
+  fileComplaint: null,
+  investigationExtendStatus: false,
+  investigationDateStart: null,
+  investigationDateEnd: null,
+  investigationDaysExtend: null,
+  investigationStatusResult: "",
+  investigationCauseText: "",
+  complaintStatus: "",
+  result: "",
+  directors: [],
+  disciplineInvestigateDocs: [],
+  disciplineInvestigateRelevantDocs: [],
+  status: "",
+  documentFile: null,
+  respondentType: "",
+  organizationId: "",
+  persons: [],
+  investigationExtendHistory: [],
+});
+
 /** function fetchData สอบสวนความผิดทางวินัย*/
 async function fetchDetailDisciplinary() {
   showLoader();
@@ -168,12 +245,11 @@ async function onSubmitDisciplinary(data: any) {
  * บันทึกข้อมูลที่เเก้ไข
  * @param id ระบุ บุคคล
  */
-const onSubmit = async (id: string) => {
+async function onSubmit(id: string) {
   router.push(`/discipline/disciplinary`);
-};
+}
 
 /** ยืนยัน ส่งไปออกคำสั่ง */
-const respondentRows = ref<Persons[]>();
 async function sentIssue() {
   respondentRows.value = await store.rowSent.filter((x) => x.report === false); //x.report === false
   modalPopup.value = true;
@@ -197,7 +273,7 @@ function confirmSentIssueGate() {
       messageError($q, e);
     })
     .finally(() => {
-      router.push(`/discipline/disciplinary`)
+      router.push(`/discipline/disciplinary`);
       fetchDetailDisciplinary();
     });
 }
@@ -234,7 +310,6 @@ function confirmEndInvestigate() {
       messageError($q, e);
     })
     .finally(() => {
-      
       fetchDetailDisciplinary();
     });
 }
@@ -258,52 +333,6 @@ function closePopup() {
   modalPopup.value = false;
 }
 
-/** โหลดข้อมูลเมื่อเข้าหน้านี้ */
-onMounted(async () => {
-  store.tabMenu = "disciplinary";
-  await fetchDetailDisciplinary();
-});
-
-watch(
-  () => store.tabMenu,
-  async () => {
-    const fetchFunction =
-      store.tabMenu === "disciplinary"
-        ? fetchDetailDisciplinary
-        : store.tabMenu === "investigatefacts"
-        ? fetchDetailInvestigate
-        : store.tabMenu === "complaints"
-        ? fetchDetailComplaints
-        : null;
-
-    if (fetchFunction) {
-      await fetchFunction();
-    }
-  }
-);
-
-/** ข้อมูล v-model ของฟอร์มเรื่องร้องเรียน */
-const personObjComplaint = reactive<ArrayPerson>({
-  id: "",
-  personId: "",
-  idcard: "",
-  name: "",
-  prefix: "",
-  firstName: "",
-  lastName: "",
-  posNo: "",
-  position: "",
-  positionLevel: "",
-  salary: null,
-  organization: "",
-});
-
-const fileListObjComplaint = reactive<ArrayFileList>({
-  id: "",
-  pathName: "",
-  fileName: "",
-});
-
 function emitPerson(data: PersonsArray[]) {
   const dataMapId = data.map((item: PersonsArray) => item.id);
   showLoader();
@@ -324,62 +353,35 @@ function emitPerson(data: PersonsArray[]) {
     });
 }
 
-const dataComplaints = reactive<FormDataComplaint>({
-  id: "",
-  respondentType: "",
-  organizationId: "",
-  consideredAgency: "",
-  title: "",
-  description: "",
-  dateReceived: null,
-  dateConsideration: null,
-  offenseDetails: "",
-  levelConsideration: "",
-  dateNotification: null,
-  complaintFrom: "",
-  appellant: "",
-  documentFile: null,
-  status: "",
-  persons: [personObjComplaint],
-  result: "",
-  disciplineComplaintDocs: [fileListObjComplaint],
-});
+watch(
+  () => store.tabMenu,
+  async () => {
+    const fetchFunction =
+      store.tabMenu === "disciplinary"
+        ? fetchDetailDisciplinary
+        : store.tabMenu === "investigatefacts"
+        ? fetchDetailInvestigate
+        : store.tabMenu === "complaints"
+        ? fetchDetailComplaints
+        : null;
 
-/** ข้อมูล v-model ของฟอร์มสืบสวน */
-const dataInvestigatefacts = reactive<FormInvestigateFact>({
-  id: "",
-  idComplaint: "",
-  investigationDetail: "",
-  complaint: "",
-  complaintdetail: "",
-  investigationDescription: "",
-  fault: "",
-  investigationDetailOther: "",
-  evidenceFiles: null,
-  fileComplaint: null,
-  investigationExtendStatus: false,
-  investigationDateStart: null,
-  investigationDateEnd: null,
-  investigationDaysExtend: null,
-  investigationStatusResult: "",
-  investigationCauseText: "",
-  complaintStatus: "",
-  result: "",
-  directors: [],
-  disciplineInvestigateDocs: [],
-  disciplineInvestigateRelevantDocs: [],
-  status: "",
-  documentFile: null,
-  respondentType: "",
-  organizationId: "",
-  persons: [],
-  investigationExtendHistory:[]
+    if (fetchFunction) {
+      await fetchFunction();
+    }
+  }
+);
+
+/** โหลดข้อมูลเมื่อเข้าหน้านี้ */
+onMounted(async () => {
+  store.tabMenu = "disciplinary";
+  await fetchDetailDisciplinary();
 });
 </script>
 
 <template>
   <div class="col-xs-12 col-sm-12 col-md-11">
     <div class="toptitle col-12 row items-center">
+
       <q-btn
         icon="mdi-arrow-left"
         unelevated
@@ -392,6 +394,7 @@ const dataInvestigatefacts = reactive<FormInvestigateFact>({
       />
       <div class="q-ma-none">แก้ไขการสอบสวนความผิดทางวินัย</div>
       <q-space />
+
       <div class="q-gutter-x-sm">
         <q-btn
           v-if="status === 'NEW'"
@@ -419,6 +422,7 @@ const dataInvestigatefacts = reactive<FormInvestigateFact>({
         />
       </div>
     </div>
+
     <q-card flat class="col-12">
       <q-tabs
         v-model="store.tabMenu"
@@ -436,16 +440,19 @@ const dataInvestigatefacts = reactive<FormInvestigateFact>({
         <q-tab name="disciplinary" label="สอบสวนความผิดทางวินัย" />
       </q-tabs>
       <q-separator />
+
       <q-tab-panels v-model="store.tabMenu" animated>
         <q-tab-panel name="complaints">
           <FormComplaints :on-submit="onSubmit" :data="dataComplaints" />
         </q-tab-panel>
+
         <q-tab-panel name="investigatefacts">
           <FormInvestigatefacts
             :on-submit="onSubmit"
             :data="dataInvestigatefacts"
           />
         </q-tab-panel>
+        
         <q-tab-panel name="disciplinary">
           <FormDisciplinary
             :on-submit="onSubmit"