@extends('layouts.app')

@section('title', 'Supplier Invoices')

@section('content')
<div class="px-4 py-6 sm:px-0">
    <div class="flex justify-between items-center mb-6">
        <div>
            <h1 class="text-3xl font-bold text-gray-900">Supplier Invoices</h1>
            <p class="text-sm text-gray-600">Manage bills received from suppliers and linked Purchase Orders</p>
        </div>
        <a href="{{ route('supplier-invoices.create') }}" class="inline-flex items-center px-4 py-2 bg-orange-600 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-orange-700">
            <i class="fas fa-file-import mr-2"></i> Record New Bill
        </a>
    </div>

    <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
        <div class="bg-white p-4 rounded-lg shadow-sm border-l-4 border-yellow-400">
            <p class="text-xs font-medium text-gray-500 uppercase">Unpaid Bills</p>
            <p class="text-2xl font-bold text-gray-800">{{ $invoices->where('payment_status', 'unpaid')->count() }}</p>
        </div>
        <div class="bg-white p-4 rounded-lg shadow-sm border-l-4 border-green-500">
            <p class="text-xs font-medium text-gray-500 uppercase">Total Monthly Volume</p>
            <p class="text-2xl font-bold text-gray-800">${{ number_format($invoices->sum('total_amount'), 2) }}</p>
        </div>
        <div class="bg-white p-4 rounded-lg shadow-sm border-l-4 border-blue-500">
            <p class="text-xs font-medium text-gray-500 uppercase">Total Invoices</p>
            <p class="text-2xl font-bold text-gray-800">{{ $invoices->total() }}</p>
        </div>
    </div>

    <div class="bg-white shadow overflow-hidden sm:rounded-lg">
        <table class="min-w-full divide-y divide-gray-200">
            <thead class="bg-gray-50">
                <tr>
                    <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Supplier / Inv #</th>
                    <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Date</th>
                    <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Linked POs</th>
                    <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Amount</th>
                    <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Status</th>
                    <th class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
                </tr>
            </thead>
            <tbody class="bg-white divide-y divide-gray-200">
                @forelse($invoices as $invoice)
                <tr>
                    <td class="px-6 py-4 whitespace-nowrap">
                        <div class="text-sm font-bold text-gray-900">{{ $invoice->supplier->name }}</div>
                        <div class="text-sm text-orange-600 font-mono">{{ $invoice->supplier_invoice_number }}</div>
                    </td>
                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                        {{ $invoice->invoice_date->format('d M Y') }}
                    </td>
                    <td class="px-6 py-4 whitespace-nowrap">
                        <div class="flex flex-wrap gap-1">
                            @foreach($invoice->purchaseOrders as $po)
                                <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-blue-100 text-blue-800">
                                    {{ $po->po_number }}
                                </span>
                            @endforeach
                        </div>
                    </td>
                    <td class="px-6 py-4 whitespace-nowrap text-sm font-semibold text-gray-900">
                        ${{ number_format($invoice->total_amount, 2) }}
                    </td>
                    <td class="px-6 py-4 whitespace-nowrap">
                        @php
                            $statusClasses = [
                                'paid' => 'bg-green-100 text-green-800',
                                'partial' => 'bg-blue-100 text-blue-800',
                                'unpaid' => 'bg-red-100 text-red-800',
                            ];
                        @endphp
                        <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full {{ $statusClasses[$invoice->payment_status] ?? 'bg-gray-100' }}">
                            {{ ucfirst($invoice->payment_status) }}
                        </span>
                    </td>
                    <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
                        <div class="flex justify-end space-x-3">
                            @if($invoice->pdf_path)
                                <a href="{{ asset('storage/' . $invoice->pdf_path) }}" target="_blank" class="text-gray-400 hover:text-red-600" title="View PDF">
                                    <i class="fas fa-file-pdf fa-lg"></i>
                                </a>
                            @endif
                            <a href="{{ route('supplier-invoices.show', $invoice) }}" class="text-gray-400 hover:text-indigo-600" title="View Details">
                                <i class="fas fa-eye fa-lg"></i>
                            </a>
                            <form action="{{ route('supplier-invoices.destroy', $invoice) }}" method="POST" onsubmit="return confirm('Are you sure you want to delete this invoice record?');" class="inline">
                                @csrf @method('DELETE')
                                <button type="submit" class="text-gray-400 hover:text-red-600">
                                    <i class="fas fa-trash fa-lg"></i>
                                </button>
                            </form>
                        </div>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="6" class="px-6 py-10 text-center text-gray-500 italic">
                        No supplier invoices recorded yet.
                    </td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>

    <div class="mt-4">
        {{ $invoices->links() }}
    </div>
</div>
@endsection