From ac4b8147bb3dbb4cd857be71329b890c2d0fd525 Mon Sep 17 00:00:00 2001
From: YM <479443481@qq.com>
Date: 星期三, 15 五月 2024 17:14:16 +0800
Subject: [PATCH] 高亮，划线
---
src/views/home.vue | 269 ++++++++++++++++++++++++++++++++++++-----------------
1 files changed, 180 insertions(+), 89 deletions(-)
diff --git a/src/views/home.vue b/src/views/home.vue
index a9106f2..2ad5d0a 100644
--- a/src/views/home.vue
+++ b/src/views/home.vue
@@ -154,7 +154,7 @@
</div>
</div>
<div
- class="noteText hover"
+ class="noteText hover 123456"
@click="jumpContent('note' + index)"
:style="{
background:
@@ -317,7 +317,9 @@
<div><img :src="zoomOut" @click="changePageSize('reduce')" /></div>
</div>
<div class="brushImgBox">
- <div><img :src="huabi2" class="brushImg" />鐢荤瑪</div>
+ <div @click="jumpContent('note' + index)">
+ <img :src="huabi2" class="brushImg" />鐢荤瑪
+ </div>
</div>
</div>
</div>
@@ -823,6 +825,7 @@
import useClipboard from 'vue-clipboard3'
const { toClipboard } = useClipboard()
const request = inject('request')
+const toolClass = inject('toolClass')
const qiankunActions = inject('qiankunActions')
//鑾峰彇璺敱鍣�
let router = useRouter()
@@ -934,6 +937,7 @@
let microApp = null // 寰簲鐢ㄥ疄渚�
const bookName = ref('')
const bookId = ref(1)
+const activeCatalog = ref()
onMounted(() => {
getCatalogueData()
getResourceData()
@@ -955,25 +959,45 @@
// 鍔犺浇寰簲鐢�
microApp = loadMicroApp(microApps.book1, {
sandbox: {
- // strictStyleIsolation: true,
+ strictStyleIsolation: true
// experimentalStyleIsolation: true
- }
+ },
+ singular: true
})
window.qiankunActions.onGlobalStateChange((state, prev) => {
- console.log(state, '鐖跺眰')
+ console.log('鐖跺眰state鍙樺寲', state)
bookName.value = state.bookName
bookId.value = state.bookId
- state.gotoPage
+ window.qiankunState = state
})
+ // 瀹氫箟鐖跺眰鏂规硶
+ console.log(window.qiankunActions)
window.qiankunActions.setGlobalState({
state: 1, // 鍔犺浇瀛愬簲鐢�
windowSelection: (data) => {
// 缁戝畾瀛愬簲鐢ㄩ�夋嫨鐩戝惉浜嬩欢
console.log(data, '瀛愬簲鐢ㄩ�夋嫨')
getSelection(data)
+ },
+ catalogChange: (data) => {
+ activeCatalog.value = data.showCatalogList
+ getSignData()
+ console.log(data, '绔犺妭鍒囨崲锛氱洰鍓嶆樉绀虹殑涓変釜绔犺妭')
+ },
+ pageChange: (data) => {
+ // {
+ // page: 100,
+ // catalog: 5,
+ // catalogId: "",
+ // catalogName: "",
+ // }
+ console.log(data, '椤甸潰鍒囨崲锛氱洰鍓嶆樉绀洪〉闈㈠拰瀵瑰簲鐨勭珷鑺備俊鎭�')
}
})
+
+ // 璋冪敤瀛愬眰鏂规硶
+ // if (window.qiankunState && window.qiankunState.aa) window.qiankunState.aa(1)
})
watch(
@@ -989,10 +1013,10 @@
watch(
() => bookId.value,
(val) => {
- getNotesList() // 鑾峰彇绗旇
- getlineHeightList() //鑾峰彇楂樹寒
- getScribeList() //鑾峰彇鍒掔嚎
- getScreenshotList() //鎴浘
+ // getNotesList() // 鑾峰彇绗旇
+ // getlineHeightList() //鑾峰彇楂樹寒
+ // getScribeList() //鑾峰彇鍒掔嚎
+ // getScreenshotList() //鎴浘
}
)
//鑾峰彇鐩綍
@@ -1631,14 +1655,13 @@
//閫変腑鏂囧瓧宸ュ叿鏍�
const selectText = ref('') //閫変腑鏂囧瓧
-const selectNode = ref(null)
-const selectPage = ref(1)
const showToolBox = ref(false)
const dialogToolData = reactive({
left: 500,
top: 300,
+ txt: '',
+ page: '',
chapter: '', //閫変腑鏂囧瓧鎵�鍦ㄧ珷鑺�
- parentNode: null,
lineHeight: [], //楂樹寒
scribeList: [], //鍒掔嚎
notesList: [] //绗旇
@@ -1647,21 +1670,22 @@
///鍐呭閫変腑
const getSelection = (data) => {
if (data.txt) {
- console.log(data.node, 'data')
+ dialogToolData.txt = data.txt
+ dialogToolData.page = data.page
+ dialogToolData.chapter = data.chapterNum
+ dialogToolData.left = data.x
+ dialogToolData.top = data.y
showToolBox.value = true
- selectText.value = data.txt
- selectNode.value = data.node.innerHTML
- selectPage.value = data.page
}
}
const pageScroll = (e) => {
- window.qiankunActions.setGlobalState({
- gotoPage: (t, s) => {
- // 缁戝畾瀛愬簲鐢ㄩ�夋嫨鐩戝惉浜嬩欢
- console.log(t, s, '瀛愬簲鐢ㄦ粴鍔�')
- }
- })
+ // window.qiankunActions.setGlobalState({
+ // gotoPage: (t, s) => {
+ // // 缁戝畾瀛愬簲鐢ㄩ�夋嫨鐩戝惉浜嬩欢
+ // console.log(t, s, '瀛愬簲鐢ㄦ粴鍔�')
+ // }
+ // })
showToolBox.value = false
lineDelete.showLineDelete = false
// let scroll = e.target.scrollTop
@@ -1835,67 +1859,133 @@
const clickSelect = (item) => {
colorActive.value = item.key
- if (toolActive.value == '楂樹寒') {
- let lineHeightData = {
- selectNode: selectNode.value,
- selectText: selectText.value,
- selectPage: selectPage.value,
- color: colorActive.value,
- chapter: dialogToolData.chapter,
- createDate: new Date()
- }
- dialogToolData.lineHeight.push(lineHeightData)
- console.log(dialogToolData.lineHeight, '鍓峮ode')
- request({
- url: '/identity/api/ApiAppUserSetKey',
- method: 'post',
- data: {
- setKeyRequests: [
- {
- domain: 'highLight',
- key: bookId.value,
- value: JSON.stringify(dialogToolData.lineHeight)
- }
- ]
- }
- }).then((res) => {
- showToolBox.value = false
- colorActive.value = ''
- toolActive.value = ''
- getlineHeightList()
- })
- }
- if (toolActive.value == '鍒掔嚎') {
- dialogToolData.scribeList.push({
- selectNode: selectNode.value,
- selectText: selectText.value,
- selectPage: selectPage.value,
- color: colorActive.value,
- chapter: dialogToolData.chapter,
- createDate: new Date()
- })
- request({
- url: '/identity/api/ApiAppUserSetKey',
- method: 'post',
- data: {
- setKeyRequests: [
- {
- domain: 'underline',
- key: bookId.value,
- value: JSON.stringify(dialogToolData.scribeList)
- }
- ]
- }
- }).then((res) => {
- colorActive.value = ''
- showToolBox.value = false
- toolActive.value = ''
- getScribeList()
- })
- }
+ addUserKey()
}
+const addUserKey = () => {
+ let dom = ''
+ let data = null
+ switch (toolActive.value) {
+ case '楂樹寒':
+ dom = 'highLightData-' + bookId.value
+ data = dialogToolData.lineHeight[dialogToolData.chapter]
+ data.push({
+ id: toolClass.uuid(8),
+ txt: dialogToolData.txt,
+ page: dialogToolData.page,
+ type: 'Highlight',
+ color: colorActive.value
+ })
+ break
+ case '鍒掔嚎':
+ dom = 'underline-' + bookId.value
+ data = dialogToolData.scribeList[dialogToolData.chapter]
+ data.push({
+ id: toolClass.uuid(8),
+ txt: dialogToolData.txt,
+ page: dialogToolData.page,
+ type: 'Dashing',
+ color: colorActive.value
+ })
+ break
+ }
+ request({
+ url: '/identity/api/ApiAppUserSetKey',
+ method: 'post',
+ data: {
+ setKeyRequests: [
+ {
+ domain: dom,
+ key: dialogToolData.chapter,
+ value: JSON.stringify(data)
+ }
+ ]
+ }
+ }).then((res) => {
+ showToolBox.value = false
+ colorActive.value = ''
+ toolActive.value = ''
+ getSignData()
+ })
+}
+
+const delUserKey = (type, ids) => {
+ switch (type) {
+ case 'Highlight':
+ dom = 'highLightData-' + bookId.value
+ data = dialogToolData.lineHeight
+ break
+ case 'Dashing':
+ dom = 'underline-' + bookId.value
+ data = dialogToolData.scribeList
+ break
+ }
+ data = data.filter((item) => ids.indexOf(item.id) == -1)
+ request({
+ url: '/identity/api/ApiAppUserSetKey',
+ method: 'post',
+ data: {
+ setKeyRequests: [
+ {
+ domain: dom,
+ key: '',
+ value: JSON.stringify(data)
+ }
+ ]
+ }
+ }).then((res) => {})
+}
const lock = ref(false)
+
+const getSignData = () => {
+ request({
+ url: '/identity/api/ApiGetAppUserKey',
+ method: 'post',
+ data: {
+ domain: 'highLightData-' + bookId.value,
+ keys: activeCatalog.value.map((item) => item + '')
+ }
+ }).then((res) => {
+ if (res && res.length > 0) {
+ for (let i = 0; i < res.length; i++) {
+ const item = res[i]
+ const data = JSON.parse(item.value)
+ // 鍌ㄥ��
+ dialogToolData.lineHeight[item.key] = data
+ // 娓叉煋
+ for (let j = 0; j < data.length; j++) {
+ const citem = data[j]
+ if (window.qiankunState && window.qiankunState.renderSign)
+ window.qiankunState.renderSign(citem.type, citem)
+ }
+ }
+ }
+ })
+ request({
+ url: '/identity/api/ApiGetAppUserKey',
+ method: 'post',
+ data: {
+ domain: 'underline-' + bookId.value,
+ keys: activeCatalog.value.map((item) => item + '')
+ }
+ }).then((res) => {
+ if (res && res.length > 0) {
+ for (let i = 0; i < res.length; i++) {
+ const item = res[i]
+ const data = JSON.parse(item.value)
+ // 鍌ㄥ��
+ dialogToolData.scribeList[item.key] = data
+ // 娓叉煋
+ for (let j = 0; j < data.length; j++) {
+ const citem = data[j]
+ if (window.qiankunState && window.qiankunState.renderSign)
+ window.qiankunState.renderSign(citem.type, citem)
+ }
+ }
+ }
+ })
+}
+
const addNote = () => {
const obj = {
desc: formData.desc
@@ -2165,7 +2255,7 @@
}
const jumpContent = (id) => {
- document.getElementById(id).scrollIntoView()
+ if (window.qiankunState && window.qiankunState.gotoPage) window.qiankunState.gotoPage(5, 100)
}
const update = (item, type) => {
@@ -2680,9 +2770,7 @@
margin: 10px 10px 10px 15px;
border-radius: 3px;
padding: 2px 5px;
- // opacity: 0.1;
.con {
- all: initial;
max-height: 65px;
display: -webkit-box;
-webkit-box-orient: vertical;
@@ -2772,14 +2860,17 @@
}
.pageBox-content {
height: calc(100% - 57px);
- overflow-y: auto;
background: #fbf9f4;
.content-box {
+ height: 100%;
position: relative;
- }
- #container {
- background: #fbf9f4;
- // height: 100%;
+ #container {
+ background: #fbf9f4;
+ height: 100%;
+ #__qiankun_microapp_wrapper_for_app_content__ {
+ height: 100%;
+ }
+ }
}
.canvas-box {
height: 100%;
--
Gitblit v1.9.1