leandrocfe / filament-apex-charts Goto Github PK

namespace App\Filament\Widgets;

use Filament\Support\RawJs;
use Illuminate\Support\Facades\Log;
use Leandrocfe\FilamentApexCharts\Widgets\ApexChartWidget;

class RevenueOverview extends ApexChartWidget
{
    /**
     * Chart Id
     *
     * @var string
     */
    protected static ?string $chartId = 'RevenueOverview';

    /**
     * Widget Title
     *
     * @var string|null
     */
    protected static ?string $heading = 'Revenue';

    /**
     * Chart options (series, labels, types, size, animations...)
     * https://apexcharts.com/docs/options
     *
     * @return array
     */
    protected function getOptions(): array
    {
        return [
            'chart' => [
                'type' => 'bar',
                'height' => 300,
                'stacked' => true,
                'toolbar' => [
                    'show' => false,
                ],
            ],
            'dataLabels' => [
                'enabled' => false,
            ],
            'series' => [
                [
                    'name' => 'Earnings',
                    'data' => [70, 43, 68, 103, 141, 73, 57, 92, 102, 159, 130, 184],
                ],
                [
                    'name' => 'Expenses',
                    'data' => [-7, -4, -6, -10, -14, -7, -5, -9, -10, -15, -13, -18],
                ],
            ],
        ];
    }

    protected function extraJsOptions(): ?RawJs
    {
        return RawJs::make(<<<'JS'
        {
            yaxis: {
                labels: {
                    formatter: function (val, index) {
                        return '$' + val
                    }
                }
            }
        }
        JS);
    }
}

public ?string $filter = '2023';

/**
 * Filter Options
 */
protected function getFilters(): ?array
{
    $years = range(now()->year, 2015);

    foreach ($years as $year) {
        $newYears[$year] = $year;
    }

    return $newYears;
}

/**
 * Chart options (series, labels, types, size, animations...)
 * https://apexcharts.com/docs/options
 *
 * @return array
 */
protected function getOptions(): array
{
    $activeFilter = $this->filter;

    $data = Trend::query(Stat::where('type', 'sales')->where('system', 'MY'))
        ->between(
            start: Carbon::create($activeFilter)->startOfYear(),
            end: Carbon::create($activeFilter)->endOfYear(),
        )
        ->perMonth()
        ->sum('data');

    return [

        'chart' => [
            'type' => 'line',
            'height' => 300,
            'toolbar' => [
                'show' => false,
            ],
        ],
        'series' => [
            [
                'name' => 'RM',
                'data' => $data->map(fn (TrendValue $value) => $value->aggregate),
                'type' => 'column',
            ],
        ],
        'stroke' => [
            'width' => [0, 4],
            'curve' => 'smooth',
        ],
        'xaxis' => [
            'categories' => $data->map(fn (TrendValue $value) => Carbon::parse($value->date)->format('M')),
            'labels' => [
                'style' => [
                    'colors' => '#9ca3af',
                    'fontWeight' => 600,
                ],
            ],
        ],
        'yaxis' => [
            'labels' => [
                'style' => [
                    'colors' => '#9ca3af',
                    'fontWeight' => 600,
                ],
            ],
        ],
        'legend' => [
            'labels' => [
                'colors' => '#9ca3af',
                'fontWeight' => 600,
            ],
        ],
        'colors' => ['#6366f1', '#38bdf8'],
        'fill' => [
            'type' => 'gradient',
            'gradient' => [
                'shade' => 'dark',
                'type' => 'vertical',
                'shadeIntensity' => 0.5,
                'gradientToColors' => ['#d946ef'],
                'inverseColors' => true,
                'opacityFrom' => 1,
                'opacityTo' => 1,
                'stops' => [0, 100],
            ],
        ],
        'plotOptions' => [
            'bar' => [
                'borderRadius' => 10,
            ],
        ],
    ];
}

public function data($i)
{
    $stat = new stat;

    return $stat->select('data')
        ->whereBetween('created_at', [now()->firstOfYear()->addMonths($i - 1)->toDateString(), now()->firstOfYear()->addMonths($i - 1)->endOfMonth()->toDateString()])
        ->sum('data');
}

file_get_contents(/app/vendor/leandrocfe/filament-apex-charts/src/CommandsLine.stub): Failed to open stream: No such file or directory

        $path = Str::of(__DIR__)
            ->replace('src/Commands', 'stubs/')

        $path = Str::of(__DIR__.DIRECTORY_SEPARATOR.'..'.DIRECTORY_SEPARATOR.'..'.DIRECTORY_SEPARATOR.'stubs'.DIRECTORY_SEPARATOR)

        $path = Str::of(__DIR__.'../../stubs/')

<?php

namespace App\Filament\Widgets;

use App\Models\Quote;
use Illuminate\Support\Carbon;
use Filament\Forms\Components\DatePicker;
use Leandrocfe\FilamentApexCharts\Widgets\ApexChartWidget;
use Flowframe\Trend\Trend;
use Flowframe\Trend\TrendValue;

