manager/zyplayer-doc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

文档展示和编辑

Browse Source
This commit is contained in:
暮光：城中城
2019-06-01 23:03:10 +08:00
parent 48f81dc547
commit 49189587ce
8 changed files with 263 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
zyplayer-doc-ui/wiki-ui/src/App.vue
View File

@@ -71,7 +71,7 @@
<el-select v-model="newSpaceForm.type" filterable placeholder="选择类型" style="width: 100%;">
<el-option :key="1" label="公共空间" :value="1">
<span style="float: left">公共空间</span>
<span style="float: right; color: #8492a6; font-size: 13px;">属于公共，登录用户可访问</span>
<span style="float: right; color: #8492a6; font-size: 13px;">属于公共，登录用户可访问、编辑</span>
</el-option>
<el-option :key="2" label="个人空间" :value="2">
<span style="float: left">个人空间</span>
@@ -211,9 +211,7 @@
},
createWiki() {
if (app.nowSpaceId > 0) {
this.newPageId = "";
this.newPageTitle = "";
this.rightContentType = 2;
this.$router.push({path: '/page/edit'});
} else {
toast.warn("请先选择或创建空间");
}

2
zyplayer-doc-ui/wiki-ui/src/common/config/apilist.js
View File

@@ -5,7 +5,7 @@ var URL = {
pageUpdate: '/zyplayer-doc-wiki/page/update',
pageList: '/zyplayer-doc-wiki/page/list',
updatePage: '/zyplayer-doc-wiki/page/update',
updateDetail: '/zyplayer-doc-wiki/page/detail',
pageDetail: '/zyplayer-doc-wiki/page/detail',
spaceList: '/zyplayer-doc-wiki/space/list',
updateSpace: '/zyplayer-doc-wiki/space/update',

129
zyplayer-doc-ui/wiki-ui/src/common/lib/common/common.js
View File

@@ -3,53 +3,86 @@ import global from '../../config/global'
import apimix from '../../config/apimix'
export default {
data: {
accessToken: '',
},
setAccessToken: function (token) {
this.data.accessToken = token;
},
getAccessToken: function () {
if (!this.data.accessToken) {
var arr, reg = new RegExp("(^| )accessToken=([^;]*)(;|$)");
if (arr = document.cookie.match(reg)) {
this.data.accessToken = unescape(arr[2]);
}
}
return this.data.accessToken;
},
validateResult: function (res, callback) {
if (!!res.message) {
global.vue.$message('请求错误：' + res.message);
} else if (res.data.errCode == 400) {
global.vue.$message('请先登录');
// window.location = apimix.apilist1.HOST + "/static/manage/login.html";
} else if (res.data.errCode == 402) {
global.vue.$router.push("/common/noAuth");
} else if (res.data.errCode !== 200) {
global.vue.$message(res.data.errMsg || "未知错误");
} else {
if (typeof callback == 'function') {
callback(res.data);
}
}
},
post: function (url, param, callback) {
param = param || {};
param.accessToken = this.getAccessToken();
global.vue.axios({
method: "post",
url: url,
headers: {'Content-type': 'application/x-www-form-urlencoded'},
data: Qs.stringify(param),
withCredentials: true,
}).then((res) => {
console.log("ok", res);
this.validateResult(res, callback);
}).catch((res) => {
console.log("error", res);
this.validateResult(res);
});
},
data: {
accessToken: '',
},
setAccessToken: function (token) {
this.data.accessToken = token;
},
getAccessToken: function () {
if (!this.data.accessToken) {
var arr, reg = new RegExp("(^| )accessToken=([^;]*)(;|$)");
if (arr = document.cookie.match(reg)) {
this.data.accessToken = unescape(arr[2]);
}
}
return this.data.accessToken;
},
validateResult: function (res, callback) {
if (!!res.message) {
global.vue.$message('请求错误：' + res.message);
} else if (res.data.errCode == 400) {
global.vue.$message('请先登录');
window.location = apimix.apilist1.HOST + "/static/manage/login.html";
} else if (res.data.errCode == 402) {
global.vue.$router.push("/common/noAuth");
} else if (res.data.errCode !== 200) {
global.vue.$message(res.data.errMsg || "未知错误");
} else {
if (typeof callback == 'function') {
callback(res.data);
}
}
},
post: function (url, param, callback) {
param = param || {};
param.accessToken = this.getAccessToken();
global.vue.axios({
method: "post",
url: url,
headers: {'Content-type': 'application/x-www-form-urlencoded'},
data: Qs.stringify(param),
withCredentials: true,
}).then((res) => {
console.log("ok", res);
this.validateResult(res, callback);
}).catch((res) => {
console.log("error", res);
this.validateResult(res);
});
},
/**
* 返回不为空的字符串，为空返回def
*/
getNotEmptyStr(str, def) {
if (isEmpty(str)) {
return isEmpty(def) ? "" : def;
}
return str;
},
/**
* 是否是空对象
* @param obj
* @returns
*/
isEmptyObject(obj) {
return isEmpty(obj) || $.isEmptyObject(obj);
},
/**
* 是否是空字符串
* @param str
* @returns
*/
isEmpty(str) {
return (str == "" || str == null || str == undefined);
},
/**
* 是否不是空字符串
* @param str
* @returns
*/
isNotEmpty(str) {
return !isEmpty(str);
},
}

2
zyplayer-doc-ui/wiki-ui/src/routes.js
View File

@@ -4,6 +4,7 @@ import UserLogin from './views/user/Login.vue'
import UserRouterView from './views/user/RouterView.vue'
import PageShow from './views/page/Show.vue'
import PageEdit from './views/page/Edit.vue'
import PageRouterView from './views/page/RouterView.vue'
import CommonNoAuth from './views/common/NoAuth.vue'
@@ -29,6 +30,7 @@ let routes = [
component: PageRouterView,
children: [
{path: 'show', name: '页面内容展示',component: PageShow},
{path: 'edit', name: '编辑内容',component: PageEdit},
]
}, {
path: '/common',

146
zyplayer-doc-ui/wiki-ui/src/views/page/Edit.vue Normal file
View File

@@ -0,0 +1,146 @@
<template>
<div style="padding: 10px;">
<el-row type="border-card">
<div style="margin-bottom: 10px;padding: 10px;" v-if="wikiPage.id > 0">
编辑：{{parentPath.path}}
</div>
<div style="margin-bottom: 10px;padding: 10px;" v-else>
父级：{{parentPath.path || '/'}}　
<el-tooltip class="item" content="在根目录创建文档">
<el-button type="text" @click="parentPath = {}" style="padding: 0 10px;">根目录</el-button>
</el-tooltip>
</div>
<el-input v-model="newPageTitle" placeholder="请输入标题"></el-input>
<div id="newPageContentDiv" style="margin: 10px 0;"></div>
<el-button type="primary" v-on:click="createWikiSave">保存</el-button>
<el-button v-on:click="createWikiCancel">取消</el-button>
</el-row>
</div>
</template>
<script>
import toast from '../../common/lib/common/toast'
import WangEditor from 'wangeditor'
var app;
export default {
data() {
return {
editor: {},
// 编辑相关
nowSpaceId: "",
newPageId: "",
newPageTitle: "",
parentPath: {
id: '',
path: '',
},
wikiPage: {},
};
},
beforeRouteUpdate(to, from, next) {
this.initQueryParam(to);
next();
},
mounted: function () {
app = this;
this.initEditor();
this.initQueryParam(this.$route);
},
methods: {
createWikiCancel() {
this.$confirm('确定要取消编辑吗？您编辑的内容将不会被保存哦~', '提示', {
confirmButtonText: '确定',
cancelButtonText: '继续编辑',
type: 'warning'
}).then(() => {
});
},
createWikiSave() {
var parentId = app.parentPath.id;
if (this.wikiPage.id > 0) {
parentId = "";
}
if (this.common.isEmpty(app.newPageTitle)) {
toast.warn("标题不能为空");
return;
}
var param = {
spaceId: app.nowSpaceId,
id: app.wikiPage.id,
name: app.newPageTitle,
parentId: parentId,
content: this.editor.txt.html()
};
this.common.post(this.apilist1.updatePage, param, function (json) {
toast.success("保存成功！");
// app.urlParamPageId = json.data.id;
// app.loadPageDetail(json.data.id);
// app.doGetPageList(null);
});
},
loadPageDetail(pageId) {
app.rightContentType = 1;
var param = {id: pageId};
this.common.post(this.apilist1.pageDetail, param, function (json) {
app.wikiPage = json.data.wikiPage || {};
app.pageContent = json.data.pageContent || {};
app.pageFileList = json.data.fileList || [];
// 内容
app.nowSpaceId = app.wikiPage.spaceId;
app.newPageTitle = app.wikiPage.name;
app.editor.txt.html(app.pageContent.content || "");
});
},
cleanPage() {
app.wikiPage = {};
app.pageContent = {};
app.pageFileList = [];
app.newPageTitle = "";
if (!!app.editor.txt) {
app.editor.txt.html("");
}
},
initQueryParam(to) {
this.nowSpaceId = to.query.spaceId;
var pageId = to.query.pageId;
if (!!pageId) {
this.loadPageDetail(pageId);
} else {
this.cleanPage();
}
},
initEditor() {
this.editor = new WangEditor('#newPageContentDiv');
this.editor.customConfig.uploadImgServer = this.apilist1.HOST + '/zyplayer-doc-wiki/common/wangEditor/upload';
this.editor.customConfig.zIndex = 100;
this.editor.customConfig.uploadFileName = 'files';
this.editor.customConfig.uploadImgMaxLength = 1;
this.editor.customConfig.pasteFilterStyle = false;
this.editor.customConfig.withCredentials = true;
this.editor.create();
},
}
}
</script>
<style>
.icon-collapse{float: left;font-size: 25px;color: #aaa;margin-top: 8px;cursor: pointer;}
.icon-collapse:hover{color: #eee;}
.wiki-title{font-size: 20px;}
.wiki-author{font-size: 14px;color: #888;padding: 20px 0;height: 40px;line-height: 40px;}
.wiki-content{font-size: 14px;}
.wiki-content.w-e-text{overflow-y: auto;}
.upload-page-file .el-upload-list{display: none;}
.is-link{color: #1e88e5;cursor: pointer;}
/*编辑框高度*/
#newPageContentDiv .w-e-text-container{height: 600px !important;}
/*评论*/
.comment-box .head{
float: left;background-color: #ccc;border-radius: 50%;margin-right: 10px;
width: 45px; height: 45px; line-height: 45px;text-align: center;color: #fff;
}
</style>

9
zyplayer-doc-ui/wiki-ui/src/views/page/Show.vue
View File

@@ -95,12 +95,8 @@
<script>
import toast from '../../common/lib/common/toast'
import jquery from '../../common/lib/jquery/jquery-3.1.0.min'
import wangEditorJs from '../../common/lib/wangEditor/wangEditor.min.js'
import wangEditorCss from '../../common/lib/wangEditor/wangEditor.min.css'
var app;
var page = {
newPageContentEditor: '',
colorArr: ["#67C23A", "#409EFF", "#E6A23C", "#F56C6C", "#909399", "#303133"],
userHeadColor: {},
};
@@ -121,7 +117,7 @@
recommentInfo: {},
};
},
beforeRouteUpdate(to, from, next){
beforeRouteUpdate(to, from, next) {
var pageId = to.query.pageId;
if (!!pageId) {
this.loadPageDetail(pageId);
@@ -137,6 +133,7 @@
},
methods: {
editWiki() {
this.$router.push({path: '/page/edit', query: {pageId: this.wikiPage.id}});
// this.rightContentType = 2;
// this.newPageId = app.wikiPage.id;
// this.newPageTitle = app.wikiPage.name;
@@ -165,7 +162,7 @@
loadPageDetail(pageId) {
app.rightContentType = 1;
var param = {id: pageId};
this.common.post(this.apilist1.updateDetail, param, function (json) {
this.common.post(this.apilist1.pageDetail, param, function (json) {
var wikiPage = json.data.wikiPage || {};
wikiPage.selfZan = json.data.selfZan || 0;
app.wikiPage = wikiPage;