เรื่องร้องเรียน อัปโหลด ลบ ไฟล์

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

@@ -17,5 +17,6 @@ export default {
   complaintAdd:() => `${discipline}/complaint`,
   complaintbyId:(id:string) => `${discipline}/complaint/${id}`,
   complaintList:(page:number,pageSize:number,keyword:string) => `${discipline}/complaint?page=${page}&pageSize=${pageSize}&keyword=${keyword}`,
-
+  complaintFileUpload:(id:string) => `${discipline}/complaint/file/${id}`,
+  complaintFileDelete:(id:string,docId:string) => `${discipline}/complaint/file/${id}/${docId}`
 };

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

@@ -46,6 +46,7 @@ const fileListOj = reactive<ArrayFileList>({
 });
 
 const data = reactive<FormData>({
+  id:'',
   respondentType: "",
   organizationId: "",
   consideredAgency: "",
@@ -132,6 +133,7 @@ async function getData() {
     .get(config.API.complaintbyId(id.value))
     .then((res) => {
       const dataList = res.data.result;
+      data.id = dataList.id
       data.respondentType = dataList.respondentType
       data.organizationId = dataList.organizationId
       data.consideredAgency = dataList.consideredAgency
@@ -149,7 +151,7 @@ async function getData() {
       data.rejectReason = dataList.rejectReason
       data.disciplineComplaintDocs = dataList.disciplineComplaintDocs
 
-      console.log('list', dataList.persons)
+      console.log('list', data.id)
     })
     .catch((e) => {
       messageError($q, e);
@@ -271,7 +273,7 @@ onMounted(() => {
       </div>
     </div>
 
-    <Form :on-submit="onSubmit" :data="data" />
+    <Form :on-submit="onSubmit" :data="data" :get-data="getData"/>
     <Popup :modal="modalPopup" :close="closePopup" />
   </div>
 </template>

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

@@ -28,7 +28,15 @@ const fileDocDataUpload = ref<File[]>([]);
 /** เรียกใช้ store */
 const mixin = useCounterMixin();
 const complainstStore = useComplainstDataStore();
-const { date2Thai, dialogConfirm, dialogRemove, success } = mixin;
+const {
+  date2Thai,
+  dialogConfirm,
+  dialogRemove,
+  success,
+  messageError,
+  hideLoader,
+  showLoader,
+} = mixin;
 const { selectComplainantTpye, filterSelector } = complainstStore; // function จาก store complainstStore
 
 /** validateForm */
@@ -57,6 +65,10 @@ const props = defineProps({
     type: Function,
     default: () => "",
   },
+  getData: {
+    type: Function,
+    default: () => "",
+  },
 });
 
 const fileListOj = reactive<ArrayFileList>({
@@ -66,6 +78,7 @@ const fileListOj = reactive<ArrayFileList>({
 });
 
 const formData = reactive<FormData>({
+  id: "",
   respondentType: "",
   organizationId: null,
   consideredAgency: "",
@@ -303,12 +316,10 @@ function onSubmit() {
   dialogConfirm(
     $q,
     async () => {
-      if(complainstStore.rowsAdd){
-        formData.persons = complainstStore.rowsAdd
-        props.onSubmit(formData)
-      }else(
-        props.onSubmit(formData)
-      )
+      if (complainstStore.rowsAdd) {
+        formData.persons = complainstStore.rowsAdd;
+        props.onSubmit(formData);
+      } else props.onSubmit(formData);
       // props.onSubmit(formData);
     },
     "ยืนยันการบันทึกข้อมูล",
@@ -341,7 +352,18 @@ function deleteFile(id: string) {
  * @param id id file
  */
 function confirmDelete(id: string) {
-  success($q, `ลบไฟล์สำเร็จ #id:${id}`);
+  showLoader();
+  http
+    .delete(config.API.complaintFileDelete(formData.id, id))
+    .then((res) => {
+      success($q, `ลบไฟล์สำเร็จ`);
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      props.getData();
+    });
 }
 
 /**
@@ -352,7 +374,7 @@ function confirmDelete(id: string) {
 watch(props.data, async () => {
   fileList.value = props.data.disciplineComplaintDocs;
   complainstStore.fetchComplainstAdd(props.data.persons);
-
+  formData.id = props.data.id;
   formData.respondentType = props.data.respondentType;
   formData.organizationId = props.data.organizationId;
   formData.consideredAgency = props.data.consideredAgency;
@@ -365,10 +387,8 @@ watch(props.data, async () => {
   formData.dateNotification = props.data.dateNotification;
   formData.complaintFrom = props.data.complaintFrom;
   formData.appellant = props.data.appellant;
-  formData.documentFile = props.data.documentFile;
   formData.status = props.data.status;
-  formData.persons = complainstStore.rowsAdd
-
+  formData.persons = complainstStore.rowsAdd;
 });
 
 /**
@@ -380,7 +400,27 @@ function handleSave(returnData: any) {
   toggleModal();
 }
 
-async function addPerson(data:any) {
+function upLoadFileDoc() {
+  const Data = new FormData();
+  Data.append("file", formData.documentFile);
+  showLoader();
+  http
+    .put(config.API.complaintFileUpload(formData.id), Data)
+    .then((res) => {
+      console.log(res);
+      success($q, "บันทึกข้อมูลสำเร็จ");
+      router.push(`/discipline/complaints`);
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      hideLoader();
+    });
+  console.log("file", formData.documentFile, formData.id);
+}
+
+async function addPerson(data: any) {
   await complainstStore.fetchComplainstAdd(data);
   toggleModal();
 }
@@ -410,10 +450,7 @@ onMounted(() => {
                 ref="respondentTypeRef"
                 dense
                 outlined
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 label="ผู้ถูกร้องเรียน"
                 option-value="id"
                 option-label="name"
@@ -450,10 +487,7 @@ onMounted(() => {
                 ref="organizationIdRef"
                 dense
                 hide-bottom-space
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 outlined
                 option-label="name"
                 option-value="id"
@@ -478,10 +512,7 @@ onMounted(() => {
                 label="หน่วยงานที่พิจารณา"
                 option-value="id"
                 option-label="name"
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 hide-bottom-space
                 emit-value
                 map-options
@@ -512,10 +543,7 @@ onMounted(() => {
                 >
                   ผู้ถูกร้องเรียน
                   <q-btn
-                    v-if="
-                      formData.status === 'NEW' ||
-                      formData.status === ''
-                    "
+                    v-if="formData.status === 'NEW' || formData.status === ''"
                     size="12px"
                     flat
                     round
@@ -582,10 +610,7 @@ onMounted(() => {
                 ref="titleRef"
                 dense
                 outlined
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 hide-bottom-space
                 v-model="formData.title"
                 :rules="[(val) => !!val || 'กรุณาการข้อมูล']"
@@ -602,10 +627,7 @@ onMounted(() => {
                 ref="descriptionRef"
                 dense
                 outlined
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 hide-bottom-space
                 v-model="formData.description"
                 :rules="[(val) => !!val || 'กรุณาการข้อมูล']"
@@ -623,10 +645,7 @@ onMounted(() => {
                 :locale="'th'"
                 autoApply
                 borderless
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 :enableTimePicker="false"
                 week-start="0"
               >
@@ -643,8 +662,7 @@ onMounted(() => {
                     outlined
                     dense
                     :readonly="
-                      formData.status !== 'NEW' &&
-                      formData.status !== ''
+                      formData.status !== 'NEW' && formData.status !== ''
                     "
                     hide-bottom-space
                     class="full-width datepicker"
@@ -678,10 +696,7 @@ onMounted(() => {
                 ref="levelConsiderationRef"
                 dense
                 outlined
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 v-model="formData.levelConsideration"
                 :options="levelConsiderationtoptions"
                 label="ระดับการพิจารณา"
@@ -702,10 +717,7 @@ onMounted(() => {
                 v-model="formData.dateConsideration"
                 @update:model-value="selectLevel(formData.levelConsideration)"
                 :locale="'th'"
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 autoApply
                 borderless
                 :enableTimePicker="false"
@@ -730,8 +742,7 @@ onMounted(() => {
                         : null
                     "
                     :readonly="
-                      formData.status !== 'NEW' &&
-                      formData.status !== ''
+                      formData.status !== 'NEW' && formData.status !== ''
                     "
                     label="วันที่กำหนดวันพิจารณา"
                     hide-bottom-space
@@ -759,10 +770,7 @@ onMounted(() => {
                 ref="offenseDetailsRef"
                 dense
                 outlined
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 v-model="formData.offenseDetails"
                 :options="offenseDetailstoptions"
                 label="ลักษณะความผิด"
@@ -782,10 +790,7 @@ onMounted(() => {
                 v-model="formData.dateNotification"
                 :locale="'th'"
                 autoApply
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 borderless
                 :enableTimePicker="false"
                 week-start="0"
@@ -803,8 +808,7 @@ onMounted(() => {
                     outlined
                     dense
                     :readonly="
-                      formData.status !== 'NEW' &&
-                      formData.status !== ''
+                      formData.status !== 'NEW' && formData.status !== ''
                     "
                     hide-bottom-space
                     class="full-width datepicker"
@@ -838,10 +842,7 @@ onMounted(() => {
                 for="selectReceivecomplaints"
                 ref="complaintFromRef"
                 dense
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 outlined
                 v-model="formData.complaintFrom"
                 :options="complaintFromtoptions"
@@ -863,10 +864,7 @@ onMounted(() => {
                 dense
                 outlined
                 v-model="formData.appellant"
-                :readonly="
-                  formData.status !== 'NEW' &&
-                  formData.status !== ''
-                "
+                :readonly="formData.status !== 'NEW' && formData.status !== ''"
                 label="ผู้ร้องเรียน"
                 :rules="[(val) => !!val || `${'กรุณากรอกข้อมูล'}`]"
                 lazy-rules
@@ -875,15 +873,29 @@ onMounted(() => {
                 rows="5"
               />
             </div>
+            <div class="col-xs-12 col-sm-12">
+              <q-input
+                for="inputInspectionResults"
+                ref="inputRef"
+                dense
+                outlined
+                hide-bottom-space
+                v-model="formData.rejectReason"
+                :rules="[
+                  (val) => !!val || 'กรุณากรอกผลการตรวจสอบเรื่องร้องเรียน',
+                ]"
+                lazy-rules
+                label="ผลการตรวจสอบเรื่องร้องเรียน"
+                type="textarea"
+                rows="5"
+              />
+            </div>
           </div>
         </div>
         <q-separator />
         <div
           class="row col-12 q-pa-sm"
-          v-if="
-            formData.status === 'NEW' ||
-            formData.status === ''
-          "
+          v-if="formData.status === 'NEW' || formData.status === ''"
         >
           <q-space />
           <q-btn
@@ -899,25 +911,22 @@ onMounted(() => {
     </q-card>
   </div>
 
-  <div class="col-12 q-mt-sm q-mb-lg">
+  <div class="col-12 q-mt-sm q-mb-lg" v-if="props.data">
     <q-card flat bordered>
       <div
         class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md"
       >
-        อัปโหลดไฟล์เอกสารหลักฐาน
+        {{ formData.status === 'NEW'? 'อัปโหลดไฟล์เอกสารหลักฐาน':'ไฟล์เอกสารหลักฐาน'}}
       </div>
       <div class="col-12"><q-separator /></div>
-      <div class="row q-ma-sm q-col-gutter-x-sm">
+      <div class="row q-ma-sm q-col-gutter-x-sm" v-if="formData.status === 'NEW'">
         <div class="col-11" id="documentFile">
           <q-file
             for="inputFiles"
             outlined
             dense
             class="fit"
-            :readonly="
-              formData.status !== 'NEW' &&
-              formData.status !== ''
-            "
+            :readonly="formData.status !== 'NEW' && formData.status !== ''"
             v-model="formData.documentFile"
             @added="fileUploadDoc"
             label="ไฟล์เอกสารหลักฐาน"
@@ -940,6 +949,7 @@ onMounted(() => {
             color="add"
             class="q-ml-sm"
             icon="mdi-upload"
+            @click="upLoadFileDoc()"
             ><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
           >
         </div>

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

@@ -1,4 +1,5 @@
 interface FormData {
+    id:string
     respondentType: string
     consideredAgency: string
     title: string