修复wiki有序列表不展示序号问题,测试创建目录导航功能

This commit is contained in:
暮光:城中城
2021-11-30 23:41:42 +08:00
parent 66a6378056
commit af645464e4
28 changed files with 25578 additions and 11607 deletions

View File

@@ -1,3 +0,0 @@
{
"lockfileVersion": 1
}

File diff suppressed because it is too large Load Diff

View File

@@ -13,7 +13,7 @@
"element-ui": "^2.15.0",
"jquery": "^3.5.1",
"js-cookie": "^2.2.1",
"mavon-editor": "^2.9.0",
"mavon-editor": "^2.10.0",
"highlight.js": "^11.3.1",
"pouchdb": "^7.1.1",
"qrcodejs2": "0.0.2",

View File

@@ -24,5 +24,5 @@
display: block;
}
.wang-editor-body ul, ol {
margin: 10px 0 10px 20px;
list-style: decimal;
}

View File

@@ -81,13 +81,13 @@
this.upgradeInfo = json.data;
if (!!this.upgradeInfo.upgradeContent) {
this.upgradeInfo.upgradeContent = this.upgradeInfo.upgradeContent.replaceAll('', '\n');
console.log("zyplayer-doc发现新版本"
+ "\n升级地址" + json.data.upgradeUrl
+ "\n当前版本" + json.data.nowVersion
+ "\n最新版本" + json.data.lastVersion
+ "\n升级内容" + json.data.upgradeContent
);
}
console.log("zyplayer-doc发现新版本"
+ "\n升级地址" + json.data.upgradeUrl
+ "\n当前版本" + json.data.nowVersion
+ "\n最新版本" + json.data.lastVersion
+ "\n升级内容" + json.data.upgradeContent
);
}
});
},

View File

