@extends('layouts.app')
@section('title','Laporan')
@section('page-title','Laporan')

@section('content')

{{-- Date Filter --}}
<form method="GET" class="flex flex-wrap gap-3 mb-6 items-end">
    <div>
        <label class="block text-xs font-medium text-gray-500 mb-1">Dari Tanggal</label>
        <input type="date" name="date_from" value="{{ $dateFrom }}" class="border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500">
    </div>
    <div>
        <label class="block text-xs font-medium text-gray-500 mb-1">Sampai Tanggal</label>
        <input type="date" name="date_to" value="{{ $dateTo }}" class="border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500">
    </div>
    <button type="submit" class="bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium px-4 py-2 rounded-lg transition">Tampilkan</button>
    <a href="{{ route('reports.index') }}" class="bg-gray-100 hover:bg-gray-200 text-gray-600 text-sm font-medium px-4 py-2 rounded-lg transition">Reset</a>
    <a href="{{ route('reports.print') }}?date_from={{ $dateFrom }}&date_to={{ $dateTo }}" target="_blank"
       class="bg-gray-700 hover:bg-gray-800 text-white text-sm font-medium px-4 py-2 rounded-lg transition">Cetak Laporan</a>
</form>

{{-- Summary Cards --}}
<div class="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-4 gap-4 mb-6">
    <div class="bg-white rounded-xl border border-gray-100 shadow-sm p-5">
        <p class="text-xs font-medium text-gray-400 mb-1">Pendapatan Penjualan</p>
        <p class="text-2xl font-bold text-blue-700">Rp {{ number_format($summary['sales_revenue'],0,',','.') }}</p>
        <p class="text-xs text-gray-400 mt-1">{{ $summary['sales_count'] }} transaksi</p>
    </div>
    <div class="bg-white rounded-xl border border-gray-100 shadow-sm p-5">
        <p class="text-xs font-medium text-gray-400 mb-1">Pendapatan Servis</p>
        <p class="text-2xl font-bold text-orange-600">Rp {{ number_format($summary['service_revenue'],0,',','.') }}</p>
        <p class="text-xs text-gray-400 mt-1">{{ $summary['service_count'] }} order selesai</p>
    </div>
    <div class="bg-white rounded-xl border border-gray-100 shadow-sm p-5">
        <p class="text-xs font-medium text-gray-400 mb-1">Total Pengeluaran</p>
        <p class="text-2xl font-bold text-red-600">Rp {{ number_format($summary['total_expenses'],0,',','.') }}</p>
        <p class="text-xs text-gray-400 mt-1">{{ $summary['expense_count'] }} entri</p>
    </div>
    <div class="bg-white rounded-xl border border-gray-100 shadow-sm p-5">
        <p class="text-xs font-medium text-gray-400 mb-1">Estimasi Laba Bersih</p>
        @php $profit = $summary['sales_revenue'] + $summary['service_revenue'] - $summary['total_expenses'] @endphp
        <p class="text-2xl font-bold {{ $profit >= 0 ? 'text-green-700' : 'text-red-700' }}">Rp {{ number_format($profit,0,',','.') }}</p>
        <p class="text-xs text-gray-400 mt-1">Pendapatan − Pengeluaran</p>
    </div>
</div>

<div class="grid grid-cols-1 lg:grid-cols-2 gap-4">

{{-- Top Selling Products --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden">
    <div class="px-5 py-3 border-b border-gray-100"><h3 class="text-sm font-semibold text-gray-700">Produk Terlaris</h3></div>
    <table class="w-full text-sm">
        <thead class="bg-gray-50"><tr>
            <th class="text-left px-4 py-2 text-gray-500 font-medium">Produk</th>
            <th class="text-right px-4 py-2 text-gray-500 font-medium">Qty Terjual</th>
            <th class="text-right px-4 py-2 text-gray-500 font-medium">Total</th>
        </tr></thead>
        <tbody class="divide-y divide-gray-50">
            @forelse($topProducts as $row)
            <tr>
                <td class="px-4 py-2 text-gray-800">{{ $row->product_name }}</td>
                <td class="px-4 py-2 text-right text-gray-600">{{ $row->total_qty }}</td>
                <td class="px-4 py-2 text-right font-medium text-gray-800">Rp {{ number_format($row->total_amount,0,',','.') }}</td>
            </tr>
            @empty
            <tr><td colspan="3" class="px-4 py-6 text-center text-gray-400">Tidak ada data.</td></tr>
            @endforelse
        </tbody>
    </table>
</div>

{{-- Expense by Category --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden">
    <div class="px-5 py-3 border-b border-gray-100"><h3 class="text-sm font-semibold text-gray-700">Pengeluaran per Kategori</h3></div>
    <table class="w-full text-sm">
        <thead class="bg-gray-50"><tr>
            <th class="text-left px-4 py-2 text-gray-500 font-medium">Kategori</th>
            <th class="text-right px-4 py-2 text-gray-500 font-medium">Jumlah Entri</th>
            <th class="text-right px-4 py-2 text-gray-500 font-medium">Total</th>
        </tr></thead>
        <tbody class="divide-y divide-gray-50">
            @forelse($expenseByCategory as $row)
            <tr>
                <td class="px-4 py-2 text-gray-800">{{ $row->category_name ?? 'Tanpa Kategori' }}</td>
                <td class="px-4 py-2 text-right text-gray-600">{{ $row->count }}</td>
                <td class="px-4 py-2 text-right font-medium text-gray-800">Rp {{ number_format($row->total,0,',','.') }}</td>
            </tr>
            @empty
            <tr><td colspan="3" class="px-4 py-6 text-center text-gray-400">Tidak ada data.</td></tr>
            @endforelse
        </tbody>
    </table>
</div>

</div>
@endsection