文章读取显示

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

View File

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

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;
}

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: {

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:
}

View File

@ -1,33 +1,31 @@
<template>
<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>
<div v-if="showEditor" class="edit">
<tinymce
ref="editor"
v-model="queryParams.UeditorContent"
v-model="queryParamsAndMg.ueditorContent"
:disabled="disabled"
@onClick="onClick"
/>
</div>
<div STYLE="margin-top: 10px;margin-bottom: 10px">
<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>
@ -36,6 +34,7 @@
import {
userUpdateNote, userGetNoteInfo
} from "@/api/note/note";
const defaultForm = {
status: 'draft',
title: '', //
@ -54,13 +53,26 @@
name: 'home',
components: {
tinymce
},
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,
@ -78,33 +90,41 @@
isEncryption: undefined,
createUserName: undefined,
tiymceUeditor: undefined,
UeditorContent: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 =>{
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) {
@ -123,27 +143,40 @@
.title {
display: flex;
}
.title div:first-child {
margin-right: 20px;
}
.title div {
width: 50%;
}
.mian {
height: 300px;
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 {
height: 800px;
overflow: scroll;
}
.edit{
margin-left: 3px;
}
.nqtitle{
margin-left: 3px;
margin-bottom: 10px;
}
.inputtop{
padding-top: 6px;
}
</style>