Skip to content

Z
zys-ui
提交 5ef27afe authored 作者: 龙菲's avatar 龙菲
浏览文件
操作

创作界面更新；webofficeSdk更新

上级 4a674e5c
全部展开 显示空白字符变更
内嵌 并排
正在显示 包含 306 行增加 和 39 行删除
public/weboffice/web-office-sdk-v1.1.19.es.js 0 → 100644
浏览文件 @ 5ef27afe
差异被折叠。
src/assets/styles/index.scss
浏览文件 @ 5ef27afe
......@@ -180,3 +180,29 @@ aside {
margin-bottom: 10px;
}
}
/* 超出单行省略 */
.oneRow {
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
/* 超出两行省略 */
.twoRow {
width: 100%;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
/* 超出三行省略 */
.threeRow {
width: 100%;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
}
\ No newline at end of file
src/libs/qiwen/globalFunction/file.js
浏览文件 @ 5ef27afe
......@@ -82,7 +82,7 @@ const fileFunction = {
* @returns {string} 文件下载路径
*/
getDownloadFilePath(row) {
return `${process.env.VUE_APP_BASE_API}/filetransfer/downloadfile?userFileId=${row.userFileId
return `${process.env.VUE_APP_BASE_API}/v1/api/folder/transfer/downloadfile?userFileId=${row.userFileId
}&shareBatchNum=${row.shareBatchNum == null ? '' : row.shareBatchNum
}&extractionCode=${row.extractionCode == null ? '' : row.extractionCode}`
},
......@@ -358,31 +358,30 @@ const fileFunction = {
let resolve = router.resolve({
path: '/wpsReader',
query: {
wpsUrl: `https://wwo.wps.cn/office/w/2c9a8083849eac7001849eae1df50001?_w_userid=1638778159578505218&_w_filrread=1&_w_filetype=db&_w_filepath=http://222.85.214.245:9559/ls/public/stream?randomCode=4cfdfdb6c7364a5fb4f7dcf91c2edcdb&_w_tokentype=1&_w_appid=1058dd766ec443c79f95933ec6a41169&_w_redirectkey=123456&_w_signature=UkoKLjjF5pJq41JYHq2eeSNd5tc%3D`,
token: `37ce999a8ffe4daa86ecb18fab08e3be`
wpsUrl: `https://wwo.wps.cn/office/w/2c9a8083849eac7001849eae1df50001?_w_userid=1638778159578505218&_w_filrread=1&_w_filetype=db&_w_filepath=http://222.85.214.245:9559/ls/public/stream?randomCode=34df183096eb4996a93c3f779702e45d&_w_tokentype=1&_w_appid=1058dd766ec443c79f95933ec6a41169&_w_redirectkey=123456&_w_signature=E1OEcnnGEgVfK7mcnGDFgXJSLPY%3D`,
token: `0617753de96249a5a9839daf9b8ff8b5`
}
})
window.open(resolve.href, '_blank')
// getViewUrlDbPath(params).then(res => {
// if (res.data) {
// console.log(res.data);
// // console.log('res.data', res.data);
// // 跳转 使用sessionStorage，避免关键信息在ip中暴露
// // 使用push会停留当前页面，故不采纳
// // params 传递参数，子组件无法渲染iframe组件，故不采纳
// // localStorage.wpsUrl = res.data.wpsUrl
// // localStorage.token = res.data.token
// // let resolve = router.resolve({
// // path: '/wpsReader',
// // query: {
// // wpsUrl: res.data.wpsUrl,
// // token: res.data.token
// // }
// // })
// // window.open(resolve.href, '_blank')
// localStorage.wpsUrl = res.data.wpsUrl
// localStorage.token = res.data.token
// let resolve = router.resolve({
// path: '/wpsReader',
// query: {
// wpsUrl: res.data.wpsUrl,
// token: res.data.token
// }
// })
// router.push('/wpsReader')
return false
// window.open(resolve.href, '_blank')
// }
// })
// return false
}
// 若当前点击项是pdf
if (PDF.includes(row.extendName.toLowerCase())) {
......
src/views/read/wpsReader/component/addNote.vue
浏览文件 @ 5ef27afe
......@@ -7,15 +7,17 @@
placeholder="输入关键词搜索"
suffix-icon="el-icon-search"
v-model="searchValue"
clearable
></el-input>
<el-select
v-model="tagModelValue"
placeholder="请选择"
placeholder="请选择标签"
size="mini"
class="select"
clearable
>
<el-option
v-for="item in options"
v-for="item in tagList"
:key="item.value"
:label="item.label"
:value="item.value"
......@@ -23,11 +25,38 @@
</el-option>
</el-select>
</div>
<div class="note-list"></div>
<!-- {{ noteList }} -->
<div class="total">共{{ noteList.length }}条数据</div>
<div class="note-list">
<el-card
class="note-item"
v-for="(item, index) in noteList"
:key="index"
shadow="never"
>
<div class="tag">
<el-tag type="warning">{{ item.tag }}</el-tag>
<el-link>更多</el-link>
</div>
<div class="origin oneRow">
<i class="el-icon-document"></i>
原文：江湖一窗隔——读林青霞写自己的故事《窗里窗外》的原文
</div>
<div class="note twoRow">
<i class="el-icon-edit"></i>
笔记：{{ item.bookmarkContent }}
</div>
<div class="buttons">
<el-button type="primary" size="mini">引入笔记</el-button>
<el-button type="primary" size="mini" plain>引入原文</el-button>
</div>
</el-card>
</div>
</div>
</template>
<script>
import { noteList, tagList } from "./mockData";
export default {
data() {
return {
......@@ -35,18 +64,58 @@ export default {
tagModelValue: "",
//笔记搜索
searchValue: "",
noteList,
tagList,
};
},
};
</script>
<style lang="scss">
// .add-note {
// padding: 20px;
// }
.total,
.note-list,
.search {
padding: 0 20px;
}
.search {
width: 100%;
display: flex;
padding-left: 20px;
.input {
margin-right: 8px;
}
}
.total {
margin:20px 0 4px;
display: flex;
justify-content: flex-end;
font-style: 14px;
color: #999;
}
.note-list {
height: calc(100vh - 200px);
overflow: auto;
.note-item {
margin-bottom: 16px;
font-size: 14px;
.tag {
display: flex;
justify-content: space-between;
margin-bottom: 8px;
}
.origin,
.note {
margin-bottom: 8px;
}
.buttons {
margin-top: 16px;
display: flex;
.el-button {
flex: 1;
}
}
}
}
</style>
src/views/read/wpsReader/component/mockData.js 0 → 100644
浏览文件 @ 5ef27afe
export const tagList = [
{
label: '政策报告',
value: '政策报告'
},
{
label: '标签2',
value: '标签2'
},
{
label: '标签3',
value: '标签3'
}
]
export const noteList = [
{
"bookmarkContent": "前，写着她的所遇、所思、所感、所惑……体会着她\n人生中的酸甜苦辣。\n作为林青霞首部文学作品，《窗里窗外》披露",
"color": "#FFCD45",
"coords": "355.3691999999999,603.32065,535.7493999999999,603.32065,355.3691999999999,593.75815,535.7493999999999,593.75815,346.9609999999999,589.89065,419.4983,589.89065,346.9609999999999,580.32815,419.4983,580.32815,364.5347499999999,576.46065,520.5301499999998,576.46065,364.5347499999999,566.89815,520.5301499999998,566.89815",
"createTime": "2023-07-13 11:16:39",
"docId": "2c98e4068479d17c018479d2300d03bb",
"docName": "江湖一窗隔——读林青霞写自己的故事《窗里窗外》",
"docSType": "s_type_kbase",
"flags": "print",
"id": "1679328960700768257",
"isDelete": 0,
"mdate": "D:20230713111639+08'00'",
"page": 0,
"rect": "346.9609999999999,566.89815,535.7493999999999,603.32065",
"showType": "pdf",
"subject": "高亮",
"title": "zystest03",
"type": "highlight",
"uniqueId": "919edb36-8b4f-d840-ae92-564e5c56c7ad",
"updateTime": "2023-07-13 11:16:39",
"userId": "1",
"tag": "政策报告"
},
{
"bookmarkContent": "就是她不在江湖，江湖仍有她\n的传说。林青霞的新书《窗里窗外》一枝独",
"color": "#E44234",
"coords": "217.62510000000003,576.4604999999999,324.28225,576.4604999999999,217.62510000000003,566.8979999999999,324.28225,566.8979999999999,135.49555000000004,563.0305,280.20040000000006,563.0305,135.49555000000004,553.468,280.20040000000006,553.468",
"createTime": "2023-07-14 10:37:44",
"docId": "2c98e4068479d17c018479d2300d03bb",
"docName": "江湖一窗隔——读林青霞写自己的故事《窗里窗外》",
"docSType": "s_type_kbase",
"flags": "print",
"id": "1679681553947971586",
"isDelete": 0,
"mdate": "D:20230714103744+08'00'",
"page": 0,
"rect": "135.49555000000004,553.468,324.28225,576.4604999999999",
"showType": "pdf",
"subject": "下划线",
"title": "zystest03",
"type": "underline",
"uniqueId": "146f8fef-d3cb-a4cd-bb07-5ef130f5ff35",
"updateTime": "2023-07-14 10:37:44",
"userId": "1",
"tag": "政策报告"
},
{
"bookmarkContent": "前，写着她的所遇、所思、所感、所惑……体会着她\n人生中的酸甜苦辣。\n作为林青霞首部文学作品，《窗里窗外》披露",
"color": "#FFCD45",
"coords": "355.3691999999999,603.32065,535.7493999999999,603.32065,355.3691999999999,593.75815,535.7493999999999,593.75815,346.9609999999999,589.89065,419.4983,589.89065,346.9609999999999,580.32815,419.4983,580.32815,364.5347499999999,576.46065,520.5301499999998,576.46065,364.5347499999999,566.89815,520.5301499999998,566.89815",
"createTime": "2023-07-13 11:16:39",
"docId": "2c98e4068479d17c018479d2300d03bb",
"docName": "江湖一窗隔——读林青霞写自己的故事《窗里窗外》",
"docSType": "s_type_kbase",
"flags": "print",
"id": "1679328960700768257",
"isDelete": 0,
"mdate": "D:20230713111639+08'00'",
"page": 0,
"rect": "346.9609999999999,566.89815,535.7493999999999,603.32065",
"showType": "pdf",
"subject": "高亮",
"title": "zystest03",
"type": "highlight",
"uniqueId": "919edb36-8b4f-d840-ae92-564e5c56c7ad",
"updateTime": "2023-07-13 11:16:39",
"userId": "1",
"tag": "政策报告"
},
{
"bookmarkContent": "就是她不在江湖，江湖仍有她\n的传说。林青霞的新书《窗里窗外》一枝独",
"color": "#E44234",
"coords": "217.62510000000003,576.4604999999999,324.28225,576.4604999999999,217.62510000000003,566.8979999999999,324.28225,566.8979999999999,135.49555000000004,563.0305,280.20040000000006,563.0305,135.49555000000004,553.468,280.20040000000006,553.468",
"createTime": "2023-07-14 10:37:44",
"docId": "2c98e4068479d17c018479d2300d03bb",
"docName": "江湖一窗隔——读林青霞写自己的故事《窗里窗外》",
"docSType": "s_type_kbase",
"flags": "print",
"id": "1679681553947971586",
"isDelete": 0,
"mdate": "D:20230714103744+08'00'",
"page": 0,
"rect": "135.49555000000004,553.468,324.28225,576.4604999999999",
"showType": "pdf",
"subject": "下划线",
"title": "zystest03",
"type": "underline",
"uniqueId": "146f8fef-d3cb-a4cd-bb07-5ef130f5ff35",
"updateTime": "2023-07-14 10:37:44",
"userId": "1",
"tag": "政策报告"
}
]
\ No newline at end of file
src/views/read/wpsReader/component/rightPanel.vue
浏览文件 @ 5ef27afe
......@@ -3,12 +3,12 @@
<div class="left">
<div class="title">{{ currentTab }}</div>
<div class="left-content">
<AddNote v-if="currentTab == '插入笔记'" />
<AutoCheck v-if="currentTab == '自动检查'" />
<AutoClose v-if="currentTab == '自动补全'" />
<AddNote />
<!-- <AutoCheck v-if="currentTab == '自动检查'" />
<AutoClose v-if="currentTab == '自动补全'" /> -->
</div>
</div>
<div class="right">
<!-- <div class="right">
<div class="tabs">
<div
@click="handleClickTab(item)"
......@@ -19,7 +19,7 @@
{{ item }}
</div>
</div>
</div>
</div> -->
<div class="close">
<i class="el-icon-close"></i>
</div>
......@@ -58,8 +58,10 @@ export default {
display: flex;
padding: 40px 0 20px;
position: relative;
box-sizing: border-box;
flex: 1;
.left {
flex: 1;
padding-right: 16px;
.title {
font-weight: bold;
......
src/views/read/wpsReader/index.vue
浏览文件 @ 5ef27afe
<template>
<div class="wps-reader">
<div id="viewFile" class="file-container"></div>
<div id="wps-container" class="wps-container"></div>
<!-- <div
class="add-note-container"
:style="{ position: 'fixed', left: 0, top: 100, 'z-index': 9999999 }"
>
我是增加笔记的盒子
</div> -->
<RightPanel />
</div>
</template>
<script>
import WebOfficeSDK from "/public/weboffice/web-office-sdk-v1.1.8.es";
import WebOfficeSDK from "/public/weboffice/web-office-sdk-v1.1.19.es";
import RightPanel from "./component/rightPanel.vue";
export default {
components: {
RightPanel,
},
data() {
return {
wpsInstance: null, //wpsInstance
};
},
mounted() {
// // this.getBookList();
// console.log("WebOfficeSDK", WebOfficeSDK);
this.openWps(this.$route.query.wpsUrl, this.$route.query.token);
const { wpsUrl, token } = this.$route.query;
this.initWps(wpsUrl, token);
// // 监听鼠标
// document.addEventListener("mouseover", function (e) {
// console.log(e.clientX);
// console.log(e.clientY);
// });
const selection = window.getSelection() || document.getSelection();
if (selection) {
const currentRange = selection.getRangeAt(0);
this.selection = selection;
this.currentRange = currentRange;
}
},
destroyed() {
this.removeWps();
},
methods: {
async openWps(url, token) {
this.wps = WebOfficeSDK.config({
wpsUrl: url, // 如果需要通过js-sdk传递token方式鉴权，则需要包含_w_tokentype=1参数
mount: document.querySelector("#viewFile"),
// 初始化WPS
async initWps(wpsUrl, token) {
this.wpsInstance = WebOfficeSDK.config({
wpsUrl,
mount: document.querySelector("#wps-container"),
});
console.log("this.wps", this.wps);
this.wps.setToken({ token });
this.wps.ready();
this.wpsInstance.setToken({ token });
// 等待加载完毕
await this.wpsInstance.ready();
// 注册选取监听
this.wpsInstance.ApiEvent.AddApiEventListener(
"WindowSelectionChange",
(data) => {
this.handleSelectionChange(data);
}
);
},
// 监听选取变化
async handleSelectionChange(data) {
console.log("data", data);
const { begin, end } = data;
const app = this.wpsInstance.Application;
// 获取选中区域
const range = await app.ActiveDocument.Range(begin, end);
// 获取文本
const text = await range.Text;
console.log("text", text);
},
// 移除监听
removeWps() {
if (this.wpsInstance) {
this.wpsInstance.ApiEvent.RemoveApiEventListener(
"WindowSelectionChange",
this.handleSelectionChange
);
}
},
},
};
......@@ -32,10 +86,16 @@ export default {
<style lang="scss" scoped>
.wps-reader {
display: flex;
.file-container {
.wps-container {
width: 80vw;
height: 100vh;
overflow: hidden;
}
}
.add-note-container {
background-color: #999;
width: 100px;
height: 100px;
padding: 20px;
}
</style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论