335 lines
9.3 KiB
Vue
335 lines
9.3 KiB
Vue
<script setup lang="ts">
|
|
import { ref, onMounted } from "vue";
|
|
import { is, useQuasar } from "quasar";
|
|
import axios from "axios";
|
|
|
|
import http from "@/plugins/http";
|
|
import config from "@/app.config";
|
|
import genReport from "@/plugins/genreport";
|
|
import { useRoute } from "vue-router";
|
|
import { useCounterMixin } from "@/stores/mixin";
|
|
import { useEvaluateStore } from "@/modules/06_evaluate/store";
|
|
|
|
const $q = useQuasar();
|
|
const route = useRoute();
|
|
const store = useEvaluateStore();
|
|
const { showLoader, hideLoader, messageError, success } = useCounterMixin();
|
|
|
|
const formTemplates = ref<any[]>([
|
|
{
|
|
code: "EV1_005",
|
|
templateName: "template-1",
|
|
title: "แบบพิจารณาคุณสมบัติบุคคล (ฉบับแก้ไข)",
|
|
fileName: "1-แบบพิจารณาคุณสมบัติบุคคล (ฉบับแก้ไข)",
|
|
downloadFile: "",
|
|
file: null,
|
|
isLoading: false,
|
|
},
|
|
{
|
|
code: "EV1_006",
|
|
templateName: "template-2",
|
|
title: "แบบแสดงรายละเอียดการเสนอผลงาน (ฉบับแก้ไข)",
|
|
fileName: "2-แบบแสดงรายละเอียดการเสนอผลงาน (ฉบับแก้ไข)",
|
|
downloadFile: "",
|
|
file: null,
|
|
isLoading: false,
|
|
},
|
|
{
|
|
code: "EV1_008",
|
|
templateName: "template-4",
|
|
title: "แบบประเมินคุณลักษณะบุคคล (ฉบับแก้ไข)",
|
|
fileName: "4-แบบประเมินคุณลักษณะบุคคล (ฉบับแก้ไข)",
|
|
downloadFile: "",
|
|
file: null,
|
|
isLoading: false,
|
|
},
|
|
{
|
|
code: "EV1_010",
|
|
templateName: "template-6",
|
|
title: "ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11) (ฉบับแก้ไข)",
|
|
fileName: "6-ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11) (ฉบับแก้ไข)",
|
|
downloadFile: "",
|
|
file: null,
|
|
isLoading: false,
|
|
},
|
|
]);
|
|
|
|
const evaluateId = ref<string>(route.params.id.toString());
|
|
const status = ref<string>("WAIT_CHECK_DOC_V1");
|
|
|
|
const profile = ref<any>();
|
|
const author = ref<string>("");
|
|
const subject = ref<string>("");
|
|
|
|
/**
|
|
* function
|
|
* @param id evaluate ID
|
|
*/
|
|
async function fetchCheckSpec(id: string) {
|
|
await http
|
|
.get(config.API.evaluationReportCheckspecByid(id))
|
|
.then((res) => {
|
|
const data = res.data.result;
|
|
profile.value = data;
|
|
})
|
|
.catch((err) => {
|
|
messageError($q, err);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* function fecth รายชื่อผู้เซ็นเอกสาร
|
|
* @param id evaluate ID
|
|
*/
|
|
function fetcheSigner(id: string) {
|
|
http
|
|
.get(config.API.evaluationSignerDoc1(id))
|
|
.then((res) => {
|
|
const data = res.data.result;
|
|
author.value = data.author;
|
|
subject.value = data.subject;
|
|
})
|
|
.catch((err) => {
|
|
messageError($q, err);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* funcion ดาวน์โหลดไฟล์
|
|
* @param tp templatname
|
|
* @param templateName
|
|
* @param fileName ชือ่ไฟล์
|
|
*/
|
|
async function onClickDowloadFile(
|
|
tp: string,
|
|
templateName: string,
|
|
fileName: string
|
|
) {
|
|
showLoader();
|
|
const body = {
|
|
template: tp,
|
|
reportName: templateName,
|
|
data: profile.value,
|
|
};
|
|
await genReport(body, fileName); //สร้างไฟล์ต้นแบบ
|
|
hideLoader();
|
|
}
|
|
|
|
/**
|
|
* function fetch ลิงก์อัปโหลดไฟล์
|
|
* @param volume เล่ม
|
|
* @param id evaluate ID
|
|
* @param type ประเภทไฟล์
|
|
* @param file ไฟล์
|
|
*/
|
|
async function fetchPathUpload(
|
|
volume: string,
|
|
id: string | undefined,
|
|
type: string,
|
|
file: any
|
|
) {
|
|
const body = {
|
|
fileList: {
|
|
fileName: type,
|
|
metadata: {
|
|
subject: subject.value,
|
|
author: author.value,
|
|
},
|
|
},
|
|
};
|
|
|
|
if (id && file) {
|
|
showLoader();
|
|
await http
|
|
.post(config.API.loadPathDocument(volume, id), body)
|
|
.then(async (res) => {
|
|
const foundKey: string | undefined = Object.keys(res.data).find(
|
|
(key) =>
|
|
res.data[key]?.fileName !== undefined &&
|
|
res.data[key]?.fileName !== ""
|
|
);
|
|
foundKey && (await uploadfile(res.data[foundKey]?.uploadUrl, file));
|
|
await downloadFile(type);
|
|
})
|
|
.catch((err) => {
|
|
messageError($q, err);
|
|
})
|
|
.finally(() => {
|
|
hideLoader();
|
|
});
|
|
}
|
|
}
|
|
|
|
/**
|
|
* functoin อัปโหลดไฟล์
|
|
* @param uploadUrl link อัปโหลด
|
|
* @param file ไฟล์
|
|
*/
|
|
async function uploadfile(uploadUrl: string, file: any) {
|
|
await axios
|
|
.put(uploadUrl, file, {
|
|
headers: {
|
|
"Content-Type": file.type,
|
|
},
|
|
})
|
|
.then(() => {
|
|
success($q, "อัปโหลไฟล์สำเร็จ");
|
|
})
|
|
.catch((err) => {
|
|
messageError($q, err);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* function ดาวน์โหลดไฟล์
|
|
* @param fileName ชื่อไฟล์
|
|
*/
|
|
async function downloadFile(fileName: string) {
|
|
const loadingKey = formTemplates.value.findIndex(
|
|
(item) => item.fileName === fileName
|
|
);
|
|
formTemplates.value[loadingKey].isLoading = true;
|
|
await http
|
|
.get(config.API.loadFileDocument("เล่ม 1", evaluateId.value, fileName))
|
|
.then((res) => {
|
|
const index = formTemplates.value.findIndex(
|
|
(item) => item.fileName === fileName
|
|
);
|
|
if (index !== -1) {
|
|
formTemplates.value[index].downloadFile = res.data.downloadUrl;
|
|
}
|
|
})
|
|
.finally(() => {
|
|
formTemplates.value[loadingKey].isLoading = false;
|
|
});
|
|
}
|
|
|
|
/**lifecycle Hooks*/
|
|
onMounted(async () => {
|
|
try {
|
|
await Promise.all([
|
|
fetcheSigner(evaluateId.value),
|
|
fetchCheckSpec(evaluateId.value),
|
|
formTemplates.value.forEach((e) => {
|
|
downloadFile(e.fileName);
|
|
}),
|
|
]);
|
|
} catch (error) {
|
|
console.log(error);
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="col-12 row q-pa-md justify-center">
|
|
<q-badge
|
|
v-if="status == 'WAIT_CHECK_DOC_V1'"
|
|
outline
|
|
color="orange-5"
|
|
label="รอตรวจสอบคุณสมบัติ"
|
|
class="q-pa-sm"
|
|
style="font-size: 16px"
|
|
/>
|
|
</div>
|
|
|
|
<div class="row q-col-gutter-sm q-pa-sm">
|
|
<div class="col-6" v-for="(item, index) in formTemplates" :key="index">
|
|
<q-skeleton
|
|
type="Qcard"
|
|
:height="store.currentStep !== 4 ? '50px' : '100px'"
|
|
v-if="item.isLoading"
|
|
/>
|
|
<q-card
|
|
v-else
|
|
bordered
|
|
class="cardSp1"
|
|
v-if="
|
|
(store.currentStep !== 4 &&
|
|
formTemplates.some((e) => e.downloadFile !== '')) ||
|
|
store.currentStep == 4
|
|
"
|
|
>
|
|
<div
|
|
class="text-weight-medium bg-grey-1 q-py-sm q-pl-md q-pr-sm col-12 row items-center"
|
|
>
|
|
<div>{{ item.title }}</div>
|
|
<q-space />
|
|
<!-- <div>
|
|
<q-btn
|
|
flat
|
|
dense
|
|
icon="download"
|
|
color="indigo"
|
|
@click="
|
|
onClickDowloadFile(item.code, item.templateName, item.title)
|
|
"
|
|
>
|
|
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
|
>
|
|
</div> -->
|
|
<div>
|
|
<q-btn
|
|
v-if="item.downloadFile != ''"
|
|
:href="item.downloadFile"
|
|
target="_blank"
|
|
class="q-ml-sm"
|
|
color="blue"
|
|
flat
|
|
dense
|
|
icon="visibility"
|
|
>
|
|
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="col-12"><q-separator /></div>
|
|
<div class="row" v-if="store.currentStep === 4">
|
|
<div class="col-12 q-pa-sm">
|
|
<div class="row q-col-gutter-md col-12">
|
|
<q-file
|
|
v-model="item.file"
|
|
class="col-xs-12 col-sm-12"
|
|
label="อัปโหลดไฟล์"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
hide-bottom-space
|
|
accept=".pdf"
|
|
:rules="
|
|
item.downloadFile === ''
|
|
? [(val:any) => !!val || 'กรุณาเลือกไฟล์']
|
|
: []
|
|
"
|
|
>
|
|
<template v-slot:prepend>
|
|
<q-icon name="attach_file" />
|
|
</template>
|
|
<template v-slot:after>
|
|
<q-btn
|
|
:disable="!item.file"
|
|
flat
|
|
round
|
|
dense
|
|
color="primary"
|
|
icon="mdi-upload"
|
|
@click="
|
|
fetchPathUpload(
|
|
'เล่ม 1',
|
|
evaluateId,
|
|
item.fileName,
|
|
item.file
|
|
)
|
|
"
|
|
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
|
>
|
|
</template>
|
|
</q-file>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</q-card>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped></style>
|