1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
| <template>
| <div class="temp-bookInnerContent" @mouseup="handleMouseUp">
| <pageContent></pageContent>
| </div>
| </template>
|
| <script>
| import pageContent from "./components/index.vue";
| export default {
| components: {
| pageContent,
| },
| data() {
| return {};
| },
|
| mounted() {},
| methods: {
| getParentWithClass(element, className) {
| while (element.parentElement) {
| element = element.parentElement;
| if (element.classList.contains(className)) {
| return element;
| }
| }
| },
|
| handleMouseUp(e) {
| 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,
| });
| }
| }
| } else {
| if (this.$store.state.qiankun.windowSelection) {
| this.$store.state.qiankun.windowSelection({
| chapterNum: "",
| txt: "",
| page: "",
| x: e.x,
| y: e.y,
| });
| }
| }
| },
| },
| };
| </script>
|
| <style lang="less">
| @import "../css/default.less";
| </style>
|
|
