forked from mirror/MrDoc
559 lines
25 KiB
HTML
559 lines
25 KiB
HTML
{% extends 'app_doc/editor/create_base.html' %}
|
||
{% load static %}
|
||
{% load i18n %}
|
||
{% block title %}修改文档{% endblock %}
|
||
|
||
{% block custom_style %}
|
||
<style>
|
||
ul li{
|
||
list-style:disc;
|
||
}
|
||
ul > li > ul > li{
|
||
list-style-type: circle;
|
||
}
|
||
ol li{
|
||
list-style-type: decimal;
|
||
}
|
||
</style>
|
||
{% endblock %}
|
||
|
||
{% block head_toolbar %}
|
||
<a class="btn pull-left" aria-label="" href="{% url 'create_doc' %}?pid={{project.id}}" target="_blank">
|
||
<i class="fa fa-plus-square"></i> <span class="layui-hide-xs">新建文档</span>
|
||
</a>
|
||
<a class="btn pull-left" aria-label="" href="{% url 'manage_doc' %}?pid={{project.id}}" target="_blank">
|
||
<i class="fa fa-cubes"></i> <span class="layui-hide-xs">管理文档</span>
|
||
</a>
|
||
<a class="btn pull-left" aria-label="" href="{% url 'manage_project' %}" target="_blank">
|
||
<i class="fa fa-cubes"></i> <span class="layui-hide-xs">管理文集</span>
|
||
</a>
|
||
{% endblock %}
|
||
|
||
{% block left_opera %}
|
||
<div class="layui-form" style="padding:0 10px 10px 10px;" lay-filter="left_form">
|
||
<div class="layui-row">
|
||
<div class="doc-form-label" style="margin-bottom: 10px;">
|
||
{% if doc.status == 0 %}
|
||
<strong>*当前文档状态：草稿</strong>
|
||
{% elif doc.status == 1 %}
|
||
<strong>*当前文档状态：已发布 </strong>
|
||
{% endif %}
|
||
</div>
|
||
|
||
<div class="doc-form-label" style="margin-bottom: 10px;">
|
||
<a class="layui-btn layui-btn-xs layui-btn-normal" target="_blank" href="{% url 'doc' doc.top_doc doc.id %}" style="background-color: #2176ff;">
|
||
<i class="fa fa-book"></i> 查看
|
||
</a>
|
||
<button class="layui-btn layui-btn-xs layui-btn-normal" id="doc-history">
|
||
<i class="fa fa-history"></i> 历史
|
||
</button>
|
||
<button class="layui-btn layui-btn-xs layui-btn-normal" id="doc-cache-btn">
|
||
<i class="fa fa-history"></i> 缓存
|
||
</button>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label" style="padding-left: 0px;">编辑器切换</label>
|
||
<div class="layui-input-block">
|
||
<select name="select_editor_mode" lay-verify="required" lay-filter="select_editor_mode">
|
||
<option value="1">EditorMD(Markdown)</option>
|
||
<option value="2">Vditor(Markdown)</option>
|
||
<option value="3">iceEditor(富文本)</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-col-md12" style="margin-bottom: 10px;">
|
||
<label class="doc-form-label" style="margin-right:0px;">
|
||
<button class="layui-btn layui-btn-primary layui-btn-sm mrdoc-btn-default" id="sel-doctemp" title="插入文档模板">
|
||
<i class="fa fa-clipboard"></i> 选择模板
|
||
</button>
|
||
</label>
|
||
|
||
<label class="doc-form-label" style="margin-right:0px;">
|
||
<input type="file" id="insert-local-file" onchange="insertLocalFile(this)" style="display:none;">
|
||
<button class="layui-btn layui-btn-primary layui-btn-sm mrdoc-btn-default" id="sel-local" onclick="selectLocalFile()" title="插入本地文本文件内容">
|
||
<i class="fa fa-upload"></i> 导入文本
|
||
</button>
|
||
</label>
|
||
</div>
|
||
|
||
<div class="layui-col-md12" style="margin-bottom: 10px;">
|
||
<div class="layui-input-inblock">
|
||
<select name="pro_id" lay-verify="required" lay-filter="project" id="project">
|
||
<option value="{{ project.id }}">{{ project.name }}</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-row">
|
||
<div class="layui-col-md12" style="margin-bottom: 10px;">
|
||
<span>点击文档树选择上级（可选）或</span>
|
||
<button class="layui-btn layui-btn-xs layui-btn-primary" id="clearParentDoc">取消上级</button>
|
||
<input type="text" id="parent-doc" hidden>
|
||
</div>
|
||
<div class="layui-col-md12">
|
||
<input type="number" class="layui-input" placeholder="输入文档排序值，默认99" id="sort" value="{{doc.sort}}">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-collapse" style="margin-top: 10px;margin-bottom: 10px;">
|
||
<div class="layui-colla-item">
|
||
<h2 class="layui-colla-title">文档结构树</h2>
|
||
<div class="layui-colla-content layui-show" style="max-height: 400px;overflow: hidden;overflow-y: scroll;overflow-x: scroll;">
|
||
<div id="doc-tree"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<hr>
|
||
|
||
<!-- 标签输入框 -->
|
||
<div class="layui-collapse" style="margin-top: 10px;margin-bottom: 10px;">
|
||
<div class="layui-colla-item">
|
||
<h2 class="layui-colla-title">标签</h2>
|
||
<div class="layui-colla-content layui-show">
|
||
<div class="layui-row layui-col-space5" style="padding: 5px;background-color: #fff;">
|
||
<input name="tagsinput" id="tagsinputval" class="tagsinput" data-role="tagsinput" value="{{doc_tags}}" placeholder="输入标签名">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 文档下级目录展开设置 -->
|
||
<div class="layui-collapse" style="margin-top: 10px;margin-bottom: 10px;">
|
||
<div class="layui-colla-item">
|
||
<h2 class="layui-colla-title">下级目录</h2>
|
||
<div class="layui-colla-content layui-show">
|
||
<div class="layui-row layui-col-space5" style="padding: 5px;background-color: #fff;">
|
||
{%if doc.open_children %}
|
||
<input type="radio" name="open-children" value="true" title="展开" checked>
|
||
<input type="radio" name="open-children" value="false" title="收起">
|
||
{% else %}
|
||
<input type="radio" name="open-children" value="true" title="展开">
|
||
<input type="radio" name="open-children" value="false" title="收起" checked>
|
||
{% endif %}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 显示下级文档 -->
|
||
<div class="layui-collapse" style="margin-top: 10px;margin-bottom: 10px;">
|
||
<div class="layui-colla-item">
|
||
<h2 class="layui-colla-title">文档内显示下级文档</h2>
|
||
<div class="layui-colla-content layui-show">
|
||
<div class="layui-row layui-col-space5" style="padding: 5px;background-color: #fff;">
|
||
{%if doc.show_children %}
|
||
<input type="radio" name="show-children" value="true" title="显示" checked>
|
||
<input type="radio" name="show-children" value="false" title="隐藏">
|
||
{% else %}
|
||
<input type="radio" name="show-children" value="true" title="显示">
|
||
<input type="radio" name="show-children" value="false" title="隐藏" checked>
|
||
{% endif %}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 发布按钮 -->
|
||
<div class="layui-collapse" style="margin-top: 10px;margin-bottom: 10px;">
|
||
<div class="layui-colla-item">
|
||
<h2 class="layui-colla-title">发布</h2>
|
||
<div class="layui-colla-content layui-show">
|
||
<div class="layui-row layui-col-space5" style="padding: 5px;background-color: #fff;">
|
||
<div class="layui-row" style="margin-top: 5px;">
|
||
<button class="layui-btn layui-btn-primary layui-btn-fluid mrdoc-btn-default" id="modify_save_doc" title="保存当前内容为草稿文档">
|
||
<i class="fa fa-save"></i> 保存为草稿
|
||
</button>
|
||
</div>
|
||
|
||
<div class="layui-row" style="margin-top: 5px;">
|
||
<button class="layui-btn layui-btn-normal layui-btn-fluid" id="modify_pub_doc" title="发布当前内容">
|
||
<i class="fa fa-save"></i> 发布文档
|
||
</button>
|
||
</div>
|
||
|
||
<div class="layui-row" style="margin-top: 5px;">
|
||
<button class="layui-btn layui-btn-warm layui-btn-fluid" onclick="moveDoc()" title="复制或移动此文档到其他文集"><i class="fa fa-copy"></i> 复制/移动文档</button>
|
||
</div>
|
||
|
||
<div class="layui-row" style="margin-top: 5px;">
|
||
<button class="layui-btn layui-btn-danger layui-btn-fluid" onclick="delDoc()" title="删除此文档"><i class="fa fa-trash"></i> 删除文档</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</div>
|
||
{% endblock %}
|
||
|
||
{% block content %}
|
||
<div class="create-doc-form">
|
||
<div class="layui-form">
|
||
<!-- 标题 -->
|
||
<div class="layui-input-block" style="margin-left:0;">
|
||
<input type="text" name="doc-name" id="doc-name" required lay-verify="required" placeholder="请输入文档标题" value="{{ doc.name }}" class="layui-input">
|
||
</div>
|
||
<br>
|
||
</div>
|
||
</div>
|
||
<div id="editor-md">
|
||
{% if editor_mode == 1 %}
|
||
<textarea style="display:none;">{{ doc.pre_content }}</textarea>
|
||
{% elif editor_mode == 3 %}
|
||
{{ doc.content | safe }}
|
||
{% else %}
|
||
{{ doc.pre_content }}
|
||
{% endif %}
|
||
</div>
|
||
{% endblock %}
|
||
|
||
{% block custom_div %}
|
||
{% include 'app_doc/editor/tpl_editor_div_doc.html' %}
|
||
{% endblock %}
|
||
|
||
{% block custom_script %}
|
||
<script>
|
||
form.val("left_form",{
|
||
"select_editor_mode": '{{editor_mode}}'
|
||
})
|
||
form.on('select(select_editor_mode)',function(data){
|
||
//console.log(data.value)
|
||
layer.open({
|
||
type:0,
|
||
title:'切换编辑器',
|
||
area:'300px;',
|
||
id:'change_editor',//配置ID
|
||
content: "页面将重载，未提交的修改将丢失！",
|
||
btn:['确定切换','取消返回'], //添加按钮
|
||
btnAlign:'c', //按钮居中
|
||
yes:function (index,layero) {
|
||
eurl = "{% url 'modify_doc' doc_id=doc.id %}"+"?eid=" + data.value.toString();
|
||
$(location).attr('href', eurl);
|
||
},
|
||
btn2: function(index, layero){
|
||
//暂时不需要返回
|
||
}
|
||
});
|
||
})
|
||
|
||
|
||
|
||
//获取文档数和上级文档信息
|
||
$(function(){
|
||
layer.load(1);
|
||
var doc_parent_id = '{{ doc.parent_doc }}';
|
||
$.post("{% url 'get_pro_doc_tree' %}",{'pro_id':$("#project").val()},function(r){
|
||
if(r.status){
|
||
layer.closeAll("loading");
|
||
var doc_tree = tree.render({
|
||
elem:"#doc-tree",
|
||
id:'docTree',
|
||
onlyIconControl:true,
|
||
data:r.data,
|
||
click: function(obj){
|
||
if(obj.data.level != 3){
|
||
console.log(obj.data.id,doc_parent_id)
|
||
if(obj.data.id != '{{ doc.id }}' ){
|
||
$('#parent-doc').val(obj.data.id);// 设置上级文档
|
||
$("div.layui-tree-set").each(function(i){
|
||
var $me = $(this)
|
||
if($me.data('id') == obj.data.id){
|
||
// console.log('点击了')
|
||
layer.msg("你选择了上级文档："+obj.data.title)
|
||
$me.find('span.layui-tree-txt').first().addClass('selected-parent-doc')
|
||
}else{
|
||
$me.find('span.layui-tree-txt').first().removeClass('selected-parent-doc')
|
||
}
|
||
});
|
||
}else{
|
||
layer.msg("不可选择自己作为上级")
|
||
};
|
||
|
||
}else{
|
||
layer.msg("第三级文档不能作为上级文档")
|
||
};
|
||
|
||
}
|
||
});
|
||
$('#parent-doc').val(doc_parent_id);// 设置上级文档
|
||
$("div.layui-tree-set").each(function(i){
|
||
var $me = $(this)
|
||
if($me.data('id') == doc_parent_id){
|
||
$me.find('span.layui-tree-txt').first().addClass('selected-parent-doc')
|
||
}else{
|
||
$me.find('span.layui-tree-txt').first().removeClass('selected-parent-doc')
|
||
}
|
||
});
|
||
}else{
|
||
layer.msg("获取下级文档失败！")
|
||
}
|
||
});
|
||
});
|
||
// 修改文档
|
||
modifyDoc = function(status){
|
||
$('button.layui-btn').attr("disabled",true);
|
||
$('button.layui-btn').addClass('layui-btn-disabled');
|
||
layer.load(1);
|
||
if(editor_mode == 1){
|
||
var content = editor.getHTML()
|
||
var pre_content = editor.getMarkdown()
|
||
}else if(editor_mode == 2){
|
||
var content = editor.getHTML()
|
||
var pre_content = editor.getValue()
|
||
}else if(editor_mode == 3){
|
||
var content = editor.getHTML()
|
||
var pre_content = editor.getText()
|
||
}
|
||
var data = {
|
||
'doc_id':'{{ doc.id }}',
|
||
'project':$("#project").val(),
|
||
'doc_tag':$("#tagsinputval").val(),
|
||
'parent_doc':$("#parent-doc").val(),
|
||
'doc_name':$("#doc-name").val(),
|
||
'content':content,
|
||
'pre_content':pre_content,
|
||
'sort':$("#sort").val(),
|
||
'editor_mode':'{{editor_mode}}',
|
||
'status':status,
|
||
'open_children':$('input:radio[name="open-children"]:checked').val(),
|
||
'show_children':$('input:radio[name="show-children"]:checked').val(),
|
||
}
|
||
$.post("{% url 'modify_doc' doc_id=doc.id %}",data,function(r){
|
||
layer.closeAll("loading");
|
||
if(r.status){
|
||
//修改成功
|
||
window.localStorage.removeItem('mrdoc_doc_cache') // 清空文档缓存
|
||
if(status === 1){
|
||
layer.msg('发布成功，即将跳转',function(){
|
||
md_changed = false;
|
||
window.location.href = "{% url 'doc' pro_id=doc.top_doc doc_id=doc.id %}";
|
||
});
|
||
}else{
|
||
//修改成功
|
||
layer.msg('保存成功',function(){
|
||
md_changed = false;
|
||
window.location.href = "{% url 'modify_doc' doc.id %}";
|
||
});
|
||
}
|
||
}else{
|
||
//修改失败
|
||
layer.msg('保存失败');
|
||
$('button.layui-btn').attr("disabled",false);
|
||
$('button.layui-btn').removeClass('layui-btn-disabled');
|
||
}
|
||
});
|
||
};
|
||
$("#modify_save_doc").click(function(){
|
||
modifyDoc(0);
|
||
})
|
||
$("#modify_pub_doc").click(function(){
|
||
modifyDoc(1);
|
||
})
|
||
//选择文档模板
|
||
$("#sel-doctemp").click(function(){
|
||
layer.open({
|
||
type: 1,
|
||
id:'temp-div',
|
||
content: $('#doctemp-list'),
|
||
area:['530px','400px'],
|
||
});
|
||
});
|
||
//插入模板
|
||
insertTemp = function(doctemp_id){
|
||
layer.load();
|
||
$.post("{% url 'get_doctemp' %}",{'doctemp_id':doctemp_id},function(r){
|
||
if(r.status){
|
||
editor.insertValue(r.data);
|
||
layer.closeAll()
|
||
}else{
|
||
layer.closeAll("loading");
|
||
layer.msg(r.data)
|
||
}
|
||
});
|
||
};
|
||
//插入本地文本文件
|
||
function insertLocalFile(input) {
|
||
var file = input.files[0];
|
||
//filename = file.name.split(".")[0]; // 文件名
|
||
//支持chrome IE10
|
||
if (window.FileReader) {
|
||
var reader = new FileReader();
|
||
reader.onload = function() {
|
||
console.log(this.result);
|
||
editor.insertValue(this.result);
|
||
}
|
||
reader.readAsText(file);
|
||
}
|
||
//支持IE 7 8 9 10
|
||
else if (typeof window.ActiveXObject != 'undefined'){
|
||
var xmlDoc;
|
||
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
|
||
xmlDoc.async = false;
|
||
xmlDoc.load(input.value);
|
||
console.log(xmlDoc.xml);
|
||
editor.insertValue(xmlDoc.xml);
|
||
}
|
||
//支持FF
|
||
else if (document.implementation && document.implementation.createDocument) {
|
||
var xmlDoc;
|
||
xmlDoc = document.implementation.createDocument("", "", null);
|
||
xmlDoc.async = false;
|
||
xmlDoc.load(input.value);
|
||
console.log(xmlDoc.xml);
|
||
editor.insertValue(xmlDoc.xml);
|
||
} else {
|
||
alert('error');
|
||
}
|
||
};
|
||
//选择本地文本文件
|
||
function selectLocalFile(){
|
||
$("#insert-local-file").trigger("click");
|
||
};
|
||
// 查看历史记录
|
||
$("#doc-history").click(function(){
|
||
layer.open({
|
||
type: 1,
|
||
title:'查看当前文档的历史版本',
|
||
id:'history-div',
|
||
content: $('#history-list'),
|
||
area:['530px','300px'],
|
||
});
|
||
});
|
||
//清除所选上级文档
|
||
$("#clearParentDoc").click(function(){
|
||
$('#parent-doc').val("");
|
||
$("span.layui-tree-txt").each(function(i){
|
||
var $me = $(this)
|
||
$me.removeClass('selected-parent-doc')
|
||
});
|
||
});
|
||
// 插入历史版本
|
||
insertHistory = function(doc_id,history_id){
|
||
layer.load(1);
|
||
var url = "{% url 'diff_doc' 0 1 %}";
|
||
url = url.replace(0,doc_id).replace(1,history_id)
|
||
$.post(url,function(r){
|
||
layer.closeAll("loading");
|
||
if(r.status){
|
||
editor.setMarkdown(r.data);
|
||
}else{
|
||
layer.msg(r.data)
|
||
}
|
||
});
|
||
};
|
||
// 删除文档
|
||
delDoc = function(doc_id){
|
||
layer.open({
|
||
type:1,
|
||
title:'删除文档',
|
||
area:'300px;',
|
||
id:'delPro',//配置ID
|
||
content:'<div style="margin-left:10px;">警告：此操作将删除此文档！</div>',
|
||
btn:['确定','取消'], //添加按钮
|
||
btnAlign:'c', //按钮居中
|
||
yes:function (index,layero) {
|
||
layer.load(1);
|
||
data = {
|
||
'doc_id':'{{ doc.id }}',
|
||
};
|
||
$.post("{% url 'del_doc' %}",data,function(r){
|
||
layer.closeAll('loading')
|
||
if(r.status){
|
||
//修改成功
|
||
layer.msg("文档已删除，即将跳转至文集")
|
||
// window.location.reload();
|
||
window.location.href = "{% url 'pro_index' doc.top_doc %}"
|
||
//layer.close(index)
|
||
}else{
|
||
//修改失败，提示
|
||
// console.log(r)
|
||
layer.msg(r.data)
|
||
}
|
||
})
|
||
},
|
||
});
|
||
};
|
||
// 移动文档
|
||
moveDoc = function(doc_id){
|
||
layer.open({
|
||
type:1,
|
||
title:'复制或移动此文档到指定文集',
|
||
id:'moveDoc',
|
||
area:'450px;',
|
||
content:$('#move-project'),
|
||
success:function(layero,index){
|
||
form.render(null, 'move-projects'); // 重新渲染弹出框的表单
|
||
// 移动文集 - 侦听选择文集 - 获取文集的文档
|
||
form.on('select(moveProject)', function(data){
|
||
// console.log(data.value); //得到被选中的值
|
||
$('#move-parent-id').val(0);
|
||
//获取文集的下级文档
|
||
$.post("{% url 'get_pro_doc_tree' %}",{'pro_id':data.value},function(r){
|
||
if(r.status){
|
||
var doc_tree = tree.render({
|
||
elem:"#move-doc-tree",
|
||
id:'moveDocTree',
|
||
onlyIconControl:true,
|
||
data:r.data,
|
||
text: {
|
||
defaultNodeName: '未命名' //节点默认名称
|
||
,none: '文集暂无文档' //数据为空时的提示文本
|
||
},
|
||
click: function(obj){
|
||
if(obj.data.level != 3){
|
||
$('#move-parent-id').val(obj.data.id);// 设置上级文档
|
||
$("div.layui-tree-set").each(function(i){
|
||
var $me = $(this)
|
||
if($me.data('id') == obj.data.id){
|
||
// console.log('点击了')
|
||
layer.msg("选择了上级文档："+obj.data.title)
|
||
$me.find('span.layui-tree-txt').first().addClass('selected-parent-doc')
|
||
}else{
|
||
$me.find('span.layui-tree-txt').first().removeClass('selected-parent-doc')
|
||
}
|
||
});
|
||
}else{
|
||
layer.msg("第三级文档不能作为上级文档")
|
||
}
|
||
|
||
}
|
||
});
|
||
}else{
|
||
layer.msg("获取下级文档失败！")
|
||
}
|
||
});
|
||
});
|
||
},
|
||
})
|
||
};
|
||
// 提交移动文档
|
||
submitMoveDoc = function(){
|
||
var data = {
|
||
move_type:$("input:radio[name='move-type']:checked").val(),
|
||
pro_id:$("#moveProject").val(),
|
||
parent_id:$("#move-parent-id").val(),
|
||
doc_id:'{{doc.id}}'
|
||
};
|
||
if(data.pro_id === ''){
|
||
layer.msg("必须选择一个文集")
|
||
return
|
||
}
|
||
console.log(data)
|
||
layer.load(1)
|
||
$.post("{% url 'move_doc' %}",data,function(r){
|
||
layer.closeAll('loading')
|
||
if(r.status){
|
||
window.location.href = '/project-'+r.data.pro_id + '/doc-' + r.data.doc_id + '/'
|
||
}else{
|
||
layer.msg(r.data)
|
||
}
|
||
});
|
||
|
||
};
|
||
|
||
|
||
</script>
|
||
{% endblock %} |