@extends('layouts.admin')

@section('heading', 'Reports')
@section('subheading', 'Sales, pipeline, balances, and salary — filtered and exportable.')

@section('actions')
  <div class="flex gap-2">
    <a href="{{ route('reports.export.excel', ['tab' => $tab, 'from' => $from, 'to' => $to]) }}" class="px-3 py-2 rounded-lg text-xs font-medium" style="background:#E1F5EE; color:#0F6E56;">Export Excel</a>
    <a href="{{ route('reports.export.pdf', ['tab' => $tab, 'from' => $from, 'to' => $to]) }}" class="px-3 py-2 rounded-lg text-xs font-medium" style="background:#FAECE7; color:#993C1D;">Export PDF</a>
  </div>
@endsection

@section('content')

<!-- Tabs -->
<div class="flex gap-2 mb-4">
  @foreach(['sales' => 'Sales', 'pipeline' => 'Pipeline', 'balances' => 'Balances', 'salary' => 'Salary'] as $key => $label)
    <a href="{{ route('reports.index', ['tab' => $key, 'from' => $from, 'to' => $to]) }}"
       class="text-sm px-4 py-2 rounded-lg font-medium"
       style="{{ $tab === $key ? 'background:#C2185B; color:white;' : 'background:#f2ece0; color:#6b6470;' }}">
      {{ $label }}
    </a>
  @endforeach
</div>

<!-- Date filter (sales + salary only) -->
@if(in_array($tab, ['sales', 'salary']))
<form method="GET" class="card p-4 mb-4 flex items-end gap-3">
  <input type="hidden" name="tab" value="{{ $tab }}">
  <div>
    <label class="block text-xs mb-1" style="color:#6b6470;">From</label>
    <input type="date" name="from" value="{{ $from }}" class="px-3 py-2 rounded-lg border text-sm outline-none" style="border-color:#e6e1d8;">
  </div>
  <div>
    <label class="block text-xs mb-1" style="color:#6b6470;">To</label>
    <input type="date" name="to" value="{{ $to }}" class="px-3 py-2 rounded-lg border text-sm outline-none" style="border-color:#e6e1d8;">
  </div>
  <button type="submit" class="px-4 py-2 rounded-lg text-sm font-medium text-white" style="background:#5E35B1;">Filter</button>
</form>
@endif

@if($tab === 'sales')
  <div class="grid grid-cols-4 gap-4 mb-4">
    <div class="card p-5"><p class="text-xs mb-1" style="color:#6b6470;">Orders</p><p class="font-display font-semibold text-2xl">{{ $data['total_orders'] }}</p></div>
    <div class="card p-5"><p class="text-xs mb-1" style="color:#6b6470;">Revenue</p><p class="font-display font-semibold text-2xl">₹{{ number_format($data['total_revenue'], 0) }}</p></div>
    <div class="card p-5"><p class="text-xs mb-1" style="color:#6b6470;">Advance collected</p><p class="font-display font-semibold text-2xl">₹{{ number_format($data['total_advance'], 0) }}</p></div>
    <div class="card p-5"><p class="text-xs mb-1" style="color:#6b6470;">Balance pending</p><p class="font-display font-semibold text-2xl">₹{{ number_format($data['total_balance'], 0) }}</p></div>
  </div>
  <div class="card p-0 overflow-hidden">
    <table class="w-full text-sm">
      <thead><tr class="text-left" style="background:#FFF9F0; color:#a19a8f;">
        <th class="px-5 py-3 font-medium text-xs">Order</th><th class="px-5 py-3 font-medium text-xs">Customer</th>
        <th class="px-5 py-3 font-medium text-xs">Date</th><th class="px-5 py-3 font-medium text-xs text-right">Total</th>
      </tr></thead>
      <tbody>
        @forelse($data['orders'] as $o)
          <tr class="border-t" style="border-color:#f2ece0;">
            <td class="px-5 py-3">#{{ $o->id }}</td><td class="px-5 py-3">{{ $o->customer->name ?? '—' }}</td>
            <td class="px-5 py-3">{{ $o->created_at->format('d M Y') }}</td><td class="px-5 py-3 text-right font-medium">₹{{ number_format($o->total_amount, 0) }}</td>
          </tr>
        @empty
          <tr><td colspan="4" class="px-5 py-8 text-center" style="color:#a19a8f;">No orders in this range.</td></tr>
        @endforelse
      </tbody>
    </table>
  </div>