@@ -32,7 +32,7 @@
<mavon-editor v-show="wikiPageEdit.editorType===2" ref="mavonEditor" v-model="markdownContent" :toolbars="toolbars"
:externalLink="false"
@save="createWikiSave(0)" @imgAdd="addMarkdownImage"
placeholder="请录入文档内容" class="page-content-editor"/>
placeholder="请录入文档内容" class="page-content-editor wang-editor-body"/>
<div v-show="wikiPageEdit.editorType===1" id="newPageContentDiv" class="page-content-editor" style="height: calc(100vh - 250px);"></div>
</el-row>
</div>
@@ -44,6 +44,7 @@
import {mavonEditor, markdownIt} from 'mavon-editor'
import 'mavon-editor/dist/markdown/github-markdown.min.css'
import 'mavon-editor/dist/css/index.css'
import "../../common/lib/wangEditor.css";
import axios from 'axios'
export default {

View File

@@ -55,6 +55,13 @@
</el-table>
</div>
<div ref="pageContent" class="wiki-page-content">
<!-- <mavon-editor v-if="wikiPage.editorType == 2" ref="mavonEditor" :editable="false"-->
<!-- :subfield="false" defaultOpen="preview" v-model="pageShowDetail"-->
<!-- :toolbars="markdownToolbars"-->
<!-- :externalLink="false" v-highlight-->
<!-- :boxShadow="false"-->
<!-- class="page-content-editor wang-editor-body"-->
<!-- />-->
<div v-html="pageShowDetail" class="markdown-body" v-if="wikiPage.editorType == 2" v-highlight></div>
<div v-html="pageShowDetail" class="wang-editor-body" v-else></div>
</div>
@@ -74,39 +81,6 @@
</span>
</div>
</div>
<!-- <div v-show="commentList.length > 0" class="comment-box" style="margin-top: 20px;">-->
<!-- <div style="border-bottom: 1px solid #67C23A;padding-bottom: 10px;">评论列表</div>-->
<!-- <div v-for="(comment,index) in commentList" :key="comment.id" :data-id="comment.id" :data-index="index" style="border-bottom: 1px solid #eee;padding: 10px;">-->
<!-- <div>-->
<!-- <div :style="'background-color: '+comment.color" class="head">{{comment.createUserName.substr(0,1)}}</div>-->
<!-- </div>-->
<!-- <div style="padding-left: 55px;">-->
<!-- {{comment.createUserName}}-->
<!-- <span style="color: #888;font-size: 13px;padding-left: 10px;">{{comment.createTime}}</span>-->
<!-- <span style="color: #888;font-size: 13px;margin-left: 10px;cursor: pointer;" @click="recommentUser(comment.id, index)">回复</span>-->
<!-- <span style="color: #888;font-size: 13px;margin-left: 10px;cursor: pointer;" @click="deleteComment(comment.id)" v-if="canDeleteComment(comment)">删除</span>-->
<!-- </div>-->
<!-- <pre style="padding: 10px 0 0 55px;">{{comment.content}}</pre>-->
<!-- <div v-for="(commentSub,indexSub) in comment.commentList" :key="commentSub.id" :data-id="commentSub.id" :data-index="indexSub" style="border-bottom: 1px solid #eee;padding: 10px;margin-left: 40px;">-->
<!-- <div>-->
<!-- <div :style="'background-color: '+commentSub.color" class="head">{{commentSub.createUserName.substr(0,1)}}</div>-->
<!-- </div>-->
<!-- <div style="padding-left: 55px;">-->
<!-- {{commentSub.createUserName}}-->
<!-- <span style="color: #888;font-size: 13px;padding-left: 10px;">{{commentSub.createTime}}</span>-->
<!-- <span style="color: #888;font-size: 13px;margin-left: 10px;cursor: pointer;" @click="deleteComment(commentSub.id)" v-if="canDeleteComment(commentSub)">删除</span>-->
<!-- </div>-->
<!-- <pre style="padding: 10px 0 0 55px;">{{commentSub.content}}</pre>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div style="margin: 20px 0 50px 0;">-->
<!-- <el-input type="textarea" v-model="commentTextInput" :rows="5" :placeholder="recommentInfo.placeholder || '请输入评论内容'"></el-input>-->
<!-- <div align="right" style="margin-top: 5px;">-->
<!-- <el-button type="primary" v-on:click="submitPageComment">提交评论</el-button>-->
<!-- <el-button v-on:click="cancelCommentUser" v-show="recommentInfo.id > 0">取消回复</el-button>-->
<!-- </div>-->
<!-- </div>-->
</el-col>
<el-col :span="6" style="height: 100%;" v-show="actionTabVisible">
<i class="el-icon-close close-action-tab" @click="closeActionTab"></i>
@@ -227,7 +201,7 @@
};
export default {
props: ['spaceInfo'],
components: {'el-image-viewer': ElImageViewer},
components: {'el-image-viewer': ElImageViewer, mavonEditor},
data() {
return {
// 页面展示相关
@@ -266,6 +240,10 @@
previewInitialIndex: 0,
showImagePreview: false,
showImagePreviewList: [],
markdownToolbars: {
fullscreen: true,
readmodel: true,
},
};
},
beforeRouteUpdate(to, from, next) {
@@ -522,6 +500,12 @@
};
if (this.wikiPage.editorType === 2) {
this.pageContent.content = markdownIt.render(this.pageContent.content);
// setTimeout(() => {
// // if (this.$refs.mavonEditor) {
// // this.$refs.mavonEditor.toolbar_right_click('read');
// // }
// this.createHeading();
// }, 0);
}
this.pageShowDetail = this.pageContent.content;
// 修改标题
@@ -542,6 +526,112 @@
closeImagePreview() {
this.showImagePreview = false;
},
/**
* 生成目录树
* ========================================================
* 说明:代码修改至 yaohaixiao 的 autoc.js
* 项目 gitee 地址https://gitee.com/yaohaixiao/AutocJS
* ========================================================
*/
createHeading() {
let headArr = [];
let headNodeArr = document.querySelector('.wiki-page-content').querySelectorAll('h1,h2,h3,h4,h5,h6,h7,h8,h9');
headNodeArr.forEach(node => {
headArr.push({
node: node,
level: parseInt(node.tagName.replace(/[h]/i, ''), 10)
});
});
let chapters = []
let previous = 1
let level = 0
headArr.forEach((heading, i) => {
let current = heading.level
let pid = -1
// 当前标题的(标题标签)序号 > 前一个标题的序号:两个相连的标题是父标题 -> 子标题关系;
// h2 (前一个标题)
// h3 (当前标题)
if (current > previous) {
level += 1
// 第一层级的 pid 是 -1
if (level === 1) {
pid = -1
} else {
pid = i - 1
}
}
// 当前标题的(标题标签)序号 = 前一个标题的序号
// h2 (前一个标题)
// h2 (当前标题)
// 当前标题的(标题标签)序号 < 前一个标题的序号,并且当前标题序号 > 当前的级别
// h2
// h4 (前一个标题)
// h3 (当前标题:这种情况我们还是任务 h3 是 h2 的下一级章节)
else if (current === previous || (current < previous && current > level)) {
// H1 的层级肯定是 1
if (current === 1) {
level = 1
pid = -1
} else {
pid = chapters[i - 1].pid
}
} else if (current <= level) {
// H1 的层级肯定是 1
if (current === 1) {
level = 1
} else {
level = level - (previous - current)
if (level <= 1) {
level = 1
}
}
// 第一级的标题
if (level === 1) {
pid = -1
} else {
// 虽然看上去差点,不过能工作啊
pid = this.generatePid(chapters, previous - current, i)
}
}
previous = current
chapters.push({
id: i,
pid: pid,
level: level,
text: this.stripTags(this.trim(heading.node.innerHTML))
});
})
console.log(chapters)
},
trim: (str) => {
return str.replace(/^\s+/g, '').replace(/\s+$/g, '')
},
stripTags: (str) => {
return str.replace(/<\/?[^>]+(>|$)/g, '')
},
generatePid(chapters, differ, index) {
let pid
// 最大只有 5 级的差距
switch (differ) {
case 2:
pid = chapters[chapters[chapters[index - 1].pid].pid].pid
break
case 3:
pid = chapters[chapters[chapters[chapters[index - 1].pid].pid].pid].pid
break
case 4:
pid = chapters[chapters[chapters[chapters[chapters[index - 1].pid].pid].pid].pid].pid
break
case 5:
pid = chapters[chapters[chapters[chapters[chapters[chapters[index - 1].pid].pid].pid].pid].pid].pid
break
default:
pid = chapters[chapters[index - 1].pid].pid
break
}
return pid
},
previewPageImage() {
const imgArr = [];
const imgSelector = this.$refs.pageContent.querySelectorAll('img');

View File

@@ -1 +1 @@
.wang-editor-body{font-size:14px;padding:6px;overflow-y:auto}.wang-editor-body table{border-top:1px solid #ccc;border-left:1px solid #ccc}.wang-editor-body table td,.wang-editor-body table th{border-bottom:1px solid #ccc;border-right:1px solid #ccc;padding:3px 5px}.wang-editor-body table th{border-bottom:2px solid #ccc;text-align:center}.wang-editor-body blockquote{display:block;border-left:8px solid #d0e5f2;padding:5px 10px;margin:10px 0;line-height:1.4;font-size:100%;background-color:#f1f1f1}.wang-editor-body code{display:inline-block;*display:inline;*zoom:1;background-color:#f1f1f1;border-radius:3px;padding:3px 5px;margin:0 3px}.wang-editor-body pre code{display:block}.wang-editor-body ul,ol{margin:10px 0 10px 20px}
.wang-editor-body{font-size:14px;padding:6px;overflow-y:auto}.wang-editor-body table{border-top:1px solid #ccc;border-left:1px solid #ccc}.wang-editor-body table td,.wang-editor-body table th{border-bottom:1px solid #ccc;border-right:1px solid #ccc;padding:3px 5px}.wang-editor-body table th{border-bottom:2px solid #ccc;text-align:center}.wang-editor-body blockquote{display:block;border-left:8px solid #d0e5f2;padding:5px 10px;margin:10px 0;line-height:1.4;font-size:100%;background-color:#f1f1f1}.wang-editor-body code{display:inline-block;*display:inline;*zoom:1;background-color:#f1f1f1;border-radius:3px;padding:3px 5px;margin:0 3px}.wang-editor-body pre code{display:block}.wang-editor-body ul,ol{list-style:decimal}

View File

@@ -1 +0,0 @@
.page-edit-vue .icon-collapse{float:left;font-size:25px;color:#aaa;margin-top:8px;cursor:pointer}.page-edit-vue .icon-collapse:hover{color:#eee}.page-edit-vue .wiki-title{font-size:20px}.page-edit-vue .wiki-author{font-size:14px;color:#888;padding:20px 0;height:40px;line-height:40px}.page-edit-vue .wiki-content{font-size:14px}.page-edit-vue .wiki-content.w-e-text{overflow-y:auto}.page-edit-vue .upload-page-file .el-upload-list{display:none}.page-edit-vue .is-link{color:#1e88e5;cursor:pointer}.page-edit-vue #newPageContentDiv .w-e-text-container{height:100%!important}.page-edit-vue .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}.page-edit-vue .page-content-editor,.page-edit-vue .page-title-input{padding:10px 0}

View File

@@ -0,0 +1 @@
.wang-editor-body{font-size:14px;padding:6px;overflow-y:auto}.wang-editor-body table{border-top:1px solid #ccc;border-left:1px solid #ccc}.wang-editor-body table td,.wang-editor-body table th{border-bottom:1px solid #ccc;border-right:1px solid #ccc;padding:3px 5px}.wang-editor-body table th{border-bottom:2px solid #ccc;text-align:center}.wang-editor-body blockquote{display:block;border-left:8px solid #d0e5f2;padding:5px 10px;margin:10px 0;line-height:1.4;font-size:100%;background-color:#f1f1f1}.wang-editor-body code{display:inline-block;*display:inline;*zoom:1;background-color:#f1f1f1;border-radius:3px;padding:3px 5px;margin:0 3px}.wang-editor-body pre code{display:block}.wang-editor-body ul,ol{list-style:decimal}.page-edit-vue .icon-collapse{float:left;font-size:25px;color:#aaa;margin-top:8px;cursor:pointer}.page-edit-vue .icon-collapse:hover{color:#eee}.page-edit-vue .wiki-title{font-size:20px}.page-edit-vue .wiki-author{font-size:14px;color:#888;padding:20px 0;height:40px;line-height:40px}.page-edit-vue .wiki-content{font-size:14px}.page-edit-vue .wiki-content.w-e-text{overflow-y:auto}.page-edit-vue .upload-page-file .el-upload-list{display:none}.page-edit-vue .is-link{color:#1e88e5;cursor:pointer}.page-edit-vue #newPageContentDiv .w-e-text-container{height:100%!important}.page-edit-vue .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}.page-edit-vue .page-content-editor,.page-edit-vue .page-title-input{padding:10px 0}

View File

@@ -1 +1 @@
<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=favicon-wiki.png><title>WIKI文档管理系统</title><link href=css/chunk-1ca8e011.e5ecc61a.css rel=prefetch><link href=css/chunk-2e5083a6.d0c31182.css rel=prefetch><link href=css/chunk-32cc5643.5a5b2ca1.css rel=prefetch><link href=css/chunk-34407190.57bbfb51.css rel=prefetch><link href=css/chunk-49c0ba36.ec6236ec.css rel=prefetch><link href=css/chunk-4cdf76bb.bb45a557.css rel=prefetch><link href=css/chunk-53af6df9.17d2b8a1.css rel=prefetch><link href=css/chunk-55738a8b.a38bf186.css rel=prefetch><link href=css/chunk-578c28a7.83c6d32d.css rel=prefetch><link href=css/chunk-72e49b1a.8ccc36ca.css rel=prefetch><link href=css/chunk-7498915d.ab8b8fd2.css rel=prefetch><link href=css/chunk-7ecd39ac.bf68cbeb.css rel=prefetch><link href=js/chunk-1ca8e011.ebf1b687.js rel=prefetch><link href=js/chunk-2d207ece.1c370d78.js rel=prefetch><link href=js/chunk-2e5083a6.4bf14594.js rel=prefetch><link href=js/chunk-32cc5643.5af84f0b.js rel=prefetch><link href=js/chunk-34407190.b1eb3639.js rel=prefetch><link href=js/chunk-49c0ba36.ac8dbcc1.js rel=prefetch><link href=js/chunk-4cdf76bb.8e528c95.js rel=prefetch><link href=js/chunk-53af6df9.ae4054ee.js rel=prefetch><link href=js/chunk-55738a8b.cffbd448.js rel=prefetch><link href=js/chunk-578c28a7.2813e273.js rel=prefetch><link href=js/chunk-72e49b1a.8acb1e4b.js rel=prefetch><link href=js/chunk-7498915d.97235250.js rel=prefetch><link href=js/chunk-7ecd39ac.3ace5570.js rel=prefetch><link href=css/chunk-vendors.3aff4100.css rel=preload as=style><link href=css/index.1abcb287.css rel=preload as=style><link href=js/chunk-vendors.2dfa4edd.js rel=preload as=script><link href=js/index.b22ab91d.js rel=preload as=script><link href=css/chunk-vendors.3aff4100.css rel=stylesheet><link href=css/index.1abcb287.css rel=stylesheet></head><body><noscript><strong>We're sorry but zyplayer-wiki-ui doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=js/chunk-vendors.2dfa4edd.js></script><script src=js/index.b22ab91d.js></script></body></html>
<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=favicon-wiki.png><title>WIKI文档管理系统</title><link href=css/chunk-1ca8e011.d02f27be.css rel=prefetch><link href=css/chunk-32cc5643.5a5b2ca1.css rel=prefetch><link href=css/chunk-34407190.57bbfb51.css rel=prefetch><link href=css/chunk-3ce84b17.ab8b8fd2.css rel=prefetch><link href=css/chunk-49c0ba36.ec6236ec.css rel=prefetch><link href=css/chunk-4cdf76bb.bb45a557.css rel=prefetch><link href=css/chunk-53af6df9.17d2b8a1.css rel=prefetch><link href=css/chunk-55738a8b.a38bf186.css rel=prefetch><link href=css/chunk-578c28a7.83c6d32d.css rel=prefetch><link href=css/chunk-6853a088.50949d53.css rel=prefetch><link href=css/chunk-72e49b1a.8ccc36ca.css rel=prefetch><link href=css/chunk-7ecd39ac.bf68cbeb.css rel=prefetch><link href=js/chunk-1ca8e011.762634f5.js rel=prefetch><link href=js/chunk-2d207ece.e10076eb.js rel=prefetch><link href=js/chunk-32cc5643.93647ea4.js rel=prefetch><link href=js/chunk-34407190.acdd458d.js rel=prefetch><link href=js/chunk-3ce84b17.7344d2a7.js rel=prefetch><link href=js/chunk-49c0ba36.5941cad9.js rel=prefetch><link href=js/chunk-4cdf76bb.e2eee9d0.js rel=prefetch><link href=js/chunk-53af6df9.fed2ef07.js rel=prefetch><link href=js/chunk-55738a8b.de766eb2.js rel=prefetch><link href=js/chunk-578c28a7.d172d229.js rel=prefetch><link href=js/chunk-6853a088.5b8a6628.js rel=prefetch><link href=js/chunk-72e49b1a.e821cfe4.js rel=prefetch><link href=js/chunk-7ecd39ac.e449af2c.js rel=prefetch><link href=css/chunk-vendors.3aff4100.css rel=preload as=style><link href=css/index.1abcb287.css rel=preload as=style><link href=js/chunk-vendors.2dfa4edd.js rel=preload as=script><link href=js/index.a56b1d38.js rel=preload as=script><link href=css/chunk-vendors.3aff4100.css rel=stylesheet><link href=css/index.1abcb287.css rel=stylesheet></head><body><noscript><strong>We're sorry but zyplayer-wiki-ui doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=js/chunk-vendors.2dfa4edd.js></script><script src=js/index.a56b1d38.js></script></body></html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long