From 46c17ea395352fc3d2bd3d5e5163f601f4d466c1 Mon Sep 17 00:00:00 2001
From: 闫增涛 <1829501689@qq.com>
Date: 星期五, 17 五月 2024 15:28:17 +0800
Subject: [PATCH] 题目传参

---
 src/books/childHealth/view/content/index.vue |  147 ++++++++++++++++++++++++++++++++++++++++++------
 1 files changed, 127 insertions(+), 20 deletions(-)

diff --git a/src/books/childHealth/view/content/index.vue b/src/books/childHealth/view/content/index.vue
index 6abe606..924583c 100644
--- a/src/books/childHealth/view/content/index.vue
+++ b/src/books/childHealth/view/content/index.vue
@@ -1,6 +1,7 @@
 <template>
   <div class="page-main" @scroll="throttledScrollHandler">
-    <div class="page-content">
+    <div class="page-content" :style="{fontSize: fontSize ? fontSize + 'px' : '16px',  
+  transform: `scale(${pageZoom ? pageZoom : 1})`}">
       <pageHeader v-if="showCatalogList.indexOf(0) > -1"></pageHeader>
       <chapterOne v-if="showCatalogList.indexOf(1) > -1"></chapterOne>
       <chapterTwo v-if="showCatalogList.indexOf(2) > -1"></chapterTwo>
@@ -36,6 +37,7 @@
 import chapterEleven from "./components/chapter011.vue";
 import chapterTwelve from "./components/chapter012.vue";
 import chapterThirteen from "./components/chapter013.vue";
+import NoteIcon from "@/assets/images/biji.png";
 import _ from "lodash";
 export default {
   data() {
@@ -45,20 +47,31 @@
       loadThreshold: 300, // 瑙﹀彂鍔犺浇闃堝��
       throttleThreshold: 100, // 鑺傛祦闃堝��
       previousScrollTop: 0,
-      throttledScrollHandler: null,
+      throttledScrollHandler: null
     };
+  },
+  computed:{
+    fontSize() {
+      return this.$store.state.qiankun.fontSize
+    },
+    pageZoom() {
+      return this.$store.state.qiankun.scale / 100
+    }
   },
   watch: {
     showCatalogList: {
-      handler(newVal) {
-        console.log("鏄剧ず绔犺妭", newVal);
-        if (this.$store.state.qiankun.windowSelection) {
-          this.$store.state.qiankun.windowSelection({
-            showCatalogList: newVal,
+      handler(newVal, oldVal) {
+        if (
+          this.$store.state.qiankun &&
+          this.$store.state.qiankun.catalogChange
+        ) {
+          // 璋冪敤鐖跺眰鏂规硶
+          this.$store.state.qiankun.catalogChange({
+            showCatalogList: newVal
           });
         }
-      },
-    },
+      }
+    }
   },
   mounted() {
     // 榛樿鍔犺浇绔犺妭
@@ -69,25 +82,48 @@
       this.throttleThreshold,
       { leading: true, trailing: false }
     );
-    // 鎻愪緵椤甸潰璺宠浆鍔熻兘
+    // 瀹氫箟瀛愬眰鏂规硶
     if (this.setGlobalState) {
-      console.log("setGlobalState");
+      // 鎻愪緵椤甸潰璺宠浆鍔熻兘
       this.setGlobalState({
         gotoPage: (catalog, page) => {
           this.gotoPage(catalog, page);
         },
+        // 娓叉煋绗旇銆侀珮浜�佸垝绾�
+        renderSign: (type, data) => {
+          this.renderSign(type, data);
+        },
+        // 鍒犻櫎绗旇銆侀珮浜�佸垝绾�
+        delSign: (data) => {
+          this.delSign(data);
+        }
       });
     }
+
     // 娴嬭瘯椤甸潰璺宠浆
     // setTimeout(() => {
     //   this.gotoPage(5, 100);
+    //   setTimeout(() => {
+    //     this.renderSign("Note", {
+    //       id: "2ACA9359",
+    //       txt: "钀ュ吇绱犲拰鐑噺锛屾墠鑳�",
+    //       page: "100",
+    //       type: "Highlight",
+    //       color: "#F5E12A"
+    //     });
+    //     setTimeout(() => {
+    //       this.delSign({
+    //         ids: ["2ACA9359"]
+    //       });
+    //     }, 2000);
+    //   }, 1000);
     // }, 3000);
   },
   methods: {
-    scrollFun(e) {
+    scrollFun(event) {
       // 鍒ゆ柇鍚戜笂婊氬姩杩樻槸鍚戜笅婊氬姩
       if (event.target.scrollTop > this.previousScrollTop) {
-        console.log("鍚戜笅婊氬姩");
+        // 鍚戜笅
         const currentScrollTop =
           event.target.scrollTop + event.target.offsetHeight;
         if (
@@ -110,7 +146,7 @@
           }
         }
       } else if (event.target.scrollTop < this.previousScrollTop) {
-        console.log("鍚戜笂婊氬姩");
+        // 鍚戜笂
         const currentScrollTop = event.target.scrollTop;
         if (currentScrollTop <= this.loadThreshold) {
           // 鍒拌揪闃堝��
@@ -125,9 +161,17 @@
         }
       }
       // showCatalogList 褰撳墠鏄剧ず鐨勪笁涓珷鑺傦紝watch鐩戝惉浼犻�掔粰涓诲簲鐢�
-      console.log(this.showCatalogList);
       // 鏇存柊涓婁竴娆℃粴鍔ㄧ殑浣嶇疆
       this.previousScrollTop = event.target.scrollTop;
+
+      // 杩斿洖椤电爜鍜岀珷鑺備俊鎭�
+      // if (this.$store.state.qiankun && this.$store.state.qiankun.pageChange)
+      //   this.$store.state.qiankun.pageChange({
+      //     page: 100,
+      //     catalog: 5,
+      //     catalogId: "",
+      //     catalogName: ""
+      //   });
     },
     gotoPage(catalog, page) {
       if (catalog >= 0 && catalog <= this.catalogLength) {
@@ -138,24 +182,87 @@
           this.showCatalogList = [
             this.catalogLength - 2,
             this.catalogLength - 1,
-            this.catalogLength,
+            this.catalogLength
           ];
         } else {
           this.showCatalogList = [catalog - 1, catalog, catalog + 1];
         }
         setTimeout(() => {
           // 璺宠浆椤电爜
-          const pageDom = document.querySelector(`[page="${page}"]`);
+          const pageDom = (
+            this.container ? this.container : document
+          ).querySelector(`[page="${page}"]`);
           if (pageDom) {
             pageDom.scrollIntoView();
           } else {
             console.log("椤电爜閿欒锛�");
           }
-        }, 50);
+        }, 500);
       } else {
         console.log("绔犺妭閿欒锛�");
       }
     },
