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

wiki增加开放访问

Browse Source
This commit is contained in:
暮光：城中城
2019-03-13 21:30:27 +08:00
parent b037af447f
commit 5096d242fd
12 changed files with 581 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
zyplayer-doc-wiki/src/main/resources/doc-wiki.html
View File

@@ -33,7 +33,9 @@
<el-tree :props="defaultProps" :data="wikiPageList" @node-click="handleNodeClick"
@node-expand="handleNodeExpand" draggable @node-drop="handlePageDrop"
ref="wikiPageTree" :filter-node-method="filterPageNode" highlight-current
:expand-on-click-node="false">
:expand-on-click-node="false" :default-expanded-keys="wikiPageExpandedKeys"
node-key="id"
style="background-color: #fafafa;">
</el-tree>
</div>
</el-aside>
@@ -168,9 +170,28 @@
<el-form-item label="空间描述：" prop="spaceExplain">
<el-input v-model="newSpaceForm.spaceExplain"></el-input>
</el-form-item>
<el-form-item label="目录加载：" prop="treeLazyLoad">
<el-form-item label="空间开放：">
<el-switch v-model="newSpaceForm.openDoc" inactive-text="需要登录" :inactive-value="0" active-text="开放访问" :active-value="1"></el-switch>
</el-form-item>
<el-form-item label="目录加载：">
<el-switch v-model="newSpaceForm.treeLazyLoad" inactive-text="预先加载" :inactive-value="0" active-text="延迟加载" :active-value="1"></el-switch>
</el-form-item>
<!--<el-form-item label="空间类型：">-->
<!--<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>-->
<!--</el-option>-->
<!--<el-option :key="2" label="个人空间" :value="2">-->
<!--<span style="float: left">个人空间</span>-->
<!--<span style="float: right; color: #8492a6; font-size: 13px;">属于个人，所有登录用户可访问</span>-->
<!--</el-option>-->
<!--<el-option :key="3" label="隐私空间" :value="3">-->
<!--<span style="float: left">隐私空间</span>-->
<!--<span style="float: right; color: #8492a6; font-size: 13px;">属于个人，仅创建者可访问</span>-->
<!--</el-option>-->
<!--</el-select>-->
<!--</el-form-item>-->
<el-form-item>
<el-button type="primary" v-if="newSpaceForm.id > 0" @click="onNewSpaceSubmit('newSpaceForm')">保存修改</el-button>
<el-button type="primary" v-else @click="onNewSpaceSubmit('newSpaceForm')">立即创建</el-button>
@@ -184,6 +205,12 @@
<el-table-column prop="id" label="ID" width="60"></el-table-column>
<el-table-column prop="name" label="名字"></el-table-column>
<el-table-column prop="spaceExplain" label="说明"></el-table-column>
<el-table-column label="开放地址">
<template slot-scope="scope">
<a target="_blank" :href="'open-wiki.html?space='+scope.row.uuid" v-if="scope.row.openDoc == 1">{{scope.row.uuid}}</a>
<span v-else>暂未开放</span>
</template>
</el-table-column>
<el-table-column prop="createUserName" label="创建人"></el-table-column>
<el-table-column prop="createTime" label="创建时间"></el-table-column>
<el-table-column label="操作">
@@ -254,7 +281,7 @@
nowSpaceShow: {},
newSpaceDialogVisible: false,
manageSpaceDialogVisible: false,
newSpaceForm: {id: '', name: '', spaceExplain: '', treeLazyLoad: 0},
newSpaceForm: {id: '', name: '', spaceExplain: '', treeLazyLoad: 0, openDoc: 0, uuid: '', type: 1},
newSpaceFormRules: {
name: [
{required: true, message: '请输入空间名', trigger: 'blur'},
@@ -272,6 +299,7 @@
// 页面展示相关
wikiPageList:[],
wikiPage: {},
wikiPageExpandedKeys: [],
pageContent: {},
pageFileList: [],
uploadFileList: [],
@@ -282,14 +310,33 @@
commentTextInput: "",
commentList: [],
recommentInfo: {},
// 页面跳转相关
initOver: false,
urlParam: {
pageId: 0
},
}
},
watch: {
urlParam: {
handler(newVal, oldVal) {
if (!this.initOver) return;
var params = urlToParam(newVal).slice(1);
window.history.pushState(null, null, '?' + params);
console.log(newVal, oldVal, params);
var oldPageId = oldVal.pageId || 0;
if (!!newVal.pageId && newVal.pageId > 0 && newVal.pageId !== oldPageId) {
this.wikiPageExpandedKeys = [parseInt(newVal.pageId)];
this.loadPageDetail(newVal.pageId);
}
},
deep: true, immediate: true
}
},
mounted: function () {
this.init();
this.loadSpaceList();
this.initOver = true;
},
methods: {
filterPageNode(value, data) {
@@ -299,7 +346,7 @@
editSpaceInfo(row) {
app.newSpaceForm = {
id: row.id, name: row.name, spaceExplain: row.spaceExplain,
treeLazyLoad: row.treeLazyLoad
treeLazyLoad: row.treeLazyLoad, openDoc: row.openDoc, type: row.type
};
app.newSpaceDialogVisible = true;
},
@@ -356,6 +403,8 @@
var param = {
id: app.newSpaceForm.id,
name: app.newSpaceForm.name,
type: app.newSpaceForm.type,
openDoc: app.newSpaceForm.openDoc,
spaceExplain: app.newSpaceForm.spaceExplain,
treeLazyLoad: app.newSpaceForm.treeLazyLoad,
};
@@ -374,7 +423,7 @@
app.rightContentType = 0;
app.doGetPageList(null);
}
app.newSpaceForm = {id: '', name: '', spaceExplain: '', treeLazyLoad: 0};
app.newSpaceForm = {id: '', name: '', spaceExplain: '', treeLazyLoad: 0, openDoc: 0, uuid: '', type: 1};
app.newSpaceDialogVisible = false;
}
});
@@ -493,7 +542,7 @@
cancelButtonText: '继续编辑',
type: 'warning'
}).then(() => {
if (isEmpty(this.lastClickNode.label)) {
if (isEmpty(this.lastClickNode.name)) {
this.rightContentType = 0;
} else {
this.rightContentType = 1;
@@ -541,7 +590,7 @@
},
spaceChangeEvents(data) {
if (data == 0) {
app.newSpaceForm = {id: '', name: '', spaceExplain: '', treeLazyLoad: 0};
app.newSpaceForm = {id: '', name: '', spaceExplain: '', treeLazyLoad: 0, openDoc: 0, uuid: '', type: 1};
app.choiceSpace = app.nowSpaceId;
app.newSpaceDialogVisible = true;
} else if (data == -1) {
@@ -590,6 +639,7 @@
app.pageContent = json.data.pageContent || {};
app.pageFileList = json.data.fileList || [];
app.uploadFormData = {pageId: app.wikiPage.id};
app.urlParam.pageId = app.wikiPage.id;
}
});
this.loadCommentList(pageId);
@@ -681,6 +731,23 @@
page.newPageContentEditor.customConfig.zIndex = 100;
page.newPageContentEditor.customConfig.pasteFilterStyle = false;
page.newPageContentEditor.create();
// 初始化页面参数
var url = document.location.toString();
if (url.indexOf("?") >= 0) {
var urlParam = {};
for (var key in this.urlParam) {
urlParam[key] = this.urlParam[key];
}
var params = url.split("?")[1];
var paramArr = params.split("&");
for (var i = 0; i < paramArr.length; i++) {
if (paramArr[i].indexOf("=") > 0) {
var param = paramArr[i].split("=");
urlParam[param[0]] = param[1];
}
}
this.urlParam = urlParam;
}
}
}
});

