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 | 222 ++++++++++++++++++++++++++++++++++++------------------ 1 files changed, 147 insertions(+), 75 deletions(-) diff --git a/src/views/home.vue b/src/views/home.vue index 6bbe6ee..2ad5d0a 100644 --- a/src/views/home.vue +++ b/src/views/home.vue @@ -317,7 +317,9 @@ <div><img :src="zoomOut" @click="changePageSize('reduce')" /></div> </div> <div class="brushImgBox"> - <div @click="jumpContent('note' + index)"><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,19 +959,20 @@ // 鍔犺浇寰簲鐢� microApp = loadMicroApp(microApps.book1, { sandbox: { - // strictStyleIsolation: true, + strictStyleIsolation: true // experimentalStyleIsolation: true - } + }, + singular: true }) window.qiankunActions.onGlobalStateChange((state, prev) => { console.log('鐖跺眰state鍙樺寲', state) bookName.value = state.bookName bookId.value = state.bookId - window.qiankunState = state; + window.qiankunState = state }) // 瀹氫箟鐖跺眰鏂规硶 - console.log(window.qiankunActions); + console.log(window.qiankunActions) window.qiankunActions.setGlobalState({ state: 1, // 鍔犺浇瀛愬簲鐢� windowSelection: (data) => { @@ -976,6 +981,8 @@ getSelection(data) }, catalogChange: (data) => { + activeCatalog.value = data.showCatalogList + getSignData() console.log(data, '绔犺妭鍒囨崲锛氱洰鍓嶆樉绀虹殑涓変釜绔犺妭') }, pageChange: (data) => { @@ -1006,10 +1013,10 @@ watch( () => bookId.value, (val) => { - getNotesList() // 鑾峰彇绗旇 - getlineHeightList() //鑾峰彇楂樹寒 - getScribeList() //鑾峰彇鍒掔嚎 - getScreenshotList() //鎴浘 + // getNotesList() // 鑾峰彇绗旇 + // getlineHeightList() //鑾峰彇楂樹寒 + // getScribeList() //鑾峰彇鍒掔嚎 + // getScreenshotList() //鎴浘 } ) //鑾峰彇鐩綍 @@ -1648,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: [] //绗旇 @@ -1664,11 +1670,12 @@ ///鍐呭閫変腑 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 } } @@ -1852,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 @@ -2182,7 +2255,6 @@ } const jumpContent = (id) => { - debugger if (window.qiankunState && window.qiankunState.gotoPage) window.qiankunState.gotoPage(5, 100) } -- Gitblit v1.9.1