调整部分方法命名以及异步渲染表格功能完善

resources/assets/dcat/js/Dcat.js

@@ -4,7 +4,7 @@ import Translator from './extensions/Translator'
 
 let $ = jQuery,
     $document = $(document),
-    pjaxResponded = false,
+    waiting = false,
     bootingCallbacks = [],
     actions = {},
     initialized = {},
@@ -81,7 +81,7 @@ export default class Dcat {
         let _this = this;
 
         if (! _window || _window === window) {
-            if (! pjaxResponded) {
+            if (! waiting) {
                 return $(callback);
             }
 
@@ -147,7 +147,7 @@ export default class Dcat {
             initialized[selector].disconnect();
         }
 
-        $(document).trigger('init:off', selector, initialized[selector])
+        $(document).trigger('dcat:init:off', selector, initialized[selector])
 
         initialized[selector] = null;
     }
@@ -156,7 +156,7 @@ export default class Dcat {
      * 主动触发 ready 事件
      */
     triggerReady() {
-        if (! pjaxResponded) {
+        if (! waiting) {
             return;
         }
 
@@ -166,14 +166,14 @@ export default class Dcat {
     }
 
     /**
-     * 如果是 pjax 响应的页面，需要调用此方法
+     * 等待JS脚本加载完成
      *
      * @returns {Dcat}
      */
-    pjaxResponded(value) {
-        pjaxResponded = value !== false;
+    wait(value) {
+        waiting = value !== false;
 
-        $document.trigger('pjax:responded');
+        $document.trigger('dcat:waiting');
 
         return this
     }

resources/assets/dcat/js/extensions/AssetsLoader.js

@@ -1,98 +1,98 @@
-
-export default class AssetsLoader {
-    constructor(Dcat) {
-        let _this = this;
-
-        _this.dcat = Dcat;
-
-        Dcat.assets = {
-            // 加载js脚本，并触发 ready 事件
-            load: _this.load.bind(_this),
-
-            // 从给定的内容中过滤"<script>"标签内容，并自动加载其中的js脚本
-            resolveHtml: _this.resolveHtml.bind(_this)
-        };
-    }
-
-
-    // 按顺序加载静态资源
-    // 并在所有静态资源加载完毕后执行回调函数
-    load(urls, callback, args) {
-        let _this = this;
-        if (urls.length < 1) {
-            (! callback) || callback(args);
-
-            _this.fire();
-            return;
-        }
-
-        seajs.use([urls.shift()], function () {
-            _this.load(urls, callback, args);
-        });
-    }
-    
-    // 过滤 <script src> 标签
-    filterScripts(content) {
-        var obj = {};
-
-        if (typeof content == 'string') {
-            content = $(content);
-        }
-
-        obj.scripts = this.findAll(content, 'script[src]').remove();
-        obj.contents = content.not(obj.scripts);
-
-        obj.contents.render = this.toString;
-        obj.js = (function () {
-            var urls = [];
-            obj.scripts.each(function (k, v) {
-                if (v.src) {
-                    urls.push(v.src);
-                }
-            });
-
-            return urls;
-        })();
-
-        return obj;
-    }
-    
-    // 返回过滤 <script src> 标签后的内容，并在加载完 script 脚本后触发 "pjax:script" 事件
-    resolveHtml(content, callback) {
-        var obj = this.filterScripts(content);
-
-        this.load(obj.js, function () {
-            (!callback) || callback(obj.contents);
-        });
-
-        return obj.contents;
-    }
-
-    findAll($el, selector) {
-        if (typeof $el === 'string') {
-            $el = $($el);
-        }
-
-        return $el.filter(selector).add($el.find(selector));
-    }
-
-    fire() {
-        this.dcat.pjaxResponded();
-
-        // js加载完毕 触发 ready 事件
-        // setTimeout用于保证在所有js代码最后执行
-        setTimeout(this.dcat.triggerReady, 1);
-    }
-
-    toString(th) {
-        var html = '', out;
-
-        this.each(function (k, v) {
-            if ((out = v.outerHTML)) {
-                html += out;
-            }
-        });
-
-        return html;
-    }
-}
+
+export default class AssetsLoader {
+    constructor(Dcat) {
+        let _this = this;
+
+        _this.dcat = Dcat;
+
+        Dcat.assets = {
+            // 加载js脚本，并触发 ready 事件
+            load: _this.load.bind(_this),
+
+            // 从给定的内容中过滤"<script>"标签内容，并自动加载其中的js脚本
+            resolveHtml: _this.resolveHtml.bind(_this)
+        };
+    }
+
+
+    // 按顺序加载静态资源
+    // 并在所有静态资源加载完毕后执行回调函数
+    load(urls, callback, args) {
+        let _this = this;
+        if (urls.length < 1) {
+            (! callback) || callback(args);
+
+            _this.fire();
+            return;
+        }
+
+        seajs.use([urls.shift()], function () {
+            _this.load(urls, callback, args);
+        });
+    }
+
+    // 过滤 <script src> 标签
+    filterScripts(content) {
+        var obj = {};
+
+        if (typeof content == 'string') {
+            content = $(content);
+        }
+
+        obj.scripts = this.findAll(content, 'script[src]').remove();
+        obj.contents = content.not(obj.scripts);
+
+        obj.contents.render = this.toString;
+        obj.js = (function () {
+            var urls = [];
+            obj.scripts.each(function (k, v) {
+                if (v.src) {
+                    urls.push(v.src);
+                }
+            });
+
+            return urls;
+        })();
+
+        return obj;
+    }
+
+    // 返回过滤 <script src> 标签后的内容，并在加载完 script 脚本后触发 "pjax:script" 事件
+    resolveHtml(content, callback) {
+        var obj = this.filterScripts(content);
+
+        this.load(obj.js, function () {
+            (!callback) || callback(obj.contents);
+        });
+
+        return obj.contents;
+    }
+
+    findAll($el, selector) {
+        if (typeof $el === 'string') {
+            $el = $($el);
+        }
+
+        return $el.filter(selector).add($el.find(selector));
+    }
+
+    fire() {
+        this.dcat.wait();
+
+        // js加载完毕 触发 ready 事件
+        // setTimeout用于保证在所有js代码最后执行
+        setTimeout(this.dcat.triggerReady, 1);
+    }
+
+    toString(th) {
+        var html = '', out;
+
+        this.each(function (k, v) {
+            if ((out = v.outerHTML)) {
+                html += out;
+            }
+        });
+
+        return html;
+    }
+}

resources/views/layouts/content.blade.php

@@ -49,7 +49,7 @@
 @else
     <title>{{ Dcat\Admin\Admin::title() }} @if($header) | {{ $header }}@endif</title>
 
-    <script>Dcat.pjaxResponded()</script>
+    <script>Dcat.wait()</script>
 
     {!! Dcat\Admin\Admin::asset()->cssToHtml() !!}
     {!! Dcat\Admin\Admin::asset()->jsToHtml() !!}

resources/views/layouts/form-content.blade.php

@@ -1,4 +1,4 @@
-<script>Dcat.pjaxResponded();</script>
+<script>Dcat.wait();</script>
 
 <style>
     .form-content .row {

resources/views/layouts/full-content.blade.php

@@ -32,7 +32,7 @@
 @else
     <title>{{ Dcat\Admin\Admin::title() }} @if($header) | {{ $header }}@endif</title>
 
-    <script>Dcat.pjaxResponded();</script>
+    <script>Dcat.wait();</script>
 
     {!! Dcat\Admin\Admin::asset()->cssToHtml() !!}
     {!! Dcat\Admin\Admin::asset()->jsToHtml() !!}

src/Admin.php

@@ -381,11 +381,11 @@ class Admin
     }
 
     /**
-     * 输入直接渲染的内容.
+     * 中断默认的渲染逻辑.
      *
-     * @param mixed $value
+     * @param string|\Illuminate\Contracts\Support\Renderable|\Closure $value
      */
-    public static function content($value)
+    public static function prevent($value)
     {
         if ($value !== null) {
             static::context()->add('contents', $value);
@@ -395,7 +395,7 @@ class Admin
     /**
      * @return bool
      */
-    public static function hasContents()
+    public static function shouldPrevent()
     {
         return count(static::context()->getArray('contents')) > 0;
     }
@@ -407,33 +407,32 @@ class Admin
      */
     public static function renderContents()
     {
-        if (! static::hasContents()) {
+        if (! static::shouldPrevent()) {
             return;
         }
 
-        $contents = static::context()->getArray('contents');
-
         $results = '';
 
-        foreach ($contents as $content) {
+        foreach (static::context()->getArray('contents') as $content) {
             $results .= Helper::render($content);
         }
 
-        static::script('Dcat.pjaxResponded()', true);
+        // 等待JS脚本加载完成
+        static::script('Dcat.wait()', true);
 
         $asset = static::asset();
 
         static::baseCss([], false);
         static::baseJs([], false);
         static::headerJs([], false);
+        static::fonts([]);
 
-        $results .= static::html()
+        return $results
+            .static::html()
             .$asset->jsToHtml()
             .$asset->cssToHtml()
             .$asset->scriptToHtml()
             .$asset->styleToHtml();
-
-        return $results;
     }
 
     /**

src/Grid.php

@@ -1022,15 +1022,10 @@ HTML;
     public function render()
     {
         $this->callComposing();
-
         $this->build();
-
         $this->applyFixColumns();
-
         $this->setUpOptions();
-
         $this->addFilterScript();
-
         $this->addScript();
 
         return $this->doWrap();
@@ -1052,13 +1047,21 @@ HTML;
             $url = Helper::fullUrlWithoutQuery(['_pjax']);
             $url = Helper::urlWithQuery($url, [static::ASYNC_NAME => 1]);
 
+            $options = [
+                'selector'  => ".async-{$this->getTableId()}",
+                'queryName' => $query,
+                'url'       => $url,
+            ];
+
+            if ($this->hasFixColumns()) {
+                $options['loadingStyle'] = 'height:140px;';
+            }
+
+            $options = json_encode($options);
+
             Admin::script(
                 <<<JS
-Dcat.grid.async({
-    selector: '.async-{$this->getTableId()}',
-    queryName: '{$query}',
-    url: '{$url}',
-}).render()
+Dcat.grid.async({$options}).render()
 JS
             );
         }
@@ -1110,4 +1113,9 @@ JS
 
         return $this->addColumn($method, $arguments[0] ?? null);
     }
+
+    public function __toString()
+    {
+        return $this->render();
+    }
 }

src/Grid/Displayers/ContextMenuActions.php

@@ -6,25 +6,26 @@ use Dcat\Admin\Admin;
 
 class ContextMenuActions extends DropdownActions
 {
-    /**
-     * {@inheritdoc}
-     */
+    protected $elementId = 'grid-context-menu';
+
     protected function addScript()
     {
         $script = <<<JS
 (function () {
-    $("body").on("contextmenu", "table#{$this->grid->getTableId()} tr", function(e) {
-         $('#grid-context-menu .dropdown-menu').hide();
-        
+    var id = '#{$this->elementId}';
+
+    $("body").on("contextmenu", "#{$this->grid->getTableId()} tr", function(e) {
+         $(id + ' .dropdown-menu').hide();
+
          var menu = $(this).find('td .grid-dropdown-actions .dropdown-menu');
          var index = $(this).index();
-         
+
          if (menu.length) {
-             menu.attr('index', index).detach().appendTo('#grid-context-menu');
+             menu.attr('index', index).detach().appendTo(id);
          } else {
-             menu = $('#grid-context-menu .dropdown-menu[index='+index+']');
+             menu = $(id + ' .dropdown-menu[index='+index+']');
          }
-         
+
          if (menu.height() > (document.body.clientHeight - e.pageY)) {
             menu.css({left: e.pageX+10, top: e.pageY - menu.height()}).show();
          } else {
@@ -32,13 +33,17 @@ class ContextMenuActions extends DropdownActions
          }
         return false;
     });
-    
+
+    if (! $(id).length) {
+        $("body").append('<div id="{$this->elementId}" class="dropdown" style="display: contents"></div>');
+    }
+
     $(document).on('click',function(){
-        $('#grid-context-menu .dropdown-menu').hide();
+        $(id + ' .dropdown-menu').hide();
     })
-   
-    $('#grid-context-menu').click('a', function () {
-        $('#grid-context-menu .dropdown-menu').hide();
+
+    $(id).click('a', function () {
+        $(this).find('.dropdown-menu').hide();
     });
 })();
 JS;
@@ -46,14 +51,10 @@ JS;
         Admin::script($script);
     }
 
-    /**
-     * {@inheritdoc}
-     */
     public function display($callback = null)
     {
         $this->addScript();
 
-        Admin::html('<div id="grid-context-menu" class="dropdown" style="display: contents"></div>');
         Admin::style('.grid__actions__ .dropdown{display: none!important;} th.grid__actions__{display: none!important;} .grid__actions__{width:1px}');
 
         return parent::display($callback);

src/Http/Controllers/RenderableController.php

@@ -60,7 +60,8 @@ class RenderableController
 
     protected function addScript()
     {
-        Admin::script('Dcat.pjaxResponded()', true);
+        // 等待JS脚本加载完成
+        Admin::script('Dcat.wait()', true);
     }
 
     protected function forgetDefaultAssets()

src/Layout/Column.php

@@ -100,7 +100,7 @@ class Column implements Renderable
 
         foreach ($this->contents as $content) {
             if ($content instanceof Grid && $content->isAsyncRequest()) {
-                Admin::content($content->render());
+                Admin::prevent($content->render());
 
                 continue;
             }

src/Layout/Content.php

@@ -535,7 +535,7 @@ class Content implements Renderable
 
         $this->callComposed();
 
-        if (Admin::hasContents()) {
+        if (Admin::shouldPrevent()) {
             return Admin::renderContents();
         }
 

src/Support/Context.php

@@ -48,7 +48,7 @@ class Context extends Fluent
 
     public function getArray($key, $default = null)
     {
-        return Helper::array($this->get($key, $default));
+        return Helper::array($this->get($key, $default), false);
     }
 
     public function add($key, $value, $k = null)

src/Support/Helper.php

@@ -97,10 +97,6 @@ class Helper
             $value = $value(...(array) $params);
         }
 
-        if ($value instanceof Grid) {
-            return (string) $value->render();
-        }
-
         if ($value instanceof Renderable) {
             return (string) $value->render();
         }