ปรับ UI

src/modules/12_evaluatePersonal/components/Detail/step/step4.vue

@@ -7,9 +7,10 @@ import config from "@/app.config";
 import keycloak from "@/plugins/keycloak";
 import { useCounterMixin } from "@/stores/mixin";
 import genReport from "@/plugins/genreport";
-
+import { useQuasar } from "quasar";
+const $q = useQuasar();
 const mixin = useCounterMixin();
-const { date2Thai, showLoader, hideLoader, messageError } = mixin;
+const { date2Thai, showLoader, hideLoader, messageError,success } = mixin;
 
 const router = useRouter();
 const route = useRoute();
@@ -144,6 +145,46 @@ function onWebSite() {}
 //       hideLoader();
 //     });
 // }
+
+function upLoadFile() {
+  showLoader();
+  http
+    .post(config.API.evaluationFileListbyId("เล่ม 1", id.value), {
+      fileList: {
+        fileName: "4-แบบประเมินคุณลักษณะบุคคล",
+        metadata: {
+          tag: "value",
+        },
+      },
+    })
+    .then((res) => {
+      const foundKey: any = Object.keys(res.data).find(
+        (key) =>
+          res.data[key]?.fileName !== undefined &&
+          res.data[key]?.fileName !== ""
+      );
+      const link = res.data[foundKey]?.uploadUrl;
+      fileUpLoad(link);
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
+function fileUpLoad(url: string) {
+  axios.put(url, fileEvaluationUpload.value, {
+    headers: { "Content-Type": fileEvaluationUpload.value?.type },
+    onUploadProgress: (e) => console.log(e),
+  }).catch((e)=>{
+    messageError($q,e)
+  }).finally(()=>{
+    fileEvaluationUpload.value = null
+    success($q, "อัปโหลดไฟล์สำเร็จ");
+  })
+}
 </script>
 
 <template>
@@ -240,7 +281,13 @@ function onWebSite() {}
                 </q-file>
               </div>
               <div class="col-1 self-center text-center q-pl-none">
-                <q-btn flat round dense color="primary" icon="mdi-upload"
+                <q-btn
+                  flat
+                  round
+                  dense
+                  color="primary"
+                  icon="mdi-upload "
+                  @click="upLoadFile"
                   ><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
                 >
               </div>