+    renderSign(type, data) {
+      const existence = (
+        this.container ? this.container : document
+      ).querySelector(`[dataid="${data.id}"]`);
+      // 鍘婚噸
+      if (!existence) {
+        const pageDom = (
+          this.container ? this.container : document
+        ).querySelector(`[page="${data.page}"]`);
+        let reg = new RegExp(`${data.txt}`, "ig");
+        switch (type) {
+          case "Highlight":
+            // 楂樹寒
+            pageDom.innerHTML = pageDom.innerHTML.replace(
+              reg,
+              `<span datatype="Highlight" dataid="${data.id}" style="background: ${data.color};" class="highLight" onclick="signClick('Highlight','${data.id}','${data.chapterNum}')">${data.txt}</span>`
+            );
+            break;
+          case "Dashing":
+            // 鍒掔嚎
+            pageDom.innerHTML = pageDom.innerHTML.replace(
+              reg,
+              `<span datatype="Dashing" dataid="${data.id}" style="text-decoration-color:${data.color};" class="underline" onclick="signClick('Dashing','${data.id}','${data.chapterNum}')">${data.txt}</span>`
+            );
+            break;
+          case "Note":
+            // 绗旇
+            pageDom.innerHTML = pageDom.innerHTML.replace(
+              reg,
+              `<span datatype="Note" dataid="${data.id}" style="border-bottom-color:${data.color}" class="notesline" onclick="signClick('Note','${data.id}','${data.chapterNum}')">${data.txt}<img src="${NoteIcon}" style="cursor: pointer" /></span>`
+            );
+            break;
+        }
+      }
+    },
+    delSign({ ids, type }) {
+      if (ids && ids.length) {
+        for (let i = 0; i < ids.length; i++) {
+          const id = ids[i];
+          const dom = (
+            this.container ? this.container : document
+          ).querySelector(`[dataid="${id}"]`);
+          dom.parentNode.innerHTML = dom.parentNode.innerHTML.replace(
+            dom.outerHTML,
+            dom.outerText
+          );
+        }
+      }
+      if (type) {
+        const doms = (
+          this.container ? this.container : document
+        ).querySelectorAll(`[datatype="${type}"]`);
+        for (let i = 0; i < doms.length; i++) {
+          const dom = doms[i];
+          dom.parentNode.innerHTML = dom.parentNode.innerHTML.replace(
+            dom.outerHTML,
+            dom.outerText
+          );
+        }
+      }
+    }
   },
   components: {
     pageHeader,
@@ -171,8 +278,8 @@
     chapterTen,
     chapterEleven,
     chapterTwelve,
-    chapterThirteen,
-  },
+    chapterThirteen
+  }
 };
 </script>
 

--
Gitblit v1.9.1