@extends('layouts.app')
@section('title', 'OTC Sales History')
@section('content')

{{-- Header --}}
<div class="flex items-center justify-between mb-4 flex-wrap gap-3">
    <div class="flex items-center gap-3">
        <a href="{{ route('pharmacy.otc') }}" class="btn-secondary text-xs flex items-center gap-1">
            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/></svg>
            Back to OTC Sales
        </a>
        <div>
            <h1 class="text-lg font-bold text-gray-900">OTC Sales History</h1>
            <p class="text-xs text-gray-400">All over-the-counter drug sales</p>
        </div>
    </div>
</div>

{{-- Filters --}}
<div class="bg-white rounded-xl border shadow-sm p-4 mb-4">
    <form method="GET" action="{{ route('pharmacy.otc.history') }}" class="flex flex-wrap items-end gap-2">
        <div>
            <label class="form-label text-xs">From</label>
            <input type="date" name="from" value="{{ $from }}" class="form-input text-xs no-flatpickr" style="width:150px">
        </div>
        <div>
            <label class="form-label text-xs">To</label>
            <input type="date" name="to" value="{{ $to }}" class="form-input text-xs no-flatpickr" style="width:150px">
        </div>
        <div>
            <label class="form-label text-xs">Payment Method</label>
            <select name="method" class="form-input text-xs" style="width:140px">
                <option value="">All</option>
                @foreach(['cash' => 'Cash', 'mpesa' => 'M-Pesa', 'mobile_money' => 'Mobile Money', 'bank_transfer' => 'Bank Transfer', 'card' => 'Card'] as $val => $label)
                    <option value="{{ $val }}" {{ request('method') === $val ? 'selected' : '' }}>{{ $label }}</option>
                @endforeach
            </select>
        </div>
        <div class="flex-1" style="min-width:200px">
            <label class="form-label text-xs">Search</label>
            <input type="text" name="search" value="{{ request('search') }}" placeholder="Drug name, patient name, MRN..." class="form-input text-xs w-full">
        </div>
        <button type="submit" class="btn-primary text-xs">Filter</button>
        @if(request()->hasAny(['from', 'to', 'method', 'search']))
            <a href="{{ route('pharmacy.otc.history') }}" class="btn-secondary text-xs">Clear</a>
        @endif
    </form>
</div>

{{-- Summary stats --}}
<div class="grid grid-cols-1 md:grid-cols-3 gap-3 mb-4">
    <div class="stat-card">
        <p class="text-xs text-gray-400 uppercase">Total Sales ({{ \Carbon\Carbon::parse($from)->format('d M') }} — {{ \Carbon\Carbon::parse($to)->format('d M') }})</p>
        <p class="text-xl font-bold text-emerald-600">KES {{ number_format($stats['total_sales'], 2) }}</p>
    </div>
    <div class="stat-card">
        <p class="text-xs text-gray-400 uppercase">Items Dispensed</p>
        <p class="text-xl font-bold text-gray-800">{{ number_format($stats['item_count']) }}</p>
    </div>
    <div class="stat-card">
        <p class="text-xs text-gray-400 uppercase">Payment Methods</p>
        <div class="text-xs mt-1 space-y-0.5">
            @forelse($stats['by_method'] as $m)
                <div class="flex justify-between">
                    <span class="capitalize">{{ str_replace('_', ' ', $m->payment_mode) }}</span>
                    <span class="font-semibold">KES {{ number_format($m->total, 0) }}</span>
                </div>
            @empty
                <p class="text-gray-400">No sales in this period.</p>
            @endforelse
        </div>
    </div>
</div>

{{-- Sales list --}}
<div class="bg-white rounded-xl border shadow-sm">
    <div class="overflow-x-auto">
        <table class="w-full">
            <thead>
                <tr class="bg-gray-50">
                    <th class="table-header">Date/Time</th>
                    <th class="table-header">Drug</th>
                    <th class="table-header">Patient</th>
                    <th class="table-header text-right">Qty</th>
                    <th class="table-header text-right">Unit Price</th>
                    <th class="table-header text-right">Total</th>
                    <th class="table-header">Method</th>
                    <th class="table-header">Dispensed By</th>
                </tr>
            </thead>
            <tbody>
                @forelse($sales as $sale)
                <tr class="border-b border-gray-50">
                    <td class="table-cell text-xs">
                        {{ $sale->dispensed_at ? \Carbon\Carbon::parse($sale->dispensed_at)->format('d M H:i') : '-' }}
                    </td>
                    <td class="table-cell text-xs font-medium">{{ $sale->drugItem->name ?? '-' }}</td>
                    <td class="table-cell text-xs">
                        @if($sale->patient_id && $sale->patient)
                            {{ $sale->patient->full_name }}
                            <p class="text-gray-400">{{ $sale->patient->mrn }}</p>
                        @else
                            <span class="text-gray-400 italic">Walk-in</span>
                        @endif
                    </td>
                    <td class="table-cell text-xs text-right">{{ $sale->quantity_dispensed }}</td>
                    <td class="table-cell text-xs text-right">{{ number_format($sale->unit_price, 2) }}</td>
                    <td class="table-cell text-xs text-right font-semibold">{{ number_format($sale->total_price, 2) }}</td>
                    <td class="table-cell">
                        <span class="badge badge-gray capitalize">{{ str_replace('_', ' ', $sale->payment_mode) }}</span>
                    </td>
                    <td class="table-cell text-xs text-gray-600">{{ $sale->dispensedBy?->name ?? '-' }}</td>
                </tr>
                @empty
                <tr><td colspan="8" class="table-cell text-center text-gray-400 py-8">No OTC sales in this period.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($sales->hasPages())
    <div class="px-4 py-3 border-t">{{ $sales->links() }}</div>
    @endif
</div>

@endsection