添加编辑器

app/Http/Controllers/TopicsController.php

@@ -3,8 +3,10 @@
 namespace App\Http\Controllers;
 
 use App\Http\Requests\TopicRequest;
+use App\Models\Category;
 use App\Models\Topic;
 use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Auth;
 
 class TopicsController extends Controller
 {
@@ -13,6 +15,12 @@ class TopicsController extends Controller
         $this->middleware('auth', ['except' => ['index', 'show']]);
     }
 
+    public function create(Topic $topic)
+    {
+        $categories = Category::all();
+        return view('topics.create_and_edit', compact('topic', 'categories'));
+    }
+
     public function index(Request $request, Topic $topic)
     {
         $topics = $topic->with('user', 'category')->withOrder($request->order)->paginate();
@@ -24,14 +32,11 @@ class TopicsController extends Controller
         return view('topics.show', compact('topic'));
     }
 
-    public function create(Topic $topic)
+    public function store(TopicRequest $request, Topic $topic)
     {
-        return view('topics.create_and_edit', compact('topic'));
+        $topic->fill($request->all());
-    }
+        $topic->user_id = Auth::id();
-
+        $topic->save();
-    public function store(TopicRequest $request)
-    {
-        $topic = Topic::create($request->all());
         return redirect()->route('topics.show', $topic->id)->with('message', 'Created successfully.');
     }
 

app/Http/Requests/TopicRequest.php

@@ -11,7 +11,9 @@ class TopicRequest extends Request
             case 'POST':
                 {
                     return [
-                        // CREATE ROLES
+                        'title' => 'required|max:50',
+                        'category_id' => 'required|integer',
+                        'body' => 'required|min:3'
                     ];
                 }
             // UPDATE
@@ -31,6 +33,15 @@ class TopicRequest extends Request
         }
     }
 
+    public function attributes()
+    {
+        return [
+            'title' => '标题',
+            'category_id' => '类别',
+            'body' => '内容'
+        ];
+    }
+
     public function messages()
     {
         return [

app/Models/Topic.php

@@ -4,7 +4,7 @@ namespace App\Models;
 
 class Topic extends Model
 {
-    protected $fillable = ['"title', 'body', 'user_id', 'category_id', 'reply_count', 'view_count', 'last_reply_user_id', 'order', 'excerpt', 'slug'];
+    protected $fillable = ['title', 'category_id', 'body', 'excerpt', 'slug'];
 
 
     public function scopeWithOrder($query, $order)

app/Observers/TopicObserver.php

@@ -14,6 +14,11 @@ class TopicObserver
         //
     }
 
+    public function saving(Topic $topic)
+    {
+        $topic->excerpt = make_excerpt($topic->body);
+    }
+
     public function updating(Topic $topic)
     {
         //

app/Policies/TopicPolicy.php

@@ -9,8 +9,7 @@ class TopicPolicy extends Policy
 {
     public function update(User $user, Topic $topic)
     {
-        // return $topic->user_id == $user->id;
+        return $topic->user_id == $user->id;
-        return true;
     }
 
     public function destroy(User $user, Topic $topic)

app/helpers.php

@@ -10,4 +10,16 @@
 function route_class()
 {
     return str_replace('.', '-', \Illuminate\Support\Facades\Route::currentRouteName());
+}
+
+/**
+ * seo
+ * @param $value
+ * @param int $length
+ * @return string
+ */
+function make_excerpt($value, $length = 200)
+{
+    $excerpt = trim(preg_replace('/\r\n|\r|\n+/', ' ', strip_tags($value)));
+    return str_limit($excerpt, $length);
 }

package-lock.json

@@ -9749,6 +9749,71 @@
       "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0=",
       "dev": true
     },
+    "simditor": {
+      "version": "2.3.6",
+      "resolved": "https://registry.npmjs.org/simditor/-/simditor-2.3.6.tgz",
+      "integrity": "sha1-unHtwxYfxDhGbDNsnBAFJ0NAOUc=",
+      "requires": {
+        "jquery": "2.1.4",
+        "simple-hotkeys": "1.0.3",
+        "simple-module": "2.0.6",
+        "simple-uploader": "2.0.8"
+      },
+      "dependencies": {
+        "jquery": {
+          "version": "2.1.4",
+          "resolved": "https://registry.npmjs.org/jquery/-/jquery-2.1.4.tgz",
+          "integrity": "sha1-IoveaYoMYUMdwmMKahVPFYkNIxc="
+        }
+      }
+    },
+    "simple-hotkeys": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/simple-hotkeys/-/simple-hotkeys-1.0.3.tgz",
+      "integrity": "sha1-R6W8NTYspzOWEb0JqE+jeBiwu8Y=",
+      "requires": {
+        "jquery": "2.2.4",
+        "simple-module": "2.0.6"
+      },
+      "dependencies": {
+        "jquery": {
+          "version": "2.2.4",
+          "resolved": "https://registry.npmjs.org/jquery/-/jquery-2.2.4.tgz",
+          "integrity": "sha1-LInWiJterFIqfuoywUUhVZxsvwI="
+        }
+      }
+    },
+    "simple-module": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/simple-module/-/simple-module-2.0.6.tgz",
+      "integrity": "sha1-zsglAyX4x/V19Kp1yRmzg5amA3s=",
+      "requires": {
+        "jquery": "2.2.4"
+      },
+      "dependencies": {
+        "jquery": {
+          "version": "2.2.4",
+          "resolved": "https://registry.npmjs.org/jquery/-/jquery-2.2.4.tgz",
+          "integrity": "sha1-LInWiJterFIqfuoywUUhVZxsvwI="
+        }
+      }
+    },
+    "simple-uploader": {
+      "version": "2.0.8",
+      "resolved": "https://registry.npmjs.org/simple-uploader/-/simple-uploader-2.0.8.tgz",
+      "integrity": "sha1-X8QQbG2Wiws1MpPjsWCUqv3pV7o=",
+      "requires": {
+        "jquery": "2.2.4",
+        "simple-module": "2.0.6"
+      },
+      "dependencies": {
+        "jquery": {
+          "version": "2.2.4",
+          "resolved": "https://registry.npmjs.org/jquery/-/jquery-2.2.4.tgz",
+          "integrity": "sha1-LInWiJterFIqfuoywUUhVZxsvwI="
+        }
+      }
+    },
     "slash": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz",

package.json

@@ -17,5 +17,8 @@
     "laravel-mix": "^1.0",
     "lodash": "^4.17.4",
     "vue": "^2.5.7"
+  },
+  "dependencies": {
+    "simditor": "^2.3.6"
   }
 }

public/js/hotkeys.js

@@ -0,0 +1,254 @@
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        // AMD. Register as an anonymous module unless amdModuleId is set
+        define('simple-hotkeys', ["jquery", "simple-module"], function ($, SimpleModule) {
+            return (root['hotkeys'] = factory($, SimpleModule));
+        });
+    } else if (typeof exports === 'object') {
+        // Node. Does not work with strict CommonJS, but
+        // only CommonJS-like environments that support module.exports,
+        // like Node.
+        module.exports = factory(require("jquery"), require("simple-module"));
+    } else {
+        root.simple = root.simple || {};
+        root.simple['hotkeys'] = factory(jQuery, SimpleModule);
+    }
+}(this, function ($, SimpleModule) {
+
+    var Hotkeys, hotkeys,
+        extend = function (child, parent) {
+            for (var key in parent) {
+                if (hasProp.call(parent, key)) child[key] = parent[key];
+            }
+
+            function ctor() {
+                this.constructor = child;
+            }
+
+            ctor.prototype = parent.prototype;
+            child.prototype = new ctor();
+            child.__super__ = parent.prototype;
+            return child;
+        },
+        hasProp = {}.hasOwnProperty;
+
+    Hotkeys = (function (superClass) {
+        extend(Hotkeys, superClass);
+
+        function Hotkeys() {
+            return Hotkeys.__super__.constructor.apply(this, arguments);
+        }
+
+        Hotkeys.count = 0;
+
+        Hotkeys.keyNameMap = {
+            8: "Backspace",
+            9: "Tab",
+            13: "Enter",
+            16: "Shift",
+            17: "Control",
+            18: "Alt",
+            19: "Pause",
+            20: "CapsLock",
+            27: "Esc",
+            32: "Spacebar",
+            33: "PageUp",
+            34: "PageDown",
+            35: "End",
+            36: "Home",
+            37: "Left",
+            38: "Up",
+            39: "Right",
+            40: "Down",
+            45: "Insert",
+            46: "Del",
+            91: "Meta",
+            93: "Meta",
+            48: "0",
+            49: "1",
+            50: "2",
+            51: "3",
+            52: "4",
+            53: "5",
+            54: "6",
+            55: "7",
+            56: "8",
+            57: "9",
+            65: "A",
+            66: "B",
+            67: "C",
+            68: "D",
+            69: "E",
+            70: "F",
+            71: "G",
+            72: "H",
+            73: "I",
+            74: "J",
+            75: "K",
+            76: "L",
+            77: "M",
+            78: "N",
+            79: "O",
+            80: "P",
+            81: "Q",
+            82: "R",
+            83: "S",
+            84: "T",
+            85: "U",
+            86: "V",
+            87: "W",
+            88: "X",
+            89: "Y",
+            90: "Z",
+            96: "0",
+            97: "1",
+            98: "2",
+            99: "3",
+            100: "4",
+            101: "5",
+            102: "6",
+            103: "7",
+            104: "8",
+            105: "9",
+            106: "Multiply",
+            107: "Add",
+            109: "Subtract",
+            110: "Decimal",
+            111: "Divide",
+            112: "F1",
+            113: "F2",
+            114: "F3",
+            115: "F4",
+            116: "F5",
+            117: "F6",
+            118: "F7",
+            119: "F8",
+            120: "F9",
+            121: "F10",
+            122: "F11",
+            123: "F12",
+            124: "F13",
+            125: "F14",
+            126: "F15",
+            127: "F16",
+            128: "F17",
+            129: "F18",
+            130: "F19",
+            131: "F20",
+            132: "F21",
+            133: "F22",
+            134: "F23",
+            135: "F24",
+            59: ";",
+            61: "=",
+            186: ";",
+            187: "=",
+            188: ",",
+            190: ".",
+            191: "/",
+            192: "`",
+            219: "[",
+            220: "\\",
+            221: "]",
+            222: "'"
+        };
+
+        Hotkeys.aliases = {
+            "escape": "esc",
+            "delete": "del",
+            "return": "enter",
+            "ctrl": "control",
+            "space": "spacebar",
+            "ins": "insert",
+            "cmd": "meta",
+            "command": "meta",
+            "wins": "meta",
+            "windows": "meta"
+        };
+
+        Hotkeys.normalize = function (shortcut) {
+            var i, j, key, keyname, keys, len;
+            keys = shortcut.toLowerCase().replace(/\s+/gi, "").split("+");
+            for (i = j = 0, len = keys.length; j < len; i = ++j) {
+                key = keys[i];
+                keys[i] = this.aliases[key] || key;
+            }
+            keyname = keys.pop();
+            keys.sort().push(keyname);
+            return keys.join("_");
+        };
+
+        Hotkeys.prototype.opts = {
+            el: document
+        };
+
+        Hotkeys.prototype._init = function () {
+            this.id = ++this.constructor.count;
+            this._map = {};
+            this._delegate = typeof this.opts.el === "string" ? document : this.opts.el;
+            return $(this._delegate).on("keydown.simple-hotkeys-" + this.id, this.opts.el, (function (_this) {
+                return function (e) {
+                    var ref;
+                    return (ref = _this._getHander(e)) != null ? ref.call(_this, e) : void 0;
+                };
+            })(this));
+        };
+
+        Hotkeys.prototype._getHander = function (e) {
+            var keyname, shortcut;
+            if (!(keyname = this.constructor.keyNameMap[e.which])) {
+                return;
+            }
+            shortcut = "";
+            if (e.altKey) {
+                shortcut += "alt_";
+            }
+            if (e.ctrlKey) {
+                shortcut += "control_";
+            }
+            if (e.metaKey) {
+                shortcut += "meta_";
+            }
+            if (e.shiftKey) {
+                shortcut += "shift_";
+            }
+            shortcut += keyname.toLowerCase();
+            return this._map[shortcut];
+        };
+
+        Hotkeys.prototype.respondTo = function (subject) {
+            if (typeof subject === 'string') {
+                return this._map[this.constructor.normalize(subject)] != null;
+            } else {
+                return this._getHander(subject) != null;
+            }
+        };
+
+        Hotkeys.prototype.add = function (shortcut, handler) {
+            this._map[this.constructor.normalize(shortcut)] = handler;
+            return this;
+        };
+
+        Hotkeys.prototype.remove = function (shortcut) {
+            delete this._map[this.constructor.normalize(shortcut)];
+            return this;
+        };
+
+        Hotkeys.prototype.destroy = function () {
+            $(this._delegate).off(".simple-hotkeys-" + this.id);
+            this._map = {};
+            return this;
+        };
+
+        return Hotkeys;
+
+    })(SimpleModule);
+
+    hotkeys = function (opts) {
+        return new Hotkeys(opts);
+    };
+
+    return hotkeys;
+
+}));
+

