|
@@ -94,12 +94,16 @@
|
|
|
cMapPacked: true,
|
|
|
}"
|
|
|
@loaded="renderedShow"
|
|
|
- @rendered="rendered"
|
|
|
+ @rendered="
|
|
|
+ showVisible = false;
|
|
|
+ showELStatus = true;
|
|
|
+ "
|
|
|
+ :page="1"
|
|
|
annotation-layer
|
|
|
text-layer
|
|
|
/>
|
|
|
|
|
|
- <!-- <template v-for="(item, index) in pageLength" :key="index">
|
|
|
+ <template v-for="(item, index) in pageLength" :key="index">
|
|
|
<div :id="'scrollbarId' + (index + 1)">
|
|
|
<el-scrollbar
|
|
|
v-if="showELStatus"
|
|
@@ -136,7 +140,7 @@
|
|
|
>
|
|
|
第 {{ index + 1 }} 页,共 {{ pageLength }} 页
|
|
|
</div>
|
|
|
- </template> -->
|
|
|
+ </template>
|
|
|
</el-scrollbar>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -195,7 +199,8 @@ const bigScroll = ({ scrollTop }) => {
|
|
|
value.value = scrollTop;
|
|
|
};
|
|
|
const scrollTo = (page) => {
|
|
|
- const targetElement = document.getElementById(`pdf${page}`);
|
|
|
+ console.log(page);
|
|
|
+ const targetElement = document.getElementById(`pdf${page - 1}`);
|
|
|
if (targetElement) {
|
|
|
targetElement.scrollIntoView({ behavior: "smooth" });
|
|
|
}
|
|
@@ -242,23 +247,19 @@ watch(
|
|
|
);
|
|
|
const rendered = () => {
|
|
|
loading.value = false;
|
|
|
- const clickableElementsA =
|
|
|
- document.querySelectorAll(".vue-pdf-embed")[0].children;
|
|
|
|
|
|
+ const clickableElementsA = document.querySelectorAll(".vue-pdf-embed div");
|
|
|
const clickableElements = document.querySelectorAll(
|
|
|
".vue-pdf-embed .vue-pdf-embed__page"
|
|
|
);
|
|
|
|
|
|
// 设置所有子元素居中对齐
|
|
|
-
|
|
|
- clickableElementsA.forEach((element, index) => {
|
|
|
+ clickableElementsA.forEach((element) => {
|
|
|
element.style.display = "flex";
|
|
|
element.style.alignItems = "center";
|
|
|
element.style.justifyContent = "center";
|
|
|
- element.setAttribute("name", "pdfItem");
|
|
|
- element.id = `pdf${index + 1}`;
|
|
|
});
|
|
|
- setPageInfo();
|
|
|
+
|
|
|
clickableElements.forEach((element, index) => {
|
|
|
element.index = index;
|
|
|
let rotationAngle = 0;
|
|
@@ -400,24 +401,6 @@ const rendered = () => {
|
|
|
});
|
|
|
});
|
|
|
};
|
|
|
-const setPageInfo = () => {
|
|
|
- const clickableElementsB = document.getElementsByName("pdfItem");
|
|
|
- clickableElementsB.forEach((element, index) => {
|
|
|
- const pageInfo = document.createElement("div");
|
|
|
- pageInfo.textContent = `第 ${index + 1} 页`;
|
|
|
-
|
|
|
- // 设置样式
|
|
|
- pageInfo.style.width = "100%";
|
|
|
- pageInfo.style.textAlign = "center";
|
|
|
- pageInfo.style.fontSize = "24px";
|
|
|
- pageInfo.style.fontWeight = "bold";
|
|
|
- pageInfo.style.margin = "20px 0";
|
|
|
- pageInfo.style.color = "white";
|
|
|
-
|
|
|
- // 插入到当前元素的后面
|
|
|
- element.insertAdjacentElement("afterend", pageInfo);
|
|
|
- });
|
|
|
-};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|