ปรับ Code ประเมืน
This commit is contained in:
parent
f9c4bb3b80
commit
5b2be2af2b
24 changed files with 603 additions and 1398 deletions
|
|
@ -1,16 +1,13 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, reactive, onMounted } from "vue";
|
||||
import keycloak from "@/plugins/keycloak";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useRoute } from "vue-router";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import genReport from "@/plugins/genreport";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import type { FormCommand } from "@/modules/12_evaluatePersonal/interface/index/evalute";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const id = ref<string>(route.params.id as string);
|
||||
const $q = useQuasar();
|
||||
|
|
@ -18,92 +15,20 @@ const $q = useQuasar();
|
|||
const mixin = useCounterMixin();
|
||||
const { showLoader, hideLoader, messageError } = mixin;
|
||||
|
||||
const fullName = ref<string>(
|
||||
keycloak.tokenParsed ? keycloak.tokenParsed.name!.toString() : ""
|
||||
);
|
||||
|
||||
const emit = defineEmits(["update:form"]);
|
||||
|
||||
/** ฟรอมจัดเตรียมเอกสารเล่ม 1*/
|
||||
const author = ref<string>("");
|
||||
const subject = ref<string>("");
|
||||
const formCommand = reactive<FormCommand>({
|
||||
elementaryFullName: "",
|
||||
elementaryPosition: "",
|
||||
abovelevelFullname: "",
|
||||
abovelevelPosition: "",
|
||||
});
|
||||
const author = ref<string>("");
|
||||
const subject = ref<string>("");
|
||||
|
||||
const elementaryFullNameRef = ref<object | null>(null);
|
||||
const elementaryPositonRef = ref<object | null>(null);
|
||||
const abovelevelFullnameRef = ref<object | null>(null);
|
||||
const abovelevelPositionRef = ref<object | null>(null);
|
||||
|
||||
const updateInput = (value: any) => {
|
||||
const ref = {
|
||||
elementaryFullNameRef: elementaryFullNameRef.value,
|
||||
elementaryPositonRef: elementaryPositonRef.value,
|
||||
abovelevelFullnameRef: abovelevelFullnameRef.value,
|
||||
abovelevelPositionRef: abovelevelPositionRef.value,
|
||||
};
|
||||
emit("update:form", value, ref);
|
||||
};
|
||||
|
||||
const fileEvaluation1 = ref<any>();
|
||||
const fileEvaluation2 = ref<any>();
|
||||
const fileEvaluation3 = ref<any>();
|
||||
const fileEvaluation4 = ref<any>();
|
||||
const fileEvaluation5 = ref<any>();
|
||||
const fileEvaluation6 = ref<any>();
|
||||
|
||||
const modalView = ref<boolean>(false);
|
||||
const numOfPages = ref<number>(0);
|
||||
const page = ref<number>(1);
|
||||
const pdfSrc = ref<any>();
|
||||
|
||||
function onClickViewPDF(file: any) {
|
||||
pdfSrc.value = file.webkitRelativePath;
|
||||
modalView.value = true;
|
||||
}
|
||||
|
||||
/** ไปหน้าต่อไปของรายงาน */
|
||||
function nextPage() {
|
||||
if (page.value < numOfPages.value) {
|
||||
page.value++;
|
||||
}
|
||||
}
|
||||
|
||||
/** กลับหน้าก่อนหน้าของรายงาน */
|
||||
function backPage() {
|
||||
if (page.value !== 1) {
|
||||
page.value--;
|
||||
}
|
||||
}
|
||||
|
||||
async function onClickDowloadFile(
|
||||
tp: string,
|
||||
templateName: string,
|
||||
fileName: string
|
||||
) {
|
||||
/** function เรียกข้อมลผลงาน*/
|
||||
async function fetchSigner() {
|
||||
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,
|
||||
};
|
||||
await genReport(body, fileName);
|
||||
}
|
||||
|
||||
function getSigner() {
|
||||
showLoader();
|
||||
http
|
||||
await http
|
||||
.get(config.API.evaluationSigner(id.value, 1))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
|
|
@ -126,416 +51,14 @@ function getSigner() {
|
|||
hideLoader();
|
||||
});
|
||||
}
|
||||
onMounted(() => {
|
||||
getSigner();
|
||||
const ref = {
|
||||
elementaryFullNameRef: elementaryFullNameRef.value,
|
||||
elementaryPositonRef: elementaryPositonRef.value,
|
||||
abovelevelFullnameRef: abovelevelFullnameRef.value,
|
||||
abovelevelPositionRef: abovelevelPositionRef.value,
|
||||
};
|
||||
emit("update:form", formCommand, ref);
|
||||
onMounted(async () => {
|
||||
await fetchSigner();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row q-col-gutter-md">
|
||||
<!-- แบบพิจารณาคุณสมบัติบุคคล -->
|
||||
<!-- <div class="col-6">
|
||||
<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="fileEvaluation1"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
@click="onClickViewPDF(fileEvaluation1)"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-10 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation1"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
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"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div> -->
|
||||
|
||||
<!-- แบบแสดงรายละเอียดการเสนอผลงาน -->
|
||||
<!-- <div class="col-6">
|
||||
<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_006',
|
||||
'template-2',
|
||||
'แบบแสดงรายละเอียดการเสนอผลงาน'
|
||||
)
|
||||
"
|
||||
>
|
||||
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
v-if="fileEvaluation2"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-10 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation2"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
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"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div> -->
|
||||
|
||||
<!-- แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล -->
|
||||
<!-- <div class="col-6">
|
||||
<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_007',
|
||||
'template-3',
|
||||
'แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล'
|
||||
)
|
||||
"
|
||||
>
|
||||
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
v-if="fileEvaluation3"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-10 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation3"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
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"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div> -->
|
||||
|
||||
<!-- แบบประเมินคุณลักษณะบุคคล -->
|
||||
<!-- <div class="col-6">
|
||||
<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_008',
|
||||
'template-4',
|
||||
'แบบประเมินคุณลักษณะบุคคล'
|
||||
)
|
||||
"
|
||||
>
|
||||
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
v-if="fileEvaluation4"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-10 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation4"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
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"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div> -->
|
||||
|
||||
<!-- แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก -->
|
||||
<!-- <div class="col-6">
|
||||
<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_009',
|
||||
'template-5',
|
||||
'แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก'
|
||||
)
|
||||
"
|
||||
>
|
||||
<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"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-10 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation5"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
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"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div> -->
|
||||
|
||||
<!--ผลงานที่จะส่งประเมิน -->
|
||||
<!-- <div class="col-6">
|
||||
<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_010',
|
||||
'template-6',
|
||||
'ผลงานที่จะส่งประเมิน'
|
||||
)
|
||||
"
|
||||
>
|
||||
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
v-if="fileEvaluation6"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-10 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation6"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
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"
|
||||
><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">ผลงาน</div>
|
||||
|
|
@ -551,7 +74,6 @@ onMounted(() => {
|
|||
outlined
|
||||
label="ชื่อผลงาน"
|
||||
v-model="subject"
|
||||
@update:model-value="updateInput(formCommand)"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกชื่อผลงาน'}`]"
|
||||
lazy-rules
|
||||
/>
|
||||
|
|
@ -561,7 +83,6 @@ onMounted(() => {
|
|||
dense
|
||||
outlined
|
||||
v-model="author"
|
||||
@update:model-value="updateInput(formCommand)"
|
||||
label="เจ้าของผลงาน"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกเจ้าของผลงาน'}`]"
|
||||
lazy-rules
|
||||
|
|
@ -597,7 +118,6 @@ onMounted(() => {
|
|||
outlined
|
||||
label="ชื่อ-นามสกุล"
|
||||
v-model="formCommand.elementaryFullName"
|
||||
@update:model-value="updateInput(formCommand)"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกชื่อ-นามสกุล'}`]"
|
||||
lazy-rules
|
||||
/>
|
||||
|
|
@ -608,7 +128,6 @@ onMounted(() => {
|
|||
dense
|
||||
outlined
|
||||
v-model="formCommand.elementaryPosition"
|
||||
@update:model-value="updateInput(formCommand)"
|
||||
label="ตำแหน่ง"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
|
||||
lazy-rules
|
||||
|
|
@ -633,7 +152,6 @@ onMounted(() => {
|
|||
label="ชื่อ-นามสกุล"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกชื่อ-นามสกุล'}`]"
|
||||
lazy-rules
|
||||
@update:model-value="updateInput(formCommand)"
|
||||
/>
|
||||
<q-input
|
||||
ref="abovelevelPositionRef"
|
||||
|
|
@ -645,7 +163,6 @@ onMounted(() => {
|
|||
label="ตำแหน่ง"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
|
||||
lazy-rules
|
||||
@update:model-value="updateInput(formCommand)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -655,94 +172,6 @@ onMounted(() => {
|
|||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Dialog Full Screen -->
|
||||
<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>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue