1

application/admin/view/document/index/edit.html

@@ -1,3 +1,4 @@
+
 <form id="edit-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
     {:token()}
     <div class="form-group">
@@ -30,6 +31,13 @@
             <textarea id="c-content" class="form-control editor" rows="5" cols="50" name="row[content]">{$row.content|htmlentities}</textarea>
         </div>
     </div>
+<!--    <div class="form-group">-->
+<!--        <label for="editor" class="control-label col-xs-12 col-sm-2">{:__('content')}:</label>-->
+<!--&lt;!&ndash;        <div class="toolbar-container"></div>&ndash;&gt;-->
+<!--&lt;!&ndash;        <div class="content-container">&ndash;&gt;-->
+
+<!--            <textarea id='content_' name="row[content]"></textarea>-->
+<!--    </div>-->
     <div class="form-group">
         <label for="c-weigh" class="control-label col-xs-12 col-sm-2">{:__('Weigh')}:</label>
         <div class="col-xs-12 col-sm-8">
@@ -45,8 +53,104 @@
     <div class="form-group layer-footer">
         <label class="control-label col-xs-12 col-sm-2"></label>
         <div class="col-xs-12 col-sm-8">
-            <button type="submit" class="btn btn-primary btn-embossed disabled">{:__('OK')}</button>
+            <button type="submit" class="btn btn-primary btn-embossed disabled" id="OK">{:__('OK')}</button>
             <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
         </div>
     </div>
 </form>
+<script src="../../../../../ckeditor5/packages/ckeditor5-build-classic/build/translations/zh-cn.js"></script>
+<script src="../../../../../ckeditor5/packages/ckeditor5-build-classic/build/ckeditor.js"></script>
+<script>
+    var editor
+    ClassicEditor.create( document.querySelector( 'textarea' ),{
+        ckfinder: {
+            uploadUrl: ' ../../../../../api/common/editor_upload?command=QuickUpload&type=Files&responseType=json',
+        },
+        toolbar: {
+            items: [
+                'sourceEditing',
+                '|','undo','redo',
+                '|','heading',
+                '|','findandReplace','alignment','bold','italic','underline','code',
+                'horizontalLine','removeformat','link','strikethrough','subscript','superscript','blockQuote','specialCharacters',
+                '|','FontSize','FontColor','FontBackgroundColor','FontFamily','highlight',
+                '|','numberedList','bulletedList','todoList','outdent','indent','pageBreak',
+                '|','insertImage','cKFinder','insertTable','mediaEmbed',
+
+            ]
+        },
+        //设置字体
+        fontFamily: {
+            options: [
+                'default',
+                'Blackoak Std',
+                '宋体,SimSun',
+                '新宋体,NSimSun',
+                '微软雅黑,Microsoft YaHei',
+                '楷体_GB2312,KaiTi_GB2312',
+                '隶书,LiSu',
+                '幼园,YouYuan',
+                '华文细黑,STXihei',
+            ]
+        },
+        image: {
+
+            styles: [
+                'full','alignLeft', 'alignCenter', 'alignRight'
+            ],
+            resizeOptions: [
+                {
+                    name: 'resizeImage:原尺寸',
+                    label: '原尺寸',
+                    value: null
+                },
+                {
+                    name: 'resizeImage:25',
+                    label: '25%',
+                    value: '25'
+                },
+                {
+                    name: 'resizeImage:50',
+                    label: '50%',
+                    value: '50'
+                },
+                {
+                    name: 'resizeImage:75',
+                    label: '75%',
+                    value: '75'
+                }
+            ],
+            toolbar: [
+                // 'imageStyle:full',
+                // 'imageStyle:side',
+                'imageStyle:alignLeft',
+                'imageStyle:alignCenter',
+                'imageStyle:alignRight',
+                '|',
+                'resizeImage',
+                '|',
+                'toggleImageCaption',
+                'imageTextAlternative',
+                'linkImage'
+            ],
+
+        },
+        table: {
+            contentToolbar: [
+                'tableColumn',
+                'tableRow',
+                'mergeTableCells',
+                'tableCellProperties',
+                'tableProperties'
+            ]
+        },
+        language: 'zh-cn'
+    } )
+        .then( editor => {
+            window.editor = editor;
+        } )
+        .catch( error => {
+            console.error( 'There was a problem initializing the editor.', error );
+        } );
+    // editor.setData( 123 );
+</script>

application/api/controller/Common.php

@@ -10,13 +10,14 @@ use app\common\model\Version;
 use fast\Random;
 use think\Config;
 use think\Hook;
+use think\Request;
 
 /**
  * 公共接口
  */
 class Common extends Api
 {
-    protected $noNeedLogin = ['init'];
+    protected $noNeedLogin = ['init','editor_upload'];
     protected $noNeedRight = '*';
 
     /**
@@ -122,9 +123,30 @@ class Common extends Api
             } catch (UploadException $e) {
                 $this->error($e->getMessage());
             }
-
             $this->success(__('Uploaded successful'), ['url' => $attachment->url, 'fullurl' => cdnurl($attachment->url, true)]);
         }
 
     }
+
+    /**
+     * CKEditor 上传图片
+     * @return \think\response\Json
+     */
+    public function editor_upload()
+    {
+        $file = request()->file('upload');
+        try {
+            $upload = new Upload($file);
+            $attachment = $upload->upload();
+        } catch (UploadException $e) {
+            $this->error($e->getMessage());
+        }
+        $res = [
+            'uploaded'=>1,
+            'url'=>cdnurl($attachment->url, true),
+            'fileName'=>$attachment->filename,
+        ];
+        return json($res);
+    }
+
 }

