Skip to content

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

优化创作页面的右侧面板

上级 73872c33
显示空白字符变更
内嵌 并排
正在显示 包含 158 行增加 和 23 行删除
src/components/file/dialog/addFileByTemplate/Dialog.vue
浏览文件 @ a6a2988d
......@@ -160,7 +160,7 @@ export default {
extendName,
filePath,
fileName,
isTemplate,
isTemplate,//0-空白文件，1-模板
templateId: templateId[0] || "",
};
newfile(params)
......
src/views/read/wpsReader/component/insertNote.vue
浏览文件 @ a6a2988d
......@@ -33,7 +33,7 @@
</el-select>
</div>
<div class="total">共{{ noteList.records.length }}条数据</div>
<div class="note-list">
<div class="note-list" v-if="noteList.records.length > 0">
<el-card
class="note-item"
v-for="(item, index) in noteList.records"
......@@ -69,26 +69,28 @@
icon-class="origin"
style="color: #1a5eff; margin-right: 6px"
/>
<!-- <i class="el-icon-document"></i> -->
<span>原文：</span>
<span
v-if="oldContent"
:title="item.bookmarkContent"
v-html="brightenKeyword(item.bookmarkContent, oldContent)"
></span>
<span v-else> {{ item.bookmarkContent }}</span>
<span v-else :title="item.bookmarkContent">
{{ item.bookmarkContent }}</span
>
</div>
<div class="note twoRow">
<svg-icon
icon-class="icon-note"
style="color: #e6a23c; margin-right: 6px"
/>
<!-- <i class="el-icon-edit"></i> -->
<span>笔记：</span>
<span
v-if="oldContent"
:title="item.noteContent"
v-html="brightenKeyword(item.noteContent, oldContent)"
></span>
<span v-else> {{ item.noteContent }}</span>
<span v-else :title="item.noteContent"> {{ item.noteContent }}</span>
</div>
<div class="buttons">
<el-button
......@@ -107,6 +109,9 @@
</div>
</el-card>
</div>
<div class="note-list" v-else>
<el-empty></el-empty>
</div>
<div class="page">
<el-pagination
size="mini"
......
src/views/read/wpsReader/component/rightPanel.vue
浏览文件 @ a6a2988d
......@@ -10,8 +10,12 @@
/>
</div>
</div>
<div class="close">
<i class="el-icon-close"></i>
<div
:title="visible?'收起面板':'插入笔记'"
:class="['close', !visible ? 'hidden' : '']"
@click="handleToggleNotePanel"
>
<i :class="visible ? 'el-icon-arrow-right' : 'el-icon-edit'"></i>
</div>
</div>
</template>
......@@ -25,6 +29,7 @@ export default {
},
data() {
return {
visible: false, //面板的可见性，用于控制按钮是否是悬浮
};
},
methods: {
......@@ -40,6 +45,11 @@ export default {
handleOpenAddUpdateDialog(item) {
this.$emit("handleOpenAddUpdateDialog", item);
},
// 关闭笔记弹窗
handleToggleNotePanel() {
this.visible = !this.visible;
this.$emit("handleToggleNotePanel");
},
},
};
</script>
......@@ -51,6 +61,8 @@ export default {
position: relative;
box-sizing: border-box;
width: 100%;
border-left: 1px solid #e6ebf5;
background-color: #fff;
.left {
padding-right: 16px;
width: 100%;
......@@ -87,10 +99,33 @@ export default {
}
.close {
position: absolute;
right: 20px;
top: 20px;
left: 0;
top: 45%;
cursor: pointer;
background-color: #fff;
transform: translate(-50%, -50%);
box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px,
rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
border-radius: 50%;
width: 32px;
height: 32px;
display: flex;
justify-content: center;
align-items: center;
i {
font-size: 22px;
color: #d3d3d3;
transition: all ease 0.5s;
}
}
// 当面板不可见时会显示
.hidden {
left: -100px;
width: 68px;
height: 68px;
i {
font-size: 24px;
color: $theme-blue;
font-size: 42px;
}
}
}
......
src/views/read/wpsReader/index.vue
浏览文件 @ a6a2988d
......@@ -5,11 +5,20 @@
'sidebar-open': $store.state.app.sidebar.opened,
}"
>
<div ref="myIframe" id="wps-container" class="wps-container"></div>
<div
ref="myIframe"
id="wps-container"
class="wps-container"
></div>
<RightPanel
class="right-panel"
ref="RightPanel"
:class="[
'right-panel',
panelVisible ? 'translateXLeft' : 'translateXRight',
]"
@handleInsertText="handleInsertText"
@handleOpenAddUpdateDialog="handleOpenAddUpdateDialog"
@handleToggleNotePanel="handleToggleNotePanel"
/>
<AddOrUpdateNoteDialog
:formData="form"
......@@ -41,6 +50,7 @@ export default {
noteContent: "", //笔记内容
tagsArr: [], //标签
},
panelVisible: false, //笔记的窗口
// isSidebarOpen:false
};
},
......@@ -49,10 +59,21 @@ export default {
return this.$store.state.app.sidebar.opened;
},
},
watch: {
panelVisible(value) {
debugger
// 获取office-iframe的dom并修改宽度为100vw
const officeIframe = document.getElementById("office-iframe");
if (!value) {
officeIframe.style.width = "100vw !important";
} else {
officeIframe.style.width = "100% !important";
}
},
},
mounted() {
const { wpsUrl, token, fileId } = this.$route.query;
this.routeParams = { wpsUrl, token, fileId };
console.log("this.routeParams", this.routeParams);
this.form.docId = fileId;
this.initWps(wpsUrl, token);
},
......@@ -165,6 +186,10 @@ export default {
// 插入文字
async handleInsertText(value) {
if (!this.wpsInstance.WordApplication) {
this.$message.error("文档初始化失败，请稍后重试");
return;
}
await this.wpsInstance
.WordApplication()
.ActiveDocument.ActiveWindow.Selection.InsertAfter(value);
......@@ -177,20 +202,36 @@ export default {
handleOpenAddUpdateDialog(item) {
this.$refs.AddOrUpdateNoteDialog.dialogVisible = true;
},
// 关闭笔记窗口
handleToggleNotePanel() {
this.panelVisible = !this.panelVisible;
},
},
};
</script>
<style lang="scss" scoped>
.wps-reader {
display: flex;
position: relative;
.wps-container {
width: calc((100vw - 54px) * 0.8); //默认宽度是sidebar收起的宽度
transition: all ease 0.5s;
width: calc(100vw - 54px); //默认宽度是sidebar收起的宽度
overflow: hidden;
}
.right-panel {
position: absolute;
right: 0;
top: 0;
transition: all ease 0.5s;
width: calc((100vw - 54px) * 0.2); //默认宽度是sidebar收起的宽度
}
.translateXLeft {
transform: translateX(0);
}
.translateXRight {
transform: translateX(calc((100vw - 54px) * 0.2));
}
.wps-container,
.right-panel {
......@@ -201,12 +242,12 @@ export default {
.sidebar-open {
.wps-container {
width: calc((100vw - 200px) * 0.8); //sidebar展开后的宽度
width: calc(100vw - 200px); //sidebar展开后的宽度
}
.right-panel {
width: calc((100vw - 200px) * 0.2); //默认宽度是sidebar收起的宽度
}
// .right-panel {
// width: calc((100vw - 200px) * 0.2); //默认宽度是sidebar收起的宽度
// }
}
.add-note-container {
background-color: #999;
......
src/views/resource/components/searchBar/index.vue
浏览文件 @ a6a2988d
......@@ -25,8 +25,8 @@
export default {
data() {
return {
tabs: ["全部", "期刊", "博硕士", "会议", "报纸", "年鉴"],
activeTab: "全部",
tabs: ["期刊", "论文", "会议", "报纸"],
activeTab: "期刊",
keyword: "",
};
},
......
src/views/resource/sharedCommunity/index.vue
浏览文件 @ a6a2988d
......@@ -96,6 +96,14 @@
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-link
type="primary"
icon="el-icon-view"
@click="handleCollect(scope.row)"
>
收藏
</el-link>
<el-divider direction="vertical"></el-divider>
<el-link
type="primary"
icon="el-icon-view"
......@@ -130,9 +138,13 @@
<script>
import { getMyShareList, removeShare } from "@/api/user/share";
import { newfile } from "@/api/wps";
import { shareStatusConstant, shareTypeConstant } from "./constant";
import { fileTypeConstant } from "@/components/file/constants";
import { mapGetters } from "vuex";
const { PUBLIC_SHARE } = shareTypeConstant;
const { MY_COLLECT } = fileTypeConstant;
export default {
name: "myShare",
dicts: ["share_type", "share_status"],
......@@ -164,7 +176,7 @@ export default {
pageCount: 10,
fileName: "", //文件名称
shareStatus: "", //分享状态
shareType: PUBLIC_SHARE,//查询分享给公共
shareType: PUBLIC_SHARE, //查询分享给公共
// shareTo: "", //分享给谁
},
// 分享状态常量
......@@ -234,6 +246,48 @@ export default {
handleMultiDownload() {
this.$refs["batchDownloadRef"].click();
},
// 收藏
async handleCollect(row) {
console.log("点击收藏", row);
this.loading = true;
const { extendName, fileName } = row;
const filePath = '/我的收藏';
const WORD = ["docx", "doc"]; //暂时只考虑新建word的情况
let filetype = "w";
// const PDF = ["pdf", "doc"];
// const EXCEL = ["xlsx", "xls"];
if (WORD.includes(row.extendName)) {
filetype = "w";
}
const params = {
filetype,
extendName,
filePath,
fileName,
// isTemplate,
// templateId: templateId[0] || "",
};
let res = await newfile(params);
this.loading = false;
if (res.code == 200) {
this.$message.success("收藏成功！");
}
// newfile(params)
// .then((res) => {
// this.sureBtnLoading = false;
// if (res.code == 200) {
// this.$message.success("文件创建成功");
// this.$refs[formName].resetFields();
// this.visible = false;
// this.callback("confirm");
// } else {
// this.$message.warning(res.message);
// }
// })
// .catch(() => {
// this.sureBtnLoading = false;
// });
},
},
};
</script>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论