MrDoc/template/app_doc/modify_doc.html

{% extends 'app_doc/create_base_2.html' %}
{% load staticfiles %}
{% block title %}修改文档{% endblock %}
{% block editor_type %}修改文档{% 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;">
    <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>
            <a class="layui-btn layui-btn-xs layui-btn-normal" target="_blank" href="{% url 'doc' doc.top_doc doc.id %}">
                <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>
            {% endif %}
        </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-normal layui-btn-sm" 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-normal layui-btn-sm" id="sel-local" onclick="selectLocalFile()" title="插入本地文本文件内容">
                    <i class="fa fa-clipboard"></i> 文本
                </button>
            </label>

            <label class="doc-form-label">
                <button class="layui-btn layui-btn-normal layui-btn-sm" onclick="saveDoc()" title="保存当前内容为草稿文档">
                    <i class="fa fa-save"></i> 保存
                </button>
            </label>
            <label class="doc-form-label">
                <button class="layui-btn layui-btn-normal layui-btn-sm" onclick="createDoc()" id="create_doc" title="发布当前内容">
                    <i class="fa fa-save"></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-normal" 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-col-md12" id="doc-tree"></div>
    </div>
    <div class="layui-row" style="margin-top: 20px;">
        <button class="layui-btn layui-btn-danger layui-btn-fluid" onclick="delDoc()" title="删除此文档">删除文档</button>
    </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">
        <textarea style="display:none;">{{ doc.pre_content }}</textarea>
        <textarea class="editormd-html-textarea" name="$id-html-code"></textarea>
    </div>
{% endblock %}

{% block custom_script %}
    <script>
        //获取文档数和上级文档信息
        $(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('点击了')
                                            $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("获取下级文档失败！")
                }
            });
        });
        //发布文档
        createDoc = function(){
            layer.load(1);
            var data = {
                'doc_id':{{ doc.id }},
                'project':$("#project").val(),
                'parent_doc':$("#parent-doc").val(),
                'doc_name':$("#doc-name").val(),
                'content':editor.getHTML(),
                //'content':editor.getPreviewedHTML(),
                'pre_content':editor.getMarkdown(),
                'sort':$("#sort").val(),
            }
            $.post("{% url 'modify_doc' doc_id=doc.id %}",data,function(r){
                layer.closeAll("loading");
                if(r.status){
                    //修改成功
                    layer.msg('发布成功，即将跳转',function(){
                        md_changed = false;
                        window.location.href = "{% url 'doc' pro_id=doc.top_doc doc_id=doc.id %}";
                    });
                }else{
                    //修改失败
                    layer.msg('保存失败');
                }
            });
        };
        //保存草稿
        saveDoc = function(){
            layer.load(1);
            var data = {
                'doc_id':{{ doc.id }},
                'project':$("#project").val(),
                'parent_doc':$("#parent-doc").val(),
                'doc_name':$("#doc-name").val(),
                'content':editor.getHTML(),
                'pre_content':editor.getMarkdown(),
                'sort':$("#sort").val(),
                'status':0
            }
            $.post("{% url 'modify_doc' doc_id=doc.id %}",data,function(r){
                layer.closeAll("loading");
                if(r.status){
                    //修改成功
                    layer.msg('保存成功',function(){
                        md_changed = false;
                        window.location.href = "{% url 'modify_doc' doc.id %}";
                    });
                }else{
                    //修改失败
                    layer.msg('保存失败');
                }
            });
        };
        //选择文档模板
        $("#sel-doctemp").click(function(){
            layer.open({
              type: 1,
                id:'temp-div',
              content: $('#doctemp-list'),
                area:['530px','300px'],
            });
        });
        //插入模板
        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)
                }
            });
        };
        // 查看历史记录
        $("#doc-history").click(function(){
            layer.open({
                type: 1,
                id:'history-div',
                content: $('#history-list'),
                area:['530px','300px'],
            });
        });
        // 插入历史版本
        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)
                        }
                    })
                },
            });
        }
    </script>
{% endblock %}

{% block custom_div %}
<!-- 模板div块 -->
<div class="doctemp-list" id="doctemp-list" style="display: none;width: 500px;">
    <div style="margin: 10px 0 0 10px;">
        <a class="layui-btn layui-btn-normal" href="{% url 'create_doctemp' %}" target="_blank">创建新模板</a>
        <a class="layui-btn layui-btn-normal" href="{% url 'manage_doctemp' %}" target="_blank">管理文档模板</a>
    </div>
    <table class="layui-table" style="margin: 10px;">
      <colgroup>
        <col width="150">
        <col width="200">
        <col>
      </colgroup>
      <thead>
        <tr>
          <th>模板名称</th>
          <th>创建时间</th>
          <th>操作</th>
        </tr>
      </thead>
      <tbody>
        {% for temp in doctemp_list %}
        <tr>
          <td>{{ temp.name }}</td>
          <td>{{ temp.create_time }}</td>
          <td>
              <a href="javascript:void(0);" class="layui-btn layui-btn-normal layui-btn-sm" onclick="insertTemp('{{temp.id}}');">选择模板</a>
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
</div>
<!-- 文档历史div块 -->
<div class="history-list" id="history-list" style="display: none;width: 500px;">
    <table class="layui-table" style="margin: 10px;" lay-size='sm'>
      <thead>
        <tr>
          <th>创建时间</th>
          <th>用户</th>
          <th>对比</th>
          <th>操作</th>
        </tr>
      </thead>
      <tbody>
        {% for history in history_list %}
        <tr>
          <td>{{ history.create_time }}</td>
          <td>{{ history.create_user }}</td>
          <td>
              <a href="{% url 'diff_doc' history.doc.id history.id %}" target="_blank">查看差异</a>
          </td>
          <td>
              <a href="javascript:void(0);" class="layui-btn layui-btn-normal layui-btn-sm" onclick="insertHistory('{{history.doc.id}}','{{history.id}}');">恢复此版本</a>
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
</div>
{% endblock %}