public/js/module.js

@@ -0,0 +1,173 @@
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        // AMD. Register as an anonymous module unless amdModuleId is set
+        define('simple-module', ["jquery"], function (a0) {
+            return (root['Module'] = factory(a0));
+        });
+    } else if (typeof exports === 'object') {
+        // Node. Does not work with strict CommonJS, but
+        // only CommonJS-like environments that support module.exports,
+        // like Node.
+        module.exports = factory(require("jquery"));
+    } else {
+        root['SimpleModule'] = factory(jQuery);
+    }
+}(this, function ($) {
+
+    var Module,
+        slice = [].slice;
+
+    Module = (function () {
+        Module.extend = function (obj) {
+            var key, ref, val;
+            if (!((obj != null) && typeof obj === 'object')) {
+                return;
+            }
+            for (key in obj) {
+                val = obj[key];
+                if (key !== 'included' && key !== 'extended') {
+                    this[key] = val;
+                }
+            }
+            return (ref = obj.extended) != null ? ref.call(this) : void 0;
+        };
+
+        Module.include = function (obj) {
+            var key, ref, val;
+            if (!((obj != null) && typeof obj === 'object')) {
+                return;
+            }
+            for (key in obj) {
+                val = obj[key];
+                if (key !== 'included' && key !== 'extended') {
+                    this.prototype[key] = val;
+                }
+            }
+            return (ref = obj.included) != null ? ref.call(this) : void 0;
+        };
+
+        Module.connect = function (cls) {
+            if (typeof cls !== 'function') {
+                return;
+            }
+            if (!cls.pluginName) {
+                throw new Error('Module.connect: cannot connect plugin without pluginName');
+                return;
+            }
+            cls.prototype._connected = true;
+            if (!this._connectedClasses) {
+                this._connectedClasses = [];
+            }
+            this._connectedClasses.push(cls);
+            if (cls.pluginName) {
+                return this[cls.pluginName] = cls;
+            }
+        };
+
+        Module.prototype.opts = {};
+
+        function Module(opts) {
+            var base, cls, i, instance, instances, len, name;
+            this.opts = $.extend({}, this.opts, opts);
+            (base = this.constructor)._connectedClasses || (base._connectedClasses = []);
+            instances = (function () {
+                var i, len, ref, results;
+                ref = this.constructor._connectedClasses;
+                results = [];
+                for (i = 0, len = ref.length; i < len; i++) {
+                    cls = ref[i];
+                    name = cls.pluginName.charAt(0).toLowerCase() + cls.pluginName.slice(1);
+                    if (cls.prototype._connected) {
+                        cls.prototype._module = this;
+                    }
+                    results.push(this[name] = new cls());
+                }
+                return results;
+            }).call(this);
+            if (this._connected) {
+                this.opts = $.extend({}, this.opts, this._module.opts);
+            } else {
+                this._init();
+                for (i = 0, len = instances.length; i < len; i++) {
+                    instance = instances[i];
+                    if (typeof instance._init === "function") {
+                        instance._init();
+                    }
+                }
+            }
+            this.trigger('initialized');
+        }
+
+        Module.prototype._init = function () {
+        };
+
+        Module.prototype.on = function () {
+            var args, ref;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            (ref = $(this)).on.apply(ref, args);
+            return this;
+        };
+
+        Module.prototype.one = function () {
+            var args, ref;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            (ref = $(this)).one.apply(ref, args);
+            return this;
+        };
+
+        Module.prototype.off = function () {
+            var args, ref;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            (ref = $(this)).off.apply(ref, args);
+            return this;
+        };
+
+        Module.prototype.trigger = function () {
+            var args, ref;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            (ref = $(this)).trigger.apply(ref, args);
+            return this;
+        };
+
+        Module.prototype.triggerHandler = function () {
+            var args, ref;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            return (ref = $(this)).triggerHandler.apply(ref, args);
+        };
+
+        Module.prototype._t = function () {
+            var args, ref;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            return (ref = this.constructor)._t.apply(ref, args);
+        };
+
+        Module._t = function () {
+            var args, key, ref, result;
+            key = arguments[0], args = 2 <= arguments.length ? slice.call(arguments, 1) : [];
+            result = ((ref = this.i18n[this.locale]) != null ? ref[key] : void 0) || '';
+            if (!(args.length > 0)) {
+                return result;
+            }
+            result = result.replace(/([^%]|^)%(?:(\d+)\$)?s/g, function (p0, p, position) {
+                if (position) {
+                    return p + args[parseInt(position) - 1];
+                } else {
+                    return p + args.shift();
+                }
+            });
+            return result.replace(/%%s/g, '%s');
+        };
+
+        Module.i18n = {
+            'zh-CN': {}
+        };
+
+        Module.locale = 'zh-CN';
+
+        return Module;
+
+    })();
+
+    return Module;
+
+}));

