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

2023-11-30 18:02:29 +07:00 · 2023-11-30 18:02:29 +07:00 · f247167e9a
commit f247167e9a
parent 76594a2359
20 changed files with 1356 additions and 1714 deletions
--- a/src/modules/11_discipline/components/1_Complaint/Form.vue
+++ b/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"