优化预报到概览

app/Admin/Controllers/UserFollowOverviewController.php

@@ -2,8 +2,10 @@
 
 namespace App\Admin\Controllers;
 
+use App\Admin\Metrics\Examples\Follow\Ajax\AllCollegesFollowChartsAjax;
 use App\Admin\Metrics\Examples\Follow\AllColleges;
 use App\Admin\Metrics\Examples\Follow\AllCollegesCharts;
+use App\Admin\Metrics\Examples\Follow\AllCollegesFollowCharts;
 use App\Admin\Repositories\UserFollowOverview;
 use App\Models\AdminFollowShow;
 use App\Models\SecondaryCollege;
@@ -15,7 +17,9 @@ use Dcat\Admin\Http\Controllers\AdminController;
 use Dcat\Admin\Layout\Column;
 use Dcat\Admin\Layout\Content;
 use Dcat\Admin\Layout\Row;
+use Dcat\Admin\Widgets\Box;
 use Dcat\Admin\Widgets\Card;
+use Dcat\Admin\Widgets\Dropdown;
 use Illuminate\Http\Request;
 
 class UserFollowOverviewController extends AdminController
@@ -29,10 +33,32 @@ class UserFollowOverviewController extends AdminController
             ->body(function ($row) {
                 $row->column(12, function (Column $column) {
                     $column->row(function (Row $row) {
-                        $row->column(6, Card::make('各学院新生录取统计', AllCollegesCharts::make()));
                         $row->column(6, new AllColleges(['title' => '全校新生录取人数', 'collagesId' => 0]));
                     });
                 });
+                $row->column(12, function (Column $column) {
+                    $column->row(function (Row $row) {
+                        $row->column(6, Card::make('各学院新生录取统计', AllCollegesCharts::make()));
+
+                        $followStatus = [0=>'未联系'];
+                        foreach (UserFollowStatus::query()->pluck('name', 'id')->toArray() as $key => $value) {
+                            $followStatus[$key] = $value;
+                        }
+
+                        $dropdown = Dropdown::make($followStatus)
+                            ->button(current($followStatus))
+                            ->click()
+                            ->map(function ($v, $k) {
+                                return "<a class='switch-bar' data-option='{$k}'>{$v}</a>";
+                            });
+                        $bar = AllCollegesFollowChartsAjax::make()
+                            ->fetching('$("#my-box").loading()')
+                            ->fetched('$("#my-box").loading(false)')
+                            ->click('.switch-bar');
+                        $box = Box::make('各学院新生回访统计', $bar)->id('my-box')->tool($dropdown);
+                        $row->column(6, $box);
+                    });
+                });
             })
             ->body($this->grid());
     }

app/Admin/Metrics/Examples/Follow/Ajax/AllCollegesFollowChartsAjax.php

@@ -0,0 +1,146 @@
+<?php
+
+namespace App\Admin\Metrics\Examples\Follow\Ajax;
+
+use App\Admin\Metrics\Examples\Follow\AllCollegesFollowCharts;
+use App\Models\AdmissionNewStudents;
+use App\Models\SecondaryCollege;
+use App\Models\Speciality;
+use App\Models\UserFollowRecord;
+use App\Models\UsersMember;
+use Dcat\Admin\Support\JavaScript;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\DB;
+
+class AllCollegesFollowChartsAjax extends AllCollegesFollowCharts
+{
+    public function __construct()
+    {
+        parent::__construct();
+    }
+
+    /**
+     * 处理请求
+     * 如果你的图表类中包含此方法，则可以通过此方法处理前端通过ajax提交的获取图表数据的请求
+     * @param Request $request
+     * @return mixed|void
+     */
+    public function handle(Request $request)
+    {
+        $option = $request->input('option');
+        $table1 = UsersMember::query()->getModel()->getTable();
+        $table2 = UserFollowRecord::query()->getModel()->getTable();
+
+        $data = [[
+            'name' => '总人数',
+            'data' => [],
+            'tooltip' => [
+                [
+                    "name" => "男生",
+                    "data" => [],
+                    "color" => '#ff6b6b'
+                ],
+                [
+                    "name" => "女生",
+                    "data" => [],
+                    "color" => "#a21919"
+                ]
+            ]
+        ]];
+
+        $collegeAll = SecondaryCollege::query()->where(["status" => SecondaryCollege::STATUS_YES])->get(["name", "id"])->toArray();
+        $categories = array_column($collegeAll, 'name');
+
+        // 新生数据
+        $studentsIds = AdmissionNewStudents::query()->where(["is_new_student" => "1"])->pluck('idCard')->toArray();
+        foreach ($collegeAll as $key=>$value){
+            $all = DB::table("{$table1} as aa")
+                ->leftJoin("{$table2} as bb", function ($join) {
+                    $join->on("aa.unique_number", "=", "bb.unique_number")->where(["bb.is_abandon" => "1"]);
+                })
+                ->whereIn("aa.idcard", $studentsIds)
+                ->where("aa.enroll_status", 1)
+                ->where(function ($query) use ($value) {
+                    $specialityIds = Speciality::query()->where("secondary_college_id", $value['id'])->pluck('id')->toArray();
+                    $query->whereIn('speciality_id', $specialityIds);
+                })
+                ->where(function ($query) use ($option) {
+                    if (empty($option)) {
+                        $query->whereNull("bb.id");
+                    } else {
+                        $query->where(["bb.follow_id" => $option]);
+                    }
+                })
+                ->select('aa.sex', DB::raw('count(*) as total'))
+                ->groupBy('aa.sex')
+                ->pluck('total', 'sex')
+                ->toArray();
+
+            // 总人数
+            $total = array_sum($all);
+            // 男生
+            $man = $all[1] ?? 0;
+            // 女生
+            $girl = $all[2] ?? 0;
+
+            $data[0]['data'][] = $total;
+            $data[0]['tooltip'][0]['data'][] = $man;
+            $data[0]['tooltip'][1]['data'][] = $girl;
+        }
+        $this->withData($data);
+        $this->option("labels", $categories);
+        $tooltipCustomFunction = <<<JS
+function({ series, seriesIndex, dataPointIndex, w }) {
+
+    let newStr = "";
+    w.config.series[0].tooltip.forEach(item=>{
+        newStr += `<div style="display: flex;padding: 0 10px;align-items: center;margin-top: 8px;">
+                <div style="width:12px;height:12px;border-radius:50%;background-color: \${item.color};margin-right: 10px;">
+
+                </div>
+                <div style="font-size: 12px;">
+                    \${item.name}: \${item.data[dataPointIndex]}
+                </div>
+            </div>`
+    })
+
+    return `
+        <div style=' border: 1px solid #e3e3e3; background: rgba(255, 255, 255, 0.96); border-radius: 5px; box-shadow: 2px 2px 6px -4px #999; font-size: 14px;'>
+            <div style='padding:6px;background: #ECEFF1;border-bottom: 1px solid #ddd;font-size:12px;'>\${w.config.labels[dataPointIndex]}</div>
+            <div style="display: flex;padding: 0 10px;align-items: center; margin-top: 8px;">
+                <div style="width:12px;height:12px;border-radius:50%;background-color: rgb(0, 143, 251);margin-right: 10px;">
+
+                </div>
+                <div style="font-size: 12px;">
+                    \${w.config.series[0].name}: \${w.config.series[0].data[dataPointIndex]}
+                </div>
+            </div>
+            \${newStr}
+        </div>
+    `;
+}
+JS;
+
+        $this->option('tooltip.custom', JavaScript::make($tooltipCustomFunction));
+    }
+
+    /**
+     * 这里返回需要异步传递到 handler 方法的参数
+     *
+     * @return array
+     */
+    public function parameters(): array
+    {
+        return [
+            'id' => $this->id,
+            'username' => $this->username,
+        ];
+    }
+
+    /**
+     * 这里覆写父类的方法，不再查询数据
+     */
+    protected function buildData()
+    {
+    }
+}