public/js/uploader.js

@@ -0,0 +1,274 @@
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        // AMD. Register as an anonymous module unless amdModuleId is set
+        define('simple-uploader', ["jquery", "simple-module"], function ($, SimpleModule) {
+            return (root['uploader'] = factory($, SimpleModule));
+        });
+    } else if (typeof exports === 'object') {
+        // Node. Does not work with strict CommonJS, but
+        // only CommonJS-like environments that support module.exports,
+        // like Node.
+        module.exports = factory(require("jquery"), require("simple-module"));
+    } else {
+        root.simple = root.simple || {};
+        root.simple['uploader'] = factory(jQuery, SimpleModule);
+    }
+}(this, function ($, SimpleModule) {
+
+    var Uploader, uploader,
+        extend = function (child, parent) {
+            for (var key in parent) {
+                if (hasProp.call(parent, key)) child[key] = parent[key];
+            }
+
+            function ctor() {
+                this.constructor = child;
+            }
+
+            ctor.prototype = parent.prototype;
+            child.prototype = new ctor();
+            child.__super__ = parent.prototype;
+            return child;
+        },
+        hasProp = {}.hasOwnProperty;
+
+    Uploader = (function (superClass) {
+        extend(Uploader, superClass);
+
+        function Uploader() {
+            return Uploader.__super__.constructor.apply(this, arguments);
+        }
+
+        Uploader.count = 0;
+
+        Uploader.prototype.opts = {
+            url: '',
+            params: null,
+            fileKey: 'upload_file',
+            connectionCount: 3
+        };
+
+        Uploader.prototype._init = function () {
+            this.files = [];
+            this.queue = [];
+            this.id = ++Uploader.count;
+            this.on('uploadcomplete', (function (_this) {
+                return function (e, file) {
+                    _this.files.splice($.inArray(file, _this.files), 1);
+                    if (_this.queue.length > 0 && _this.files.length < _this.opts.connectionCount) {
+                        return _this.upload(_this.queue.shift());
+                    } else if (_this.files.length === 0) {
+                        return _this.uploading = false;
+                    }
+                };
+            })(this));
+            return $(window).on('beforeunload.uploader-' + this.id, (function (_this) {
+                return function (e) {
+                    if (!_this.uploading) {
+                        return;
+                    }
+                    e.originalEvent.returnValue = _this._t('leaveConfirm');
+                    return _this._t('leaveConfirm');
+                };
+            })(this));
+        };
+
+        Uploader.prototype.generateId = (function () {
+            var id;
+            id = 0;
+            return function () {
+                return id += 1;
+            };
+        })();
+
+        Uploader.prototype.upload = function (file, opts) {
+            var f, i, key, len;
+            if (opts == null) {
+                opts = {};
+            }
+            if (file == null) {
+                return;
+            }
+            if ($.isArray(file) || file instanceof FileList) {
+                for (i = 0, len = file.length; i < len; i++) {
+                    f = file[i];
+                    this.upload(f, opts);
+                }
+            } else if ($(file).is('input:file')) {
+                key = $(file).attr('name');
+                if (key) {
+                    opts.fileKey = key;
+                }
+                this.upload($.makeArray($(file)[0].files), opts);
+            } else if (!file.id || !file.obj) {
+                file = this.getFile(file);
+            }
+            if (!(file && file.obj)) {
+                return;
+            }
+            $.extend(file, opts);
+            if (this.files.length >= this.opts.connectionCount) {
+                this.queue.push(file);
+                return;
+            }
+            if (this.triggerHandler('beforeupload', [file]) === false) {
+                return;
+            }
+            this.files.push(file);
+            this._xhrUpload(file);
+            return this.uploading = true;
+        };
+
+        Uploader.prototype.getFile = function (fileObj) {
+            var name, ref, ref1;
+            if (fileObj instanceof window.File || fileObj instanceof window.Blob) {
+                name = (ref = fileObj.fileName) != null ? ref : fileObj.name;
+            } else {
+                return null;
+            }
+            return {
+                id: this.generateId(),
+                url: this.opts.url,
+                params: this.opts.params,
+                fileKey: this.opts.fileKey,
+                name: name,
+                size: (ref1 = fileObj.fileSize) != null ? ref1 : fileObj.size,
+                ext: name ? name.split('.').pop().toLowerCase() : '',
+                obj: fileObj
+            };
+        };
+
+        Uploader.prototype._xhrUpload = function (file) {
+            var formData, k, ref, v;
+            formData = new FormData();
+            formData.append(file.fileKey, file.obj);
+            formData.append("original_filename", file.name);
+            if (file.params) {
+                ref = file.params;
+                for (k in ref) {
+                    v = ref[k];
+                    formData.append(k, v);
+                }
+            }
+            return file.xhr = $.ajax({
+                url: file.url,
+                data: formData,
+                processData: false,
+                contentType: false,
+                type: 'POST',
+                headers: {
+                    'X-File-Name': encodeURIComponent(file.name)
+                },
+                xhr: function () {
+                    var req;
+                    req = $.ajaxSettings.xhr();
+                    if (req) {
+                        req.upload.onprogress = (function (_this) {
+                            return function (e) {
+                                return _this.progress(e);
+                            };
+                        })(this);
+                    }
+                    return req;
+                },
+                progress: (function (_this) {
+                    return function (e) {
+                        if (!e.lengthComputable) {
+                            return;
+                        }
+                        return _this.trigger('uploadprogress', [file, e.loaded, e.total]);
+                    };
+                })(this),
+                error: (function (_this) {
+                    return function (xhr, status, err) {
+                        return _this.trigger('uploaderror', [file, xhr, status]);
+                    };
+                })(this),
+                success: (function (_this) {
+                    return function (result) {
+                        _this.trigger('uploadprogress', [file, file.size, file.size]);
+                        _this.trigger('uploadsuccess', [file, result]);
+                        return $(document).trigger('uploadsuccess', [file, result, _this]);
+                    };
+                })(this),
+                complete: (function (_this) {
+                    return function (xhr, status) {
+                        return _this.trigger('uploadcomplete', [file, xhr.responseText]);
+                    };
+                })(this)
+            });
+        };
+
+        Uploader.prototype.cancel = function (file) {
+            var f, i, len, ref;
+            if (!file.id) {
+                ref = this.files;
+                for (i = 0, len = ref.length; i < len; i++) {
+                    f = ref[i];
+                    if (f.id === file * 1) {
+                        file = f;
+                        break;
+                    }
+                }
+            }
+            this.trigger('uploadcancel', [file]);
+            if (file.xhr) {
+                file.xhr.abort();
+            }
+            return file.xhr = null;
+        };
+
+        Uploader.prototype.readImageFile = function (fileObj, callback) {
+            var fileReader, img;
+            if (!$.isFunction(callback)) {
+                return;
+            }
+            img = new Image();
+            img.onload = function () {
+                return callback(img);
+            };
+            img.onerror = function () {
+                return callback();
+            };
+            if (window.FileReader && FileReader.prototype.readAsDataURL && /^image/.test(fileObj.type)) {
+                fileReader = new FileReader();
+                fileReader.onload = function (e) {
+                    return img.src = e.target.result;
+                };
+                return fileReader.readAsDataURL(fileObj);
+            } else {
+                return callback();
+            }
+        };
+
+        Uploader.prototype.destroy = function () {
+            var file, i, len, ref;
+            this.queue.length = 0;
+            ref = this.files;
+            for (i = 0, len = ref.length; i < len; i++) {
+                file = ref[i];
+                this.cancel(file);
+            }
+            $(window).off('.uploader-' + this.id);
+            return $(document).off('.uploader-' + this.id);
+        };
+
+        Uploader.i18n = {
+            'zh-CN': {
+                leaveConfirm: '正在上传文件，如果离开上传会自动取消'
+            }
+        };
+
+        Uploader.locale = 'zh-CN';
+
+        return Uploader;
+
+    })(SimpleModule);
+
+    uploader = function (opts) {
+        return new Uploader(opts);
+    };
+
+    return uploader;
+
+}));

