@extends('layouts.admin')
@section('title', 'Sales History')
@section('page-title', 'POS Sales History')
@section('page-subtitle', 'All completed sales transactions')
@section('content')
<div class="card overflow-hidden">
    <div class="overflow-x-auto">
        <table class="w-full text-sm">
            <thead class="bg-gray-50 border-b">
                <tr>
                    <th class="px-4 py-3 text-left">Reference</th>
                    <th class="px-4 py-3 text-left">Customer</th>
                    <th class="px-4 py-3 text-right">Total</th>
                    <th class="px-4 py-3 text-left">Payment</th>
                    <th class="px-4 py-3 text-right">Change</th>
                    <th class="px-4 py-3 text-left">Cashier</th>
                    <th class="px-4 py-3 text-left">Date</th>
                    <th class="px-4 py-3 text-center">Actions</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-gray-100">
                @forelse($sales as $sale)
                <tr class="hover:bg-gray-50">
                    <td class="px-4 py-3 font-mono text-xs text-pink-700">{{ $sale->reference }}</td>
                    <td class="px-4 py-3">{{ $sale->customer_name }}</td>
                    <td class="px-4 py-3 text-right font-bold text-green-700">₦{{ number_format($sale->total_amount) }}</td>
                    <td class="px-4 py-3 capitalize">{{ str_replace('_', ' ', $sale->payment_method) }}</td>
                    <td class="px-4 py-3 text-right">₦{{ number_format($sale->change_given) }}</td>
                    <td class="px-4 py-3 text-gray-500">{{ $sale->cashier_name }}</td>
                    <td class="px-4 py-3">{{ \Carbon\Carbon::parse($sale->sale_date)->format('d M Y H:i') }}</td>
                    <td class="px-4 py-3 text-center">
                        <a href="{{ route('admin.pos.receipt', $sale->id) }}" class="bg-blue-100 text-blue-700 px-3 py-1 rounded text-xs hover:bg-blue-200">
                            <i class="fas fa-print mr-1"></i>Receipt
                        </a>
                    </td>
                </tr>
                @empty
                <tr><td colspan="8" class="px-4 py-8 text-center text-gray-500">No sales recorded yet.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    <div class="px-4 py-3 border-t">{{ $sales->links() }}</div>
</div>
@endsection