@endif

@if($tab === 'pipeline')
  <div class="card p-6 mb-4">
    <div class="grid grid-cols-6 gap-4">
      @foreach($data['counts'] as $stage => $count)
        <div class="flex flex-col items-center gap-2">
          <div class="w-14 h-14 rounded-full flex items-center justify-center font-display font-semibold" style="background:#EEEDFE; color:#5E35B1;">{{ $count }}</div>
          <span class="text-xs capitalize" style="color:#6b6470;">{{ $stage }}</span>
        </div>
      @endforeach
    </div>
  </div>
@endif

@if($tab === 'balances')
  <div class="grid grid-cols-2 gap-4 mb-4">
    <div class="card p-5"><p class="text-xs mb-1" style="color:#6b6470;">Total outstanding</p><p class="font-display font-semibold text-2xl" style="color:#C2185B;">₹{{ number_format($data['total_outstanding'], 0) }}</p></div>
    <div class="card p-5"><p class="text-xs mb-1" style="color:#6b6470;">Customers owing</p><p class="font-display font-semibold text-2xl">{{ $data['customer_count'] }}</p></div>
  </div>
  <div class="card p-0 overflow-hidden">
    <table class="w-full text-sm">
      <thead><tr class="text-left" style="background:#FFF9F0; color:#a19a8f;">
        <th class="px-5 py-3 font-medium text-xs">Order</th><th class="px-5 py-3 font-medium text-xs">Customer</th>
        <th class="px-5 py-3 font-medium text-xs text-right">Balance</th>
      </tr></thead>
      <tbody>
        @forelse($data['orders'] as $o)
          <tr class="border-t" style="border-color:#f2ece0;">
            <td class="px-5 py-3">#{{ $o->id }}</td><td class="px-5 py-3">{{ $o->customer->name ?? '—' }}</td>
            <td class="px-5 py-3 text-right font-medium" style="color:#C2185B;">₹{{ number_format($o->balance_amount, 0) }}</td>
          </tr>
        @empty
          <tr><td colspan="3" class="px-5 py-8 text-center" style="color:#a19a8f;">No outstanding balances.</td></tr>
        @endforelse
      </tbody>
    </table>
  </div>
@endif

@if($tab === 'salary')
  <div class="card p-5 mb-4"><p class="text-xs mb-1" style="color:#6b6470;">Total paid in range</p><p class="font-display font-semibold text-2xl">₹{{ number_format($data['total_paid'], 0) }}</p></div>
  <div class="card p-0 overflow-hidden">
    <table class="w-full text-sm">
      <thead><tr class="text-left" style="background:#FFF9F0; color:#a19a8f;">
        <th class="px-5 py-3 font-medium text-xs">Staff</th><th class="px-5 py-3 font-medium text-xs">Date</th>
        <th class="px-5 py-3 font-medium text-xs">Notes</th><th class="px-5 py-3 font-medium text-xs text-right">Amount</th>
      </tr></thead>
      <tbody>
        @forelse($data['payments'] as $p)
          <tr class="border-t" style="border-color:#f2ece0;">
            <td class="px-5 py-3">{{ $p->staff->name ?? '—' }} <span class="text-xs" style="color:#a19a8f;">{{ $p->staff->staff_code ?? '' }}</span></td>
            <td class="px-5 py-3">{{ $p->paid_on->format('d M Y') }}</td><td class="px-5 py-3" style="color:#6b6470;">{{ $p->notes ?? '—' }}</td>
            <td class="px-5 py-3 text-right font-medium">₹{{ number_format($p->amount, 0) }}</td>
          </tr>
        @empty
          <tr><td colspan="4" class="px-5 py-8 text-center" style="color:#a19a8f;">No payments in this range.</td></tr>
        @endforelse
      </tbody>
    </table>
  </div>
@endif

@endsection