erpsaas/resources/views/filament/company/pages/reports/income-statement.blade.php

<x-filament-panels::page>
    <x-filament::section>
        <form wire:submit="loadReportData">
            <div class="flex flex-col md:flex-row items-start md:items-center justify-between gap-4 md:gap-8">
                <!-- Form Container -->
                <div class="flex-grow">
                    {{ $this->form }}
                </div>

                <!-- Grouping Button and Column Toggle -->
                <div class="flex flex-col md:flex-row items-start md:items-center gap-4 md:gap-8 flex-shrink-0">
                    @if($this->hasToggleableColumns())
                        <x-filament-tables::column-toggle.dropdown
                            :form="$this->toggleTableColumnForm"
                            :trigger-action="$this->toggleColumnsAction"
                        />
                    @endif
                    <x-filament::button type="submit" wire:target="loadReportData" class="flex-shrink-0">
                        Update Report
                    </x-filament::button>
                </div>
            </div>
        </form>
    </x-filament::section>


    <x-filament::section>
        <!-- Summary Section -->
        @if($this->reportLoaded)
            <div
                class="flex flex-col md:flex-row items-center md:items-end text-center justify-center gap-4 md:gap-8">
                @foreach($this->report->getSummary() as $summary)
                    <div class="text-sm">
                        <div class="text-gray-600 font-medium mb-2">{{ $summary['label'] }}</div>

                        @php
                            $isNetEarnings = $summary['label'] === 'Net Earnings';
                            $isPositive = money($summary['value'], \App\Utilities\Currency\CurrencyAccessor::getDefaultCurrency())->isPositive();
                        @endphp

                        <strong
                            @class([
                                'text-lg',
                                'text-green-700' => $isNetEarnings && $isPositive,
                                'text-danger-700' => $isNetEarnings && ! $isPositive,
                            ])
                        >
                            {{ $summary['value'] }}
                        </strong>
                    </div>

                    @if(! $loop->last)
                        <div class="flex items-center justify-center px-2">
                            <strong class="text-lg">
                                {{ $loop->remaining === 1 ? '=' : '-' }}
                            </strong>
                        </div>
                    @endif
                @endforeach
            </div>
        @endif
    </x-filament::section>

    <x-filament-tables::container>
        <div class="es-table__header-ctn"></div>
        <div wire:init="loadReportData"
             class="relative divide-y divide-gray-200 overflow-x-auto dark:divide-white/10 dark:border-t-white/10 min-h-64">
            @if($this->reportLoaded)
                <div wire:loading.remove wire:target="loadReportData">
                    @if($this->report)
                        <x-company.tables.reports.detailed-report :report="$this->report"/>
                    @endif
                </div>
            @else
                <div class="absolute inset-0 flex items-center justify-center">
                    <div wire:loading wire:target="loadReportData">
                        <x-filament::loading-indicator class="p-6 text-primary-700 dark:text-primary-300"/>
                    </div>
                </div>
            @endif
        </div>
        <div class="es-table__footer-ctn border-t border-gray-200"></div>
    </x-filament-tables::container>
</x-filament-panels::page>