MrDoc/template/app_doc/docs_base.html
2021-08-10 14:25:44 +08:00

416 lines
19 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{% load static %}
{% load i18n %}
<!DOCTYPE html>
<html lang="zh-cn" style="font-size: 15px;">
<head>
<meta charset="UTF-8">
<meta name=renderer content=webkit>
<meta http-equiv="X-UA-Compatible" content="IE=Edgechrome=1">
<meta http-equiv="Cache-Control" content="no-transform" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<meta http-equiv="Cache-Control" content="max-age=7200" />
<!-- <meta name="referrer" content="no-referrer"> -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="keywords" content="{% block keyword %}{% endblock %}{{site_keywords}}"/>
<meta name="description" content="{% block description %}{% endblock %}" />
<!-- OGP分享协议开始 -->
<meta property="og:type" content="website">
<meta property="og:title" content="{% block ogp_title %}{% endblock %}">
<meta property="og:description" content="{% block ogp_desc %}{% endblock %}">
<meta property="og:image" content="{{request.scheme}}://{{request.META.HTTP_HOST}}{% static 'search/mrdoc_logo_300.png' %}">
<meta property="og:url" content="{{request.scheme}}://{{request.META.HTTP_HOST}}{{request.path_info}}">
<!-- OGP分享协议结束 -->
<title>{% block title %}{% endblock %} - {% if site_name != None and site_name != '' %}{{site_name}} {% else %}{% trans "站点标题" %}{% endif %}</title>
<link href="{% static 'layui/css/layui.css' %}?version={{mrdoc_version}}" rel="stylesheet">
{% if doc.editor_mode != 4 %}
<link rel="stylesheet" href="{% static 'editor.md/css/editormd.css' %}?version={{mrdoc_version}}" />
{% endif %}
{% if doc.editor_mode == 2 %}
<link rel="stylesheet" href="{% static 'vditor/dist/index.css' %}?version={{mrdoc_version}}" />
{% endif %}
{% if doc.editor_mode == 4 %}
<!-- 在线表格 -->
<link rel='stylesheet' href="{% static 'luckysheet/dist/plugins/css/pluginsCss.css' %}?version={{mrdoc_version}}" />
<link rel='stylesheet' href="{% static 'luckysheet/dist/plugins/plugins.css' %}?version={{mrdoc_version}}" />
<link rel='stylesheet' href="{% static 'luckysheet/dist/css/luckysheet.css' %}?version={{mrdoc_version}}" />
<link rel='stylesheet' href="{% static 'luckysheet/dist/assets/iconfont/iconfont.css' %}?version={{mrdoc_version}}" />
{% endif %}
<link href="{% static 'viewerjs/viewer.min.css' %}?version={{mrdoc_version}}" rel="stylesheet">
<link rel="icon" href="{% static 'search/mrdoc_logo_300.png' %}" sizes="192x192" />
<link href="{% static 'mrdoc/mrdoc.css' %}?version={{mrdoc_version}}" rel="stylesheet">
<link href="{% static 'mrdoc/mrdoc-docs.css' %}?version={{mrdoc_version}}" rel="stylesheet">
<link href="{% static 'iconFont/iconfont.css' %}?version={{mrdoc_version}}" rel="stylesheet">
<style>
{% if img_scale %}
.markdown-body p img{
max-width: 350px;
}
{% endif %}
{% if long_code == 'on' %}
pre.linenums,.vditor-reset > pre > code{
max-height: max-content!important;
}
{% endif %}
/* html{
filter: invert(1) hue-rotate(180deg);
} */
</style>
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
</head>
<body class="big-page">
<div class="doc layui-fluid" style="padding-left:0px;">
<!-- 左侧目录栏 -->
<div class="doc-summary">
<!-- 文档搜索 -->
<form action="{% url 'pro_index' pro_id=project.id %}" method="get">
<div id="doc-search-input">
<input type="text" name="kw" placeholder="{% trans '在文集内搜索文档' %}" value="" class="layui-input doc-search-input">
</div>
</form>
<!-- 左上角广告块 -->
<!-- 广告代码开始 -->
{% if debug %}
{% else %}
{% if ad_code_4 %}
<div class="ad-code" id="ad-code-4"></div>
{% endif %}
{% endif %}
<!-- 广告代码结束 -->
<!-- 文集名称 -->
<div class="project-title">
{% if project.icon %}
<svg class="icon" aria-hidden="true"><use xlink:href="#{{project.icon}}"></use></svg>
{% endif %}
<a href="{% url 'pro_index' pro_id=project.id %}">{{ project.name }}
{% if project.role == 1 %}
<i class="layui-icon layui-icon-password" title="{% trans '私密文档' %}"></i>
{% endif %}
</a>
{% if request.user.is_authenticated %}
{% if is_collect_pro %}
<i class="layui-icon layui-icon-star-fill collected" style="cursor: pointer;" title="已收藏文集,点击取消" id="collect_pro"></i>
{% else %}
<i class="layui-icon layui-icon-star" style="cursor: pointer;" title="收藏文集" id="collect_pro"></i>
{% endif %}
{% else %}
<i class="layui-icon layui-icon-star" style="cursor: pointer;" title="请登录后收藏"></i>
{% endif %}
<p>
{% if colla_user > 0 %}
<span style="font-size:12px;color:gray;font-weight:100;">{% trans "* 此为协作文集" %}</span>
{% endif %}
</p>
</div>
<hr>
<!-- 遍历文集大纲 -->
<!-- 如果文集的文档数量超过999使用异步加载文集目录 -->
{% if toc_cnt > 999 %}
<div style="text-align: center;" id='loading-project-toc'><i class="fa fa-spinner fa-pulse"></i>{% trans "文集大纲加载中……" %}</div>
{% load doc_filter %}
<nav>
<ul class="summary" id="project-toc"></ul>
</nav>
{% else %}
<!-- 文档数量小于999使用同步加载文集目录 -->
<nav>
<ul class="summary">
<!-- 一级目录 -->
{% for docs in toc_list %}
<li>
{% if docs.children %}
<div style="display:flex;justify-content:space-between;">
<a href="{% url 'doc' pro_id=pro_id doc_id=docs.id %}" title="{{docs.name}}">{% if docs.editor_mode == 4 %}<i class="layui-icon layui-icon-table"></i>{% else %}<i class="iconfont mrdoc-icon-wendang"></i>{% endif %} {{ docs.name }}</a>
{% if docs.open_children %}
<i class="layui-icon layui-icon-down switch-toc"></i>
{% else %}
<i class="layui-icon layui-icon-left switch-toc"></i>
{% endif %}
</div>
{% if docs.open_children %}
<ul class="sub-menu">
{% else %}
<ul class="sub-menu toc-close">
{% endif %}
<!-- 二级目录 -->
{% for node in docs.children %}
<li>
{% if node.id|get_next_doc %}
<div style="display:flex;justify-content:space-between;">
<a href="{% url 'doc' pro_id=pro_id doc_id=node.id %}" title="{{node.name}}"><i class="{% if node.editor_mode == 4 %}layui-icon layui-icon-table {% else %}iconfont mrdoc-icon-wendang{% endif %}"></i> {{ node.name }}</a>
{% if node.open_children %}
<i class="layui-icon layui-icon-down switch-toc"></i>
{% else %}
<i class="layui-icon layui-icon-left switch-toc"></i>
{% endif %}
</div>
{% if node.open_children %}
<ul class="sub-menu">
{% else %}
<ul class="sub-menu toc-close">
{% endif %}
<!-- 三级目录 -->
{% for doc in node.children %}
<li><a href="{% url 'doc' pro_id=pro_id doc_id=doc.id %}" title="{{doc.name}}"><i class="{% if doc.editor_mode == 4 %}layui-icon layui-icon-table {% else %}iconfont mrdoc-icon-wendang{% endif %}"></i> {{ doc.name }}</a></li>
{% endfor %}
</ul>
{% else %}
<a href="{% url 'doc' pro_id=pro_id doc_id=node.id %}" title="{{node.name}}"><i class="{% if node.editor_mode == 4 %}layui-icon layui-icon-table {% else %}iconfont mrdoc-icon-wendang{% endif %}"></i> {{ node.name }}</a>
{% endif %}
</li>
{% endfor %}
</ul>
{% else %}
<a href="{% url 'doc' pro_id=pro_id doc_id=docs.id %}" title="{{docs.name}}"><i class="{% if docs.editor_mode == 4 %}layui-icon layui-icon-table {% else %}iconfont mrdoc-icon-wendang{% endif %}"></i> {{ docs.name }}</a>
{% endif %}
</li>
{% endfor %}
</ul>
</nav>
{% endif %}
<div class="bq">
<a href="javascript:void(0);" class="mrdoc-link" id="dashang">{% trans "本文档使用 MrDoc 发布" %}</a>
</div>
<!-- 右下角广告块 -->
<!-- 广告代码开始 -->
{% if debug %}
{% else %}
{% if ad_code_3 %}
<div class="ad-code" id="ad-code-3"></div>
{% endif %}
{% endif %}
<!-- 广告代码结束 -->
</div>
<!-- 左侧目录栏结束 -->
<!-- 右侧文档栏 -->
<div class="doc-body">
<!-- 文档导航 -->
<div class="doc-header" role="navigation">
<a class="btn pull-left js-toolbar-action" aria-label="" href="javascript:void(0);" title="{% trans '切换侧边栏' %}">
<i class="layui-icon layui-icon-slider"></i>
</a>
<a class="btn pull-left font-small" href="javascript:void(0);" title="{% trans '缩小字体' %}">
<i class="fa fa-font">-</i>
</a>
<a class="btn pull-left font-large" href="javascript:void(0);" title="{% trans '放大字体' %}">
<i class="fa fa-font">+</i>
</a>
<a class="btn pull-left font-switch" href="javascript:void(0);" title="{% trans '切换字体类型' %}">
<i class="fa fa-text-height"></i>
</a>
<!-- 顶部工具栏 -->
{% block head_toolbar %}
{% endblock %}
<a class="btn pull-right" aria-label="" href="{% url 'pro_list' %}">
<i class="layui-icon layui-icon-home"></i> <span class="layui-hide-xs">{% trans "首页" %}</span>
</a>
</div>
<!-- 文档主体 -->
<div class="doc-body-content">
<div class="doc-body-content-div">
{% if project.is_watermark %}
<div id="wm"></div>
{% endif %}
<!-- 文档内容 -->
<div class="doc-content" id="doc-content">
<!-- 标题 -->
<div class="doc-info">
<!-- 页面主体头信息 -->
{% block content_head %}
{% endblock %}
<!-- 广告代码开始 -->
{% if debug %}
{% else %}
{% if ad_code %}
<div class="ad-code" id="ad-code-1"></div>
{% endif %}
{% endif %}
<!-- 广告代码结束 -->
</div>
<!-- 标题结束 -->
<!-- 正文开始 -->
<div class="markdown-body" id="content" style="padding: 20px;padding-top: 5px;">
{% block page_content %}
{% endblock %}
</div>
<!-- 正文结束 -->
<div class="markdown-body" style="padding-left: 20px;">
{% block children_content %}
{% endblock %}
</div>
</div>
<hr>
<!-- 分享栏 -->
<div style="color: rgba(0,0,0,.65);padding-bottom: 10px;margin-top: 10px;">
{% block doc_bottom_block %}
{% endblock %}
</div>
<!-- 广告代码开始 -->
{% if debug %}
{% else %}
{% if ad_code_2 %}
<div class="ad-code" id="ad-code-2"></div>
{% endif %}
{% endif %}
<!-- 广告代码结束 -->
{% block doc_previous_next %}{% endblock %}
</div>
</div>
</div>
<!-- 右侧文档栏结束 -->
<!-- 右下角工具按钮 -->
<div class="fixed-tool-bar">
<div class="toTop" ><i class="layui-icon layui-icon-up"></i></div>
{% block right_widget %} {% endblock %}
</div>
</div>
<!-- 分享选项卡模板 -->
<div id="share_div" style="display: none;">
<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
<ul class="layui-tab-title">
<li class="layui-this">{% trans "微信扫一扫" %}</li>
<li>{% trans "复制链接" %}</li>
</ul>
<div class="layui-tab-content" style="height: 100px;">
<div class="layui-tab-item layui-show" align='center'>
<p style="font-weight: 700;margin-bottom: 10px;">{% trans "手机扫一扫进行分享" %}</p>
<div id="url_qrcode"></div>
</div>
<div class="layui-tab-item" align='center'>
<input type="text" id="copy_crt_url" name="current_url" class="layui-input" /><br>
<button class="layui-btn layui-btn-radius layui-btn-xs" style="background-color: #333;" id="copy_doc_url"">{% trans "复制链接" %}</button>
</div>
</div>
</div>
</div>
<!-- 打赏选项卡模板 -->
<div id="dashang_img" style="display: none;">
<div>
<div class="layui-tab-content" style="height: 100px;">
<div style="text-align: center;font-size: 16px;font-weight: 500;padding-top: 10px;">关于 MrDoc</div><hr>
<div style="padding: 10px;"><a href="https://mrdoc.pro/" target="_blank">觅道文档MrDoc</a><a href="https://zmister.com/" target="_blank"><strong>州的先生</strong></a>开发并开源的在线文档系统,其适合作为个人和小型团队的云笔记、文档和知识库管理工具。</div>
<div style="padding: 10px;">如果觅道文档给你或你的团队带来了帮助,欢迎对作者进行一些打赏捐助,这将有力支持作者持续投入精力更新和维护觅道文档,感谢你的捐助!<a href="http://mrdoc.zmister.com/project-7/doc-1366/" target="_blank">>>>捐助鸣谢列表</a></div>
<div class="" style="display:flex;justify-content:space-around;flex-wrap:wrap;">
<div class="" align='center' style="">
<p>微信</p>
<img src="{% static 'dashang/dashang_wx.webp' %}" style="width: 180px;height: auto;" />
</div>
<div class="" align='center'>
<p>支付宝</p>
<img src="{% static 'dashang/dashang_alipay.webp' %}" style="width: 180px;height: auto;" />
</div>
<div class="" align='center'>
<p>QQ</p>
<img src="{% static 'dashang/dashang_qq.webp' %}" style="width: 180px;height: auto;" />
</div>
<div class="" align='center'>
<p>PayPal</p>
<a href="https://paypal.me/zmister" target="_blank">
<img src="{% static 'dashang/dashang_paypal.png' %}" style="width: 180px;height: auto;" />
</a>
</div>
</div>
</div>
</div>
</div>
<script src="{% static 'jquery/3.1.1/jquery.min.js' %}"></script>
<script src="{% static 'layui/layui.js' %}?version={{mrdoc_version}}"></script>
<script src="{% static 'viewerjs/viewer.min.js' %}?version={{mrdoc_version}}"></script>
<script src="{% static 'qrcodejs/qrcode.min.js' %}?version={{mrdoc_version}}"></script>
<script src="{% static 'mrdoc/mrdoc-docs.js' %}?version={{mrdoc_version}}"></script>
<script src="{% static 'iconFont/iconfont.js' %}?version={{mrdoc_version}}"></script>
<script src="{% static 'editor.md/lib/purify.min.js' %}?version={{mrdoc_version}}"></script>
<script>
var layer = layui.layer;
{% if toc_cnt > 999 %}
// 如果文集的文档数量大于999使用异步加载左侧文集大纲
getProjectToc();
{% endif %}
</script>
{% if doc.editor_mode == 2 %}
<script src="{% static 'vditor/dist/method.min.js' %}?version={{mrdoc_version}}"></script>
{% elif doc.editor_mode == 1 %}
<script src="{% static 'editor.md/lib/marked.min.js' %}?version={{mrdoc_version}}"></script>
<script src="{% static 'editor.md/editormd.js' %}?version={{mrdoc_version}}"></script>
{% elif doc.editor_mode == 4 %}
<!-- 在线表格 -->
<script src="{% static 'luckysheet/dist/plugins/js/plugin.js' %}?version={{mrdoc_version}}"></script>
<script src="{% static 'luckysheet/dist/luckysheet.umd.js' %}?version={{mrdoc_version}}"></script>
{% endif %}
<!-- 动态添加广告代码 -->
{% if debug %}
{% else %}
<div id="ad-1">
{{ad_code|safe}}
</div>
<div id="ad-2">
{{ad_code_2|safe}}
</div>
<div id="ad-3">
{{ad_code_3|safe}}
</div>
<div id="ad-4">
{{ad_code_4|safe}}
</div>
<script>
$("#ad-1").appendTo($("#ad-code-1"));
$("#ad-2").appendTo($("#ad-code-2"));
$("#ad-3").appendTo($("#ad-code-3"));
$("#ad-4").appendTo($("#ad-code-4"));
</script>
{% endif %}
<!-- 广告代码结束 -->
<!-- 统计代码开始 -->
{% if debug %}
{% else %}
{{ static_code | safe }}
{% endif %}
<!-- 统计代码结束 -->
{% block custom_script %}
{% endblock %}
<script>
{% if project.is_watermark %}
initWhterMark('{{project.watermark_value}}')
{% endif %}
// 外部链接添加图标
document.addEventListener('DOMContentLoaded', function() {
Array.prototype.filter.call(document.links, function(link) {
return link.hostname && link.hostname !== location.hostname;
})
.forEach(function(link) {
link.target = '_blank';
// console.log(link,$(link).children('img').length)
// console.log(link,$(link).children().length)
if($(link).children().length == 0){
link.classList.add('external');
}
});
});
// 高亮搜索词
{% if doc.editor_mode != 2 %}
keyLight('doc-content',getQueryVariable("highlight"))
{% endif %}
</script>
</body>
</html>