瀏覽代碼

保留单指拖动

dengrui 2 周之前
父節點
當前提交
614331afde
共有 1 個文件被更改,包括 12 次插入29 次删除
  1. 12 29
      src/components/PDFViewFull/index.vue

+ 12 - 29
src/components/PDFViewFull/index.vue

@@ -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>