resources/views/layouts/_header.blade.php

@@ -39,6 +39,12 @@
                     <li><a href="{{route('login')}}">登录</a></li>
                     <li><a href="{{route('register')}}">注册</a></li>
                 @else
+                    <li>
+                        <a href="{{ route('topics.create') }}">
+                            <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
+                        </a>
+                    </li>
+
                     <li class="dropdown">
                         <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
                             <span class="user-avatar pull-left" style="margin-right:8px; margin-top:-5px;">

resources/views/layouts/app.blade.php

@@ -12,6 +12,9 @@
 
     <!-- Styles -->
     <link href="{{ asset('css/app.css') }}" rel="stylesheet">
+    @yield('styles')
+
+
 </head>
 
 <body>
@@ -30,5 +33,6 @@
 
 <!-- Scripts -->
 <script src="{{ asset('js/app.js') }}"></script>
+@yield('scripts')
 </body>
 </html>

resources/views/topics/_sidebar.blade.php

@@ -1,3 +1,8 @@
 <div class="panel panel-default">
-    <div class="panel-body"> 右边导航栏</div>
+    <div class="panel-body">
+        <a href="{{ route('topics.create') }}" class="btn btn-success btn-block"
+           aria-label="Left Align">
+            <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span> 新建帖子
+        </a>
+    </div>
 </div>

