hrms-user/src/modules/06_evaluate/components/viewstep/viewStep7.vue
2024-01-18 10:34:27 +07:00

62 lines
1.5 KiB
Vue

<script setup lang="ts">
import { ref } from "vue";
import DialogHeader from "@/components/DialogHeader.vue";
import ViewPDF from "@/modules/06_evaluate/components/viewstep/viewPDF.vue";
const props = defineProps({
pdfSrc: {
type: String,
},
urlDownloadFile: {
type: String,
},
});
const modalPerview = ref<boolean>(false);
</script>
<template>
<q-card bordered class="col-12 row shadow-0" >
<div class="col-12 row items-center q-pa-sm ">
<div class="q-pl-sm text-weight-medium" >เอกสารทปโหลด</div>
<q-space />
<q-btn
flat
color="primary"
icon="download"
target="_blank"
dense
:href="props.urlDownloadFile"
>
<q-tooltip>ดาวนโหลด</q-tooltip>
</q-btn>
<q-btn
flat
color="primary"
icon="mdi-fullscreen"
dense
class="q-ml-sm"
@click="modalPerview = true"
><q-tooltip>เตมจอ</q-tooltip></q-btn
>
</div>
<div class="col-12"><q-separator /></div>
<div class="row col-12">
<ViewPDF :pdfSrc="props.pdfSrc" class="col-12" />
</div>
</q-card>
<q-dialog v-model="modalPerview" full-width fullHeight>
<q-card>
<q-card-section>
<DialogHeader :close="() => (modalPerview = false)" />
</q-card-section>
<q-card-section class="q-pt-none">
<ViewPDF :pdfSrc="props.pdfSrc" :type="'popup'" />
</q-card-section>
</q-card>
</q-dialog>
</template>
<style scoped></style>