实现文档历史功能

static/js/editor.js

@@ -200,30 +200,68 @@ function showSuccess($msg,$id) {
     return true;
 }
 
-$(function () {
-    $("#documentHistoryModal").on("shown.bs.modal",function () {
-        var historyVue = new Vue({
-            el : "#documentHistoryModal",
-            data : {
-                lists : []
-            },
-            delimiters : ['${','}'],
-            methods : {
-
+window.documentHistory = function() {
+    layer.open({
+        type: 2,
+        title: '历史版本',
+        shadeClose: true,
+        shade: 0.8,
+        area: ['700px','80%'],
+        content: window.historyURL + "?identify=" + window.book.identify + "&doc_id=" + window.selectNode.id,
+        end : function () {
+            if(window.SelectedId){
+                var selected = {node:{
+                    id : window.SelectedId
+                }};
+                window.loadDocument(selected);
+                window.SelectedId = null;
             }
-        });
-
-        $.ajax({
-            url : window.historyURL,
-            data : { "identify" : window.book.identify,"doc_id" : window.selectNode.id },
-            dataType :"json",
-            success : function (res) {
-                if(res.errcode === 0){
-                    historyVue.lists = res.data.lists;
-                }else{
-                    alert(res.message);
-                }
-            }
-        });
+        }
     });
+};
+
+$(function () {
+    window.vueApp = new Vue({
+        el : "#attachList",
+        data : {
+            lists : []
+        },
+        delimiters : ['${','}'],
+        methods : {
+            removeAttach : function ($attach_id) {
+                var $this = this;
+                var item = $this.lists.filter(function ($item) {
+                    return $item.attachment_id == $attach_id;
+                });
+
+                if(item && item[0].hasOwnProperty("state")){
+                    $this.lists = $this.lists.filter(function ($item) {
+                        return $item.attachment_id != $attach_id;
+                    });
+                    return;
+                }
+                $.ajax({
+                    url : window.removeAttachURL,
+                    type : "post",
+                    data : { "attach_id" : $attach_id},
+                    success : function (res) {
+                        console.log(res);
+                        if(res.errcode === 0){
+                            $this.lists = $this.lists.filter(function ($item) {
+                                return $item.attachment_id != $attach_id;
+                            });
+                        }else{
+                            layer.msg(res.message);
+                        }
+                    }
+                });
+            }
+        },
+        watch : {
+            lists : function ($lists) {
+                $("#attachInfo").text(" " + $lists.length + " 个附件")
+            }
+        }
+    });
+
 });

static/js/html-editor.js

@@ -9,24 +9,18 @@ $(function () {
         "editor" : "wangEditor"
     };
     wangEditor.config.menus.splice(0,0,"|");
+    wangEditor.config.menus.splice(0,0,"history");
     wangEditor.config.menus.splice(0,0,"save");
     wangEditor.config.menus.splice(0,0,"release");
     wangEditor.config.menus.splice(29,0,"attach")
 
     //移除地图、背景色
     editor.config.menus = $.map(wangEditor.config.menus, function(item, key) {
-        if (item === 'bgcolor') {
-            return null;
-        }
+
         if (item === 'fullscreen') {
             return null;
         }
-        if (item === "undo"){
-            return null;
-        }
-        if (item === "redo"){
-            return null;
-        }
+
         return item;
     });
 

static/js/markdown.js

@@ -61,7 +61,7 @@ $(function () {
        if(name === "attachment"){
            $("#uploadAttachModal").modal("show");
        }else if(name === "history"){
-            $("#documentHistoryModal").modal("show");
+           window.documentHistory();
        }else if(name === "save"){
             saveDocument(false);
 
@@ -126,7 +126,7 @@ $(function () {
      * 加载指定的文档到编辑器中
      * @param $node
      */
-    function loadDocument($node) {
+    window.loadDocument = function($node) {
         var index = layer.load(1, {
             shade: [0.1,'#fff'] //0.1透明度的白色背景
         });
@@ -175,7 +175,6 @@ $(function () {
 
             if(item.id === doc_id){
                 version = item.version;
-                console.log(item)
                 break;
             }
         }

static/wangEditor/plugins/history-menu.js

@@ -0,0 +1,47 @@
+(function () {
+
+    // 获取 wangEditor 构造函数和 jquery
+    var E = window.wangEditor;
+    var $ = window.jQuery;
+
+    // 用 createMenu 方法创建菜单
+    E.createMenu(function (check) {
+
+        // 定义菜单id，不要和其他菜单id重复。编辑器自带的所有菜单id，可通过『参数配置-自定义菜单』一节查看
+        var menuId = 'history';
+
+        // check将检查菜单配置（『参数配置-自定义菜单』一节描述）中是否该菜单id，如果没有，则忽略下面的代码。
+        if (!check(menuId)) {
+            return;
+        }
+
+        // this 指向 editor 对象自身
+        var editor = this;
+
+        // 创建 menu 对象
+        var menu = new E.Menu({
+            editor: editor,  // 编辑器对象
+            id: menuId,  // 菜单id
+            title: '历史', // 菜单标题
+
+            // 正常状态和选中状态下的dom对象，样式需要自定义
+            $domNormal: $('<a href="#" tabindex="-1"><i class="fa fa-history" aria-hidden="true" name="history"></i></a>'),
+            $domSelected: $('<a href="#" tabindex="-1" class="selected"><i class="fa fa-history" aria-hidden="true" name="history"></i></a>')
+        });
+
+        // 菜单正常状态下，点击将触发该事件
+        menu.clickEvent = function (e) {
+            window.documentHistory();
+        };
+
+        // 菜单选中状态下，点击将触发该事件
+        menu.clickEventSelected = function (e) {
+
+        };
+
+
+        // 增加到editor对象中
+        editor.menus[menuId] = menu;
+    });
+
+})();