รายการยื่นคำร้องขอแก้ไขข้อมูล

src/modules/10_registry/components/DialogAddRequestEdit.vue

@@ -1,8 +1,10 @@
 <script setup lang="ts">
-import { reactive, ref } from "vue";
+import { reactive, ref, watch } from "vue";
 import { useQuasar } from "quasar";
 import config from "@/app.config";
 import http from "@/plugins/http";
+import axios from "axios";
+import keycloak from "@/plugins/keycloak";
 
 import DialogHeader from "@/components/DialogHeader.vue";
 
@@ -26,6 +28,7 @@ const props = defineProps({
 });
 
 const isReadOnly = ref<boolean>(false);
+const profileId = ref<string>("");
 const formData = reactive({
   topic: "",
   detail: "",
@@ -40,22 +43,92 @@ function closeDialog() {
   formData.document = null;
 }
 
+/**
+ * function ยืนยันการยื่นคำร้องขอแก้ไขข้อมูล
+ */
 function onSubmit() {
   dialogConfirm(
     $q,
-    async () => {
-      await showLoader();
-      console.log(formData);
-      props.fetchData?.();
-      await success($q, "บันทึกข้อมูลสำเร็จ");
-      await closeDialog();
-      await hideLoader();
+    () => {
+      showLoader();
+      http
+        .post(config.API.requestEdit, {
+          topic: formData.topic,
+          detail: formData.detail,
+          profileId: profileId.value,
+        })
+        .then((res) => {
+          createURLUpload(res.data.result, formData.document);
+        })
+        .catch((err) => {
+          messageError($q, err);
+          hideLoader();
+        });
     },
     "ยืนยันการยื่นคำร้อง",
     "ต้องการยืนยันการยื่นคำร้องนี้ใช่หรือไม่?"
   );
 }
 
+/**
+ * function สร้าง URL อัปโหลไฟล์เอกสารหลักฐาน
+ */
+function createURLUpload(id: string, file: any) {
+  const fileName = { fileName: file.name };
+  http
+    .post(
+      config.API.file(
+        "ระบบทะเบียนประวัติ",
+        "เอกสารหลักฐานคำร้องขอแก้ไขข้อมูล",
+        id
+      ),
+      {
+        replace: false,
+        fileList: fileName,
+      }
+    )
+    .then(async (res) => {
+      const foundKey: string | undefined = Object.keys(res.data).find(
+        (key) =>
+          res.data[key]?.fileName !== undefined &&
+          res.data[key]?.fileName !== ""
+      );
+      foundKey &&
+        uploadFileDoc(res.data[foundKey]?.uploadUrl, formData.document);
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
+
+/**
+ * function สำหรับอัพโหลดไฟล์เอกสารหลักฐาน
+ */
+function uploadFileDoc(uploadUrl: string, file: any) {
+  showLoader();
+  axios
+    .put(uploadUrl, file, {
+      headers: {
+        "Content-Type": file.type,
+      },
+    })
+    .then(async (res) => {
+      await props.fetchData?.();
+      await success($q, "บันทึกข้อมูลสำเร็จ");
+      closeDialog();
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
+/**
+ * class input
+ * @param val
+ */
 function classInput(val: boolean) {
   return {
     "full-width cursor-pointer ": val,
@@ -63,6 +136,11 @@ function classInput(val: boolean) {
   };
 }
 
+/**
+ * function ค้นหาข้อมูลใน select
+ * @param val คำค้นหา
+ * @param update Function
+ */
 function filterOption(val: string, update: Function) {
   update(() => {
     topicOption.value = store.optionTopic.filter(
@@ -70,6 +148,31 @@ function filterOption(val: string, update: Function) {
     );
   });
 }
+
+/**
+ * function fetch profileId
+ */
+function fetchProfile() {
+  showLoader();
+  http
+    .get(config.API.profilePosition())
+    .then((res) => {
+      const data = res.data.result;
+      profileId.value = data.profileId;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+watch(
+  () => modal.value,
+  () => {
+    modal.value && fetchProfile();
+  }
+);
 </script>
 
 <template>
@@ -130,6 +233,7 @@ function filterOption(val: string, update: Function) {
                 dense
                 outlined
                 hide-bottom-space
+                :rules="[(val:any) => !!val || `${'กรุณาเลือกไฟล์'}`]"
               />
             </div>
           </div>