| | |
| | | <div class="menuContent" v-if="menuState.open"> |
| | | <div class="searchBox"> |
| | | <div class="inputBox" v-if="activeMenu !== 2"> |
| | | <el-input class="custom-input" placeholder="请输入内容" v-model="searchText"> |
| | | <el-input |
| | | class="custom-input" |
| | | placeholder="请输入内容" |
| | | v-model="searchText" |
| | | @keyup.enter="searchBook" |
| | | > |
| | | <template #prefix> |
| | | <el-icon @click="searchBook"><Search /></el-icon> |
| | | <el-icon><Search /></el-icon> |
| | | </template> |
| | | </el-input> |
| | | </div> |
| | |
| | | <!-- 目录 --> |
| | | <div class="menuList" v-if="activeMenu == 0"> |
| | | <el-tree |
| | | ref="catalogTree" |
| | | style="max-width: 600px" |
| | | default-expand-all="true" |
| | | :data="catalogueData" |
| | | :props="defaultProps" |
| | | v-if="catalogueData.length > 0" |
| | | @node-click="handleNodeClick" |
| | | :filter-node-method="filterNode" |
| | | /> |
| | | <div v-if="catalogueData.length == 0"> |
| | | <el-empty :image-size="60" description="暂无数据" /> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="list-box"> |
| | | <div v-if="scribeData.noteList.length > 0 && !scribeData.loading"> |
| | | <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"> |
| | |
| | | <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 |
| | |
| | | {{ 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> |
| | |
| | | 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"> |
| | |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="screenshotClose">取 消</el-button> |
| | | <el-button type="primary" @click="addScreenshot" :loading="screenshotLoading">确 定</el-button> |
| | | <el-button type="primary" @click="addScreenshot" :loading="screenshotLoading" |
| | | >确 定</el-button |
| | | > |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | |
| | | windowSelection: (data) => { |
| | | // 绑定子应用选择监听事件 |
| | | console.log(data, '子应用选择') |
| | | if(data.txt){ |
| | | if (data.txt) { |
| | | getSelection(data) |
| | | }else{ |
| | | } else { |
| | | showToolBox.value = false |
| | | } |
| | | }, |
| | |
| | | // catalogName: "", |
| | | // } |
| | | console.log(data, '页面切换:目前显示页面和对应的章节信息') |
| | | }, |
| | | |
| | | } |
| | | }) |
| | | // 调用子层方法 |
| | | // if (window.qiankunState && window.qiankunState.aa) window.qiankunState.aa(1) |
| | |
| | | axios |
| | | .get(resourceUrl + '/1/information.json?t=123') |
| | | .then(function (response) { |
| | | console.log(response.data); |
| | | console.log(response.data) |
| | | var json = response.data |
| | | // 处理获取到的json数据 |
| | | catalogueData.value = json.data |
| | |
| | | children: 'children', |
| | | label: 'label' |
| | | } |
| | | const filterNode = (value, data) => { |
| | | if (!value) return true |
| | | return data.label.indexOf(value) !== -1 |
| | | } |
| | | |
| | | const handleNodeClick = (data) => { |
| | | document.getElementById(data.id).scrollIntoView() |
| | | console.log(data) |
| | | if (window.qiankunState && window.qiankunState.gotoPage) |
| | | window.qiankunState.gotoPage(data.chapter, data.start) |
| | | } |
| | | |
| | | //获取资源 |
| | |
| | | case '0': |
| | | break |
| | | case '1': |
| | | getNotesList() |
| | | // getSignData() |
| | | break |
| | | case '2': |
| | | break |
| | |
| | | } else { |
| | | menuState.notesColor = 'all' |
| | | } |
| | | getNotesList() |
| | | // getNotesList() |
| | | } |
| | | const catalogTree = ref() |
| | | const searchBook = async () => { |
| | | if (activeMenu.value == 0) { |
| | | if (catalogTree) catalogTree.value.filter(searchText.value) |
| | | } |
| | | if (activeMenu.value == 1) { |
| | | getNotesList() |
| | | // getNotesList() |
| | | getSignData() |
| | | } |
| | | if (activeMenu.value == 2) { |
| | | let dataList = JSON.parse(JSON.stringify(resourceDataList.value)) |
| | |
| | | const labelShow = (str) => {} |
| | | |
| | | //标签 |
| | | const reMark =() => { |
| | | |
| | | |
| | | } |
| | | const reMark = () => {} |
| | | //截图 |
| | | //截图事件 |
| | | function jitT() { |
| | |
| | | } |
| | | ] |
| | | } |
| | | }).then((res) => { |
| | | screenshotLoading.value = false |
| | | getScreenshotList() |
| | | nameData.value = '' |
| | | urlData.value = '' |
| | | floatingToolData.activeToolData = '' |
| | | screenshotVisble.value = false |
| | | }).catch(function (error) { |
| | | screenshotLoading.value = false |
| | | }) |
| | | .then((res) => { |
| | | screenshotLoading.value = false |
| | | getScreenshotList() |
| | | nameData.value = '' |
| | | urlData.value = '' |
| | | floatingToolData.activeToolData = '' |
| | | screenshotVisble.value = false |
| | | }) |
| | | .catch(function (error) { |
| | | screenshotLoading.value = false |
| | | }) |
| | | } else { |
| | | ElMessage.error('截图名称不能为空!') |
| | | } |
| | |
| | | case '高亮': |
| | | dom = 'highLightData-' + bookId.value |
| | | data = dialogToolData.lineHeight[dialogToolData.chapter] |
| | | if (!data) data = [] |
| | | data.push({ |
| | | id: toolClass.uuid(8), |
| | | txt: dialogToolData.txt, |
| | |
| | | case '划线': |
| | | dom = 'underline-' + bookId.value |
| | | data = dialogToolData.scribeList[dialogToolData.chapter] |
| | | if (!data) data = [] |
| | | data.push({ |
| | | id: toolClass.uuid(8), |
| | | txt: dialogToolData.txt, |
| | |
| | | case '笔记': |
| | | if (!formData.desc.replace(/^\s*|\s*$/g, '')) { |
| | | ElMessage.error('笔记内容不能为空!') |
| | | return |
| | | return |
| | | } |
| | | if (!noteColorActive.value) { |
| | | ElMessage.error('请选择笔记颜色!') |
| | | return |
| | | } |
| | | dom = 'notes-' + bookId.value |
| | | data = dialogToolData.notesList.length != 0 ? dialogToolData.notesList[dialogToolData.chapter] : [] |
| | | data = |
| | | dialogToolData.notesList.length != 0 ? dialogToolData.notesList[dialogToolData.chapter] : [] |
| | | if (!data) data = [] |
| | | data.push({ |
| | | id: toolClass.uuid(8), |
| | | txt: dialogToolData.txt, |
| | |
| | | createDate: new Date(), |
| | | note: formData.desc.replace(/^\s*|\s*$/g, '') |
| | | }) |
| | | |
| | | |
| | | break |
| | | } |
| | | request({ |
| | |
| | | } |
| | | }).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 getSignData = () => { |
| | |
| | | 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] |
| | |
| | | top: 0, |
| | | left: 0, |
| | | deleteType: '', |
| | | deleteTxt: '' |
| | | id: '' |
| | | }) |
| | | |
| | | // 划线、笔记、高亮点击回调 |
| | | window.signClick = (type, id)=>{ |
| | | console.log("signClick点击事件回调的实例", type, 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 |
| | |
| | | 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 |
| | | } |
| | | |
| | | 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 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() |
| | | }) |
| | | } |
| | | |
| | | const lineDeleteBtn = () => { |
| | |
| | | } |
| | | |
| | | //删除 |
| | | 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', |
| | |
| | | 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() |
| | | }) |
| | | } |
| | | } |
| | | |
| | | |
| | | //内容区域顶部显示 |
| | | |