<?php

namespace App\Admin\Metrics;

use App\Models\Episode;
use App\Models\EpisodesList;
use Dcat\Admin\Admin;
use Dcat\Admin\Widgets\Metrics\Donut;

class Episodes extends Donut
{
    protected $labels = ['短剧总数量', '剧集总数量'];

    private $episodeCount     = 0;
    private $episodeListCount = 0;

    /**
     * 初始化卡片内容.
     */
    protected function init()
    {
        parent::init();

        $color  = Admin::color();
        $colors = [$color->primary(), $color->alpha('blue2', 0.5)];

        $this->title('短剧/剧集');
        $this->chartLabels($this->labels);
        // 设置图表颜色
        $this->chartColors($colors);
        $this->episodeCount     = $this->getEpisodeCount();
        $this->episodeListCount = $this->getEpisodeListCount();
    }

    private function getEpisodeCount()
    {
        return Episode::count();
    }

    private function getEpisodeListCount()
    {
        return EpisodesList::count();
    }

    /**
     * 渲染模板
     *
     * @return string
     */
    public function render()
    {
        $this->fill();

        return parent::render();
    }

    /**
     * 写入数据.
     *
     * @return void
     */
    public function fill()
    {
        $this->withContent($this->episodeCount, $this->episodeListCount);

        // 图表数据
        $this->withChart([$this->episodeCount, $this->episodeListCount]);
    }

    /**
     * 设置图表数据.
     *
     * @return $this
     */
    public function withChart(array $data)
    {
        return $this->chart([
            'series' => $data,
        ]);
    }

    /**
     * 设置卡片头部内容.
     *
     * @return $this
     */
    protected function withContent($episode, $episodeList)
    {
        $blue = Admin::color()->alpha('blue2', 0.5);

        $style      = 'margin-bottom: 8px';
        $labelWidth = 120;

        return $this->content(
            <<<HTML
<div class="d-flex pl-1 pr-1 pt-1" style="{$style}">
    <div style="width: {$labelWidth}px">
        <i class="fa fa-circle text-primary"></i> {$this->labels[0]}
    </div>
    <div>{$episode}</div>
</div>
<div class="d-flex pl-1 pr-1" style="{$style}">
    <div style="width: {$labelWidth}px">
        <i class="fa fa-circle" style="color: $blue"></i> {$this->labels[1]}
    </div>
    <div>{$episodeList}</div>
</div>
HTML
        );
    }
}
