Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout

YM

2024-05-14 c309a98cf8a99f60be712a7d4f836db4702c209a

 src/books/childHealth/view/index.vue

@@ -1,6 +1,5 @@
<template>
  <div class="temp-book" @mouseup="handleMouseUp">
    <pageHeader></pageHeader>
    <pageContent></pageContent>
  </div>
</template>
@@ -8,12 +7,11 @@
<script>
import examinations from "./components/examinations/index.vue";
import { getPublicImage } from "@/assets/js/middleGround/tool";
import pageHeader from "./header/index.vue";
import pageContent from "./content/index.vue";
import {mapState} from 'vuex'
export default {
  name: "temp-book",
  name: "child-health",
  components: {
    pageHeader,
    pageContent,
    examinations,
  },
@@ -26,7 +24,20 @@
  },
  mounted() {
    this.getBookInfo();
    console.log(this.$store.state.qiankun, "this.$store.state.qiankun");
  },
  // computed: {
  //   ...mapState(['lineHeightList'])
  // },
  // wathch: {
  //   lineHeightList:{
  //     handler(){
  //       console.log('监听到lineHeightList变化');
  //       this.handleDom()
  //     },
  //     deep:true
  //   }
  // },
  methods: {
    getBookInfo() {
      let query = {
@@ -367,7 +378,6 @@
        });
      }
    },

    getParentWithClass(element, className) {
      while (element.parentElement) {
        element = element.parentElement;
@@ -378,20 +388,68 @@
    },
    handleMouseUp(e) {
      const txt = window.getSelection()?.toString();
      const node = window.getSelection();
      let html = node.anchorNode.parentNode.parentNode.parentNode;
      let nextHtml = html.firstChild.innerHTML;
      let pageHtml = this.getParentWithClass(node.anchorNode,'page-box')
      if (txt) {
        console.log(pageHtml);
      const selection = window.getSelection();
      if (selection.type != "none") {
        let node = selection.anchorNode.parentNode;
        let pageHtml = this.getParentWithClass(
          selection.anchorNode,
          "page-box"
        );
        console.log("子项", selection.anchorNode);
        let chapterDom = this.getParentWithClass(
          selection.anchorNode,
          "chapter"
        );
        let chapterNum;
        if (chapterDom) chapterNum = chapterDom.getAttribute("num");
        console.log("第一处判断", txt, pageHtml);
        if (txt && pageHtml) {
          const page = pageHtml.getAttribute("page");
          console.log(
            {
              chapterNum,
              txt,
              selection,
              node,
              page,
              x: e.x,
              y: e.y,
            },
            "sendData"
          );
          // 监听选中文本事件，并触发父层方法
          console.log("第二处判断", this.$store.state.qiankun);
          if (this.$store.state.qiankun.windowSelection) {
            this.$store.state.qiankun.windowSelection({
              txt,
              selection,
              node,
              page,
              x: e.x,
              y: e.y,
            });
          }
        }
      }
      if (html) {
        const page = html.getAttribute("page");
        console.log("page", page,this.$actions);
        this.$actions.setGlobalState({
          aa:page
        })
        
    },
    handleDom() {
      const selection = window.getSelection();
      let textDom = this.getParentWithClass(selection.anchorNode, "page-box");
      for (let i = 0; i < this.$store.state.lineHeightList.length; i++) {
        let item = this.$store.state.lineHeightList[i];
        let rReg = new RegExp(`${item.selectText}`, "ig");
        let text = textDom.innerHTML;
        console.log(item.selectNode, "item.selectNode.innerHTML");
        let nodeHtml = item.selectNode;
        let nHtml = "";
        nHtml = nodeHtml.replace(
          rReg,
          `<span style="background: ${item.color};padding: 2px;cursor: pointer">${item.selectText}</span>`
        );
        console.log(nHtml);
        let rHtml = "";
        rHtml = text.replace(nodeHtml, nHtml);
        textDom.innerHTML = rHtml;
      }
    },
  },