wzj/Mrdoc
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

优化文集简介页面

Browse Source
This commit is contained in:
yangjian 2020-12-06 09:06:28 +08:00
parent 0b36fc6afa
commit 9de23407aa
8 changed files with 43 additions and 233 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
CHANGES.md
View File

@ -1,5 +1,20 @@
## 版本更新记录
### v0.6.2 2020-12
- [优化]个人中心和后台管理页面加载页面时间；
- [优化]文集文档页面左侧文集目录交互体验；
- [优化]Editor.md编辑器模式下图片上传异常交互；
- [优化]同步Vditor编辑器组件版本至3.6.6；
- [优化]HTML模板文件结构和代码结构；
- [优化]后台管理、个人中心的文集管理、文档管理界面切换为动态表格；
- [新增]个人中心文集文档拖拽排序功能；
- [新增]文档搜索全文搜索功能；
- [新增]个人中心文集管理的文集搜索功能；
- [新增]文档编辑器浏览器缓存功能；
- [合并]文集简介优化[!1](https://gitee.com/zmister/MrDoc/pulls/1)
- [合并]Editor.md编辑器自定义文档样式[#42](https://github.com/zmister2016/MrDoc/pull/42)
### v0.6.1 2020-11-16
- 优化文集介绍页面，文集简介支持Markdown渲染；

15
MrDoc/settings.py
View File

@ -40,7 +40,7 @@ SECRET_KEY = '5&71mt9@^58zdg*_!t(x6g14q*@84d%ptr%%s6e0l50zs0we3d'
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = CONFIG.getboolean('site','debug')
VERSIONS = '0.6.1'
VERSIONS = '0.6.2'
ALLOWED_HOSTS = ['*']
@ -64,6 +64,7 @@ INSTALLED_APPS = [
MIDDLEWARE = [
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.locale.LocaleMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
@ -83,6 +84,7 @@ TEMPLATES = [
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.i18n',
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
@ -166,6 +168,17 @@ USE_L10N = True
USE_TZ = False
# 多语言配置
LANGUAGES = (
('zh-hans',('中文简体')),
('zh-hant',('中文繁體')),
('en',('english')),
)
# 翻译文件
LOCALE_PATHS = (
os.path.join(BASE_DIR,'locale'),
)
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/2.1/howto/static-files/

221
static/sortablejs/test.html
View File

@ -1,221 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>layout 后台大布局 - Layui</title>
<link rel="stylesheet" href="../layui/css/layui.css">
<style>
.row {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.list-group {
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
padding-left: 0;
margin-bottom: 0;
}
.col {
-ms-flex-preferred-size: 0;
flex-basis: 0;
-ms-flex-positive: 1;
flex-grow: 1;
max-width: 100%;
position: relative;
width: 100%;
padding-right: 15px;
padding-left: 15px;
}
.list-group-item:first-child {
border-top-left-radius: .25rem;
border-top-right-radius: .25rem;
}
.list-group-item {
position: relative;
display: block;
padding: .75rem 1.25rem;
margin-bottom: -1px;
background-color: #fff;
border: 1px solid rgba(0,0,0,.125);
}
.list-group-item:first-child {
border-top-left-radius: 0.25rem;
border-top-right-radius: 0.25rem;
}
.list-group-item:last-child {
margin-bottom: 0;
border-bottom-right-radius: 0.25rem;
border-bottom-left-radius: 0.25rem;
}
.list-group-item:hover, .list-group-item:focus {
z-index: 1;
text-decoration: none;
}
.list-group-item.disabled, .list-group-item:disabled {
color: #6c757d;
pointer-events: none;
background-color: #fff;
}
.list-group-item.active {
z-index: 2;
color: #fff;
background-color: #007bff;
border-color: #007bff;
}
</style>
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
<div class="layui-header">
<div class="layui-logo">layui 后台布局</div>
<!-- 头部区域（可配合layui已有的水平导航） -->
<ul class="layui-nav layui-layout-left">
<li class="layui-nav-item"><a href="">控制台</a></li>
<li class="layui-nav-item"><a href="">商品管理</a></li>
<li class="layui-nav-item"><a href="">用户</a></li>
<li class="layui-nav-item">
<a href="javascript:;">其它系统</a>
<dl class="layui-nav-child">
<dd><a href="">邮件管理</a></dd>
<dd><a href="">消息管理</a></dd>
<dd><a href="">授权管理</a></dd>
</dl>
</li>
</ul>
<ul class="layui-nav layui-layout-right">
<li class="layui-nav-item">
<a href="javascript:;">
<img src="http://t.cn/RCzsdCq" class="layui-nav-img">
贤心
</a>
<dl class="layui-nav-child">
<dd><a href="">基本资料</a></dd>
<dd><a href="">安全设置</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">退了</a></li>
</ul>
</div>
<div class="layui-side layui-bg-black">
<div class="layui-side-scroll">
<!-- 左侧导航区域（可配合layui已有的垂直导航） -->
<ul class="layui-nav layui-nav-tree" lay-filter="test">
<li class="layui-nav-item layui-nav-itemed">
<a class="" href="javascript:;">所有商品</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;">列表一</a></dd>
<dd><a href="javascript:;">列表二</a></dd>
<dd><a href="javascript:;">列表三</a></dd>
<dd><a href="">超链接</a></dd>
</dl>
</li>
<li class="layui-nav-item">
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;">列表一</a></dd>
<dd><a href="javascript:;">列表二</a></dd>
<dd><a href="">超链接</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">云市场</a></li>
<li class="layui-nav-item"><a href="">发布商品</a></li>
</ul>
</div>
</div>
<div class="layui-body">
<!-- 内容主体区域 -->
<div style="padding: 15px;">
<div class="layui-row" style="margin-bottom: 10px;padding-left:15px;">
<span class="layui-breadcrumb" lay-separator=">">
<a href="{% url 'manage_project' %}">文集管理</a>
<a><cite>导入文集</cite></a>
</span>
</div>
<div class="layui-card-header" style="margin-bottom: 10px;">
<span style="font-size:18px;">导入文集到MrDoc</span>
</div>
<div class="layui-row" >
<button class="layui-btn layui-btn-normal layui-btn-sm" id="upload-zip"><i class="layui-icon layui-icon-upload"></i>导入.Zip文件</button>
</div>
<div id="nested" class="row">
<button onclick="getLevel()">aaa</button>
<ul id="nestedDemo" class="list-group col nested-sortable">
<li data-sortable-id="499" class="list-group-item" style="">万视电商数据助手脑图.<ul class="list-group nested-sortable"></ul></li>
<li data-sortable-id="498" class="list-group-item" style="">《读懂一本书》思维导图.<ul class="list-group nested-sortable"></ul></li>
<li data-sortable-id="500" class="list-group-item" style="">六类群体可得到慈善组织、红十字会优先帮扶_滚动新闻_中国政府网.<ul class="list-group nested-sortable"></ul></li>
</ul>
</div>
</div>
</div>
<div class="layui-footer">
<!-- 底部固定区域 -->
© layui.com - 底部固定区域
</div>
</div>
<script src="../jquery/3.1.1/jquery.min.js"></script>
<script src="../layui/layui.all.js"></script>
<script src="./Sortable.js"></script>
<script>
// Nested demo
var nestedSortables = [].slice.call(document.querySelectorAll('.nested-sortable'));
// Loop through each nested sortable element
for (var i = 0; i < nestedSortables.length; i++) {
new Sortable(nestedSortables[i], {
group: {
name:'nested',
pull: function(event) {
//console.log(event);
var deep = event.el.parentNode.parentNode.parentNode.parentNode.className
// console.log(deep)
// please get deep
// console.log(deep)
if(deep == 'list-group nested-sortable') return false;
return true;
},
},
animation: 150,
fallbackOnBody: true,
invertSwap:true,
swapThreshold: 0.65,
});
}
const nestedQuery = '.nested-sortable';
const identifier = 'sortableId';
const root = document.getElementById('nestedDemo');
function serialize(sortable) {
var serialized = [];
var children = [].slice.call(sortable.children);
for (var i in children) {
var nested = children[i].querySelector(nestedQuery);
serialized.push({
id: children[i].dataset[identifier],
children: nested ? serialize(nested) : []
});
}
return serialized
}
console.log(serialize(root))
function getLevel(){
console.log(serialize(root))
}
</script>
</body>
</html>

3
template/app_doc/doc.html
View File

@ -171,8 +171,10 @@
<script src="{% static 'toc/doctoc.js' %}"></script>
<script src="{% static 'viewerjs/viewer.min.js' %}"></script>
<script>
// layui.use(['jquery','layer','form'],function(){
var layer = layui.layer;
var form = layui.form;
// var $ = layui.jquery;
// Ajax默认配置
$.ajaxSetup({
data: {csrfmiddlewaretoken: '{{ csrf_token }}' },
@ -326,5 +328,6 @@
share_data['is_enable'] = true
updateDocShare(share_data);
})
// })
</script>
{% endblock %}

13
template/app_doc/docs_base.html
View File

@ -285,12 +285,14 @@
<script src="{% static 'jquery/3.1.1/jquery.min.js' %}"></script>
<script src="{% static 'layui/layui.all.js' %}"></script>
<!-- <script src="{% static 'layui/layui.js' %}"></script> -->
<script src="{% static 'qrcodejs/qrcode.min.js' %}"></script>
<script src="{% static 'mrdoc/mrdoc-docs.js' %}?version={{mrdoc_version}}"></script>
<script>
// 如果文集的文档数量大于999，使用异步加载左侧文集大纲
{% if toc_cnt > 999 %}
// 如果文集的文档数量大于999，使用异步加载左侧文集大纲
getProjectToc();
{% endif %}
</script>
@ -308,8 +310,9 @@
<!-- 解析渲染Markdown -->
<script>
// EditorMD模式
{% if doc.editor_mode == 1 %}
// EditorMD模式
//解析Markdown为HTML
editormd.markdownToHTML("content", {
htmlDecode : "style,script,iframe",
@ -324,8 +327,9 @@
tocDropdown : false,
atLink : false,//禁用@链接
});
// Vditor模式
{% elif doc.editor_mode == 2 %}
// Vditor模式
// 渲染Markdown
const initRender = () => {
const md_content = $("#content textarea").val()
@ -343,9 +347,6 @@
var toc_elem = $("#toc-container div ul.markdown-toc-list")
Vditor.outlineRender(document.getElementById('content'), toc_elem[0])
if (outlineElement.innerText.trim() !== '') {
// 去除vditor默认添加的空格字符
var toc_html = $("#toc-container");
//toc_html.html(toc_html.html().replace('  ',''))
var toc_cnt = $(".markdown-toc-list").children().length;
//console.log(toc_cnt)
if(toc_cnt > 0){

2
template/app_doc/manage/manage_project_options.html
View File

@ -162,7 +162,7 @@
<div class="layui-row">
<div style="float: left;">
<strong>{% trans "导出文集" %}</strong>
<p>{% trans "将文集内的文档以Markdown（.md）的形式导出为zip压缩文件</p>
<p>{% trans "将文集内的文档以Markdown（.md）的形式导出为zip压缩文件" %}</p>
</div>
<button class="layui-btn layui-btn-primary" style="float: right;" id="export-project">{% trans "导出文集" %}</button>
</div>

3
template/app_doc/pro_list.html
View File

@ -244,9 +244,6 @@
// 获取页脚的高度
footerHeight = $(".layui-footer").height();
// 获取页脚的高度
/*
scrollTop() 设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
*/
footerTop = ($(window).scrollTop() + $(window).height() - footerHeight - 20)+"px";
// console.log("页脚高度：",footerHeight)
// console.log(footerTop)

4
template/app_doc/project.html
View File

@ -43,7 +43,9 @@
<div class="layui-tab-content" style="padding: 0;">
<!-- 文集简介 -->
<div class="layui-tab-item layui-show">
<div id="project-desc"><textarea style="display: none;">{{project.intro}}</textarea></div>
<div id="project-desc">
<textarea style="display: none;">{% if project.intro == '' or project.intro is None %}{% trans "暂无文集简介" %}{% else %}{{project.intro}}{% endif %}
</textarea></div>
</div>
<!-- 目录大纲 -->
<div class="layui-tab-item">