app/Admin/Metrics/Examples/Follow/AllCollegesCharts.php

@@ -3,9 +3,7 @@
 namespace App\Admin\Metrics\Examples\Follow;
 
 use App\Models\AdmissionNewStudents;
-use App\Models\CompletedOfflineStep;
 use App\Models\Config;
-use App\Models\OfflineStep;
 use App\Models\SecondaryCollege;
 use App\Models\Speciality;
 use App\Models\UsersMember;
@@ -15,7 +13,7 @@ use Illuminate\Support\Facades\DB;
 
 class AllCollegesCharts extends Chart
 {
-    //各二级学院女生报道率
+    // 各学院新生录取统计
     public function __construct($containerSelector = null, $options = [])
     {
         parent::__construct($containerSelector, $options);
@@ -29,7 +27,7 @@ class AllCollegesCharts extends Chart
     {
         $this->options([
             "chart"=>[
-                "height"=>300, //高度
+                "height"=>330, //高度
                 "type"=>"bar", //chart 类型
             ],
         ]);
@@ -101,7 +99,6 @@ class AllCollegesCharts extends Chart
             }
         }
 
-
         $this->option("series",$data);
         $this->option("labels",$label);
         $this->option("yaxis",["max" => 2000]); //Y轴最大值

app/Admin/Metrics/Examples/Follow/AllCollegesFollowCharts.php

@@ -0,0 +1,86 @@
+<?php
+
+namespace App\Admin\Metrics\Examples\Follow;
+
+use Dcat\Admin\Admin;
+use Dcat\Admin\Widgets\ApexCharts\Chart;
+
+class AllCollegesFollowCharts extends Chart
+{
+    public function __construct($containerSelector = null, $options = [])
+    {
+        parent::__construct($containerSelector, $options);
+
+        $this->setUpOptions();
+    }
+
+    /**
+     * 初始化图表配置
+     */
+    protected function setUpOptions()
+    {
+        $color = Admin::color();
+
+        $colors = [$color->primary(), $color->primaryDarker()];
+
+        $this->options([
+            'colors' => ['#008ffbd9', '#feb019', '#00e396'],
+            'chart' => [
+                'type' => 'bar',
+                "height"=>'315px', //高度
+            ],
+            'plotOptions' => [
+                'bar' => [
+                    'horizontal' => false,
+                    'columnWidth' => '80%',
+                    'borderRadius' => 5,
+                    'borderRadiusApplication' => 'end'
+                ]
+            ],
+            'stroke' => [
+                'show' => false,
+                'width' => 3
+            ],
+            'xaxis' => [
+                'type' => 'category',
+            ],
+            'tooltip' => [
+                'x' => [
+                    'formatter' => function ($val) {
+                        return $val;
+                    }
+                ]
+            ],
+        ]);
+    }
+
+
+    /**
+     * 设置图表数据
+     * @param array $data
+     * @return $this
+     */
+    public function withData(array $data)
+    {
+        return $this->option('series', $data);
+    }
+
+    /**
+     * 设置图表类别.
+     * @param array $data
+     * @return $this
+     */
+    public function withCategories(array $data)
+    {
+        return $this->option('xaxis.categories', $data);
+    }
+
+    /**
+     * 渲染图表
+     * @return string
+     */
+    public function render()
+    {
+        return parent::render();
+    }
+}