Skip to content

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

完善创作页面的插入笔记

上级 f7290020
隐藏空白字符变更
内嵌 并排
正在显示 包含 222 行增加 和 172 行删除
src/components/common/BreadCrumb.vue
浏览文件 @ e0d5a9e8
<template>
<div class="breadcrumb-wrapper">
<div class="title">当前位置：</div>
<el-input
<!-- <el-input
class="file-path-input"
ref="filePathInputRef"
placeholder="请输入路径"
......@@ -12,20 +12,11 @@
@blur="handleInputBlurEnter"
@change="handleInputBlurEnter"
></el-input>
<!-- {{ breadCrumbList }} -->
123 -->
<div
class="breadcrumb-box"
:class="{ 'able-input': fileType === 0 }"
v-show="!isShowInput"
@click.self="handleClickBreadCrumbSelf"
>
<!-- <el-breadcrumb
v-if="![0, 8].includes(fileType) && !['Share'].includes($route.name)"
separator-class="el-icon-arrow-right"
>
<el-breadcrumb-item>{{ fileTypeMap[fileType] }}</el-breadcrumb-item>
</el-breadcrumb> -->
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item
v-for="(item, index) in breadCrumbList"
......
src/components/file/box/contextMenu/Box.vue
浏览文件 @ e0d5a9e8
......@@ -273,45 +273,30 @@ export default {
// 删除按钮是否显示
deleteBtnShow() {
return this.fileType != this.MY_COLLECT; //我的收藏不能删除
// return this.fileType !== 8 && !["Share"].includes(this.routeName);
},
// 还原按钮是否显示
restoreBtnShow() {
return true;
// return this.fileType === 6 && !["Share"].includes(this.routeName);
},
// 复制按钮是否显示
copyBtnShow() {
return true;
// return (
// ![6, 8].includes(this.fileType) && !["Share"].includes(this.routeName)
// );
},
// 移动按钮是否显示
moveBtnShow() {
return true;
// return (
// ![6, 8].includes(this.fileType) && !["Share"].includes(this.routeName)
// );
},
// 重命名按钮是否显示
renameBtnShow() {
return this.fileType != this.MY_COLLECT; //我的收藏不能重命名
// return (
// ![6, 8].includes(this.fileType) && !["Share"].includes(this.routeName)
// );
},
// 分享按钮是否显示
shareBtnShow() {
return true;
// return (
// ![6, 8].includes(this.fileType) && !["Share"].includes(this.routeName)
// );
return this.fileType !=this.TEMPLATE_MANAGE;//模板管理不能分享
},
// 下载按钮是否显示
downloadBtnShow() {
return true;
// return ![6, 8].includes(this.fileType);
},
// 解压缩按钮是否显示
unzipBtnShow() {
......@@ -333,18 +318,10 @@ export default {
onlineEditBtnShow() {
// 只有我的Word文件才显示
// 根据当前文件的作者的userId进行判断，和本人一致则是可编辑
console.log("onlineEditBtnShow", this.selectedFile);
return (
["doc", "docx"].includes(this.selectedFile.extendName) &&
this.selectedFile.userId == store.getters.userInfo.userId
);
// return (
// ![6, 8].includes(this.fileType) &&
// (this.officeFileType.includes(this.selectedFile.extendName) ||
// this.markdownFileType.includes(this.selectedFile.extendName) ||
// this.fileSuffixCodeModeMap.has(this.selectedFile.extendName)) &&
// !["Share"].includes(this.routeName)
// );
},
// 复制链接按钮是否显示
copyLinkBtnShow() {
......
src/components/file/constants.js
浏览文件 @ e0d5a9e8
......@@ -22,5 +22,5 @@ export const uploadModeConstant = {
// 是否收藏
export const collectConstant = {
COLLECTED: 0, //收藏
NOT_COLLECTED: 1 ,//未收藏
NOT_COLLECTED: 1,//未收藏
}
\ No newline at end of file
src/components/file/dialog/addFileByTemplate/Dialog.vue
浏览文件 @ e0d5a9e8
......@@ -15,7 +15,7 @@
label-width="100px"
label-position="top"
>
<el-form-item label="选择新建方式" prop="addNewFileWay">
<el-form-item label="选择新建方式" prop="addNewFileWay" >
<el-radio-group v-model="form.addNewFileWay">
<el-radio label="1">新建空白文档</el-radio>
<el-radio label="2">从模板导入</el-radio>
......@@ -67,7 +67,6 @@
<script>
import { newfile, getTemplateList } from "@/api/wps";
export default {
name: "AddFileDialog",
data() {
......@@ -89,7 +88,6 @@ export default {
},
watch: {
"form.addNewFileWay"(value) {
console.log("form.addNewFileWay", this.form.addNewFileWay);
if (value == 2) {
this.loadTemplateList();
}
......
src/views/manage/templateManage/index.vue
浏览文件 @ e0d5a9e8
......@@ -5,6 +5,8 @@
</template>
<script>
import FileList from "@/components/file/FileList.vue";
import { fileTypeConstant } from "@/components/file/constants";
const { TEMPLATE_MANAGE } = fileTypeConstant;
export default {
components: {
FileList,
......@@ -12,6 +14,7 @@ export default {
data() {
return {
isInit: false,
...fileTypeConstant,
};
},
mounted() {
......@@ -21,7 +24,7 @@ export default {
// 修改查询参数，例如，给 "filePath" 参数设置新的值
// 10-我的创作 11-模板管理
const newFileType = 11;
const newFileType = TEMPLATE_MANAGE;
const newFilePath = "/模板管理";
const newQueryParams = {
...currentQueryParams,
......
src/views/mine/myNote/components/noteByFile.vue
浏览文件 @ e0d5a9e8
......@@ -62,7 +62,7 @@
:key="index"
>
<div class="card-head">
<div class="tag" v-if="item.tagName.length > 0">
<div class="tag" v-if="item.tagName && item.tagName.length > 0">
<el-tag
style="margin-right: 8px"
type="warning"
......@@ -152,8 +152,8 @@ export default {
mixins: [noteOperationMixins],
data() {
return {
keyword:'',//文件名关键词，搜索文件时使用
currentFileId:'',//文件id 搜索笔记时使用
keyword: "", //文件名关键词，搜索文件时使用
currentFileId: "", //文件id 搜索笔记时使用
//文件列表
fileList: {
records: [],
......@@ -210,17 +210,17 @@ export default {
},
},
mounted() {
this.loadfileList();
this.loadLeftList();
},
methods: {
//加载文件列表
async loadfileList() {
async loadLeftList() {
this.loading = true;
const { current, size } = this.fileList;
const params = {
currentPage: current,
pageCount: size,
fileName:this.keyword
fileName: this.keyword,
};
let res = await getNoteAllFilesList(params);
if (res.data) {
......@@ -252,7 +252,7 @@ export default {
this.fileList.size = 20;
// 重置笔记的筛选条件
this.currentFileId = "";
this.loadfileList();
this.loadLeftList();
},
handleReset() {
......@@ -260,9 +260,9 @@ export default {
this.fileList.current = 1;
this.fileList.size = 20;
// 重置查询参数
this.currentFileId = ''
this.keyword = ''
this.loadfileList();
this.currentFileId = "";
this.keyword = "";
this.loadLeftList();
},
// 点击左侧文件
......@@ -280,13 +280,13 @@ export default {
// 文件列表size
handleSizeChangeFile(value) {
this.fileList.pageCount = value;
this.loadfileList();
this.loadLeftList();
},
// 文件列表current
handleCurrentChangeFile(value) {
this.fileList.currentPage = value;
this.loadfileList();
this.loadLeftList();
},
// 文件列表current
......@@ -395,19 +395,24 @@ export default {
font-size: 14px;
margin-bottom: 16px;
.card-head {
display: flex;
justify-content: space-between;
margin-bottom: 16px;
.tag {
float: left;
}
// display: flex;
// justify-content: space-between;
.oprations {
display: flex;
justify-content: flex-end;
float: right;
margin-bottom: 8px;
// display: flex;
// justify-content: flex-end;
.el-link {
margin-right: 16px;
}
}
}
.bookmark {
margin-bottom: 16px;
font-size: 16px;
......
src/views/mine/myNote/components/noteByTag.vue
浏览文件 @ e0d5a9e8
......@@ -20,14 +20,8 @@
>
</div>
<div class="header">
<span class="total"> 共计{{ tagList.total }}条数据 </span>
<span>
<el-button type="text">
<svg-icon icon-class="add-tag"></svg-icon>
新增标签</el-button
>
</span>
<div class="total">
共计{{ tagList.total }}条数据
</div>
<el-row class="list">
<el-col
......@@ -67,7 +61,7 @@
:key="index"
>
<div class="card-head">
<div class="tag" v-if="item.tagName.length > 0">
<div class="tag" v-if="item.tagName && item.tagName.length > 0">
<el-tag
style="margin-right: 8px"
type="warning"
......@@ -202,11 +196,11 @@ export default {
},
},
mounted() {
this.loadtagList();
this.loadLeftList();
},
methods: {
//加载文件列表
async loadtagList() {
async loadLeftList() {
this.loading = true;
const { current, size } = this.tagList;
const params = {
......@@ -254,7 +248,7 @@ export default {
this.fileList.size = 20;
// 重置当前选中的文件
this.currentTagId = "";
this.loadtagList();
this.loadLeftList();
},
handleReset() {
......@@ -270,13 +264,13 @@ export default {
// 文件列表size
handleSizeChangeFile(value) {
this.tagList.pageCount = value;
this.loadtagList();
this.loadLeftList();
},
// 文件列表current
handleCurrentChangeFile(value) {
this.tagList.currentPage = value;
this.loadtagList();
this.loadLeftList();
},
// 文件列表current
......@@ -312,14 +306,12 @@ export default {
padding: 20px 20px 0px;
position: relative;
.header {
.total {
color: #999;
padding: 12px 0 10px;
// margin-bottom: 10px;
font-size: 14px;
display: flex;
justify-content: space-between;
align-items: center;
justify-content: flex-end;
}
.list {
font-size: 14px;
......@@ -382,13 +374,18 @@ export default {
font-size: 14px;
margin-bottom: 16px;
.card-head {
display: flex;
justify-content: space-between;
margin-bottom: 16px;
// display: flex;
// justify-content: space-between;
.tag{
float: left;
}
.oprations {
display: flex;
justify-content: flex-end;
float: right;
// display: flex;
// justify-content: flex-end;
margin-bottom: 8px;
.el-link {
margin-right: 16px;
}
......
src/views/mine/myNote/components/noteOperationMixins.js
浏览文件 @ e0d5a9e8
import { textCopy } from "@/utils/index";
import { addOrUpdateNoteDoc, deleteNote } from "@/api/doc/bookMark";
import { deleteNote } from "@/api/doc/bookMark";
import AddOrUpdateNoteDialog from "@/views/read/wpsReader/component/addOrUpdateNoteDialog.vue";
export default {
components:{
components: {
AddOrUpdateNoteDialog
},
methods: {
......@@ -43,15 +43,16 @@ export default {
},
// 删除笔记
async handleDeleteNote(item) {
this.loading = true;
// this.loading = true;
const params = {
id: item.id,
};
let res = await deleteNote(params);
// this.loading = false;
if (res.code == 200) {
this.$message.success("操作成功");
this.loadLeftList();
}
this.loading = false;
},
}
}
src/views/read/wpsReader/component/autoCheck.vue deleted 100644 → 0
浏览文件 @ f7290020
<template>
<div>自动检查</div>
</template>
<script>
export default {};
</script>
<style></style>
src/views/read/wpsReader/component/autoClose.vue deleted 100644 → 0
浏览文件 @ f7290020
<template>
<div>自动补全</div>
</template>
<script>
export default {};
</script>
<style></style>
src/views/read/wpsReader/component/insertNote.vue
浏览文件 @ e0d5a9e8
......@@ -5,38 +5,48 @@
<el-input
class="input"
size="mini"
placeholder="输入关键词搜索"
placeholder="输入关键词搜索原文或笔记"
suffix-icon="el-icon-search"
v-model="searchValue"
v-model="searchParams.content"
@keyup.enter.native="handleSearch"
clearable
></el-input>
<el-select
v-model="tagModelValue"
placeholder="请选择标签"
size="mini"
class="select"
v-model="searchParams.tagId"
filterable
remote
clearable
default-first-option
placeholder="标签（可搜索）"
:remote-method="remoteMethod"
:loading="loading"
@change="handleSearch"
>
<el-option
v-for="item in tagList"
:key="item.value"
:label="item.label"
:value="item.value"
v-for="item in tagList.records"
:key="item.id"
:label="item.tagName"
:value="item.id"
>
</el-option>
</el-select>
</div>
<!-- {{ noteList }} -->
<div class="total">共{{ noteList.length }}条数据</div>
<div class="total">共{{ noteList.records.length }}条数据</div>
<div class="note-list">
<el-card
class="note-item"
v-for="(item, index) in noteList"
v-for="(item, index) in noteList.records"
:key="index"
shadow="hover"
>
<div class="tag">
<el-tag type="warning">{{ item.tag }}</el-tag>
<div class="tag" v-if="item.tagName && item.tagName.length > 0">
<el-tag
style="margin-right: 8px"
type="warning"
v-for="(v, i) in item.tagName.split(',')"
>{{ v }}
</el-tag>
<el-dropdown>
<el-link>更多</el-link>
......@@ -50,43 +60,78 @@
</el-dropdown>
</div>
<div class="origin oneRow">
<i class="el-icon-document"></i>
原文：{{ item.bookmarkContent }}
<svg-icon
icon-class="origin"
style="color: #1a5eff; margin-right: 6px"
/>
<!-- <i class="el-icon-document"></i> -->
<span>原文：</span>
<span
v-if="oldContent"
v-html="brightenKeyword(item.bookmarkContent, oldContent)"
></span>
<span v-else> {{ item.bookmarkContent }}</span>
</div>
<div class="note twoRow">
<i class="el-icon-edit"></i>
笔记：{{ item.noteContent }}
<svg-icon
icon-class="icon-note"
style="color: #e6a23c; margin-right: 6px"
/>
<!-- <i class="el-icon-edit"></i> -->
<span>笔记：</span>
<span
v-if="oldContent"
v-html="brightenKeyword(item.noteContent, oldContent)"
></span>
<span v-else> {{ item.noteContent }}</span>
</div>
<div class="buttons">
<el-button
type="primary"
size="mini"
@click="handleInsertNote(item.noteContent)"
>引入笔记</el-button
@click="handleInsertOrigin(item.bookmarkContent)"
>引入原文</el-button
>
<el-button
type="primary"
size="mini"
plain
@click="handleInsertOrigin(item.bookmarkContent)"
>引入原文</el-button
@click="handleInsertNote(item.noteContent)"
>引入笔记</el-button
>
</div>
</el-card>
</div>
<div class="page">
<el-pagination
size="mini"
class="note-page"
background
@size-change="handleSizeChangeNote"
@current-change="handleCurrentChangeNote"
:current-page.sync="noteList.current"
:page-size="noteList.size"
layout="prev, pager, next"
:total="tagList.total"
>
</el-pagination>
</div>
</div>
</template>
<script>
import { noteList, tagList } from "./mockData";
import { getBookMarkList } from "@/api/doc/bookMark";
// import { noteList, tagList } from "./mockData";
import { getNoteByTag, getNoteAllTagList } from "@/api/doc/index";
export default {
data() {
return {
//当前选中的标签
tagModelValue: "",
//笔记搜索
searchValue: "",
searchParams: {
//标签名搜索
tagId: "",
//从原文和笔记中搜索
content: "",
},
oldContent: "", //用于记录上一次搜索的关键词，以至于不会被实时影响关键词着色效果
loading: false,
dropdownList: [
{
......@@ -102,24 +147,67 @@ export default {
value: "delete",
},
],
noteList,
tagList,
// noteList: [], //笔记列表
// tagList: [],
noteList: {
records: [],
current: 1,
size: 20,
total: 0,
}, //笔记列表
tagList: {
records: [],
current: 1,
size: 20,
total: 0,
},
};
},
mounted() {
// this.loadData()
this.loadNoteList();
},
methods: {
async loadData() {
// 加载笔记列表
async loadNoteList() {
this.loading = true;
let res = await getBookMarkList();
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();
}
},
// 搜索
handleSearch() {
this.loadNoteList();
},
// 加载标签
async loadTagList() {
// 首次加载时只加载最多10个供用户下拉选择
this.remoteMethod("", 10);
},
// 远程搜索标签 默认搜索时pageCount 为100
remoteMethod(keyword, pageCount = 100) {
this.loading = true;
const params = {
keyword,
currentPage: 1,
pageCount,
};
getNoteAllTagList(params).then((res) => {
this.loading = false;
if (res.code == 200) {
this.tagList = res.data;
}
});
},
// 插入笔记
handleInsertNote(value) {
this.$emit("insertText", value);
......@@ -135,17 +223,50 @@ export default {
case "view":
break;
case "edit":
this.handleOpenAddUpdateDialog(item)
this.handleOpenAddUpdateDialog(item);
break;
case "delete":
break;
}
},
// 打开编辑笔记对话框
handleOpenAddUpdateDialog(item){
this.$emit('handleOpenAddUpdateDialog',item)
}
handleOpenAddUpdateDialog(item) {
this.$emit("handleOpenAddUpdateDialog", item);
},
//获取需要标红的文字
getRedWords(contentText, keyword) {
let keywordArray = keyword.split("");
let wordsArray = [];
for (let key of keywordArray) {
if (contentText.includes(key)) {
wordsArray.push(key);
}
}
return wordsArray;
},
//将文字标红
brightenKeyword(contentText, keyword) {
let wordsArray = this.getRedWords(contentText, keyword);
let res = contentText; //res的初始值是不带任何红色格式的
//遍历相同字数组，
for (let word of wordsArray) {
const Reg = new RegExp(word, "i");
//替换每一个相同字
res = res.replace(Reg, `<span style="color: red;">${word}</span>`);
}
return res; //此时的res里已经将需要标红的字体带上了格式（<span style="color:red"></span>）
},
// 文件列表current
handleSizeChangeNote(value) {
this.tagList.pageCount = value;
this.loadNoteList();
},
// 文件列表current
handleCurrentChangeNote(value) {
this.tagList.currentPage = value;
this.loadNoteList();
},
},
};
</script>
......@@ -167,11 +288,11 @@ export default {
margin: 20px 0 4px;
display: flex;
justify-content: flex-end;
font-style: 14px;
font-size: 14px;
color: #999;
}
.note-list {
height: calc(100vh - 200px);
height: calc(100vh - 210px);
overflow: auto;
.note-item {
margin-bottom: 16px;
......
src/views/read/wpsReader/component/rightPanel.vue
浏览文件 @ e0d5a9e8
<template>
<div class="panel">
<div class="left">
<div class="title">{{ currentTab }}</div>
<div class="title">插入笔记</div>
<div class="left-content">
<InsertNote
ref="InsertNote"
@insertText="handleInsertText"
@handleOpenAddUpdateDialog="handleOpenAddUpdateDialog"
/>
<!-- <AutoCheck v-if="currentTab == '自动检查'" />
<AutoClose v-if="currentTab == '自动补全'" /> -->
</div>
</div>
<!-- <div class="right">
<div class="tabs">
<div
@click="handleClickTab(item)"
:class="{ 'tab-item': true, active: currentTab == item }"
v-for="(item, index) in tabs"
:key="index"
>
{{ item }}
</div>
</div>
</div> -->
<div class="close">
<i class="el-icon-close"></i>
</div>
......@@ -32,30 +18,18 @@
<script>
import InsertNote from "./insertNote.vue";
import AutoCheck from "./autoCheck.vue";
import AutoClose from "./autoClose.vue";
export default {
name: "rightPanel",
components: {
InsertNote,
AutoCheck,
AutoClose,
},
data() {
return {
// 当前选中的tab
currentTab: "插入笔记",
//右侧tabs
tabs: ["插入笔记", "自动检查", "自动补全"],
};
},
methods: {
handleClickTab(tab) {
this.currentTab = tab;
},
// 获取笔记
loadNoteData() {
console.log("获取笔记loadData");
this.$refs.InsertNote.loadData();
},
//插入文字
......
vue.config.js
浏览文件 @ e0d5a9e8
......@@ -35,9 +35,9 @@ module.exports = {
proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: {
// target: `http://222.85.214.245:9600`,
target: `http://222.85.214.245:9600`,
// target: `http://222.85.214.245:9558`,
target: `http://172.24.100.246:9600`,
// target: `http://172.24.100.246:9600`,
changeOrigin: true,
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论