class QuotesChart extends ApexChartWidget
{
    /**
     * Chart Id
     *
     * @var string
     */
    protected static ?string $chartId = 'quotesChart';

    /**
     * Widget Title
     *
     * @var string|null
     */
    protected static ?string $heading = 'Quotes';

    // Set to full width
    protected int | string | array $columnSpan = 'full';

    // Filter options
    protected function getFormSchema(): array
    {
        return [

            DatePicker::make('date_start')
                ->default(now()->subRealMonths(6)),
            DatePicker::make('date_end')
                ->default(now()),
        ];
    }

    /**
     * Chart options (series, labels, types, size, animations...)
     * https://apexcharts.com/docs/options
     *
     * @return array
     */
    protected function getOptions(): array
    {
        $dateStart = Carbon::parse($this->filterFormData['date_start']);
        $dateEnd = Carbon::parse($this->filterFormData['date_end']);

        $yAxis = Trend::model(Quote::class)
            ->between(
                start: $dateStart,
                end: $dateEnd,
            )
            ->perMonth()
            ->count();

        //@TODO Sort out code repetition below. No need for separate block for each status

        $declined = Trend::query(Quote::query()->where('status', 'declined'))
            ->between(
                start: $dateStart,
                end: $dateEnd,
            )
            ->perMonth()
            ->count();

        $draft = Trend::query(Quote::query()->where('status', 'draft'))
            ->between(
                start: $dateStart,
                end: $dateEnd,
            )
            ->perMonth()
            ->count();

        $published = Trend::query(Quote::query()->where('status', 'published'))
            ->between(
                start: $dateStart,
                end: $dateEnd,
            )
            ->perMonth()
            ->count();

        $review = Trend::query(Quote::query()->where('status', 'review'))
            ->between(
                start: $dateStart,
                end: $dateEnd,
            )
            ->perMonth()
            ->count();

        $accepted = Trend::query(Quote::query()->where('status', 'accepted'))
            ->between(
                start: $dateStart,
                end: $dateEnd,
            )
            ->perMonth()
            ->count();

        return [
            'chart' => [
                'type' => 'bar',
                'stacked' => true,
                'responsive' => [
                    'breakpoint' => '435px',
                    'options' => [
                        'height' => '300px',
                    ],
                ],
            ],
            //@TODO Sort out code repetition below. No need for separate block for each status
            'series' => [
                [
                    'name' => 'draft',
                    'data' => $draft->map(fn (TrendValue $value) => $value->aggregate),
                ],
                [
                    'name' => 'published',
                    'data' => $published->map(fn (TrendValue $value) => $value->aggregate),
                ],
                [
                    'name' => 'review',
                    'data' => $review->map(fn (TrendValue $value) => $value->aggregate),
                ],
                [
                    'name' => 'declined',
                    'data' => $declined->map(fn (TrendValue $value) => $value->aggregate),
                ],
                [
                    'name' => 'accepted',
                    'data' => $accepted->map(fn (TrendValue $value) => $value->aggregate),
                ],
            ],
            'xaxis' => [
                'categories' => $yAxis->map(fn (TrendValue $value) => date_format(date_create($value->date), 'M y')),
                'labels' => [
                    'style' => [
                        'fontFamily' => 'inherit',
                    ],
                ],
            ],
            'yaxis' => [
                'labels' => [
                    'style' => [
                        'fontFamily' => 'inherit',
                    ],
                ],
            ],
            'dataLabels'=> [
                'enabled' => true,
            ],
            'colors' => ['#d3d3d3', '#00bfff', '#ff7e00', '#ff0000', '#32cd32'],
            'plotOptions' => [
                'column' => [
                    'borderRadius' => 3,
                    'horizontal' => false,
                ],
            ],
        ];
    }
}

return [
            'chart' => [
                'type' => 'bar',
                'height' => 300,
                'animations' => [
                    'enabled' => false
                ],
            ],
            'series' => [
                [
                    'name' => 'Sales',
                    'data' => $totalSoldByProduct->pluck('total_revenue')->toArray(),
                ],
            ],
            'xaxis' => [
                'categories' => $totalSoldByProduct->pluck('name')->toArray(),
                'labels' => [
                    'style' => [
                        'colors' => '#9ca3af',
                        'fontWeight' => 600,
                    ],
                ],
            ],
            'yaxis' => [
                'labels' => [
                    'style' => [
                        'colors' => '#9ca3af',
                        'fontWeight' => 600,
                    ],
                ],
            ],
            'dataLabels' => [
                'enabled' => true,
                'formatter' => 'function(val, opts) {
                    return "Sold " + val;
                }',
                'style' => [
                    'colors' => ['#fff'],
                ],
            ],
            'colors' => ['#1da6e7'],
        ];

 'formatter' => 'function(val, opts) {
                    return "Sold " + val;
                }',

<div>
    @if ($heading != null)
        ... // original code

        <x-filament::hr class="py-2" />
    @endif
</div>