@extends('dashboard.layout')
@section('title','التقارير')

@section('content')
<div class="row g-3">
  <div class="col-12 col-xl-4">
    <div class="card card-dark p-3 h-100">
      <h2 class="h6 mb-3">نظرة سريعة</h2>
      <ul class="list-unstyled m-0">
        <li class="d-flex justify-content-between py-1 border-bottom"><span class="text-muted">مبيعات اليوم</span><strong>{{ number_format(($summary['sales_today'] ?? 0),2) }}</strong></li>
        <li class="d-flex justify-content-between py-1 border-bottom"><span class="text-muted">مبيعات هذا الأسبوع</span><strong>{{ number_format(($summary['sales_week'] ?? 0),2) }}</strong></li>
        <li class="d-flex justify-content-between py-1"><span class="text-muted">طلبات غير مكتملة</span><strong>{{ $summary['pending_orders'] ?? 0 }}</strong></li>
      </ul>
      <div class="mt-3">
        <a class="btn btn-outline-secondary btn-sm" href="#">تصدير CSV</a>
      </div>
    </div>
  </div>

  <div class="col-12 col-xl-8">
    <div class="card card-dark p-3">
      <div class="d-flex align-items-center justify-content-between mb-2">
        <h2 class="h6 m-0">أفضل المنتجات</h2>
        <form method="GET" class="d-flex gap-2">
          <select name="range" class="form-select form-select-sm">
            @foreach(['7d'=>'آخر 7 أيام','30d'=>'آخر 30 يوم','90d'=>'آخر 90 يوم'] as $k=>$v)
              <option value="{{ $k }}" @selected(request('range',$range ?? '30d')===$k)>{{ $v }}</option>
            @endforeach
          </select>
          <button class="btn btn-outline-secondary btn-sm">تحديث</button>
        </form>
      </div>

      <div class="table-responsive-stack">
        <table class="table align-middle mb-0">
          <thead><tr><th>#</th><th>المنتج</th><th>المبيعات</th><th>الإيراد</th></tr></thead>
          <tbody>
          @forelse($topProducts ?? [] as $i => $row)
            <tr>
              <td>{{ $i+1 }}</td>
              <td class="fw-bold">{{ $row['name'] }}</td>
              <td>{{ $row['units'] }}</td>
              <td>{{ number_format($row['revenue'],2) }}</td>
            </tr>
          @empty
            <tr><td colspan="4" class="text-muted">لا توجد بيانات بعد.</td></tr>
          @endforelse
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
@endsection