Browse Source

数据统计卡片

jqh 5 years ago
parent
commit
8035517af7

+ 11 - 11
src/Widgets/ApexCharts/Chart.php

@@ -3,13 +3,13 @@
 namespace Dcat\Admin\Widgets\ApexCharts;
 
 use Dcat\Admin\Support\Helper;
-use Dcat\Admin\Traits\FromApi;
+use Dcat\Admin\Traits\InteractsWithApi;
 use Dcat\Admin\Widgets\Widget;
 use Illuminate\Support\Str;
 
 class Chart extends Widget
 {
-    use FromApi;
+    use InteractsWithApi;
 
     public static $js = '@apex-charts';
 
@@ -248,15 +248,15 @@ if (! response.status) {
     return Dcat.error(response.message || 'Server internal error.');
 }
 
-var container = $(response.selector || '{$this->containerSelector}'), extend = {$this->buildExtendOptionsScript()};
+var chartBox = $(response.selector || '{$this->containerSelector}'), extend = {$this->buildExtendOptionsScript()};
 
-container.html('');
-
-setTimeout(function () {
-    var chart = new ApexCharts(container[0], $.extend(response.options, extend(response.options)));
+if (chartBox.length) {
+    chartBox.html('');
     
-    chart.render();
-}, 50);
+    setTimeout(function () {
+        new ApexCharts(chartBox[0], $.extend(response.options, extend(response.options))).render();
+    }, 50);
+}
 JS
         );
 
@@ -313,11 +313,11 @@ HTML;
     }
 
     /**
-     * 返回请求结果.
+     * 返回API请求结果.
      *
      * @return array
      */
-    public function result()
+    public function valueResult()
     {
         return [
             'status'   => 1,

+ 3 - 3
src/Widgets/Chart/Chart.php

@@ -4,7 +4,7 @@ namespace Dcat\Admin\Widgets\Chart;
 
 use Dcat\Admin\Admin;
 use Dcat\Admin\Widgets\Color;
-use Dcat\Admin\Traits\FromApi;
+use Dcat\Admin\Traits\InteractsWithApi;
 use Dcat\Admin\Widgets\Widget;
 use Illuminate\Support\Str;
 
@@ -18,7 +18,7 @@ use Illuminate\Support\Str;
  */
 abstract class Chart extends Widget
 {
-    use FromApi;
+    use InteractsWithApi;
 
     public static $js = '@chartjs';
 
@@ -493,7 +493,7 @@ HTML;
     /**
      * @return \Illuminate\Http\JsonResponse
      */
-    public function result()
+    public function valueResult()
     {
         return $this->toJsonResponse();
     }

+ 34 - 30
src/Widgets/Metrics/Card.php

@@ -5,13 +5,13 @@ namespace Dcat\Admin\Widgets\Metrics;
 use Dcat\Admin\Admin;
 use Dcat\Admin\Support\Helper;
 use Dcat\Admin\Widgets\ApexCharts\Chart;
-use Dcat\Admin\Traits\FromApi;
+use Dcat\Admin\Traits\InteractsWithApi;
 use Dcat\Admin\Widgets\Widget;
 use Illuminate\Support\Str;
 
 class Card extends Widget
 {
-    use FromApi;
+    use InteractsWithApi;
 
     /**
      * @var string
@@ -95,31 +95,6 @@ class Card extends Widget
         return $this->chart ?: ($this->chart = Chart::make());
     }
 
-    /**
-     * 设置图表.
-     */
-    protected function setUpChart()
-    {
-        if (! $chart = $this->chart) {
-            return;
-        }
-
-        // 设置图表高度
-        $this->chartOptions['chart']['height'] = $this->chartHeight;
-
-        // 颜色
-        if (empty($this->chartOptions['colors'])) {
-            $this->chartOptions['colors'] = (array) Admin::color()->get($this->style);
-        }
-
-        // 图表配置选项
-        $chart->options($this->chartOptions);
-
-        if ($callback = $this->chartCallback) {
-            $callback($chart);
-        }
-    }
-
     /**
      * 设置图标.
      *
@@ -291,6 +266,31 @@ class Card extends Widget
         return $this;
     }
 
+    /**
+     * 设置图表.
+     */
+    protected function setUpChart()
+    {
+        if (! $chart = $this->chart) {
+            return;
+        }
+
+        // 设置图表高度
+        $this->chartOptions['chart']['height'] = $this->chartHeight;
+
+        // 颜色
+        if (empty($this->chartOptions['colors'])) {
+            $this->chartOptions['colors'] = (array) Admin::color()->get($this->style);
+        }
+
+        // 图表配置选项
+        $chart->options($this->chartOptions);
+
+        if ($callback = $this->chartCallback) {
+            $callback($chart);
+        }
+    }
+
     /**
      * @return mixed
      */
@@ -341,6 +341,8 @@ JS;
     }
 
     /**
+     * 渲染卡片头部内容.
+     *
      * @return string
      */
     public function renderHeader()
@@ -349,6 +351,8 @@ JS;
     }
 
     /**
+     * 渲染卡片主体内容.
+     *
      * @return string
      */
     public function renderContent()
@@ -383,11 +387,11 @@ JS;
     }
 
     /**
-     * 返回卡片数据结果.
+     * 返回API请求结果.
      *
      * @return array
      */
-    public function result()
+    public function valueResult()
     {
         $this->setUpChart();
 
@@ -397,7 +401,7 @@ JS;
                 'header'  => $this->renderHeader(),
                 'content' => $this->renderContent(),
             ],
-            (array) optional($this->chart)->result()
+            (array) optional($this->chart)->valueResult()
         );
     }
 }

+ 2 - 4
src/Widgets/Metrics/RadialBarCard.php

@@ -4,13 +4,11 @@ namespace Dcat\Admin\Widgets\Metrics;
 
 use Dcat\Admin\Admin;
 use Dcat\Admin\Support\Helper;
-use Dcat\Admin\Traits\FromApi;
+use Dcat\Admin\Traits\InteractsWithApi;
 use Illuminate\Contracts\Support\Renderable;
 
 class RadialBarCard extends Card
 {
-    use FromApi;
-
     /**
      * @var array
      */
@@ -26,7 +24,7 @@ class RadialBarCard extends Card
     /**
      * @var int
      */
-    protected $chartHeight = 200;
+    protected $chartHeight = 150;
 
     /**
      * 图表默认配置.

+ 2 - 2
src/Widgets/Sparkline/Sparkline.php

@@ -3,7 +3,7 @@
 namespace Dcat\Admin\Widgets\Sparkline;
 
 use Dcat\Admin\Admin;
-use Dcat\Admin\Traits\FromApi;
+use Dcat\Admin\Traits\InteractsWithApi;
 use Dcat\Admin\Widgets\Widget;
 use Illuminate\Contracts\Support\Arrayable;
 use Illuminate\Support\Str;
@@ -22,7 +22,7 @@ use Illuminate\Support\Str;
  */
 class Sparkline extends Widget
 {
-    use FromApi;
+    use InteractsWithApi;
 
     public static $js = '@jquery.sparkline';
     public static $css = '@jquery.sparkline';