ต่อ api รายละเอียดการประเมินของ

This commit is contained in:
setthawutttty 2023-12-22 18:20:49 +07:00
parent cab89c78f3
commit 4521f80918
17 changed files with 1226 additions and 191 deletions

View file

@ -1,21 +1,31 @@
<script setup lang="ts">
import { ref } from "vue";
import { ref, onMounted } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import keycloak from "@/plugins/keycloak";
import axios from "axios";
import http from "@/plugins/http";
import config from "@/app.config";
import { useRouter, useRoute } from "vue-router";
import genReport from "@/plugins/genreport";
const modalView = ref<boolean>(false);
const fullName = ref<string>(
keycloak.tokenParsed ? keycloak.tokenParsed.name!.toString() : ""
);
const router = useRouter();
const route = useRoute();
const numOfPages = ref<number>(0);
const page = ref<number>(1);
const $q = useQuasar();
const mixin = useCounterMixin();
const { date2Thai, showLoader, hideLoader, messageError, success } = mixin;
const AnnouncementDate = ref<string | null>(date2Thai(new Date()));
const AnnouncementStartDate = ref<string | null>();
const AnnouncementEndDate = ref<string | null>();
const id = ref<string>(route.params.id as string);
const pdfSrc = ref<any>();
const fileEvaluation5 = ref<any>();
const status = ref<string>("ANNOUNCE_WEB");
const website = ref<string>("https://bma-ehr.frappet.com/");
@ -24,17 +34,17 @@ const files = [
{
id: "file1",
fileName: "แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)",
pathName: "12",
pathName: "5-แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)",
},
{
id: "file2",
fileName: "ประกาศผลการคัดเลือกบุคคล (เอกสารหมายเลข 10)",
pathName: "12",
pathName: "10-ประกาศผลการคัดเลือกบุคคล (เอกสารหมายเลข 10)",
},
{
id: "file3",
fileName: "เอกสารแสดงผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)",
pathName: "12",
fileName: "ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)",
pathName: "6-ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)",
},
];
@ -106,19 +116,113 @@ function fileUpLoad(url: string) {
});
}
function copyLink(link: string) {
navigator.clipboard
.writeText(link)
.then(() => {
console.log(`Copied link for file: ${link}`);
function getFileName(fileName: string) {
if (fileName && fileName.lastIndexOf(".") !== -1) {
const index = fileName.indexOf("(");
if (index !== -1) {
return fileName.substring(0, index).trim();
} else {
//
return fileName.split(".").slice(0, -1).join(".");
}
} else {
//
return fileName;
}
}
/** ไปหน้าต่อไปของรายงาน */
function nextPage() {
if (page.value < numOfPages.value) {
page.value++;
}
}
/** กลับหน้าก่อนหน้าของรายงาน */
function backPage() {
if (page.value !== 1) {
page.value--;
}
}
function copyLink(name: string) {
console.log(name);
showLoader();
http
.get(config.API.evaluationFilebyId("เล่ม 1", id.value, name))
.then((res) => {
console.log(res.data);
const link = res.data.downloadUrl;
navigator.clipboard.writeText(link);
})
.catch((e) => {})
.finally(() => {
success($q, "คัดลอก URL สำเร็จ");
hideLoader();
});
}
function getDate() {
showLoader();
http
.get(config.API.evaluationDateAnnounce(id.value))
.then((res) => {
const data = res.data.result;
AnnouncementStartDate.value = date2Thai(data.dateStartAnnounce);
const endDate = new Date(data.dateEndAnnounce);
endDate.setDate(endDate.getDate() + 30);
AnnouncementEndDate.value = date2Thai(endDate);
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
success($q, "คัดลอกสำเร็จ");
hideLoader();
});
}
// function linkCopy(link: string) {
// navigator.clipboard
// .writeText(link)
// .then(() => {
// console.log(`Copied link for file: ${link}`);
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// success($q, "");
// });
// }
async function onClickDowloadFile(
tp: string,
templateName: string,
fileName: string
) {
showLoader();
const data = Object.assign(
{ fullName: fullName.value },
tp === "EV1_005" || tp === "EV1_007" ? { organizationName: "-" } : null,
tp === "EV1_007" ? { positionName: "-" } : null,
tp === "EV1_007" ? { positionLeaveName: "-" } : null
);
const body = {
template: tp,
reportName: templateName,
data: data,
};
console.log(body);
await genReport(body, fileName);
}
function onClickViewPDF(file: any) {
// pdfSrc.value = file.webkitRelativePath;
modalView.value = true;
}
onMounted(() => {
getDate();
});
</script>
<template>
@ -127,7 +231,8 @@ function copyLink(link: string) {
<q-banner class="text-weight-bold text-red-14 bg-red-2 text-center">
<div class="text-weight-bold">
<q-icon name="info_outline" color="red-14" size="24px" />
ประกาศเมอวนท {{ AnnouncementDate }}
ประกาศเมอวนท {{ AnnouncementStartDate }} งวนท
{{ AnnouncementEndDate }}
</div>
</q-banner>
</div>
@ -156,7 +261,7 @@ function copyLink(link: string) {
round
color="primary"
icon="mdi-clipboard-outline"
@click="copyLink(file.fileName)"
@click="copyLink(file.pathName)"
>
<q-tooltip>ดลอกลงค</q-tooltip>
</q-btn>
@ -168,6 +273,80 @@ function copyLink(link: string) {
</q-card>
</div>
<div class="col-12">
<q-card bordered style="border: 1px solid #d6dee1">
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
นทกแจงผลการประกาศคดเลอก
</div>
<div class="col-12"><q-separator /></div>
<div class="row">
<div class="col-12 q-pa-sm">
<div class="row q-col-gutter-md col-12">
<!-- <div class="col-xs-12 col-sm-6 row">
<q-btn
class="col-12"
outline
icon="download"
label="ดาวน์โหลดต้นแบบ"
color="primary"
@click="
onClickDowloadFile(
'EV1_005',
'template-1',
'แบบพิจารณาคุณสมบัติบุคคล'
)
"
>
<q-tooltip> ดาวนโหลดตนแบบ </q-tooltip></q-btn
>
</div>
<div class="col-xs-12 col-sm-6 row">
<q-btn
v-if="fileEvaluation5"
class="col-12"
outline
icon="visibility"
label="ดูไฟล์เอกสาร"
color="primary"
@click="onClickViewPDF(fileEvaluation5)"
>
<q-tooltip> ไฟลเอกสาร </q-tooltip></q-btn
>
</div> -->
<div class="col-xs-12 col-sm-10 row">
<q-file
ref="fileEvaluation1Ref"
v-model="fileEvaluation5"
class="col-12"
outlined
dense
label="อัปโหลดไฟล์"
hide-bottom-space
lazy-rules
accept=".pdf"
>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
</div>
<div class="col-2 self-center text-center q-pl-none">
<q-btn
flat
round
dense
color="primary"
icon="mdi-upload"
@click="upLoadFile"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
</div>
</div>
</div>
</div>
</q-card>
</div>
<!-- <div class="col-12">
<q-card bordered style="border: 1px solid #d6dee1">
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
นทกแจงผลการประกาศคดเลอก
@ -251,7 +430,7 @@ function copyLink(link: string) {
</div>
</div>
</q-card>
</div>
</div> -->
<div class="col-12">
<div class="q-mt-xs q-gutter-md" align="right">
<q-btn
@ -263,6 +442,93 @@ function copyLink(link: string) {
</div>
</div>
</div>
<q-dialog
v-model="modalView"
persistent
:maximized="true"
transition-show="slide-up"
transition-hide="slide-down"
>
<q-card class="bg-white">
<div class="flex justify-end items-center align-center q-mr-md q-mt-sm">
<q-btn
icon="close"
unelevated
round
dense
style="color: #ff8080; background-color: #ffdede"
size="12px"
v-close-popup
/>
</div>
<div class="q-pa-md">
<div class="row items-start items-center">
<div class="col">
<q-btn
padding="xs"
icon="mdi-chevron-left"
color="grey-2"
text-color="grey-5"
size="md"
class="my-auto"
@click="backPage"
:disable="page == 1"
/>
</div>
<div class="col-12 col-md-auto">
<div class="q-pa-md flex">
หนาท {{ page }} จาก {{ numOfPages }}
</div>
</div>
<div class="col text-right">
<q-btn
padding="xs"
icon="mdi-chevron-right"
color="grey-2"
text-color="grey-5"
size="md"
@click="nextPage"
:disable="page === numOfPages"
/>
</div>
</div>
<div class="row items- items-center">
<VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent />
</div>
<div class="row items- items-end">
<div class="col">
<q-btn
padding="xs"
icon="mdi-chevron-left"
color="grey-2"
text-color="grey-5"
size="md"
class="my-auto"
@click="backPage"
:disable="page == 1"
/>
</div>
<div class="col-12 col-md-auto">
<div class="q-pa-md flex">
หนาท {{ page }} จาก {{ numOfPages }}
</div>
</div>
<div class="col text-right">
<q-btn
padding="xs"
icon="mdi-chevron-right"
color="grey-2"
text-color="grey-5"
size="md"
@click="nextPage"
:disable="page === numOfPages"
/>
</div>
</div>
</div>
</q-card>
</q-dialog>
</template>
<style scoped></style>