|
@@ -1,30 +1,13 @@
|
|
|
<template>
|
|
|
<div class="container_all">
|
|
|
- <div
|
|
|
- v-if="loadedPages > 0"
|
|
|
- class="container_public"
|
|
|
- :style="{ transform: `scale(${scale})` }"
|
|
|
- >
|
|
|
- <!-- @page-loaded="onPageLoaded" -->
|
|
|
+ <div class="container_public" :style="{ transform: `scale(${scale})` }">
|
|
|
<div v-for="pageNumber in loadedPages" :key="pageNumber">
|
|
|
<vue-pdf
|
|
|
- class="container_pdf"
|
|
|
- :src="{
|
|
|
- url: fileUrl,
|
|
|
- cMapUrl: 'https://cdn.jsdelivr.net/npm/pdfjs-dist@2.9.359/cmaps/',
|
|
|
- cMapPacked: true,
|
|
|
- }"
|
|
|
- :page="pageNumber"
|
|
|
- ></vue-pdf>
|
|
|
- <!-- <vue-pdf
|
|
|
v-if="pageNumber < 3"
|
|
|
class="container_pdf"
|
|
|
- :src="{
|
|
|
- url: fileUrl,
|
|
|
- cMapUrl: 'https://cdn.jsdelivr.net/npm/pdfjs-dist@2.9.359/cmaps/',
|
|
|
- cMapPacked: true,
|
|
|
- }"
|
|
|
+ :src="fileUrl"
|
|
|
:page="pageNumber"
|
|
|
+ @page-loaded="onPageLoaded"
|
|
|
></vue-pdf>
|
|
|
<vue-pdf
|
|
|
v-else
|
|
@@ -35,7 +18,8 @@
|
|
|
cMapPacked: true,
|
|
|
}"
|
|
|
:page="pageNumber"
|
|
|
- ></vue-pdf> -->
|
|
|
+ @page-loaded="onPageLoaded"
|
|
|
+ ></vue-pdf>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
@@ -78,7 +62,7 @@ export default {
|
|
|
currentPage: 1,
|
|
|
numPages: 0,
|
|
|
scale: 1,
|
|
|
- loadedPages: 0,
|
|
|
+ loadedPages: 1,
|
|
|
};
|
|
|
},
|
|
|
|
|
@@ -105,7 +89,6 @@ export default {
|
|
|
// this.loadedPages += 1; // 加载下一页
|
|
|
// }
|
|
|
},
|
|
|
-
|
|
|
///接口获取数据
|
|
|
getDetail() {
|
|
|
var that = this;
|
|
@@ -114,25 +97,24 @@ export default {
|
|
|
detail(id).then((res) => {
|
|
|
if (res.code === 0) {
|
|
|
that.name = res.data.name;
|
|
|
- var fileUrl = res.data.fileUrl;
|
|
|
- that.getPdfPages(fileUrl);
|
|
|
+ that.fileUrl = res.data.fileUrl;
|
|
|
+ that.fileName = that.getFileExtension(that.fileUrl);
|
|
|
+ that.getPdfPages();
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
|
|
|
- async getPdfPages(fileUrl) {
|
|
|
+ async getPdfPages() {
|
|
|
var that = this;
|
|
|
- const loadingTask = VuePdf.createLoadingTask(fileUrl);
|
|
|
+ const loadingTask = VuePdf.createLoadingTask(that.fileUrl);
|
|
|
const pdf = await loadingTask.promise;
|
|
|
- var length = pdf.numPages;
|
|
|
- // that.numPages = length;
|
|
|
- // that.loadedPages = that.numPages;
|
|
|
- if (length == 0) {
|
|
|
+ this.numPages = pdf.numPages;
|
|
|
+ // this.loadedPages = this.numPages;
|
|
|
+ if (this.numPages == 0) {
|
|
|
return;
|
|
|
}
|
|
|
- that.fileUrl = fileUrl;
|
|
|
- that.loadedPages = length;
|
|
|
- // that.loadedPages = that.numPages > 2 ? 2 : that.numPages;
|
|
|
+ this.loadedPages = this.numPages;
|
|
|
+ // this.loadedPages = this.numPages > 2 ? 2 : this.numPages;
|
|
|
},
|
|
|
|
|
|
///截取文件
|
|
@@ -182,7 +164,7 @@ export default {
|
|
|
var that = this;
|
|
|
var name = that.name;
|
|
|
var fileUrl = that.fileUrl;
|
|
|
- var fileName = that.getFileExtension(that.fileUrl);
|
|
|
+ var fileName = that.fileName;
|
|
|
|
|
|
var finalName = "";
|
|
|
if (name != null && name != "") {
|