From 2e664020f32a0eda87139bc1363fa34b7b5697ba Mon Sep 17 00:00:00 2001
From: 闫增涛 <1829501689@qq.com>
Date: 星期三, 15 五月 2024 23:11:51 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout

---
 src/books/childHealth/view/content/index.vue |  129 +++++++++++++++++++++++++++++++++++++++---
 1 files changed, 119 insertions(+), 10 deletions(-)

diff --git a/src/books/childHealth/view/content/index.vue b/src/books/childHealth/view/content/index.vue
index 5f88fe5..6e37da0 100644
--- a/src/books/childHealth/view/content/index.vue
+++ b/src/books/childHealth/view/content/index.vue
@@ -3,7 +3,6 @@
     <div class="page-content">
       <pageHeader v-if="showCatalogList.indexOf(0) > -1"></pageHeader>
       <chapterOne v-if="showCatalogList.indexOf(1) > -1"></chapterOne>
-      <chapterOne v-if="showCatalogList.indexOf(1) > -1"></chapterOne>
       <chapterTwo v-if="showCatalogList.indexOf(2) > -1"></chapterTwo>
       <chapterThree v-if="showCatalogList.indexOf(3) > -1"></chapterThree>
       <chapterFour v-if="showCatalogList.indexOf(4) > -1"></chapterFour>
@@ -37,9 +36,8 @@
 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() {
     return {
@@ -51,6 +49,21 @@
       throttledScrollHandler: null
     };
   },
+  watch: {
+    showCatalogList: {
+      handler(newVal, oldVal) {
+        if (
+          this.$store.state.qiankun &&
+          this.$store.state.qiankun.catalogChange
+        ) {
+          // 璋冪敤鐖跺眰鏂规硶
+          this.$store.state.qiankun.catalogChange({
+            showCatalogList: newVal
+          });
+        }
+      }
+    }
+  },
   mounted() {
     // 榛樿鍔犺浇绔犺妭
     this.showCatalogList = [0];
@@ -60,24 +73,48 @@
       this.throttleThreshold,
       { leading: true, trailing: false }
     );
-    // 鎻愪緵椤甸潰璺宠浆鍔熻兘
+    // 瀹氫箟瀛愬眰鏂规硶
     if (this.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 (
@@ -100,7 +137,7 @@
           }
         }
       } else if (event.target.scrollTop < this.previousScrollTop) {
-        console.log("鍚戜笂婊氬姩");
+        // 鍚戜笂
         const currentScrollTop = event.target.scrollTop;
         if (currentScrollTop <= this.loadThreshold) {
           // 鍒拌揪闃堝��
@@ -114,9 +151,18 @@
           }
         }
       }
-      console.log(this.showCatalogList);
+      // showCatalogList 褰撳墠鏄剧ず鐨勪笁涓珷鑺傦紝watch鐩戝惉浼犻�掔粰涓诲簲鐢�
       // 鏇存柊涓婁竴娆℃粴鍔ㄧ殑浣嶇疆
       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) {
@@ -134,16 +180,79 @@
         }
         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.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.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.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: {

--
Gitblit v1.9.1