api สอบสวน

src/api/11_discipline/api.discipline.ts

@@ -1,5 +1,5 @@
 import env from "../index";
-const discipline = `${env.API_URI}/discipline`;
+const discipline = `${env.API_URI}/discipline/disciplinary`;
 const investigate = `${env.API_URI}/discipline/investigate`;
 
 export default {
@@ -46,16 +46,20 @@ export default {
   investigateApprove: (id: string) => `${investigate}/approve/${id}`,
 
   /** ระบบวินัยเรื่องสอบสวน */
-  disciplineDisciplinary: () => `${discipline}/disciplinary`,
+  disciplineDisciplinary: () => `${discipline}`,
   disciplineDisciplinaryById: (id: string) =>
-    `${discipline}/disciplinary/${id}`,
+    `${discipline}/${id}`,
   disciplineInvestigateById: (id: string) =>
-    `${discipline}/disciplinary/investigate/${id}`,
+    `${discipline}/investigate/${id}`,
   disciplineComplaintsById: (id: string) =>
-    `${discipline}/disciplinary/complaint/${id}`,
+    `${discipline}/complaint/${id}`,
   disciplineDirector: () => `${discipline}/director`,
   disciplineDoc: (type: string, id: string) =>
-    `${discipline}/disciplinary/${type}/file/${id}`,
+    `${discipline}/${type}/file/${id}`,
   disciplineByIdDoc: (type: string, id: string, docId: string) =>
-    `${discipline}/disciplinary/${type}/file/${id}/${docId}`,
+    `${discipline}/${type}/file/${id}/${docId}`,
+
+    disciplinaryReject: (id: string) => `${discipline}/reject/${id}`,
+    disciplinaryResume: (id: string) => `${discipline}/resume/${id}`,
+    disciplinaryApprove: (id: string) => `${discipline}/approve/${id}`,
 };

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

@@ -19,6 +19,7 @@ import http from "@/plugins/http";
 
 const $q = useQuasar();
 const route = useRoute();
+const router = useRouter();
 const modalPerson = ref<boolean>(false);
 const toggleModal = () => (modalPerson.value = !modalPerson.value);
 /**เรียกใช้ store */
@@ -134,6 +135,15 @@ const initialPagination = ref<any>({
 
 /** หัวตาราง */
 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",
@@ -210,6 +220,7 @@ const columnsPerson = ref<QTableProps["columns"]>([
 
 /** หัวข้อที่เเสดงในตาราง */
 const visibleColumnsPerson = ref<string[]>([
+  "info",
   "no",
   "idcard",
   "name",
@@ -715,7 +726,27 @@ onMounted(async () => {
                             <div v-if="col.name == 'no'">
                               {{ props.rowIndex + 1 }}
                             </div>
-                            <div>
+                            <div v-else-if="col.name == 'info'">
+                              <q-btn
+                                size="14px"
+                                flat
+                                round
+                                dense
+                                color="info"
+                                icon="info"
+                                @click="
+                                  router.push(`/registry/${props.row.personId}`)
+                                "
+                                ><q-tooltip>ดูข้อมูลในทะเบียนประวัติ</q-tooltip></q-btn
+                              >
+                            </div>
+                            <div
+                              v-else-if="col.name === 'organization'"
+                              class="table_ellipsis"
+                            >
+                              {{ props.row.organization }}
+                            </div>
+                            <div v-else>
                               {{ col.value }}
                             </div>
                           </q-td>
@@ -1234,9 +1265,15 @@ onMounted(async () => {
                 formData.disciplineInvestigateRelevantDocs.length === 0
               "
             >
-              <q-card class="q-pa-md q-ma-xs" bordered> ไม่มีรายการเอกสาร </q-card>
+              <q-card class="q-pa-md q-ma-xs" bordered>
+                ไม่มีรายการเอกสาร
+              </q-card>
             </div>
-            <q-list separator class="full-width q-mt-md" v-if="props.data.disciplineInvestigateRelevantDocs.length >0">
+            <q-list
+              separator
+              class="full-width q-mt-md"
+              v-if="props.data.disciplineInvestigateRelevantDocs.length > 0"
+            >
               <q-item
                 clickable
                 v-ripple
@@ -1279,94 +1316,94 @@ onMounted(async () => {
           </q-card>
         </div>
         <div class="col-xs-12">
-            <q-card
+          <q-card bordered class="row col-12" style="border: 1px solid #d6dee1">
-              bordered
+            <div class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md">
-              class="row col-12"
+              อัปโหลดไฟล์เอกสารหลักฐาน
-              style="border: 1px solid #d6dee1"
+            </div>
+            <div class="col-12"><q-separator /></div>
+            <q-file
+              v-if="formData.status === 'NEW'"
+              class="col-10 q-pa-sm"
+              for="#documentFile"
+              outlined
+              dense
+              v-model="formData.documentFile"
+              label="ไฟล์เอกสารหลักฐาน"
+              hide-bottom-space
             >
-              <div class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md">
+              <template v-slot:prepend>
-                อัปโหลดไฟล์เอกสารหลักฐาน
+                <q-icon name="attach_file" color="primary" />
-              </div>
+              </template>
-              <div class="col-12"><q-separator /></div>  
+            </q-file>
-                <q-file
-                  v-if="formData.status === 'NEW'"
-                  class="col-10 q-pa-sm"
-                  for="#documentFile"
-                  outlined
-                  dense
-                  v-model="formData.documentFile"
-                  label="ไฟล์เอกสารหลักฐาน"
-                  hide-bottom-space
-                >
-                  <template v-slot:prepend>
-                    <q-icon name="attach_file" color="primary" />
-                  </template>
-                </q-file>
-                
-                <div class="col-2 self-center">
-                  <q-btn
-                    v-if="formData.documentFile"
-                    size="14px"
-                    flat
-                    round
-                    dense
-                    color="add"
-                    icon="mdi-upload"
-                    @click="uploadFile"
-                    ><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
-                  >
-                </div>
-                <div
-                  v-if="formData.disciplineInvestigateDocs.length === 0"
-                  class="col-12"
-                >
-                  <q-card class="q-pa-md q-ma-xs" bordered> ไม่มีรายการเอกสาร </q-card>
-                </div>
 
-              <div class="col-xs-12 q-pa-sm row" v-if="props.data.disciplineInvestigateDocs.length >0">
+            <div class="col-2 self-center">
-                <q-list separator class="full-width">
+              <q-btn
-                  <q-item
+                v-if="formData.documentFile"
-                    clickable
+                size="14px"
-                    v-ripple
+                flat
-                    v-for="file in props.data.disciplineInvestigateDocs"
+                round
-                    :key="file.id"
+                dense
-                  >
+                color="add"
-                    <q-item-section>{{ file.fileName }}</q-item-section>
+                icon="mdi-upload"
-                    <q-item-section avatar>
+                @click="uploadFile"
-                      <div class="row">
+                ><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
-                        <div>
+              >
-                          <q-btn
+            </div>
-                            dense
+            <div
-                            flat
+              v-if="formData.disciplineInvestigateDocs.length === 0"
-                            round
+              class="col-12"
-                            size="12px"
+            >
-                            color="blue"
+              <q-card class="q-pa-md q-ma-xs" bordered>
-                            icon="mdi-download-outline"
+                ไม่มีรายการเอกสาร
-                            @click="downloadFile(file.pathName)"
+              </q-card>
-                          >
+            </div>
-                            <q-tooltip>ดาวน์โหลดเอกสารหลักฐาน</q-tooltip>
+
-                          </q-btn>
+            <div
-                        </div>
+              class="col-xs-12 q-pa-sm row"
-                        <div>
+              v-if="props.data.disciplineInvestigateDocs.length > 0"
-                          <q-btn
+            >
-                            v-if="formData.status === 'NEW'"
+              <q-list separator class="full-width">
-                            dense
+                <q-item
-                            flat
+                  clickable
-                            round
+                  v-ripple
-                            size="12px"
+                  v-for="file in props.data.disciplineInvestigateDocs"
-                            color="red"
+                  :key="file.id"
-                            icon="mdi-delete-outline"
+                >
-                            @click="deleteFile(file.id)"
+                  <q-item-section>{{ file.fileName }}</q-item-section>
-                            ><q-tooltip>ลบเอกสารหลักฐาน</q-tooltip></q-btn
+                  <q-item-section avatar>
-                          >
+                    <div class="row">
-                        </div>
+                      <div>
+                        <q-btn
+                          dense
+                          flat
+                          round
+                          size="12px"
+                          color="blue"
+                          icon="mdi-download-outline"
+                          @click="downloadFile(file.pathName)"
+                        >
+                          <q-tooltip>ดาวน์โหลดเอกสารหลักฐาน</q-tooltip>
+                        </q-btn>
                       </div>
-                    </q-item-section>
+                      <div>
-                  </q-item>
+                        <q-btn
-                </q-list>
+                          v-if="formData.status === 'NEW'"
-              </div>
+                          dense
-            </q-card>
+                          flat
-      
+                          round
+                          size="12px"
+                          color="red"
+                          icon="mdi-delete-outline"
+                          @click="deleteFile(file.id)"
+                          ><q-tooltip>ลบเอกสารหลักฐาน</q-tooltip></q-btn
+                        >
+                      </div>
+                    </div>
+                  </q-item-section>
+                </q-item>
+              </q-list>
+            </div>
+          </q-card>
         </div>
       </q-card>
     </div>

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

@@ -2,23 +2,25 @@
 import { onMounted, reactive, ref, watch } from "vue";
 import { useQuasar } from "quasar";
 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 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 } from "@/modules/11_discipline/interface/request/disciplinary";
+import type {
+  FormData,
+  PersonsArray,
+} from "@/modules/11_discipline/interface/request/disciplinary";
 import type {
   FormData as FormDataComplaint,
   ArrayPerson,
   ArrayFileList,
 } from "@/modules/11_discipline/interface/request/complaint";
 
-import type {
+import type { FormData as FormInvestigateFact } from "@/modules/11_discipline/interface/request/investigateFact";
-  FormData as FormInvestigateFact,
-} from "@/modules/11_discipline/interface/request/investigateFact";
 
 /**import store*/
 import { useCounterMixin } from "@/stores/mixin";
@@ -31,9 +33,10 @@ const { dialogConfirm, success, messageError, showLoader, hideLoader } = mixin;
 const router = useRouter();
 const route = useRoute();
 
+const modalPopup = ref<boolean>(false);
 const id = ref<string>(route.params.id as string);
 const data = ref<object>();
-const status = ref<string>("")
+const status = ref<string>("");
 
 /** function fetchData สอบสวนความผิดทางวินัย*/
 async function fetchDetailDisciplinary() {
@@ -42,7 +45,7 @@ async function fetchDetailDisciplinary() {
     .get(config.API.disciplineDisciplinaryById(id.value))
     .then((res) => {
       data.value = res.data.result;
-      status.value = res.data.result.status
+      status.value = res.data.result.status;
     })
     .catch((err) => {
       messageError($q, err);
@@ -64,18 +67,24 @@ async function fetchDetailInvestigate() {
       dataInvestigatefacts.respondentType = dataList.respondentType;
       dataInvestigatefacts.persons = dataList.persons;
       dataInvestigatefacts.investigationDetail = dataList.investigationDetail;
-      dataInvestigatefacts.investigationDetailOther = dataList.investigationDetailOther;
+      dataInvestigatefacts.investigationDetailOther =
-      dataInvestigatefacts.investigationDateStart = dataList.investigationDateStart;
+        dataList.investigationDetailOther;
+      dataInvestigatefacts.investigationDateStart =
+        dataList.investigationDateStart;
       dataInvestigatefacts.investigationDateEnd = dataList.investigationDateEnd;
-      dataInvestigatefacts.investigationDescription = dataList.investigationDescription;
+      dataInvestigatefacts.investigationDescription =
-      dataInvestigatefacts.investigationCauseText = dataList.investigationCauseText;
+        dataList.investigationDescription;
+      dataInvestigatefacts.investigationCauseText =
+        dataList.investigationCauseText;
       dataInvestigatefacts.status = dataList.status;
       dataInvestigatefacts.result = dataList.result;
       dataInvestigatefacts.directors = dataList.director;
-      dataInvestigatefacts.disciplineInvestigateDocs = dataList.disciplineInvestigateDocs;
+      dataInvestigatefacts.disciplineInvestigateDocs =
+        dataList.disciplineInvestigateDocs;
       dataInvestigatefacts.disciplineInvestigateRelevantDocs =
         dataList.disciplineInvestigateRelevantDocs;
-      dataInvestigatefacts.investigationStatusResult = dataList.investigationStatusResult;
+      dataInvestigatefacts.investigationStatusResult =
+        dataList.investigationStatusResult;
     })
     .catch((err) => {
       messageError($q, err);
@@ -155,12 +164,25 @@ const onSubmit = async (id: string) => {
 
 /** ยืนยัน ส่งไปออกคำสั่ง */
 function sentIssue() {
-  dialogConfirm(
+  console.log("sent");
-    $q,
+  modalPopup.value = true;
-    () => confirmSentIssue(),
+}
-    "ยืนยันส่งไปสรุปผลการพิจารณา",
+
-    "ต้องการยืนยันส่งไปสรุปผลการพิจารณาใช่หรือไม่?"
+function sentIssueGate() {
-  );
+  dialogConfirm($q, () => confirmSentIssueGate(),'ยืนยันส่งไปสรุปผลการพิจารณา','ต้องการยืนยันส่งไปสรุปผลการพิจารณาใช่หรือไม่?');
+}
+
+function confirmSentIssueGate() {
+  showLoader()
+  http
+    .get(config.API.disciplinaryApprove(id.value))
+    .then((res) => {})
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      fetchDetailDisciplinary();
+    });
 }
 
 /** ยืนยัน ยุติเรื่อง */
@@ -186,16 +208,41 @@ function cancelInvestigate() {
 /** ฟังชั่น ส่งไปออกคำสั่ง*/
 function confirmSentIssue() {
   console.log("sent");
+  modalPopup.value = true;
 }
 
 /** ฟังชั่น ยุติเรื่อง*/
 function confirmEndInvestigate() {
   console.log("sent");
+  showLoader();
+  http
+    .get(config.API.disciplinaryReject(id.value))
+    .then((res) => {})
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      fetchDetailDisciplinary();
+    });
 }
 
 /** ฟังชั่น ยกเลิกการยุติเรื่อง*/
 function confirmCancelInvestigate() {
   console.log("sent");
+  showLoader();
+  http
+    .get(config.API.disciplinaryResume(id.value))
+    .then((res) => {})
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      fetchDetailDisciplinary();
+    });
+}
+
+function closePopup() {
+  modalPopup.value = false;
 }
 
 /** โหลดข้อมูลเมื่อเข้าหน้านี้ */
@@ -243,6 +290,125 @@ const fileListObjComplaint = reactive<ArrayFileList>({
   fileName: "",
 });
 
+function emitPerson(data: PersonsArray[]) {
+  console.log(data);
+  // const dataMapId = data.map((item: PersonsArray) => item.id);
+  // console.log(dataMapId);
+  // showLoader();
+  // http
+  //   .put(config.API.investigateApprove(id.value), {
+  //     persons: dataMapId,
+  //   })
+  //   .then((res) => {
+  //     // router.push(`/discipline/investigatefacts`);
+  //   })
+  //   .catch((e) => {
+  //     messageError($q, e);
+  //   })
+  //   .finally(() => {
+  //     hideLoader();
+  //     fetchDetailDisciplinary();
+  //   });
+}
+
+/** หัวตาราง */
+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",
+]);
+
 const dataComplaints = reactive<FormDataComplaint>({
   id: "",
   respondentType: "",
@@ -314,7 +480,7 @@ const dataInvestigatefacts = reactive<FormInvestigateFact>({
           v-if="status === 'NEW'"
           label="ส่งไปสรุปผลการพิจารณา"
           color="public"
-          @click="sentIssue"
+          @click="sentIssueGate"
         />
         <q-btn
           v-if="status === 'NEW'"
@@ -358,7 +524,10 @@ const dataInvestigatefacts = reactive<FormInvestigateFact>({
           <FormComplaints :on-submit="onSubmit" :data="dataComplaints" />
         </q-tab-panel>
         <q-tab-panel name="investigatefacts">
-          <FormInvestigatefacts :on-submit="onSubmit" :data="dataInvestigatefacts" />
+          <FormInvestigatefacts
+            :on-submit="onSubmit"
+            :data="dataInvestigatefacts"
+          />
         </q-tab-panel>
         <q-tab-panel name="disciplinary">
           <FormDisciplinary
@@ -371,6 +540,16 @@ const dataInvestigatefacts = reactive<FormInvestigateFact>({
       </q-tab-panels>
     </q-card>
   </div>
+
+  <Popup
+    :modal="modalPopup"
+    :close="closePopup"
+    title="ส่งไปพักราชการ"
+    :rows="store.rowSent"
+    :columns="columns"
+    :visibleColumns="visibleColumns"
+    @return-person="emitPerson"
+  />
 </template>
 
 <style scoped>

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

@@ -3,7 +3,7 @@ import { ref, onMounted, reactive, watch } from "vue";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useQuasar } from "quasar";
-import { useRoute } from "vue-router";
+import { useRoute,useRouter } from "vue-router";
 
 /**import type*/
 import type { QTableProps } from "quasar";
@@ -40,6 +40,7 @@ const { date2Thai, showLoader, hideLoader, dialogConfirm, messageError } =
   mixin;
 
 const route = useRoute();
+const router = useRouter();
 const $q = useQuasar();
 
 const id = ref<string>(route.params.id as string);
@@ -57,6 +58,15 @@ function toggleModal() {
 
 /** หัวตารางของรายการผู้ถูกสอบสวน กรณีบุคคล */
 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",
@@ -347,6 +357,8 @@ async function fetchDatadetail() {
     disciplineDisciplinary_DocRelevants.value =
       props.data.disciplineDisciplinary_DocRelevants;
 
+      investigateDis.rowSent = formData.persons
+
     /** MAP รายชื่อกรรมการ หน้าหลัก */
     let datalistDirector: responseType[] = formData.directors.map(
       (e: directorType) => ({
@@ -390,6 +402,7 @@ async function addPerson(data: Persons[]) {
   }));
   const mergedArray = [...formData.persons, ...newPerson];
   formData.persons = mergedArray;
+  investigateDis.rowSent = formData.persons
   toggleModal();
 }
 
@@ -669,7 +682,27 @@ onMounted(async () => {
                               <div v-if="col.name == 'no'">
                                 {{ props.rowIndex + 1 }}
                               </div>
-                              <div>
+                              <div v-else-if="col.name == 'info'">
+                              <q-btn
+                                size="14px"
+                                flat
+                                round
+                                dense
+                                color="info"
+                                icon="info"
+                                @click="
+                                  router.push(`/registry/${props.row.personId}`)
+                                "
+                                ><q-tooltip>ดูข้อมูลในทะเบียนประวัติ</q-tooltip></q-btn
+                              >
+                            </div>
+                            <div
+                              v-else-if="col.name === 'organization'"
+                              class="table_ellipsis"
+                            >
+                              {{ props.row.organization }}
+                            </div>
+                              <div v-else>
                                 {{ col.value }}
                               </div>
                             </q-td>
@@ -1364,7 +1397,7 @@ onMounted(async () => {
         label="เลือกไฟล์"
         :files="disciplineDisciplinary_DocRelevants"
         :id="id"
-        type="relevants"
+        type="relevant"
         :fetchData="props.fetchData"
       />
 

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

@@ -11,7 +11,7 @@ import { useCounterMixin } from "@/stores/mixin";
 const $q = useQuasar();
 
 const mixin = useCounterMixin();
-const { showLoader, hideLoader, success, messageError } = mixin;
+const { showLoader, hideLoader, success, messageError,dialogRemove } = mixin;
 
 const fileRef = ref<Object | null>(null);
 const file = ref<any>();
@@ -72,12 +72,17 @@ async function uploadFile() {
       hideLoader();
     });
 }
+
+function popupRemove(id:string){
+  dialogRemove($q,()=> removeFile(id))
+}
+
 async function removeFile(id: string) {
   showLoader();
   await http
     .delete(config.API.disciplineByIdDoc(props.type, props.id, id))
     .then(() => {
-      success($q, "ลบข้อมูลสำเร็จ");
+      success($q, "ลบไฟล์สำเร็จ");
       props.fetchData();
     })
     .catch((e) => {
@@ -99,92 +104,90 @@ function downloadFile(link: string) {
 
 <template>
   <q-card flat class="q-pa-md" bordered>
-    <div class="col-12 row q-col-gutter-md">
+    <q-card bordered style="border: 1px solid #d6dee1">
-      <div class="row col-12">
+      <div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
-        <q-card bordered class="row col-12" style="border: 1px solid #d6dee1">
+        {{ title }}
-          <div class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md">
-            {{ title }}
-          </div>
-          <div class="col-12"><q-separator /></div>
-          <div class="col-xs-12 q-pa-sm row">
-            <q-file
-              class="col-11"
-              outlined
-              dense
-              ref="fileRef"
-              for="#files"
-              v-model="file"
-              :label="label"
-              hide-bottom-space
-              lazy-rules
-              accept=".pdf,.xlsx,.doc"
-            >
-              <template v-slot:prepend>
-                <q-icon name="attach_file" />
-              </template>
-            </q-file>
-            <div class="col-1 self-center">
-              <q-btn
-                size="14px"
-                flat
-                round
-                dense
-                color="add"
-                icon="mdi-upload"
-                @click="uploadFile()"
-                ><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
-              >
-            </div>
-          </div>
-
-          <div v-if="props.files.length > 0" class="col-xs-12 q-pa-sm row">
-            <q-list
-              v-for="(f, index) in props.files"
-              :key="index"
-              bordered
-              separator
-              class="full-width"
-            >
-              <q-item clickable v-ripple>
-                <q-item-section>{{ f.fileName }}</q-item-section>
-                <q-item-section avatar>
-                  <div class="row">
-                    <div>
-                      <q-btn
-                        dense
-                        flat
-                        round
-                        size="12px"
-                        color="blue"
-                        icon="mdi-download-outline"
-                        @click="downloadFile(f.pathName)"
-                      >
-                        <q-tooltip>ดาวน์โหลดเอกสาร</q-tooltip>
-                      </q-btn>
-                    </div>
-                    <div>
-                      <q-btn
-                        dense
-                        flat
-                        round
-                        size="12px"
-                        color="red"
-                        icon="mdi-delete-outline"
-                        @click="removeFile(f.id)"
-                        ><q-tooltip>ลบเอกสาร</q-tooltip></q-btn
-                      >
-                    </div>
-                  </div>
-                </q-item-section>
-              </q-item>
-            </q-list>
-          </div>
-
-          <div class="col-12 q-mt-sm" v-if="props.files.length == 0">
-            <q-card class="q-pa-md" bordered> ไม่มีรายการเอกสาร </q-card>
-          </div>
-        </q-card>
       </div>
-    </div>
+      <div class="col-12"><q-separator /></div>
+      <div class="row">
+        <div class="col-11 q-pa-sm">
+          <q-file
+            outlined
+            dense
+            ref="fileRef"
+            for="#files"
+            v-model="file"
+            :label="label"
+            hide-bottom-space
+            lazy-rules
+            accept=".pdf,.xlsx,.doc"
+          >
+            <template v-slot:prepend>
+              <q-icon name="attach_file" />
+            </template>
+          </q-file>
+        </div>
+        <div class="col-1 self-center text-center">
+          <q-btn
+            v-if="file"
+            size="14px"
+            flat
+            round
+            dense
+            color="add"
+            icon="mdi-upload"
+            @click="uploadFile()"
+            ><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
+          >
+        </div>
+      </div>
+
+      <div v-if="props.files.length > 0" class="col-xs-12 q-pa-sm row">
+        <q-list
+          v-for="(f, index) in props.files"
+          :key="index"
+          bordered
+          separator
+          class="full-width"
+        >
+          <q-item clickable v-ripple>
+            <q-item-section>{{ f.fileName }}</q-item-section>
+            <q-item-section avatar>
+              <div class="row">
+                <div>
+                  <q-btn
+                    dense
+                    flat
+                    round
+                    size="12px"
+                    color="blue"
+                    icon="mdi-download-outline"
+                    @click="downloadFile(f.pathName)"
+                  >
+                    <q-tooltip>ดาวน์โหลดเอกสาร</q-tooltip>
+                  </q-btn>
+                </div>
+                <div>
+                  <q-btn
+                    dense
+                    flat
+                    round
+                    size="12px"
+                    color="red"
+                    icon="mdi-delete-outline"
+                    @click="popupRemove(f.id)"
+                    ><q-tooltip>ลบเอกสาร</q-tooltip></q-btn
+                  >
+                </div>
+              </div>
+            </q-item-section>
+          </q-item>
+        </q-list>
+      </div>
+
+      <div class="col-12 q-ma-xs" v-if="props.files.length == 0">
+        <q-card class="q-pa-md" bordered> ไม่มีรายการเอกสาร </q-card>
+      </div>
+    </q-card>
   </q-card>
 </template>

src/modules/11_discipline/interface/request/disciplinary.ts

@@ -11,6 +11,19 @@ interface Persons {
   organization: string; //สังกัด
   name: string;
 }
+interface PersonsArray {
+  id: string; //id อ้างอิง profile
+  idcard: string; //รหัสบัตรประชาชน
+  prefix: string; //คำนำหน้า
+  firstName: string; //ชื่อ
+  lastName: string; //นามสกุล
+  posNo: string; //เลขที่ตำแหน่ง
+  position: string; //ตำแหน่ง
+  positionLevel: string; //ระดับ
+  salary: number; //เงินเดือน
+  organization: string; //สังกัด
+  name: string;
+}
 interface Director {
   directorId?: string;
   duty?: string;
@@ -115,4 +128,4 @@ interface DisciplinaryRef {
   [key: string]: any;
 }
 
-export type { FormData, DisciplinaryRef, Persons, Director };
+export type { FormData, DisciplinaryRef, Persons, Director,PersonsArray };

src/modules/11_discipline/store/InvestigateDisStore.ts

@@ -9,6 +9,9 @@ import type {
   DataOptioGroup,
   DataNumberOption
 } from "@/modules/11_discipline/interface/index/Main";
+import type {
+  Persons
+} from "@/modules/11_discipline/interface/request/disciplinary";
 import { useCounterMixin } from "@/stores/mixin";
 const mixin = useCounterMixin();
 const { date2Thai } = mixin;
@@ -18,6 +21,7 @@ export const useInvestigateDisStore = defineStore(
   () => {
     const tabMenu = ref<string>("disciplinary");
     const rows = ref<investigateDisDataRowType[]>([]);
+    const rowSent = ref<Persons[]>([]);
     const rows2 = ref<directorType[]>([]);
     const selected = ref<directorType[]>([]);
 
@@ -346,6 +350,7 @@ export const useInvestigateDisStore = defineStore(
       fetchList,
       rows,
       rows2,
+      rowSent,
       offenseDetailsOps,
       optionsfaultLevel,
       fecthDirector,