From 1d88745fc1d5b2a62a6f2b9bca765c76ea48427c Mon Sep 17 00:00:00 2001 From: litian <2804272236@qq.com> Date: 星期三, 15 五月 2024 21:30:53 +0800 Subject: [PATCH] sc --- src/views/home.vue | 477 +++++++++++++++++++++++------------------------------------ 1 files changed, 189 insertions(+), 288 deletions(-) diff --git a/src/views/home.vue b/src/views/home.vue index 2ad5d0a..118f144 100644 --- a/src/views/home.vue +++ b/src/views/home.vue @@ -117,8 +117,12 @@ default-expand-all="true" :data="catalogueData" :props="defaultProps" + v-if="catalogueData.length > 0" @node-click="handleNodeClick" /> + <div v-if="catalogueData.length == 0"> + <el-empty :image-size="60" description="鏆傛棤鏁版嵁" /> + </div> </div> <!-- 绗旇 --> <div class="notesBox" v-if="activeMenu == 1"> @@ -140,8 +144,8 @@ </div> </div> <div class="list-box"> - <div v-if="scribeData.noteList.length > 0 && !scribeData.loading"> - <div v-for="(item, index) in scribeData.noteList" :key="item.key" class="listItem"> + <div v-if=" scribeData.noteList.length > 0"> + <div v-for="(item, index) in scribeData.noteList" :key="item.key" class="listItem"> <div class="textBox"> <div class="title"> <div class="title-con"> @@ -149,13 +153,13 @@ <span>{{ item.createDate }}</span> </div> <div> - <img :src="bianji" @click="update(item, 'note')" /> - <img :src="shanchu" @click="deleteBtn(item, 'note')" /> + <img :src="bianji" @click="update(item)" /> + <img :src="shanchu" @click="deleteBtn(item)" /> </div> </div> <div class="noteText hover 123456" - @click="jumpContent('note' + index)" + @click="jumpContent(item)" :style="{ background: item.color == '#F5E12A' @@ -171,15 +175,15 @@ : item.color }" > - <div class="con hover" @click="jumpContent('note' + index)"> + <div class="con hover"> {{ item.note }} </div> </div> - <div class="chapter">{{ item.selectText }}</div> + <div class="chapter">{{ item.txt }}</div> </div> </div> </div> - <div v-if="scribeData.noteList.length == 0 && !scribeData.loading"> + <div v-if=" scribeData.noteList.length == 0"> <el-empty :image-size="60" description="鏆傛棤鏁版嵁" /> </div> </div> @@ -324,7 +328,7 @@ </div> </div> <!-- 寰簲鐢ㄧ洅瀛� --> - <div class="pageBox-content" @scroll="pageScroll"> + <div class="pageBox-content"> <div class="content-box"> <div id="container" @@ -704,7 +708,7 @@ v-show="lineDelete.showLineDelete" :style="{ top: `${lineDelete.top}px`, left: `${lineDelete.left}px` }" > - <el-button @click="lineDeleteBtn">鍒犻櫎</el-button> + <el-button @click="delUserKey">鍒犻櫎</el-button> </div> <el-dialog title="璧勬簮" align-center v-model="resourVisble" width="845" class="resourDialog"> @@ -735,17 +739,17 @@ v-for="item in colorSelectList" :key="item.key" class="flex1 hover" - @click="clickSelect(item)" + @click="clickSelectColor(item)" > <div :style="{ background: item.key }" class="scribeItem"> - <img :src="xuanzhong" v-if="item.key == colorActive" /> + <img :src="xuanzhong" v-if="item.key == noteColorActive" /> </div> </div> </div> <template #footer> <span class="dialog-footer"> <el-button @click="handleClose">鍙� 娑�</el-button> - <el-button type="primary" @click="addNote">纭� 瀹�</el-button> + <el-button type="primary" @click="addUserKey">纭� 瀹�</el-button> </span> </template> </el-dialog> @@ -775,7 +779,7 @@ <template #footer> <span class="dialog-footer"> <el-button @click="screenshotClose">鍙� 娑�</el-button> - <el-button type="primary" @click="addScreenshot">纭� 瀹�</el-button> + <el-button type="primary" @click="addScreenshot" :loading="screenshotLoading">纭� 瀹�</el-button> </span> </template> </el-dialog> @@ -964,6 +968,7 @@ }, singular: true }) + window.qiankunActions.onGlobalStateChange((state, prev) => { console.log('鐖跺眰state鍙樺寲', state) bookName.value = state.bookName @@ -978,7 +983,11 @@ windowSelection: (data) => { // 缁戝畾瀛愬簲鐢ㄩ�夋嫨鐩戝惉浜嬩欢 console.log(data, '瀛愬簲鐢ㄩ�夋嫨') - getSelection(data) + if(data.txt){ + getSelection(data) + }else{ + showToolBox.value = false + } }, catalogChange: (data) => { activeCatalog.value = data.showCatalogList @@ -993,9 +1002,9 @@ // catalogName: "", // } console.log(data, '椤甸潰鍒囨崲锛氱洰鍓嶆樉绀洪〉闈㈠拰瀵瑰簲鐨勭珷鑺備俊鎭�') - } + }, + }) - // 璋冪敤瀛愬眰鏂规硶 // if (window.qiankunState && window.qiankunState.aa) window.qiankunState.aa(1) }) @@ -1023,11 +1032,12 @@ const catalogueData = ref([]) const getCatalogueData = () => { axios - .get(ctxUrl + '/catalog.json') + .get(resourceUrl + '/1/information.json?t=123') .then(function (response) { + console.log(response.data); var json = response.data // 澶勭悊鑾峰彇鍒扮殑json鏁版嵁 - catalogueData.value = json + catalogueData.value = json.data }) .catch(function (error) { console.log(error) @@ -1079,7 +1089,7 @@ const testWord = ref('') //word閾炬帴 const getResourceData = () => { axios - .get(ctxUrl + '/resource.json') + .get(resourceUrl + '/1/resource.json') .then(function (response) { var json = response.data // 澶勭悊鑾峰彇鍒扮殑json鏁版嵁 @@ -1183,7 +1193,7 @@ case '0': break case '1': - getNotesList() + // getSignData() break case '2': break @@ -1273,11 +1283,13 @@ } else { menuState.notesColor = 'all' } - getNotesList() + // getNotesList() } const searchBook = async () => { if (activeMenu.value == 1) { - getNotesList() + // getNotesList() + getSignData() + } if (activeMenu.value == 2) { let dataList = JSON.parse(JSON.stringify(resourceDataList.value)) @@ -1491,8 +1503,10 @@ const confirmDialog = ref<Boolean>(false) const screenshotVisble = ref<Boolean>(false) const nameData = ref('') //鎴浘鍚嶇О +const screenshotLoading = ref(false) const urlData = ref('') //鎴浘base64 const screenshotList = ref([]) +const screenshotData = ref([]) //娴獥宸ュ叿鏍忕偣鍑讳簨浠� const floatItemHandle = (item) => { @@ -1502,7 +1516,10 @@ canvasShow.value = true toolSelectData.activeTool = 'huabi' break + case '鏍囨敞': + break case '鏍囩': + reMark() break case '鎴睆': jitT() @@ -1577,9 +1594,14 @@ toolSelectData.fontSizeActive = str } -//鏍囩鏄剧ず闅愯棌 +//鏍囨敞鏄剧ず闅愯棌 const labelShow = (str) => {} +//鏍囩 +const reMark =() => { + + +} //鎴浘 //鎴浘浜嬩欢 function jitT() { @@ -1600,13 +1622,15 @@ console.log(base64) floatingToolData.activeToolData = '' } +//淇濆瓨鎴浘 const addScreenshot = () => { if (nameData.value) { - screenshotList.value.push({ + screenshotData.value.push({ createDate: new Date(), imgUrl: urlData.value, name: nameData.value }) + screenshotLoading.value = true request({ url: '/identity/api/ApiAppUserSetKey', method: 'post', @@ -1615,16 +1639,19 @@ { domain: 'screenshot', key: bookId.value, - value: JSON.stringify(screenshotList.value) + value: JSON.stringify(screenshotData.value) } ] } }).then((res) => { + screenshotLoading.value = false getScreenshotList() nameData.value = '' urlData.value = '' floatingToolData.activeToolData = '' screenshotVisble.value = false + }).catch(function (error) { + screenshotLoading.value = false }) } else { ElMessage.error('鎴浘鍚嶇О涓嶈兘涓虹┖!') @@ -1645,12 +1672,37 @@ }).then((res) => { if (res && res.length > 0 && res[0].value) { screenshotList.value = JSON.parse(res[0].value) + screenshotData.value = JSON.parse(res[0].value) } }) } +//鏌ョ湅鎴浘 const getCapture = (item) => { imgUrl.value = item.imgUrl confirmDialog.value = true +} +//鍒犻櫎鎴浘 +const deleteScreenshot = (item) => { + let list = screenshotList.value.filter((itemData) => itemData.imgUrl !== item.imgUrl) + request({ + url: '/identity/api/ApiAppUserSetKey', + method: 'post', + data: { + setKeyRequests: [ + { + domain: 'screenshot', + key: bookId.value, + value: JSON.stringify(list) + } + ] + } + }).then((res) => { + ElMessage({ + message: '鍒犻櫎鎴浘鎴愬姛!', + type: 'success' + }) + getScreenshotList() + }) } //閫変腑鏂囧瓧宸ュ叿鏍� @@ -1679,22 +1731,9 @@ } } -const pageScroll = (e) => { - // window.qiankunActions.setGlobalState({ - // gotoPage: (t, s) => { - // // 缁戝畾瀛愬簲鐢ㄩ�夋嫨鐩戝惉浜嬩欢 - // console.log(t, s, '瀛愬簲鐢ㄦ粴鍔�') - // } - // }) - showToolBox.value = false - lineDelete.showLineDelete = false - // let scroll = e.target.scrollTop - // let offsetHeight = document.getElementById('container').offsetHeight - // headerData.process = Math.round((scroll / offsetHeight) * 100) -} - const toolActive = ref('') const colorActive = ref('') +const noteColorActive = ref('') const dialogToolList = reactive([ { icon: gaoliang, activeIcon: gaoliang1, name: '楂樹寒' }, { icon: huaxian, activeIcon: huaxian1, name: '鍒掔嚎' }, @@ -1861,6 +1900,10 @@ colorActive.value = item.key addUserKey() } +//绗旇閫夐鑹� +const clickSelectColor = (item) => { + noteColorActive.value = item.key +} const addUserKey = () => { let dom = '' @@ -1888,6 +1931,28 @@ color: colorActive.value }) break + case '绗旇': + if (!formData.desc.replace(/^\s*|\s*$/g, '')) { + ElMessage.error('绗旇鍐呭涓嶈兘涓虹┖!') + return + } + if (!noteColorActive.value) { + ElMessage.error('璇烽�夋嫨绗旇棰滆壊!') + return + } + dom = 'notes-' + bookId.value + data = dialogToolData.notesList.length != 0 ? dialogToolData.notesList[dialogToolData.chapter] : [] + data.push({ + id: toolClass.uuid(8), + txt: dialogToolData.txt, + page: dialogToolData.page, + type: 'Note', + color: noteColorActive.value, + createDate: new Date(), + note: formData.desc.replace(/^\s*|\s*$/g, '') + }) + + break } request({ url: '/identity/api/ApiAppUserSetKey', @@ -1903,39 +1968,15 @@ } }).then((res) => { showToolBox.value = false + addNoteVisble.value = false colorActive.value = '' + noteColorActive.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({ @@ -1984,176 +2025,27 @@ } } }) -} - -const addNote = () => { - const obj = { - desc: formData.desc - } - if (!colorActive.value) { - ElMessage.error('璇烽�夋嫨绗旇棰滆壊!') - return - } - if (!lock.value) { - lock.value = true - if (formData.desc.replace(/^\s*|\s*$/g, '')) { - dialogToolData.notesList.push({ - selectNode: selectNode.value, - selectText: selectText.value, - color: colorActive.value, - selectPage: selectPage.value, - chapter: dialogToolData.chapter, - createDate: new Date(), - note: formData.desc.replace(/^\s*|\s*$/g, '') - }) - request({ - url: '/identity/api/ApiAppUserSetKey', - method: 'post', - data: { - setKeyRequests: [ - { - domain: 'notes', - key: bookId.value, - value: JSON.stringify(dialogToolData.notesList) - } - ] - } - }).then((res) => { - showToolBox.value = false - addNoteVisble.value = false - colorActive.value = '' - toolActive.value = '' - getNotesList() - setTimeout(() => { - lock.value = false - }, 1000) - }) - } else { - ElMessage.error('绗旇鍐呭涓嶈兘涓虹┖!') - lock.value = false - } - } -} -//绗旇 -const getNotesList = () => { - scribeData.noteList = [] - scribeData.loading = true request({ url: '/identity/api/ApiGetAppUserKey', method: 'post', data: { - domain: 'notes', - keys: [bookId.value] + domain: 'notes-' + bookId.value, + keys: activeCatalog.value.map((item) => item + '') } }).then((res) => { - if (res && res.length > 0 && res[0].value) { - dialogToolData.notesList = JSON.parse(res[0].value) - let list = JSON.parse(res[0].value) - let textDom1 = document.querySelector('.temp-book') - if (list.length > 0) { - list.forEach((item, index) => { - item.createDate = moment(item.createDate).format('YYYY-MM-DD') - if (searchText.value) { - searchText.value = searchText.value.replace(/^\s*|\s*$/g, '') - let text = searchText.value.replace(/^\s*|\s*$/g, '') - if (item.text.indexOf(text) > -1) { - if (menuState.notesColor == 'all') { - scribeData.noteList.push(item) - } else if (menuState.notesColor == item.color) { - scribeData.noteList.push(item) - } - } - } else { - if (menuState.notesColor == 'all') { - scribeData.noteList.push(item) - } else if (menuState.notesColor == item.color) { - scribeData.noteList.push(item) - } - } - //椤甸潰娣诲姞绗旇 - let rReg1 = new RegExp(`${item.selectText}`, 'ig') - let text1 = textDom1.innerHTML - let nHtmlText1 = item.selectNode - - let nHtml1 = '' - nHtml1 = nHtmlText1.replace( - rReg1, - `<span style="padding-bottom:2px; border-bottom: 2px solid;border-bottom-color:${item.color}" class="notesline">${item.selectText}</span><img src="${biji1}" style="cursor: pointer" onclick="notesVisbleShow('${item.selectText}')"/>` - ) - let rHtml1 = '' - rHtml1 = text1.replace(nHtmlText1, nHtml1) - textDom1.innerHTML = rHtml1 - }) - } - } - scribeData.loading = false - }) -} -//鍒掔嚎 -const getScribeList = () => { - scribeData.scribeDataList = [] - request({ - url: '/identity/api/ApiGetAppUserKey', - method: 'post', - data: { - domain: 'underline', - keys: [bookId.value] - } - }).then((res) => { - if (res && res.length > 0 && res[0].value) { - dialogToolData.scribeList = JSON.parse(res[0].value) - scribeData.scribeDataList = JSON.parse(res[0].value) - let textDom1 = document.querySelector('.temp-book') - if (scribeData.scribeDataList.length > 0) { - for (let i = 0; i < scribeData.scribeDataList.length; i++) { - let item = scribeData.scribeDataList[i] - let rReg1 = new RegExp(`${item.selectText}`, 'ig') - let text1 = textDom1.innerHTML - let nHtmlText1 = item.selectNode - - let nHtml1 = '' - nHtml1 = nHtmlText1.replace( - rReg1, - `<span style="text-decoration:underline;text-decoration-style: wavy;text-underline-thickness:2px;text-decoration-color:${item.color};cursor: pointer" class="underline" onclick="deleteScribeShow('${item.selectText}')">${item.selectText}</span>` - ) - let rHtml1 = '' - rHtml1 = text1.replace(nHtmlText1, nHtml1) - textDom1.innerHTML = rHtml1 - } - } - } - }) -} -//楂樹寒 -const getlineHeightList = () => { - scribeData.lineHeightList = [] - request({ - url: '/identity/api/ApiGetAppUserKey', - method: 'post', - data: { - domain: 'highLight', - keys: [bookId.value] - } - }).then((res) => { - if (res && res.length > 0 && res[0].value) { - dialogToolData.lineHeight = JSON.parse(res[0].value) - scribeData.lineHeightList = JSON.parse(res[0].value) - let textDom = document.querySelector('.temp-book') - if (scribeData.lineHeightList.length > 0) { - for (let i = 0; i < scribeData.lineHeightList.length; i++) { - let item = scribeData.lineHeightList[i] - let rReg = new RegExp(`${item.selectText}`, 'ig') - let text = textDom.innerHTML - let nHtmlText = item.selectNode - let nHtml = '' - nHtml = nHtmlText.replace( - rReg, - `<span style="background: ${item.color};padding:3px;cursor: pointer" class="highLight" onclick="deletelineHeightShow('${item.selectText}')">${item.selectText}</span>` - ) - // nHtmlText = nHtml - let rHtml = '' - rHtml = text.replace(nHtmlText, nHtml) - textDom.innerHTML = rHtml + if (res && res.length > 0) { + for (let i = 0; i < res.length; i++) { + const item = res[i] + const data = JSON.parse(item.value) + // 鍌ㄥ�� + scribeData.noteList = data + dialogToolData.notesList[item.key] = data + console.log(dialogToolData.notesList,"notesList") + // 娓叉煋 + for (let j = 0; j < data.length; j++) { + const citem = data[j] + if (window.qiankunState && window.qiankunState.renderSign) + window.qiankunState.renderSign(citem.type, citem) } } } @@ -2166,12 +2058,29 @@ top: 0, left: 0, deleteType: '', - deleteTxt: '' + id: '' }) + +// 鍒掔嚎銆佺瑪璁般�侀珮浜偣鍑诲洖璋� +window.signClick = (type, id)=>{ + console.log("signClick鐐瑰嚮浜嬩欢鍥炶皟鐨勫疄渚�", type, id); + // if (window.qiankunState && window.qiankunState.delSign) window.qiankunState.delSign({ids:[id]}) + if(type == 'Note'){ + let data = dialogToolData.notesList.filter((item) => id.indexOf(item.id) == -1) + console.log(data) + formData.desc = notes.note + noteColorActive.value = notes.color + addNoteVisble.value = true + }else{ + lineDelete.showLineDelete = true + lineDelete.deleteType = type + lineDelete.id = id + } +} window.notesVisbleShow = function (txt) { addNoteVisble.value = true - let notes = dialogToolData.notesList.find((item) => item.selectText == txt) + let notes = dialogToolData.notesList.find((item) => item.id == id) formData.desc = notes.note colorActive.value = notes.color selectNode.value = notes.selectNode @@ -2179,24 +2088,43 @@ selectPage.value = notes.selectPage dialogToolData.chapter = notes.chapter } - -window.deleteScribeShow = function (txt) { - let lines = scribeData.scribeDataList.find((item) => item.selectText == txt) - lineDelete.deleteType = 'underline' - lineDelete.deleteTxt = txt - lineDelete.top = event.screenY - lineDelete.left = event.screenX - lineDelete.showLineDelete = true +const delUserKey = () => { + let type = lineDelete.deleteType + let ids = lineDelete.id + let dom = '' + let data = null + 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) + console.log(data[0]) + let list = data[0].filter((item) => item.id != ids) + console.log(list) + request({ + url: '/identity/api/ApiAppUserSetKey', + method: 'post', + data: { + setKeyRequests: [ + { + domain: dom, + key: dialogToolData.chapter, + value: JSON.stringify(list) + } + ] + } + }).then((res) => { + if (window.qiankunState && window.qiankunState.delSign) window.qiankunState.delSign({ids:[ids]}) + getSignData() + }) } -window.deletelineHeightShow = function (txt) { - let lines = scribeData.lineHeightList.find((item) => item.selectText == txt) - lineDelete.deleteType = 'highLight' - lineDelete.deleteTxt = txt - lineDelete.top = event.screenY - lineDelete.left = event.screenX - lineDelete.showLineDelete = true -} const lineDeleteBtn = () => { if (lineDelete.deleteType == 'underline') { @@ -2254,29 +2182,32 @@ } } -const jumpContent = (id) => { +//绗旇璺宠浆 +const jumpContent = (item) => { + console.log(item) if (window.qiankunState && window.qiankunState.gotoPage) window.qiankunState.gotoPage(5, 100) } +//绗旇缂栬緫 const update = (item, type) => { dialogToolData.notesList.splice( dialogToolData.notesList.findIndex((itemData) => itemData.selectText == item.selectText), 1 ) - selectNode.value = item.selectNode - selectText.value = item.selectText - selectPage.value = item.selectPage - colorActive.value = item.color + dialogToolData.txt = item.txt + dialogToolData.page = item.page + dialogToolData.chapter = item.chapterNum + noteColorActive.value = item.color dialogToolData.chapter = item.chapter formData.desc = item.note addNoteVisble.value = true } //鍒犻櫎 -const deleteBtn = (item, type) => { +const deleteBtn = (item) => { if (type == 'note') { // 绉婚櫎 - let list = scribeData.noteList.filter((itemData) => itemData.selectText !== item.selectText) + let list = dialogToolData.noteList.filter((itemData) => itemData.id !== item.id) request({ url: '/identity/api/ApiAppUserSetKey', method: 'post', @@ -2294,43 +2225,13 @@ message: '鍒犻櫎绗旇鎴愬姛!', type: 'success' }) - console.log(document.querySelectorAll('.notesline')) - let list = document.querySelectorAll('.notesline') - list.forEach((itemNode) => { - if (itemNode.innerText == item.selectText) { - console.log(itemNode.nextSibling) - itemNode.removeAttribute('style') - itemNode.nextSibling?.remove() - } - }) + if (window.qiankunState && window.qiankunState.delSign) window.qiankunState.delSign({ids:[id]}) getNotesList() }) } } -//鍒犻櫎鎴浘 -const deleteScreenshot = (item) => { - let list = screenshotList.value.filter((itemData) => itemData.imgUrl !== item.imgUrl) - request({ - url: '/identity/api/ApiAppUserSetKey', - method: 'post', - data: { - setKeyRequests: [ - { - domain: 'screenshot', - key: bookId.value, - value: JSON.stringify(list) - } - ] - } - }).then((res) => { - ElMessage({ - message: '鍒犻櫎鎴浘鎴愬姛!', - type: 'success' - }) - getScreenshotList() - }) -} + //鍐呭鍖哄煙椤堕儴鏄剧ず const headerData = reactive({ -- Gitblit v1.9.1