学前儿童保存--input事件

闫增涛

2024-06-07 3b2e6425d6fc732a221c9ef9ec9e8dc849e11148

 src/books/childHealth/view/index.vue

@@ -1,85 +1,21 @@
<template>
  <div class="temp-book" @mouseup="handleMouseUp" @mousedown="handleMouseDown" @mousemove="handleMousemove">
  <div class="temp-book" @mouseup="handleMouseUp">
    <pageContent></pageContent>
  </div>
</template>

<script>
import examinations from "./components/examinations/index.vue";
import pageContent from "./content/index.vue";
// import testData from '../assets/examinationList'
// import getQuestionData from '@/assets/methods/examination'
export default {
  name: "child-health",
  components: {
    pageContent,
    examinations,
  },
  data() {
    return {
      bookData:{},
      type: "option",
      idPathList: [],
      cardList: [],
      isMouseDown: false,
      move: false,
    };
    return {};
  },
  mounted() {
    this.getBookInfo();
    console.log(this.$store.state.qiankun, "this.$store.state.qiankun");
  },

  mounted() {},
  methods: {
    getBookInfo() {
      let query = {
        path: "*",
        queryType: "*",
        productId: this.config.bookId,
        favoriteTypes: "FavoriteBookCity",
        itemFields: {
          "SysType=": "CmsFolder",
        },
        coverSize: {
          height: 300,
        },
        fields: {
          seriesName: [],
          author: [],
          isbn: [],
          publicationDate: [],
          bookClassification: [],
          paperPrice: [],
          JDLink: [],
          tmallLink: [],
          dangdangLink: [],
          weidianLink: [],
          content: [],
          authorIntroduction: [],
          // isApplyPaperBook: [],
          // isApplyEBook: [],
          isApplyBook: [],
          isSell: [],
          pdf: [],
          protectedEpub: [],
          probationPage: [], //pdf试读页数
          freeEpubPage: [], //epub试读百分比
        },
      };
      this.MG.store.getProductDetail(query).then((res) => {
        console.log("图书信息",res.datas); 
        this.$data.bookData =  res.datas
        this.$store.commit('setRootCmsItemId',res.datas.rootCmsItemId)
        // const questiondata = testData
        // for(let key in testData) {
        //   for(let tkey in testData[key]) {
        //     console.log(testData[key][tkey]);
        //     questiondata[key][tkey]  = getQuestionData(res.datas.rootCmsItemId,testData[key][tkey])
        //   }
        // }
        // this.$store.commit('setQuestionData',questiondata)
        // console.log(questiondata);
      });
    },
    getParentWithClass(element, className) {
      while (element.parentElement) {
        element = element.parentElement;
@@ -89,82 +25,51 @@
      }
    },
    handleMouseUp(e) {
      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"
          );
          let chapterDom = this.getParentWithClass(
            selection.anchorNode,
            "chapter"
          );
          let chapterNum;
          if (chapterDom) chapterNum = chapterDom.getAttribute("num");
          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,
              });
            }
      const selection = (
        this.container ? this.container : window
      ).getSelection();
      const txt = selection.toString();
      if (selection.type != "none" && txt) {
        let node = selection.anchorNode.parentNode;
        let pageHtml = this.getParentWithClass(
          selection.anchorNode,
          "page-box"
        );
        let chapterDom = this.getParentWithClass(
          selection.anchorNode,
          "chapter"
        );
        let chapterNum;
        if (chapterDom) chapterNum = chapterDom.getAttribute("num");
        if (pageHtml) {
          const page = pageHtml.getAttribute("page");
          // 监听选中文本事件，并触发父层方法
          if (this.$store.state.qiankun.windowSelection) {
            this.$store.state.qiankun.windowSelection({
              chapterNum,
              txt,
              page,
              x: e.x,
              y: e.y,
            });
          }
          this.$data.isMouseDown = false;
        }
      } else {
        if (this.$store.state.qiankun.windowSelection) {
          this.$store.state.qiankun.windowSelection({
            chapterNum: "",
            txt: "",
            page: "",
            x: e.x,
            y: e.y,
          });
        }
      }
      this.$data.move = false
    },

    handleMouseDown() {
      this.$data.isMouseDown = true;
    },
    handleMousemove() {
      if (this.$data.isMouseDown) {
        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;
    // },
  },
};
</script>

<style lang="less" scoped></style>
../assets/examinationList.js../assets/examinationList.js
<style lang="less">
@import "../assets/main.less";
</style>