Skip to content

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

完善创建笔记模块

上级 b03e1a2d
隐藏空白字符变更
内嵌 并排
正在显示 包含 482 行增加 和 155 行删除
src/api/resource/index.js 0 → 100644
浏览文件 @ 0cf88b42
/**
* 资源社区相关接口
*/
import request from '@/utils/request'
const baseUrl = '/v1/api'
// 报纸列表查询
export const getNewspaperList = (params) => {
return request({
url: baseUrl + '/paper/newspaper',
method: 'get',
params
})
}
// 期刊列表查询
export const getPeriodicalsList = (params) => {
return request({
url: baseUrl + '/paper/periodicals',
method: 'get',
params
})
}
// 会议列表查询
export const getConferenceList = (params) => {
return request({
url: baseUrl + '/paper/conference',
method: 'get',
params
})
}
// 论文列表查询
export const getThesisList = (params) => {
return request({
url: baseUrl + '/paper/thesis',
method: 'get',
params
})
}
\ No newline at end of file
src/assets/icons/svg/highlight2.svg 0 → 100644
浏览文件 @ 0cf88b42
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1695188018125" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2762" xmlns:xlink="http://www.w3.org/1999/xlink" width="80" height="80"><path d="M984.687304 758.316522H39.312696A17.051826 17.051826 0 0 1 22.26087 741.220174V285.629217c0-9.394087 7.635478-17.029565 17.051826-17.029565h945.374608c9.416348 0 17.051826 7.613217 17.051826 17.029565V741.286957a17.051826 17.051826 0 0 1-17.051826 17.051826" p-id="2763"></path><path d="M897.224348 22.26087H126.775652a33.391304 33.391304 0 0 0-33.391304 33.391304v111.104a33.391304 33.391304 0 0 0 66.782609 0v-77.690435h318.041043V937.850435h-68.85287a33.391304 33.391304 0 1 0 0 66.782608h204.466087a33.391304 33.391304 0 1 0 0-66.782608h-68.830608V89.043478h318.842434v77.690435a33.391304 33.391304 0 1 0 66.782609 0v-111.081739a33.391304 33.391304 0 0 0-33.391304-33.391304" p-id="2764"></path></svg>
\ No newline at end of file
src/assets/icons/svg/字体下划线.svg 0 → 100644
浏览文件 @ 0cf88b42
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1695188014215" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2615" xmlns:xlink="http://www.w3.org/1999/xlink" width="80" height="80"><path d="M512 811.296a312 312 0 0 0 312-312V89.6h-112v409.696a200 200 0 1 1-400 0V89.6h-112v409.696a312 312 0 0 0 312 312zM864 885.792H160a32 32 0 0 0 0 64h704a32 32 0 0 0 0-64z" p-id="2616"></path></svg>
\ No newline at end of file
src/components/file/box/uploadFile/Box.vue
浏览文件 @ 0cf88b42
...@@ -314,7 +314,6 @@ export default { ...@@ -314,7 +314,6 @@ export default {
this.callback(false); this.callback(false);
return; return;
} }
let result = JSON.parse(response); let result = JSON.parse(response);
if (result.code === 200) { if (result.code === 200) {
this.uploadStatus[file.id] = ""; this.uploadStatus[file.id] = "";
...@@ -323,9 +322,13 @@ export default { ...@@ -323,9 +322,13 @@ export default {
this.$message.success(`上传完毕`); this.$message.success(`上传完毕`);
// callType 调用此服务的方式：1 - 顶部栏，2 - 右键菜单 // callType 调用此服务的方式：1 - 顶部栏，2 - 右键菜单
if (this.callType === 1) { if (this.callType === 1) {
this.serviceEl.$emit("getTableDataByType"); if (this.serviceEl) {
this.serviceEl.$emit("getTableDataByType");
}
} else { } else {
this.serviceEl.getTableDataByType(); if (this.serviceEl) {
this.serviceEl.getTableDataByType();
}
} }
// this.serviceEl.$store.dispatch("showStorage"); // this.serviceEl.$store.dispatch("showStorage");
this.callback(true); this.callback(true);
......
src/libs/qiwen/globalFunction/file.js
浏览文件 @ 0cf88b42
...@@ -338,11 +338,10 @@ const fileFunction = { ...@@ -338,11 +338,10 @@ const fileFunction = {
// 实际实现逻辑---start // 实际实现逻辑---start
const params = { const params = {
fileId: fileId || id, fileId: fileId || id,
flag flag:false
} }
getViewUrlDbPath(params).then(res => { getViewUrlDbPath(params).then(res => {
if (res.data) { if (res.data) {
// console.log('res.data', res.data);
// 跳转 使用sessionStorage，避免关键信息在ip中暴露 // 跳转 使用sessionStorage，避免关键信息在ip中暴露
// 使用push会停留当前页面，故不采纳 // 使用push会停留当前页面，故不采纳
// params 传递参数，子组件无法渲染iframe组件，故不采纳 // params 传递参数，子组件无法渲染iframe组件，故不采纳
...@@ -354,7 +353,8 @@ const fileFunction = { ...@@ -354,7 +353,8 @@ const fileFunction = {
wpsUrl: res.data.wpsUrl, wpsUrl: res.data.wpsUrl,
token: res.data.token, token: res.data.token,
fileId, fileId,
extendName extendName,
readOnly: !flag,//是否只读flag为True是可编辑
} }
}) })
window.open(resolve.href, '_blank') window.open(resolve.href, '_blank')
......
src/views/mine/myNote/components/noteOperationMixins.js
浏览文件 @ 0cf88b42
...@@ -42,26 +42,26 @@ export default { ...@@ -42,26 +42,26 @@ export default {
} }
}, },
// 打开笔记 // 打开笔记编辑框
handleOpenEditNote(item) { handleOpenEditNote(item) {
const { id, docId, bookmarkContent, noteContent, tagName } = item; const { id, docId, bookmarkContent, noteContent, tagName, jsonStr } = item;
this.form = { this.form = {
id, id,
docId, docId,
bookmarkContent, bookmarkContent,
noteContent, noteContent,
jsonStr,
tagsArr: tagName && tagName.length > 0 ? tagName.split(",") : [], tagsArr: tagName && tagName.length > 0 ? tagName.split(",") : [],
}; };
console.log("------------this.form ", this.form);
this.$refs.AddOrUpdateNoteDialog.dialogVisible = true; this.$refs.AddOrUpdateNoteDialog.dialogVisible = true;
}, },
// 删除笔记 // 删除笔记
async handleDeleteNote(item) { async handleDeleteNote(item) {
// this.loading = true;
const params = { const params = {
id: item.id, id: item.id,
}; };
let res = await deleteNote(params); let res = await deleteNote(params);
// this.loading = false;
if (res.code == 200) { if (res.code == 200) {
this.$message.success("操作成功"); this.$message.success("操作成功");
this.loadLeftList(); this.loadLeftList();
......
src/views/read/wpsReader/component/addOrUpdateNoteDialog.vue
浏览文件 @ 0cf88b42
...@@ -7,16 +7,15 @@ ...@@ -7,16 +7,15 @@
:close-on-click-modal="false" :close-on-click-modal="false"
:close-on-press-escape="false" :close-on-press-escape="false"
:append-to-body="true" :append-to-body="true"
v-loading="loading"
> >
<el-form <el-form
:model="form" :model="form"
label-width="50px" label-width="80px"
:rules="rules" :rules="rules"
ref="form" ref="form"
size="mini" size="mini"
> >
<el-form-item label="原文"> <el-form-item label="原文" prop="bookmarkContent">
<el-input <el-input
type="textarea" type="textarea"
rows="5" rows="5"
...@@ -41,7 +40,7 @@ ...@@ -41,7 +40,7 @@
remote remote
default-first-option default-first-option
allow-create allow-create
placeholder="请输入文章标签（可多个）" placeholder="请输入文章标签"
:remote-method="remoteMethod" :remote-method="remoteMethod"
:loading="loading" :loading="loading"
> >
...@@ -54,14 +53,43 @@ ...@@ -54,14 +53,43 @@
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="标记方式">
<el-radio-group v-model="markingMode">
<el-radio label="下划线">
<svg-icon
icon-class="underline"
style="margin-right: 4px"
></svg-icon
>下划线
</el-radio>
<el-radio label="高亮">
<svg-icon
icon-class="highlight2"
style="margin-right: 4px"
></svg-icon
>高亮
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="标记颜色">
<el-row class="color-container">
<el-col
@click.native="handleClickColor(item)"
:span="6"
v-for="(item, index) in colorList"
:key="index"
:class="[`color-item`, currentColor == item ? 'active' : '']"
:style="{ background: item }"
></el-col>
</el-row>
</el-form-item>
<el-form-item> <el-form-item>
<div class="buttons"> <div class="buttons">
<el-button <el-button
style="width: 100%" style="width: 100%"
type="primary" type="primary"
size="mini" size="mini"
icon="el-icon-check" @click.native="handleSubmitAddNote"
@click="handleSubmitAddNote"
>提交</el-button >提交</el-button
> >
<el-button <el-button
...@@ -85,14 +113,22 @@ export default { ...@@ -85,14 +113,22 @@ export default {
props: { props: {
formData: { formData: {
type: Object, type: Object,
default: () => ({ default: () => ({}),
id: "", //笔记id
docId: "", //文档Id
bookmarkContent: "", //笔记内容
noteContent: "", //标签，提交给后台的时候使用多个用逗号分割
tagsArr: [], //笔记标签
}),
}, },
// formData: {
// type: Object,
// default: () => ({
// id: "", //笔记id
// docId: "", //文档Id
// bookmarkContent: "", //笔记内容
// noteContent: "", //标签，提交给后台的时候使用多个用逗号分割
// tagsArr: [], //笔记标签
// jsonStr: {
// markingMode: "下划线", //标记方式
// color: "#ffff00", //标记颜色
// },
// }),
// },
}, },
data() { data() {
return { return {
...@@ -104,12 +140,23 @@ export default { ...@@ -104,12 +140,23 @@ export default {
bookmarkContent: "", //原文 bookmarkContent: "", //原文
noteContent: "", //笔记 noteContent: "", //笔记
tagsArr: "", //标签，提交给后台的时候使用多个用逗号分割 tagsArr: "", //标签，提交给后台的时候使用多个用逗号分割
jsonStr: {
markingMode: "下划线",
color: "#ffff00", //标记颜色
},
type: "note", // 笔记类型，新增时必传，[underline-下划线,note-笔记,highlight-高亮] type: "note", // 笔记类型，新增时必传，[underline-下划线,note-笔记,highlight-高亮]
offset: "0", //偏移量，新增时必传 offset: "0", //偏移量，新增时必传
sectionId: "0", //父节点ID，新增时必传 sectionId: "0", //父节点ID，新增时必传
}, },
options: [], //标签可选项 options: [], //标签可选项
rules: { rules: {
bookmarkContent: [
{
required: true,
message: "请输入原文",
trigger: "change",
},
],
noteContent: [ noteContent: [
{ {
required: true, required: true,
...@@ -119,12 +166,39 @@ export default { ...@@ -119,12 +166,39 @@ export default {
], ],
}, },
loading: false, loading: false,
colorList: [
"#ffff00",
"#00ff00",
"#00ffff",
"#ff00ff",
"#0000ff",
"#ff0000",
"#000080",
"#008080",
"#008000",
"#800080",
"#800000",
"#808000",
"#808080",
"#c0c0c0",
// "#000000",
],
currentColor: "#ffff00",
markingMode: "下划线",
}; };
}, },
watch: { watch: {
formData: { formData: {
handler(value) { handler(value) {
this.form = { ...this.form, ...value }; this.form = { ...this.form, ...value };
console.log('this.form',this.form);
const { jsonStr } = this.form;
// 解析从后台穿过来的json串，如果没有值则需要给默认值
if (jsonStr && typeof jsonStr == "string") {
this.form.jsonStr = JSON.parse(jsonStr);
}
this.currentColor = this.form.jsonStr.color; //回显颜色
this.markingMode = this.form.jsonStr.markingMode; //回显标记方式
}, },
deep: true, deep: true,
immediate: true, immediate: true,
...@@ -138,6 +212,9 @@ export default { ...@@ -138,6 +212,9 @@ export default {
if (valid) { if (valid) {
this.loading = true; this.loading = true;
const formData = new FormData(); const formData = new FormData();
this.form.jsonStr.color = this.currentColor;
this.form.jsonStr.markingMode = this.markingMode;
this.form.jsonStr = JSON.stringify(this.form.jsonStr); //字符串化jsonStr,传给后台的是json字符串
for (const key in this.form) { for (const key in this.form) {
if (key == "tagsArr") { if (key == "tagsArr") {
formData.append("tags", this.form.tagsArr.join(",")); formData.append("tags", this.form.tagsArr.join(","));
...@@ -190,6 +267,10 @@ export default { ...@@ -190,6 +267,10 @@ export default {
this.options = []; this.options = [];
} }
}, },
// 点击选择颜色
handleClickColor(color) {
this.currentColor = color;
},
}, },
}; };
</script> </script>
...@@ -205,4 +286,19 @@ export default { ...@@ -205,4 +286,19 @@ export default {
margin-top: 10px; margin-top: 10px;
} }
} }
.color-container {
.color-item {
width: 20px;
height: 20px;
margin: 0 8px 8px 0;
border: 2px solid transparent;
cursor: pointer;
&:hover {
border: 2px solid #666;
}
}
.active {
border: 2px solid #666;
}
}
</style> </style>
src/views/read/wpsReader/component/mockData.js
浏览文件 @ 0cf88b42
...@@ -13,29 +13,34 @@ export const tagList = [ ...@@ -13,29 +13,34 @@ export const tagList = [
} }
] ]
export const noteList = [ export const notes = [
{ {
"bookmarkContent": "加强协同推进，通力合作强作为出成效 全市各级各部门要严格对照《分工方案》相关工作要求，", "id": "1704408080194179074",
"noteContent": "加强协同推进，通力合作强作为出成效 全市各级各部门要严格对照《分工方案》相关工作要求，",
"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", "userId": "1",
"tag": "政策报告" "docId": "1704026320359841792",
}, "bookmarkContent": "1. 学会跟困难打交道、“掰手腕”，无论何时遇到何种困难，都把它当作砥砺\r\n",
"offset": "0",
"createTime": "2023-09-20T16:12:07.000+08:00",
"updateTime": "2023-09-20T16:12:07.000+08:00",
"isDelete": 0,
"noteContent": "1. 学会跟困难打交道、“掰手腕”，无论何时遇到何种困难，都把它当作砥砺",
"sectionId": "0",
"docName": "汇报稿(测试文件)",
"type": "note",
"docSType": "doc",
"showType": "html",
"uniqueId": null,
"page": null,
"rect": null,
"color": null,
"flags": null,
"title": null,
"subject": null,
"mdate": null,
"coords": null,
"inreplyto": null,
"xmlStr": null,
"tagName": "金句",
"jsonStr": '{"markingMode":"下划线","color":"#00ffff","start":"10","end":"20","page":2}'
}
] ]
\ No newline at end of file
src/views/read/wpsReader/component/insertNote.vue → src/views/read/wpsReader/component/noteList.vue
浏览文件 @ 0cf88b42
...@@ -92,7 +92,7 @@ ...@@ -92,7 +92,7 @@
></span> ></span>
<span v-else :title="item.noteContent"> {{ item.noteContent }}</span> <span v-else :title="item.noteContent"> {{ item.noteContent }}</span>
</div> </div>
<div class="buttons"> <div class="buttons" v-if="!readOnly">
<el-button <el-button
type="primary" type="primary"
size="mini" size="mini"
...@@ -135,12 +135,19 @@ ...@@ -135,12 +135,19 @@
</template> </template>
<script> <script>
// import { noteList, tagList } from "./mockData"; import { notes } from "./mockData";
import { getNoteByTag, getNoteAllTagList } from "@/api/doc/index"; import { getNoteByTag, getNoteAllTagList } from "@/api/doc/index";
import noteOperationMixins from "@/views/mine/myNote/components/noteOperationMixins"; import noteOperationMixins from "@/views/mine/myNote/components/noteOperationMixins";
export default { export default {
//noteOperationMixins主要混入属性form、handleNoteOperation方法、AddOrUpdateNoteDialog组件 //noteOperationMixins主要混入属性form、handleNoteOperation方法、AddOrUpdateNoteDialog组件
mixins: [noteOperationMixins], mixins: [noteOperationMixins],
props: {
// 是否只读，若只读可以新建笔记和查看笔记列表，若可以编辑则只能查看笔记列表
readOnly: {
type: Boolean,
default: true,
},
},
data() { data() {
return { return {
searchParams: { searchParams: {
...@@ -166,7 +173,7 @@ export default { ...@@ -166,7 +173,7 @@ export default {
}, },
], ],
noteList: { noteList: {
records: [], records: notes,
current: 1, current: 1,
size: 20, size: 20,
total: 0, total: 0,
...@@ -180,7 +187,7 @@ export default { ...@@ -180,7 +187,7 @@ export default {
}; };
}, },
mounted() { mounted() {
this.loadNoteList(); // this.loadNoteList();
}, },
methods: { methods: {
// 加载笔记列表 // 加载笔记列表
...@@ -291,6 +298,9 @@ export default { ...@@ -291,6 +298,9 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.add-note {
width: 100%;
}
.total, .total,
.note-list, .note-list,
.search { .search {
......
src/views/read/wpsReader/component/rightPanel.vue
浏览文件 @ 0cf88b42
<template> <template>
<div class="panel"> <div class="panel">
<div class="left"> <!-- <div :span="4" class="top">
<div class="title">插入笔记</div> <el-row class="tabs">
<el-col
:span="12"
:class="['tab-item', item == currentTab ? 'active' : '']"
@click="handleClickTab(item)"
v-for="(item, index) in tabs"
:key="index"
>
{{ item }}
</el-col>
</el-row>
</div> -->
<div :span="20" class="content">
<div class="title">我的笔记</div>
<div class="left-content"> <div class="left-content">
<InsertNote <!-- <AddNewNote
ref="InsertNote" v-if="currentTab==='新建笔记'"
ref="AddNote"
/> -->
<NoteList
ref="NoteList"
:readOnly="readOnly"
@insertText="handleInsertText" @insertText="handleInsertText"
@handleOpenAddUpdateDialog="handleOpenAddUpdateDialog" @handleOpenAddUpdateDialog="handleOpenAddUpdateDialog"
/> />
</div> </div>
</div> </div>
<div <div
:title="visible?'收起面板':'插入笔记'" :title="visible ? '收起面板' : '插入笔记'"
:class="['close', !visible ? 'hidden' : '']" :class="['close', !visible ? 'hidden' : '']"
@click="handleToggleNotePanel" @click="handleToggleNotePanel"
> >
...@@ -21,21 +39,31 @@ ...@@ -21,21 +39,31 @@
</template> </template>
<script> <script>
import InsertNote from "./insertNote.vue"; import NoteList from "./noteList.vue";
export default { export default {
name: "rightPanel", name: "rightPanel",
components: { components: {
InsertNote, NoteList,
},
props: {
// 是否只读，若只读可以新建笔记和查看笔记列表，若可以编辑则只能查看笔记列表
readOnly: {
type: Boolean,
default: true,
},
}, },
data() { data() {
return { return {
visible: false, //面板的可见性，用于控制按钮是否是悬浮 visible: false, //面板的可见性，用于控制按钮是否是悬浮
tabs: ["新建笔记", "我的笔记"],
currentTab: "新建笔记",
}; };
}, },
methods: { methods: {
// 获取笔记 // 获取笔记
loadNoteData() { loadNoteData() {
this.$refs.InsertNote.loadData(); this.$refs.NoteList.NoteList();
}, },
//插入文字 //插入文字
handleInsertText(value) { handleInsertText(value) {
...@@ -50,22 +78,28 @@ export default { ...@@ -50,22 +78,28 @@ export default {
this.visible = !this.visible; this.visible = !this.visible;
this.$emit("handleToggleNotePanel"); this.$emit("handleToggleNotePanel");
}, },
// 点击右侧tab
handleClickTab(tab) {
this.currentTab = tab;
},
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.panel { .panel {
display: flex; // display: flex;
padding: 20px 0; // justify-content: space-between;
// padding: 20px 0;
position: relative; position: relative;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
border-left: 1px solid #e6ebf5; border-left: 1px solid #e6ebf5;
background-color: #fff; background-color: #fff;
.left { .content {
padding-right: 16px; // width: 100%;
width: 100%; padding-top: 20px;
flex: 1;
.title { .title {
font-weight: bold; font-weight: bold;
display: flex; display: flex;
...@@ -75,10 +109,13 @@ export default { ...@@ -75,10 +109,13 @@ export default {
.left-content { .left-content {
} }
} }
.right { .top {
margin-top: 20px; // margin-top: 20px;
width: 66px; // width: 66px;
// margin-bottom: 10px;
.tabs { .tabs {
display: flex;
justify-content: center;
.tab-item { .tab-item {
text-align: center; text-align: center;
padding: 14px; padding: 14px;
......
src/views/read/wpsReader/index.vue
浏览文件 @ 0cf88b42
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
<div ref="myIframe" id="wps-container" class="wps-container"></div> <div ref="myIframe" id="wps-container" class="wps-container"></div>
<RightPanel <RightPanel
ref="RightPanel" ref="RightPanel"
:readOnly="routeParams.readOnly"
:class="[ :class="[
'right-panel', 'right-panel',
panelVisible ? 'translateXLeft' : 'translateXRight', panelVisible ? 'translateXLeft' : 'translateXRight',
...@@ -30,6 +31,7 @@ import RightPanel from "./component/rightPanel.vue"; ...@@ -30,6 +31,7 @@ import RightPanel from "./component/rightPanel.vue";
import AddOrUpdateNoteDialog from "./component/addOrUpdateNoteDialog.vue"; import AddOrUpdateNoteDialog from "./component/addOrUpdateNoteDialog.vue";
import { addNearRead } from "@/api/user"; import { addNearRead } from "@/api/user";
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
import { getNoteByTag, getNoteAllTagList } from "@/api/doc/index";
export default { export default {
components: { components: {
RightPanel, RightPanel,
...@@ -46,9 +48,13 @@ export default { ...@@ -46,9 +48,13 @@ export default {
bookmarkContent: "", //原文内容 bookmarkContent: "", //原文内容
noteContent: "", //笔记内容 noteContent: "", //笔记内容
tagsArr: [], //标签 tagsArr: [], //标签
jsonStr: {
//笔记在文档中位置的详细信息（包括标记方式、颜色、页码、起始位置等）
markingMode: "下划线", //标记方式
color: "#ffff00", //标记颜色
},
}, },
panelVisible: false, //笔记的窗口 panelVisible: false, //笔记的窗口
// isSidebarOpen:false
}; };
}, },
computed: { computed: {
...@@ -57,106 +63,90 @@ export default { ...@@ -57,106 +63,90 @@ export default {
}, },
}, },
mounted() { mounted() {
const { wpsUrl, token, fileId } = this.$route.query; const { wpsUrl, token, fileId, extendName, readOnly } = this.$route.query;
this.routeParams = { wpsUrl, token, fileId }; this.routeParams = {
wpsUrl,
token,
fileId,
extendName,
readOnly: Boolean(readOnly),
};
this.form.docId = fileId; this.form.docId = fileId;
this.initWps(wpsUrl, token, fileId); this.initWps(wpsUrl, token, fileId);
}, },
destroyed() { destroyed() {
this.removeSelectionChangeListener(); this.removeDocSelectionListener();
}, },
methods: { methods: {
// 新增阅读记录
async addViewRecord() {
const params = {
docId: this.routeParams.fileId,
docSType: "docx", //枚举值docx,pdf
};
console.log("params", params);
return;
try {
let res = await addNearRead(params);
if (res.code == 200) {
console.log(123);
} else {
throw res.code;
}
} catch (error) {
console.error(error);
}
},
// 初始化WPS // 初始化WPS
async initWps(wpsUrl, token, fileId) { async initWps(wpsUrl, token, fileId) {
this.wpsInstance = WebOfficeSDK.config({ this.wpsInstance = WebOfficeSDK.config({
wpsUrl, wpsUrl,
mount: document.querySelector("#wps-container"), mount: document.querySelector("#wps-container"),
}); });
this.wpsInstance.setToken({ token }); this.wpsInstance.setToken({ token });
this.wpsInstance.ApiEvent.AddApiEventListener("fileOpen", (data) => {
console.log("fileOpen: ", data);
});
// 等待加载完毕 // 等待加载完毕
await this.wpsInstance.ready(); await this.wpsInstance.ready();
const app = this.wpsInstance.Application; // 增加浏览记录
console.log("app", app);
this.addSelectionListen();
this.initAddNoteButton();
this.addViewRecord(); this.addViewRecord();
const { readOnly } = this.routeParams;
console.log("readOnly", readOnly);
// 只有只读的才能新建笔记和监听
if (readOnly) {
// this.initAddNoteButton();
this.addDocSelectionListen();
}
},
// 新增阅读记录
async addViewRecord() {
const params = {
docId: this.routeParams.fileId,
docSType: "docx", //枚举值docx,pdf
};
await addNearRead(params);
}, },
// 添加监听选取文字 // // 高亮文本
addSelectionListen() { // async highlightSelection() {
// const app = this.wpsInstance.Application;
// const font = await app.ActiveDocument.Range(118, 207).Font;
// // 设置选定文字的高亮颜色
// font.HighLight = "#228B22";
// },
// 添加DOC监听选取文字
addDocSelectionListen() {
// 注册选取监听 // 注册选取监听
this.wpsInstance.ApiEvent.AddApiEventListener( this.wpsInstance.ApiEvent.AddApiEventListener(
"WindowSelectionChange", "WindowSelectionChange",
(data) => { (data) => {
this.handleSelectionChange(data); this.handleDocSelectionChange(data);
}
);
this.wpsInstance.ApiEvent.AddApiEventListener(
"TextSelectChange",
async (data) => {
console.log("TextSelectChange");
// 复制选中的批注文案
const app = this.wpsInstance.Application;
console.log("app", app);
await app.ActivePDF.AnnoAPI.SetSelectionAnno({
type: app.Enum.AnnoType.Highlight,
color: "rgba(0,0,0,1)",
});
} }
); );
}, },
// 初始化并监听新建笔记按钮
async initAddNoteButton() {
const app = this.wpsInstance.Application;
// 通过 CommandBar 的 Controls 对象，可获取到对应类型的内容集合，从而做新增操作或者获取到具体内容进行操作
// 定制元素对象：【开始 Tab】
const controls = await app.CommandBars("StartTab").Controls;
// 新增按钮型定制元素
this.controlButton = await controls.Add(1);
this.controlButton.Caption = "新建笔记";
this.controlButton.Enabled = false;
this.controlButton.OnAction = this.handleAddNote;
},
// 监听文字选取变化 // 监听DOC文字选取变化
async handleSelectionChange(data) { async handleDocSelectionChange(data) {
const { begin, end } = data; const { begin, end } = data;
console.log(data); // console.log(data);
if (begin != undefined && (end != undefined) & (begin != end)) { if (begin != undefined && (end != undefined) & (begin != end)) {
const app = this.wpsInstance.Application; const app = this.wpsInstance.Application;
// 获取选中区域 // 获取选中区域
const range = await app.ActiveDocument.Range(begin, end); const range = await app.ActiveDocument.Range(begin, end);
// 获取文本 // 获取文本
const text = await range.Text; const text = await range.Text;
// 获取所在页
const currentPage =
await app.ActiveDocument.ActiveWindow.Selection.Information(
app.Enum.WdInformation.wdActiveEndPageNumber
);
// 填入原文
this.form.bookmarkContent = text; this.form.bookmarkContent = text;
// 填入笔记相关信息
this.form.jsonStr = { ...this.form.jsonStr, begin, end, currentPage };
if (text) { if (text) {
this.controlButton.Enabled = true; this.controlButton.Enabled = true;
} else { } else {
...@@ -167,6 +157,48 @@ export default { ...@@ -167,6 +157,48 @@ export default {
this.controlButton.Enabled = false; this.controlButton.Enabled = false;
} }
}, },
async getDocCurrentPage() {
const app = this.wpsInstance.Application;
// 获取当前页数
const currentPage =
await app.ActiveDocument.ActiveWindow.Selection.Information(
app.Enum.WdInformation.wdActiveEndPageNumber
);
console.log(currentPage);
},
// 初始化并监听新建笔记按钮
async initAddNoteButton() {
const app = this.wpsInstance.Application;
// 通过 CommandBar 的 Controls 对象，可获取到对应类型的内容集合，从而做新增操作或者获取到具体内容进行操作
// 定制元素对象：【开始 Tab】
const controls = await app.CommandBars("StartTab").Controls;
// 新增按钮型定制元素
this.controlButton = await controls.Add(1);
this.controlButton.Caption = "新建笔记";
this.controlButton.Enabled = false;
this.controlButton.OnAction = this.handleAddNote;
},
// //添加PDF选取监听
// addPdfSelectionListen() {
// this.wpsInstance.ApiEvent.AddApiEventListener(
// "TextSelectChange",
// async (data) => {
// console.log("TextSelectChange");
// // 复制选中的批注文案
// const app = this.wpsInstance.Application;
// console.log("app", app);
// await app.ActivePDF.AnnoAPI.SetSelectionAnno({
// type: app.Enum.AnnoType.Highlight,
// color: "rgba(0,0,0,1)",
// });
// }
// );
// },
//新建笔记 //新建笔记
handleAddNote() { handleAddNote() {
...@@ -178,11 +210,18 @@ export default { ...@@ -178,11 +210,18 @@ export default {
}, },
// 移除文字选取监听 // 移除文字选取监听
removeSelectionChangeListener() { removeDocSelectionListener() {
if (this.wpsInstance && this.wpsInstance.ApiEvent) {
this.wpsInstance.ApiEvent.RemoveApiEventListener("TextSelectChange");
}
},
// 移除pdf选取监听
removeDocSelectionListener() {
if (this.wpsInstance && this.wpsInstance.ApiEvent) { if (this.wpsInstance && this.wpsInstance.ApiEvent) {
this.wpsInstance.ApiEvent.RemoveApiEventListener( this.wpsInstance.ApiEvent.RemoveApiEventListener(
"WindowSelectionChange", "WindowSelectionChange",
this.handleSelectionChange this.handleDocSelectionChange
); );
} }
}, },
...@@ -215,6 +254,26 @@ export default { ...@@ -215,6 +254,26 @@ export default {
handleToggleNotePanel() { handleToggleNotePanel() {
this.panelVisible = !this.panelVisible; this.panelVisible = !this.panelVisible;
}, },
// 加载笔记列表,在此处调用因为本页面需要用来高亮显示文档中的笔记
async loadNoteList() {
this.loading = true;
const { current, size } = this.noteList;
const { content, tagId } = this.searchParams;
const params = {
currentPage: current,
pageCount: size,
id: tagId,
content,
};
let res = await getNoteByTag(params);
this.oldContent = content;
this.loading = false;
if (res.code == 200) {
this.noteList = res.data;
this.loadTagList();
}
},
}, },
}; };
</script> </script>
......
src/views/resource/components/searchBar/index.vue
浏览文件 @ 0cf88b42
...@@ -16,7 +16,9 @@ ...@@ -16,7 +16,9 @@
v-model="keyword" v-model="keyword"
clearable clearable
></el-input> ></el-input>
<el-button icon="el-icon-search" type="primary" @click="handleSearch">搜索 </el-button> <el-button icon="el-icon-search" type="primary" @click="handleSearch"
>搜索
</el-button>
</div> </div>
</div> </div>
</template> </template>
...@@ -34,9 +36,9 @@ export default { ...@@ -34,9 +36,9 @@ export default {
handleClickTab(item) { handleClickTab(item) {
this.activeTab = item; this.activeTab = item;
}, },
handleSearch(){ handleSearch() {
this.$emit('search',this.keyword) this.$emit("search");
} },
}, },
}; };
</script> </script>
......
src/views/resource/components/table/index.vue
浏览文件 @ 0cf88b42
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
</div> </div>
<el-table <el-table
v-loading="loading" v-loading="loading"
:data="fileList.records" :data="list.records"
@selection-change="handleSelectionChange" @selection-change="handleSelectionChange"
> >
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
...@@ -107,8 +107,8 @@ ...@@ -107,8 +107,8 @@
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination <pagination
v-show="fileList.total > 0" v-show="list.total > 0"
:total="fileList.total" :total="list.total"
:page.sync="queryParams.currentPage" :page.sync="queryParams.currentPage"
:limit.sync="queryParams.pageCount" :limit.sync="queryParams.pageCount"
@pagination="getList" @pagination="getList"
...@@ -119,8 +119,14 @@ ...@@ -119,8 +119,14 @@
</template> </template>
<script> <script>
import { fileList } from "../../mockData"; import { list } from "../../mockData";
export default { export default {
props: {
list: {
type: Object,
default: () => ({}),
},
},
data() { data() {
return { return {
// 遮罩层 // 遮罩层
...@@ -133,11 +139,6 @@ export default { ...@@ -133,11 +139,6 @@ export default {
multiple: true, multiple: true,
// 显示搜索条件 // 显示搜索条件
showSearch: true, showSearch: true,
// 总条数
total: 0,
// 表格数据
// fileList: [],
fileList,
// 弹出层标题 // 弹出层标题
title: "", title: "",
// 是否显示弹出层 // 是否显示弹出层
...@@ -155,7 +156,23 @@ export default { ...@@ -155,7 +156,23 @@ export default {
multiCancelVisible: false, multiCancelVisible: false,
}; };
}, },
computed: {
// 批量下载文件链接
batchDownloadLink() {
return `${
process.env.VUE_APP_BASE_API
}/v1/api/folder/transfer/batchDownloadFile?userFileIds=${this.selectedFiles
.map((item) => item.userFileId)
.join(",")}`;
},
},
mounted() {
this.getList();
},
methods: { methods: {
getList() {
this.$emit("getList");
},
// 多选框选中数据 // 多选框选中数据
handleSelectionChange(selection) { handleSelectionChange(selection) {
this.selectedFiles = selection; this.selectedFiles = selection;
...@@ -166,9 +183,9 @@ export default { ...@@ -166,9 +183,9 @@ export default {
handleOpenFile(file) { handleOpenFile(file) {
this.$file.handleFileNameClickNew(file); this.$file.handleFileNameClickNew(file);
}, },
// 批量收藏 // 批量收藏
handleMultiCollect(){}, handleMultiCollect() {},
// 点击收藏 // 点击收藏
handleCollect(file) {}, handleCollect(file) {},
}, },
......
src/views/resource/external/index.vue
浏览文件 @ 0cf88b42
<template> <template>
<div class="app-container container"> <div class="app-container container">
<SearchBar @search="handleRearch" /> <SearchBar ref="SearchBar" @search="loadData" />
<Table /> <Table :list="list" @getList="loadData" />
</div> </div>
</template> </template>
<script> <script>
import SearchBar from "../components/searchBar/index.vue"; import SearchBar from "../components/searchBar/index.vue";
import Table from "../components/table/index.vue"; import Table from "../components/table/index.vue";
import {
getNewspaperList,
getPeriodicalsList, //期刊
getConferenceList, //会议
getThesisList, //论文
} from "@/api/resource/index";
export default { export default {
components: { components: {
SearchBar, SearchBar,
Table, Table,
}, },
data() {
return {
list: {
records: [],
total: 0,
size: 10,
current: 1,
},
};
},
methods: { methods: {
handleRearch(keyword) { async loadData() {
console.log("search",keyword); const { keyword, activeTab } = this.$refs.SearchBar;
const { current, size } = this.list;
const params = {
keyword,
pageNo: current,
pageSize: size,
};
console.log("keyword", keyword);
// const activeTab = this.
// console.log(keyword, activeTab);
// return
let request;
switch (activeTab) {
case "报纸":
request = getNewspaperList;
break;
case "期刊":
request = getPeriodicalsList;
break;
case "会议":
request = getConferenceList;
break;
case "论文":
request = getThesisList;
break;
}
let res = await request(params);
if (res.code == 200) {
this.lsit = res.data;
}
}, },
}, },
}; };
......
vue.config.js
浏览文件 @ 0cf88b42
...@@ -35,6 +35,7 @@ module.exports = { ...@@ -35,6 +35,7 @@ module.exports = {
proxy: { proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy // detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: { [process.env.VUE_APP_BASE_API]: {
// target: `http://192.168.1.4:5236`,
target: `http://192.168.1.5:5236`, target: `http://192.168.1.5:5236`,
// target: `http://222.85.214.245:9600`, // target: `http://222.85.214.245:9600`,
// target: `http://222.85.214.245:9558`, // target: `http://222.85.214.245:9558`,
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论