resources/views/topics/create_and_edit.blade.php

@@ -1,25 +1,42 @@
 @extends('layouts.app')
+@section('styles')
+    <link rel="stylesheet" type="text/css" href="{{ asset('css/simditor.css') }}">
+@stop
+@section('scripts')
+    <script type="text/javascript" src="{{ asset('js/module.js') }}"></script>
+    <script type="text/javascript" src="{{ asset('js/hotkeys.js') }}"></script>
+    <script type="text/javascript" src="{{ asset('js/uploader.js') }}"></script>
+    <script type="text/javascript" src="{{ asset('js/simditor.js') }}"></script>
 
+    <script>
+        $(document).ready(function () {
+            var editor = new Simditor({
+                textarea: $('#editor')
+            });
+        });
+    </script>
+
+@stop
 @section('content')
 
     <div class="container">
         <div class="col-md-10 col-md-offset-1">
             <div class="panel panel-default">
 
-                <div class="panel-heading">
-                    <h1>
-                        <i class="glyphicon glyphicon-edit"></i> Topic /
-                        @if($topic->id)
-                            Edit #{{$topic->id}}
-                        @else
-                            Create
-                        @endif
-                    </h1>
-                </div>
-
-                @include('common.error')
-
                 <div class="panel-body">
+                    <h2 class="text-center">
+                        <i class="glyphicon glyphicon-edit"></i>
+                        @if($topic->id)
+                            编辑话题
+                        @else
+                            新建话题
+                        @endif
+                    </h2>
+
+                    <hr>
+
+                    @include('common.error')
+
                     @if($topic->id)
                         <form action="{{ route('topics.update', $topic->id) }}" method="POST" accept-charset="UTF-8">
                             <input type="hidden" name="_method" value="PUT">
