分页

闫增涛

2024-05-14 9b55b510a461c6a7681be500540db4f3a405efdb

 src/books/childHealth/view/index.vue

@@ -1,5 +1,5 @@
<template>
  <div class="temp-book" @mouseup="handleMouseUp">
  <div class="temp-book" @mouseup="handleMouseUp" @mousedown="handleMouseDown" @mousemove="handleMousemove">
    <pageContent></pageContent>
  </div>
</template>
@@ -8,7 +8,6 @@
import examinations from "./components/examinations/index.vue";
import { getPublicImage } from "@/assets/js/middleGround/tool";
import pageContent from "./content/index.vue";
import { mapState } from "vuex";
export default {
  name: "child-health",
  components: {
@@ -20,27 +19,15 @@
      type: "option",
      idPathList: [],
      cardList: [],
      isMouseDown:false,
      showToolBox:false,
      move:false
      isMouseDown: false,
      showToolBox: false,
      move: false,
    };
  },
  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 = {
@@ -390,78 +377,81 @@
      }
    },
    handleMouseUp(e) {
      const txt = window.getSelection()?.toString();
      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"
      if (this.$data.move) {
        const txt = window.getSelection()?.toString();
        const selection = window.getSelection();
        if (selection.type != "none") {
          let node = selection.anchorNode.parentNode;
          let pageHtml = this.getParentWithClass(
            selection.anchorNode,
            "page-box"
          );
          // 监听选中文本事件，并触发父层方法
          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,
            });
          let chapterDom = this.getParentWithClass(
            selection.anchorNode,
            "chapter"
          );
          let chapterNum;
          if (chapterDom) chapterNum = chapterDom.getAttribute("num");
          if (txt && pageHtml) {
            this.$dsta.showToolBox = true;
            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,
              });
            }
          }
          this.$data.isMouseDown = false;
        }
      }
      this.$data.move = false
    },
    

    handleMouseDown() {
      this.$data.isMouseDown = true;
      this.$data.showToolBox = false;
    },
    handleMousemove() {
      if (this.$data.isMouseDown) {
        this.$data.move= true;
        this.$data.move = true;
      }
    },

    handleMouseUp(e) {
      if (move.value) {
        const txt = window.getSelection()?.toString();
        selectText.value = txt;
        const node = window.getSelection();
        let html = node.anchorNode.parentNode.parentNode;
        dialogToolData.chapter = html.firstChild.innerHTML;
        if (txt) {
          showToolBox.value = true;
          dialogToolData.top = e.y;
          dialogToolData.left = e.x;
        }
        isMouseDown.value = false;
      }
      move.value = false;
    },
    // handleMouseUp(e) {
    //   if (move.value) {
    //     const txt = window.getSelection()?.toString();
    //     selectText.value = txt;
    //     const node = window.getSelection();
    //     let html = node.anchorNode.parentNode.parentNode;
    //     dialogToolData.chapter = html.firstChild.innerHTML;
    //     if (txt) {
    //       showToolBox.value = true;
    //       dialogToolData.top = e.y;
    //       dialogToolData.left = e.x;
    //     }
    //     isMouseDown.value = false;
    //   }
    //   move.value = false;
    // },
  },
};
</script>