12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152 |
- <script setup>
- import { ref, watch } from "vue";
- import { useMainStore } from "@/stores/store";
- const store = useMainStore();
- let pdfIframe = ref(null);
- let pdfUrl = ref(null);
- const props = defineProps({
- file: {
- type: String,
- },
- });
- watch(
- () => props.file,
- (name) => {
- setPDFUrl(name);
- }
- );
- function setPDFUrl(pdf) {
- console.log('pdf',pdf);
- // let url = `${store.imgUrl}/pdf/${name}.pdf`;
- let json = pdf.replace(/'/g, '"');
- let file = JSON.parse(json);
- let url = file.file1;
- // 更新 iframe 的 src
- if (pdfIframe.value) {
- pdfIframe.value.src = url;
- } else {
- pdfUrl.value = url;
- }
- }
- </script>
- <template>
- <div class="pt-16" v-if="!store.isMobile">
- <iframe
- ref="pdfIframe"
- src="https://craftsplatform.ntcri.gov.tw/pdf/Re_Ceramic.pdf"
- width="100%"
- height="700px"
- frameborder="0"
- border="0"
- cellspacing="0"
- ></iframe>
- </div>
- </template>
- <style lang="scss" scoped></style>
|