Song/xkrs_ms
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

文章读取显示

Browse Source
This commit is contained in:
WangHao
2020-10-18 00:43:29 +08:00
parent bbcf39bfc6
commit 368bfc5c85
5 changed files with 107 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
ruoyi-note/src/main/java/com/ruoyi/note/domain/NmNote.java
View File

@@ -118,7 +118,7 @@ public class NmNote
/**富文本文章内容*/
@Transient
private String UeditorContent;
private String ueditorContent;
}

10
ruoyi-ui/src/components/BookmarkList/index.vue
View File

@@ -56,12 +56,12 @@
this.showView(this.property);
},
updated(){
this.showView(this.property);
// this.showView(this.property);
},
created() {
var that=this;
//便签ID
that.Ueditor = that.$route.query.Ueditor;
// var that=this;
// //便签ID
// that.Ueditor = that.$route.query.Ueditor;
},
filters: {
@@ -121,7 +121,7 @@
}
.bookmark:hover {
background-color: #D4D4D4;
background-color: #E8E8E8;
}

2
ruoyi-ui/src/components/TinyMCE/index.vue
View File

@@ -72,7 +72,7 @@
language: 'zh_CN',
skin_url: '/tinymce/skins/ui/oxide',
// skin_url: 'tinymce/skins/ui/oxide-dark',//暗色系
height: 300,
height: 600,
menubar: 'file edit insert view format table',//菜单 //
// 配置每个菜单栏的子菜单项（如下是默认配置）
menu: {

53
ruoyi-ui/src/views/bookmark/bookmark/index.vue
View File

@@ -126,7 +126,7 @@
<div class="nullbookmark-img">
</div>
<div style="color: #000000" class="nullbookmark-text">
此目录还未添加书签
此目录还未添加收藏
</div>
</div>
@@ -199,10 +199,10 @@
<div class="bookmarklist" :style="datalist" infinite-scroll-distance="10" v-loading="loading" v-if="showbookmark"
v-infinite-scroll="load"
infinite-scroll-disabled="disabled" style="overflow:auto;" infinite-scroll-immediate="false">
<BookmarkOne @on-windowurl="windowurl" :property="property" :listloading="listloading" :loading="loading" :bookmarkList="bookmarkList"></BookmarkOne>
<BookmarkOne @on-windowurl="windowurl" :key="property" :property="property" :listloading="listloading" :loading="loading" :bookmarkList="bookmarkList"></BookmarkOne>
<p v-if="listloading" class="listhint"><i class="el-icon-loading"></i>加载中...</p>
<p v-if="listnoMore" class="listhint">没有更多了</p>
<p v-if="listnoMore&&!showimg" class="listhint">没有更多了</p>
</div>
@@ -286,15 +286,16 @@
<i class="el-icon-rank" ></i>
</div>
<div class="mianUrl-top-right">
<i class="el-icon-edit-outline" @click="windowurlOpen"></i>
<i class="el-icon-position"></i>
<i class="el-icon-edit-outline" ></i>
<i class="el-icon-position" @click="windowurlOpen"></i>
</div>
</el-header>
<!-- <div class="main-url-title">部分网站不允许内嵌套打开,请在设置中选择自己喜欢的打开方式!</div>-->
<div class="mianUrl-botoom" v-loading="iframeLoading" >
<!-- webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen="true"-->
<!-- <iframe sandbox="allow-forms allow-scripts allow-popups" class="openurl" :src="gourl" target="_self" tabindex="-1" />-->
<router-view :key="$route.query.t"></router-view>
<!-- <router-view :key="$route.query.t"></router-view>-->
<TinyMceEdit :key="noteId" :ueditor="Ueditor" :noteid="noteId"></TinyMceEdit>
</div>
</el-main>
@@ -311,6 +312,7 @@
import {listMenuByUserId} from "@/api/bookmark/menu";
import Treeselect from "@riophae/vue-treeselect";
import BookmarkOne from "../../../components/BookmarkList";
import TinyMceEdit from "../../../views/bookmark/common/NqEdit";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import {
selectBymenuIdUserID,
@@ -331,7 +333,7 @@
export default {
components: {
format, Treeselect,BookmarkOne
format, Treeselect,BookmarkOne,TinyMceEdit
},
data: function () {
@@ -436,6 +438,11 @@
isMain:true,
menuId:undefined,//当前目录
Ueditor:undefined,//点击的编辑器文章id
noteId:undefined, //点击的noteId
}
},
@@ -534,7 +541,6 @@
that.$set(that.queryParams, 'pageNum', i)
that.$set(that.noteParams, 'pageNum', m)
// console.log("this.queryParams.pageNum:" + that.queryParams.pageNum)
var listcount = Math.ceil(that.total / 15);
@@ -543,10 +549,8 @@
that.noMore = true;
that.listnoMore = true;
that.listloading = false
// console.log("禁止滚动了")
return;
} else {
this.listloading = true
setTimeout(() => {
switch(this.property) {
@@ -817,9 +821,6 @@
this.bookmarkList = response.rows;
this.total = response.total;
this.loading = false;
// if (this.total>0){
// this.gourl=this.bookmarkList[0].url;
// }
if (this.bookmarkList==null||this.bookmarkList.length==0) {
this.showimg=true;
}
@@ -880,22 +881,9 @@
}
});
},
// /**网站内打开*/
// windowurl(url,bookmarkId) {
// var that=this;
// //网站内打开
// that.iframeLoading=true;
// this.gourl=url;
// setTimeout(function(){
// that.iframeLoading=false;
// },1000);
// },
/**网站内便签打开 网页*/
windowurl(noteId, tiymceueditor,bookmarkId,url) {
var that=this;
console.log("noteId:"+noteId)
console.log("tiymceueditor:"+tiymceueditor)
this.openIsMain();
switch (that.property) {
case 0:
/**网页新窗口打开*/
@@ -903,16 +891,9 @@
break;
case 1:
/**编辑器内部打开*/
that.$router.push({
path: "/NqEdit",
query: {
Ueditor: tiymceueditor,
noteId:noteId,
// menuId:that.noteParams.menuId,
property:that.property,
t:Date.now(),
}
})
this.openIsMain();
that.Ueditor=tiymceueditor;//点击的编辑器文章id
that.noteId=noteId; //点击的noteId
break;
default:
}

133
ruoyi-ui/src/views/bookmark/common/NqEdit.vue
View File

@@ -1,41 +1,40 @@
<template>
<div class="home">
<div class="home" >
<div CLASS="nqtitle">
<div class="mdui-textfield mdui-textfield-floating-label">
<label class="mdui-textfield-label">文章标题</label>
<input class="mdui-textfield-input" type="text" required/>
<div class="mdui-textfield-error">文章标题不能为空</div>
<div class="nqtitle">
<div class="mdui-textfield mdui-textfield-floating-label inputtop">
<input class="mdui-textfield-input" v-model="queryParamsAndMg.title" type="text" required/>
</div>
</div>
<!-- <div class="mian" v-html="msg">-->
<div v-loading="loading" v-if="!showEditor" class="mian" v-html="queryParamsAndMg.ueditorContent">
<!-- </div>-->
</div>
<div>
<tinymce
ref="editor"
v-model="queryParams.UeditorContent"
:disabled="disabled"
@onClick="onClick"
/>
</div>
<div STYLE="margin-top: 10px;margin-bottom: 10px">
<div v-if="showEditor" class="edit">
<tinymce
ref="editor"
v-model="queryParamsAndMg.ueditorContent"
:disabled="disabled"
@onClick="onClick"
/>
<div v-if="showEditor" STYLE="margin-top: 10px;margin-bottom: 10px">
<button class="mdui-btn mdui-btn-raised mdui-color-indigo-300" @click="clear">清空内容</button>
<button class="mdui-btn mdui-btn-raised mdui-color-indigo-300" @click="clear">发布</button>
<button class="mdui-btn mdui-ripple mdui-btn-raised " @click="disabled = true">禁用</button>
<button class="mdui-btn mdui-ripple mdui-btn-raised " @click="disabled = false">启用</button>
</div>
</div>
</div>
</template>
<script>
import tinymce from '../../../components/TinyMCE'
import {
userUpdateNote,userGetNoteInfo
userUpdateNote, userGetNoteInfo
} from "@/api/note/note";
const defaultForm = {
status: 'draft',
title: '', // 文章题目
@@ -55,12 +54,25 @@
components: {
tinymce
},
data(){
return{
props: {
ueditor: null,
noteid: null,
updateEditor:null
},
mounted() {
this.showEditor=this.updateEditor;
this.getNoteById();
},
updated() {
},
data() {
return {
postForm: Object.assign({}, defaultForm),
msg: "<span>请尽情创作吧!</span>",
disabled: false,
queryParams:{
queryParamsAndMg: {
noteId: undefined,
userId: undefined,
title: undefined,
@@ -77,73 +89,94 @@
isShare: undefined,
isEncryption: undefined,
createUserName: undefined,
tiymceUeditor:undefined,
UeditorContent:undefined,
tiymceUeditor: undefined,
ueditorContent: undefined,
},
showEditor:false,
loading:false,
}
},
created() {
var that = this;
var Ueditor = that.$route.query.Ueditor;
var noteId = that.$route.query.noteId;
this.queryParams.tiymceUeditor=Ueditor;
this.queryParams.noteId=noteId;
//查看对应的文章 信息和标题等等
this.getNoteList();
},
methods: {
/** 实时更新文章的信息 */
UpdateNote(){
userUpdateNote(this.queryParams).then(response =>{
console.log("已保存:"+Date.now())
UpdateNote() {
userUpdateNote(this.queryParamsAndMg).then(response => {
console.log("已保存:" + Date.now())
});
},
/** 查询便签管理列表 */
getNoteList() {
userGetNoteInfo(this.queryParams.noteId).then(response => {
this.queryParams = response.rows;
});
getNoteById() {
console.log("请求执行了!!!")
var that = this;
that.loading=true;
var blueditor = that.ueditor != null && that.ueditor != '' && that.ueditor != undefined;
var blnoteId = that.noteid != null && that.noteid != '' && that.noteid != undefined;
if (blueditor) {
this.queryParamsAndMg.tiymceUeditor = that.ueditor;
}
if (blnoteId) {
this.queryParamsAndMg.noteId = that.noteid;
}
if (blueditor && blnoteId) {
userGetNoteInfo(this.queryParamsAndMg.noteId).then(response => {
that.queryParamsAndMg = response.data;
});
}
that.loading=false;
},
//鼠标单击的事件
onClick (e, editor) {
onClick(e, editor) {
console.log('Element clicked')
console.log(e)
console.log(editor)
},
//清空内容
clear () {
clear() {
this.$refs.editor.clear()
}
}
}
</script>
<style scoped>
.title{
.title {
display: flex;
}
.title div:first-child{
.title div:first-child {
margin-right: 20px;
}
.title div{
.title div {
width: 50%;
}
.mian{
height: 300px;
.mian {
height: 100%;
overflow-y: auto;
width: 100%;
border: 1px solid #cacaca;
background-color: #ebebeb;
width: 1000px;
/*text-indent: 10px;*/
padding: 10px;
margin-bottom: 10px;
opacity: 0.9;
}
.home{
.home {
height: 800px;
overflow: scroll;
}
.edit{
margin-left: 3px;
}
.nqtitle{
margin-left: 3px;
margin-bottom: 10px;
}
.inputtop{
padding-top: 6px;
}
</style>