| | |
| | | <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 testData from '../assets/examinationList.json' |
| | | import pageContent from "./content/index.vue"; |
| | | export default { |
| | | name: "child-health", |
| | | components: { |
| | | pageContent, |
| | | examinations, |
| | | pageContent |
| | | }, |
| | | data() { |
| | | return { |
| | | bookData:{}, |
| | | bookData: {}, |
| | | type: "option", |
| | | idPathList: [], |
| | | cardList: [], |
| | | isMouseDown: false, |
| | | showToolBox: false, |
| | | move: false, |
| | | isMouseDown: false |
| | | }; |
| | | }, |
| | | mounted() { |
| | | this.getBookInfo(); |
| | | console.log(this.$store.state.qiankun, "this.$store.state.qiankun"); |
| | | }, |
| | | methods: { |
| | | getBookInfo() { |
| | |
| | | productId: this.config.bookId, |
| | | favoriteTypes: "FavoriteBookCity", |
| | | itemFields: { |
| | | "SysType=": "CmsFolder", |
| | | "SysType=": "CmsFolder" |
| | | }, |
| | | coverSize: { |
| | | height: 300, |
| | | height: 300 |
| | | }, |
| | | fields: { |
| | | seriesName: [], |
| | |
| | | pdf: [], |
| | | protectedEpub: [], |
| | | probationPage: [], //pdf试读页数 |
| | | freeEpubPage: [], //epub试读百分比 |
| | | }, |
| | | freeEpubPage: [] //epub试读百分比 |
| | | } |
| | | }; |
| | | this.MG.store.getProductDetail(query).then((res) => { |
| | | console.log("图书信息",res.datas.cmsDatas[0].datas); |
| | | this.$data.bookData = res.datas.cmsDatas[0].datas |
| | | |
| | | this.$data.bookData = res.datas; |
| | | this.$store.commit("setRootCmsItemId", res.datas.rootCmsItemId); |
| | | }); |
| | | }, |
| | | getParentWithClass(element, className) { |
| | |
| | | } |
| | | }, |
| | | 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) { |
| | | 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, |
| | | }); |
| | | } |
| | | 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: "", |
| | | y: "" |
| | | }); |
| | | } |
| | | } |
| | | this.$data.move = false |
| | | }, |
| | | |
| | | handleMouseDown() { |
| | | this.$data.isMouseDown = true; |
| | | this.$data.showToolBox = false; |
| | | }, |
| | | 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> |
| | | |