@@ -27,67 +44,31 @@
                                 <form action="{{ route('topics.store') }}" method="POST" accept-charset="UTF-8">
                                     @endif
 
-                                    <input type="hidden" name="_token" value="{{ csrf_token() }}">
+                                    {{csrf_field()}}
-
+                                    <div class="form-group">
+                                        <input class="form-control" type="text" name="title"
+                                               value="{{ old('title', $topic->title ) }}" placeholder="请填写标题" required/>
+                                    </div>
 
                                     <div class="form-group">
-                                        <label for="title-field">"title</label>
+                                        <select class="form-control" name="category_id" required>
-                                        <input class="form-control" type="text" name="title" id=title-field"
+                                            <option value="" hidden disabled selected>请选择分类</option>
-                                               value="{{ old('"title', $topic->title ) }}"/>
+                                            @foreach ($categories as $value)
+                                                <option value="{{ $value->id }}">{{ $value->name }}</option>
+                                            @endforeach
+                                        </select>
                                     </div>
+
                                     <div class="form-group">
-                                        <label for="body-field">Body</label>
+                                <textarea name="body" class="form-control" id="editor" rows="3"
-                                        <textarea name="body" id="body-field" class="form-control"
+                                          placeholder="请填入至少三个字符的内容。"
-                                                  rows="3">{{ old('body', $topic->body ) }}</textarea>
+                                          required>{{ old('body', $topic->body ) }}</textarea>
-                                    </div>
-                                    <div class="form-group">
-                                        <label for="user_id-field">User_id</label>
-                                        <input class="form-control" type="text" name="user_id" id="user_id-field"
-                                               value="{{ old('user_id', $topic->user_id ) }}"/>
-                                    </div>
-                                    <div class="form-group">
-                                        <label for="category_id-field">Category_id</label>
-                                        <input class="form-control" type="text" name="category_id"
-                                               id="category_id-field"
-                                               value="{{ old('category_id', $topic->category_id ) }}"/>
-                                    </div>
-                                    <div class="form-group">
-                                        <label for="reply_count-field">Reply_count</label>
-                                        <input class="form-control" type="text" name="reply_count"
-                                               id="reply_count-field"
-                                               value="{{ old('reply_count', $topic->reply_count ) }}"/>
-                                    </div>
-                                    <div class="form-group">
-                                        <label for="view_count-field">View_count</label>
-                                        <input class="form-control" type="text" name="view_count" id="view_count-field"
-                                               value="{{ old('view_count', $topic->view_count ) }}"/>
-                                    </div>
-                                    <div class="form-group">
-                                        <label for="last_reply_user_id-field">Last_reply_user_id</label>
-                                        <input class="form-control" type="text" name="last_reply_user_id"
-                                               id="last_reply_user_id-field"
-                                               value="{{ old('last_reply_user_id', $topic->last_reply_user_id ) }}"/>
-                                    </div>
-                                    <div class="form-group">
-                                        <label for="order-field">Order</label>
-                                        <input class="form-control" type="text" name="order" id="order-field"
-                                               value="{{ old('order', $topic->order ) }}"/>
-                                    </div>
-                                    <div class="form-group">
-                                        <label for="excerpt-field">Excerpt</label>
-                                        <textarea name="excerpt" id="excerpt-field" class="form-control"
-                                                  rows="3">{{ old('excerpt', $topic->excerpt ) }}</textarea>
-                                    </div>
-                                    <div class="form-group">
-                                        <label for="slug-field">Slug</label>
-                                        <input class="form-control" type="text" name="slug" id="slug-field"
-                                               value="{{ old('slug', $topic->slug ) }}"/>
                                     </div>
 
                                     <div class="well well-sm">
-                                        <button type="submit" class="btn btn-primary">Save</button>
+                                        <button type="submit" class="btn btn-primary"><span
-                                        <a class="btn btn-link pull-right" href="{{ route('topics.index') }}"><i
+                                                    class="glyphicon glyphicon-ok" aria-hidden="true"></span> 保存
-                                                    class="glyphicon glyphicon-backward"></i> Back</a>
+                                        </button>
                                     </div>
                                 </form>
                 </div>
@@ -95,4 +76,4 @@
         </div>
     </div>
 
-@endsection
+@endsection

webpack.mix.js

@@ -12,4 +12,6 @@ let mix = require('laravel-mix');
  */
 
 mix.js('resources/assets/js/app.js', 'public/js')
-    .sass('resources/assets/sass/app.scss', 'public/css');
+    .sass('resources/assets/sass/app.scss', 'public/css')
+    .copyDirectory('resources/assets/editor/js', 'public/js')
+    .copyDirectory('resources/assets/editor/css', 'public/css');