application/extra/addons.php

@@ -6,9 +6,6 @@ return [
         'app_init' => [
             'epay',
         ],
-        'config_init' => [
-            'summernote',
-        ],
     ],
     'route' => [
         '/example$' => 'example/index/index',

public/assets/js/addons.js

@@ -1,119 +1,3 @@
 define([], function () {
-    require.config({
-    paths: {
-        'summernote': '../addons/summernote/lang/summernote-zh-CN.min'
-    },
-    shim: {
-        'summernote': ['../addons/summernote/js/summernote.min', 'css!../addons/summernote/css/summernote.min.css'],
-    }
-});
-require(['form', 'upload'], function (Form, Upload) {
-    var _bindevent = Form.events.bindevent;
-    Form.events.bindevent = function (form) {
-        _bindevent.apply(this, [form]);
-        try {
-            //绑定summernote事件
-            if ($(Config.summernote.classname || '.editor', form).length > 0) {
-                var selectUrl = typeof Config !== 'undefined' && Config.modulename === 'index' ? 'user/attachment' : 'general/attachment/select';
-                require(['summernote'], function () {
-                    var imageButton = function (context) {
-                        var ui = $.summernote.ui;
-                        var button = ui.button({
-                            contents: '<i class="fa fa-file-image-o"/>',
-                            tooltip: __('Choose'),
-                            click: function () {
-                                parent.Fast.api.open(selectUrl + "?element_id=&multiple=true&mimetype=image/", __('Choose'), {
-                                    callback: function (data) {
-                                        var urlArr = data.url.split(/\,/);
-                                        $.each(urlArr, function () {
-                                            var url = Fast.api.cdnurl(this, true);
-                                            context.invoke('editor.insertImage', url);
-                                        });
-                                    }
-                                });
-                                return false;
-                            }
-                        });
-                        return button.render();
-                    };
-                    var attachmentButton = function (context) {
-                        var ui = $.summernote.ui;
-                        var button = ui.button({
-                            contents: '<i class="fa fa-file"/>',
-                            tooltip: __('Choose'),
-                            click: function () {
-                                parent.Fast.api.open(selectUrl + "?element_id=&multiple=true&mimetype=*", __('Choose'), {
-                                    callback: function (data) {
-                                        var urlArr = data.url.split(/\,/);
-                                        $.each(urlArr, function () {
-                                            var url = Fast.api.cdnurl(this, true);
-                                            var node = $("<a href='" + url + "'>" + url + "</a>");
-                                            context.invoke('insertNode', node[0]);
-                                        });
-                                    }
-                                });
-                                return false;
-                            }
-                        });
-                        return button.render();
-                    };
-                    $(Config.summernote.classname || '.editor', form).each(function () {
-                        $(this).summernote($.extend(true, {}, {
-                            height: 250,
-                            lang: 'zh-CN',
-                            fontNames: [
-                                'Arial', 'Arial Black', 'Serif', 'Sans', 'Courier',
-                                'Courier New', 'Comic Sans MS', 'Helvetica', 'Impact', 'Lucida Grande',
-                                "Open Sans", "Hiragino Sans GB", "Microsoft YaHei",
-                                '微软雅黑', '宋体', '黑体', '仿宋', '楷体', '幼圆',
-                            ],
-                            fontNamesIgnoreCheck: [
-                                "Open Sans", "Microsoft YaHei",
-                                '微软雅黑', '宋体', '黑体', '仿宋', '楷体', '幼圆'
-                            ],
-                            toolbar: [
-                                ['style', ['style', 'undo', 'redo']],
-                                ['font', ['bold', 'underline', 'strikethrough', 'clear']],
-                                ['fontname', ['color', 'fontname', 'fontsize']],
-                                ['para', ['ul', 'ol', 'paragraph', 'height']],
-                                ['table', ['table', 'hr']],
-                                ['insert', ['link', 'picture', 'video']],
-                                ['select', ['image', 'attachment']],
-                                ['view', ['fullscreen', 'codeview', 'help']],
-                            ],
-                            buttons: {
-                                image: imageButton,
-                                attachment: attachmentButton,
-                            },
-                            dialogsInBody: true,
-                            followingToolbar: false,
-                            callbacks: {
-                                onChange: function (contents) {
-                                    $(this).val(contents);
-                                    $(this).trigger('change');
-                                },
-                                onInit: function () {
-                                },
-                                onImageUpload: function (files) {
-                                    var that = this;
-                                    //依次上传图片
-                                    for (var i = 0; i < files.length; i++) {
-                                        Upload.api.send(files[i], function (data) {
-                                            var url = Fast.api.cdnurl(data.url, true);
-                                            $(that).summernote("insertImage", url, 'filename');
-                                        });
-                                    }
-                                }
-                            }
-                        }, $(this).data("summernote-options") || {}));
-                    });
-                });
-            }
-        } catch (e) {
-
-        }
-
-    };
-});
-
+    
 });

public/assets/js/backend/document/index.js

@@ -72,6 +72,12 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
             }, 100);
         },
         edit: function () {
+
+
+            // $("#OK").click(function(){
+            //     // alert(editor.getData());
+            //     $('#content_').text(editor.getData())
+            // });
             Controller.api.bindevent();
         },
         api: {