310
zyplayer-doc-wiki/src/main/resources/open-wiki.html Normal file
View File

@@ -0,0 +1,310 @@
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>wiki文档管理系统</title>
<link rel="shortcut icon" href="webjars/doc-wiki/img/wiki.ico"/>
<link rel="stylesheet" href="webjars/doc-wiki/css/element-ui.css">
<link rel="stylesheet" href="webjars/doc-wiki/css/doc-wiki.css" />
</head>
<body>
<div id="app">
<el-container style="height: 100%;">
<el-aside width="280" style="height: 100%;background-color: #fafafa;">
<div style="padding: 0 10px 50px 10px;" v-show="leftCollapse">
<el-input v-model="searchKeywords" @keyup.enter.native="searchByKeywords" placeholder="搜索文档" style="margin: 10px 0;">
<el-button slot="append" icon="el-icon-search" v-on:click="searchByKeywords"></el-button>
</el-input>
<el-tree :props="defaultProps" :data="wikiPageList" @node-click="handleNodeClick"
@node-expand="handleNodeExpand"
ref="wikiPageTree" :filter-node-method="filterPageNode" highlight-current
:expand-on-click-node="false" :default-expanded-keys="wikiPageExpandedKeys"
node-key="id"
style="background-color: #fafafa;">
</el-tree>
<div class="build-info">本文档使用<span @click="aboutDialogVisible = true;">zyplayer-doc</span>构建</div>
</div>
</el-aside>
<el-container>
<el-main class="doc-body-box">
<el-row type="border-card" v-show="rightContentType == 0">
<div style="margin-top: 30px;color: #666; text-align: center; font-size: 30px;">欢迎使用在线文档</div>
<div style="margin-top: 30px;color: #666; text-align: center;">
{{nowSpaceShow.name}}
<span v-show="nowSpaceShow.spaceExplain && nowSpaceShow.spaceExplain.length > 0"> · {{nowSpaceShow.spaceExplain}}</span>
</div>
</el-row>
<el-row type="border-card" v-show="rightContentType == 1">
<i class="el-icon-menu icon-collapse" @click="leftCollapse = !leftCollapse;"></i>
<div style="max-width: 950px;margin: 0 auto;">
<div class="wiki-title">{{wikiPage.name}}</div>
<div class="wiki-author">
<span><span v-show="wikiPage.updateTime">最后修改：{{wikiPage.updateTime}}</span></span>
</div>
<div class="wiki-files">
<el-table v-show="pageFileList.length > 0" :data="pageFileList" border style="width: 100%; margin-bottom: 5px;">
<el-table-column label="文件名">
<template slot-scope="scope">
<a target="_blank" :href="scope.row.fileUrl">{{scope.row.fileName}}</a>
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建时间"></el-table-column>
</el-table>
</div>
<div class="wiki-content w-e-text">
<div v-html="pageContent.content"></div>
</div>
</div>
</el-row>
</el-main>
</el-container>
</el-container>
<!--关于弹窗-->
<el-dialog title="关于zyplayer-doc-wiki" :visible.sync="aboutDialogVisible" width="600px">
<el-form>
<el-form-item label="项目地址：">
<a target="_blank" href="https://gitee.com/zyplayer/zyplayer-doc">zyplayer-doc</a>
</el-form-item>
<el-form-item label="开发人员：">
<a target="_blank" href="http://zyplayer.com">暮光：城中城</a>
</el-form-item>
<el-form-item label="">
欢迎加群讨论，QQ群号：466363173，欢迎提交需求，欢迎使用和加入开发！
</el-form-item>
</el-form>
</el-dialog>
</div>
</body>
<script type="text/javascript" src="webjars/doc-wiki/vue/vue.js"></script>
<script type="text/javascript" src="webjars/doc-wiki/js/element-ui.js"></script>
<!-- ajax 用到了jquery -->
<script type="text/javascript" src="webjars/doc-wiki/js/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="webjars/doc-wiki/js/common.js"></script>
<script type="text/javascript" src="webjars/doc-wiki/js/toast.js"></script>
<script type="text/javascript" src="webjars/doc-wiki/js/formatjson.js"></script>
<script type="text/javascript" src="webjars/doc-wiki/js/doc-wiki-tree.js"></script>
<script type="text/javascript" src="webjars/doc-wiki/lib/wangEditor/wangEditor.js"></script>
<script>
var page = {
newPageContentEditor: '',
colorArr: ["#67C23A", "#409EFF", "#E6A23C", "#F56C6C", "#909399", "#303133"],
userHeadColor: {},
};
var app = new Vue({
el: '#app',
data() {
return {
leftCollapse: true,
aboutDialogVisible: false,
rightContentLoading: false,
rightContentType: 0,// 右侧显示类型，0=欢迎页 1=文章内容 2=编辑或新增文章
pathIndex: [],
defaultProps: {
children: 'children',
label: 'name'
},
// 空间搜索相关
spaceOptions: [],
spaceList:[],
choiceSpace: "",
nowSpaceId: '',
nowSpaceShow: {},
newSpaceDialogVisible: false,
manageSpaceDialogVisible: false,
newSpaceForm: {id: '', name: '', spaceExplain: '', treeLazyLoad: 0},
newSpaceFormRules: {
name: [
{required: true, message: '请输入空间名', trigger: 'blur'},
{min: 2, max: 25, message: '长度在 2 到 25 个字符', trigger: 'blur'}
],
},
// 依据目录树存储的map全局对象
treePathDataMap: new Map(),
// 搜索的输入内容
searchKeywords: "",
lastClickNode: {},
// 编辑相关
newPageId: "",
newPageTitle: "",
// 页面展示相关
wikiPageList:[],
wikiPage: {},
wikiPageExpandedKeys: [],
pageContent: {},
pageFileList: [],
uploadFileList: [],
uploadFormData: {pageId: 0},
zanUserDialogVisible: false,
zanUserList: [],
// 评论相关
commentTextInput: "",
commentList: [],
recommentInfo: {},
// 页面跳转相关
initOver: false,
urlParam: {
pageId: 0
},
}
},
watch: {
urlParam: {
handler(newVal, oldVal) {
if (!this.initOver) return;
var params = urlToParam(newVal).slice(1);
window.history.pushState(null, null, '?' + params);
console.log(newVal, oldVal, params);
var oldPageId = oldVal.pageId || 0;
if (!!newVal.pageId && newVal.pageId > 0 && newVal.pageId !== oldPageId) {
this.wikiPageExpandedKeys = [parseInt(newVal.pageId)];
this.loadPageDetail(newVal.pageId);
}
},
deep: true, immediate: true
}
},
mounted: function () {
this.init();
this.doGetPageList(null);
this.initOver = true;
},
methods: {
filterPageNode(value, data) {
if (!value) return true;
return data.label.indexOf(value) !== -1;
},
notOpen() {
Toast.notOpen();
},
handleNodeClick(data) {
app.rightContentType = 1;
if (app.lastClickNode.id == data.id) {
return;
}
console.log("点击节点：", data);
app.lastClickNode = data;
this.loadPageDetail(app.lastClickNode.id);
},
handleNodeExpand(node) {
if (node.children.length > 0 && node.children[0].needLoad) {
console.log("加载节点：", node);
app.doGetPageList(node.id, node);
}
},
loadPageDetail(pageId) {
app.rightContentType = 1;
var param = {pageId: pageId, space: this.urlParam.space};
ajaxTemp("zyplayer-doc-wiki/open-api/page/detail", "post", "json", param, function (json) {
if (validateResult(json)) {
var wikiPage = json.data.wikiPage || {};
wikiPage.selfZan = json.data.selfZan || 0;
app.wikiPage = wikiPage;
app.pageContent = json.data.pageContent || {};
app.pageFileList = json.data.fileList || [];
app.uploadFormData = {pageId: app.wikiPage.id};
app.urlParam.pageId = app.wikiPage.id;
}
});
},
getUserHeadBgColor(userId) {
var color = page.userHeadColor[userId];
if (!color) {
color = page.colorArr[Math.ceil(Math.random() * page.colorArr.length) - 1];
page.userHeadColor[userId] = color;
}
return color;
},
searchByKeywords() {
this.$refs.wikiPageTree.filter(app.searchKeywords);
},
doGetPageList() {
var nodePath = "/";
var param = {space: this.urlParam.space};
ajaxTemp("zyplayer-doc-wiki/open-api/page/list", "post", "json", param, function (json) {
if (validateResult(json)) {
var pathIndex = json.data || [];
app.createNodePath(pathIndex, nodePath);
app.wikiPageList = pathIndex;
app.lastClickNode = {};
}
});
},
createNodePath(node, nodePath) {
if (!nodePath.endsWith("/")) {
nodePath += "/";
}
for (var i = 0; i < node.length; i++) {
var item = node[i];
item.nodePath = nodePath + item.name;
if (!!item.children && item.children.length > 0) {
this.createNodePath(item.children, item.nodePath);
}
}
},
init(){
page.newPageContentEditor = new window.wangEditor('#newPageContentDiv');
page.newPageContentEditor.customConfig.uploadImgServer = 'zyplayer-doc-wiki/common/upload';
page.newPageContentEditor.customConfig.zIndex = 100;
page.newPageContentEditor.customConfig.pasteFilterStyle = false;
page.newPageContentEditor.create();
// 初始化页面参数
var url = document.location.toString();
if (url.indexOf("?") >= 0) {
var urlParam = {};
for (var key in this.urlParam) {
urlParam[key] = this.urlParam[key];
}
var params = url.split("?")[1];
var paramArr = params.split("&");
for (var i = 0; i < paramArr.length; i++) {
if (paramArr[i].indexOf("=") > 0) {
var param = paramArr[i].split("=");
urlParam[param[0]] = param[1];
}
}
this.urlParam = urlParam;
}
}
}
});
</script>
<style>
html,body,#app {margin: 0; padding: 0; height: 100%;}
pre{margin: 0;white-space: pre-wrap;font-size: 14px; font-family: auto;}
.el-menu {box-sizing: border-box;border-right: 0;margin-right: 3px;}
.el-header {background-color: #409EFF; color: #333; line-height: 40px; text-align: right;height: 40px !important;}
.doc-body-box{
overflow-x: hidden;overflow-y: auto;width: 100%;
padding: 10px;border-left: 1px solid #f1f1f1; box-sizing: border-box;
}
.el-tree{margin-right: 3px;}
.logo{
background: #409EFF; cursor: pointer;
width: 100%; height:40px;line-height:40px;font-size: 25px;color: #fff;text-align: center;
}
.icon-collapse{float: left;font-size: 25px;color: #aaa;cursor: pointer;position: fixed;}
.icon-collapse:hover{color: #ccc;}
.wiki-title{font-size: 20px;text-align: center;}
.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;
}
.build-info{
position: fixed;bottom: 0;left: 0;background: #fafafa;width: 280px;text-align: center;
padding: 5px 0;color: #aaa;font-size: 12px;
}
.build-info span{color: #4183c4;cursor: pointer;}
</style>
</html>

15
zyplayer-doc-wiki/src/main/resources/webjars/doc-wiki/js/common.js
View File

@@ -35,6 +35,21 @@ function validateResult(result) {
return false;
}
function urlToParam(param, key, encode) {
if (param == null) return '';
var paramStr = '';
var t = typeof (param);
if (t == 'string' || t == 'number' || t == 'boolean') {
paramStr += '&' + key + '=' + ((encode == null || encode) ? encodeURIComponent(param) : param);
} else {
for (var i in param) {
var k = key == null ? i : key + (param instanceof Array ? '[' + i + ']' : '.' + i);
paramStr += urlToParam(param[i], k, encode);
}
}
return paramStr;
}
function getNowDate() {
var date = new Date();
var month = date.getMonth() + 1;