@extends('layouts.app')

@section('title', 'Purchase Orders')

@section('content')
<x-breadcrumb :items="[['label' => 'Purchase Orders']]" />

<x-page-header title="Purchase Orders" subtitle="Create, track and approve purchase orders.">
    <x-slot name="actions">
        <a href="{{ route('purchase-orders.create') }}" class="procure-btn-primary"><i class="fas fa-plus"></i> New PO</a>
    </x-slot>
</x-page-header>

<div class="procure-filters">
    <form method="GET" action="{{ route('purchase-orders.index') }}" class="row align-items-end">
        <div class="col-md-4 mb-2">
            <label class="small text-muted">Search</label>
            <div class="procure-search" style="width:100%;">
                <i class="fas fa-search"></i>
                <input type="text" name="search" value="{{ request('search') }}" placeholder="PO number, supplier..." style="width:100%;">
            </div>
        </div>
        <div class="col-md-4 mb-2">
            <label class="small text-muted">Status</label>
            <select name="status" class="form-control form-control-sm" style="border-radius:8px;">
                <option value="">All statuses</option>
                @foreach(['draft','pending_approval','approved','issued','partially_received','received','cancelled','closed'] as $st)
                    <option value="{{ $st }}" @selected(request('status') === $st)>{{ ucfirst(str_replace('_', ' ', $st)) }}</option>
                @endforeach
            </select>
        </div>
        <div class="col-md-2 mb-2">
            <button type="submit" class="procure-btn w-100"><i class="fas fa-filter"></i> Filter</button>
        </div>
        <div class="col-md-2 mb-2">
            <a href="{{ route('purchase-orders.index') }}" class="procure-btn w-100">Reset</a>
        </div>
    </form>
</div>

@if(($purchaseOrders ?? collect())->isEmpty())
    <div class="chart-card">
        <div class="chart-card-body">
            <x-empty-state icon="fas fa-shopping-bag" title="No purchase orders" message="Create a purchase order to start procurement."
                :action-url="route('purchase-orders.create')" action-label="New PO" />
        </div>
    </div>
@else
    <div class="chart-card">
        <div class="chart-card-body" style="overflow-x:auto;">
            <table class="procure-table">
                <thead>
                    <tr>
                        <th>PO Number</th>
                        <th>Supplier</th>
                        <th>Date</th>
                        <th>Amount</th>
                        <th>Status</th>
                        <th class="text-right">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($purchaseOrders as $po)
                        <tr>
                            <td><a href="{{ route('purchase-orders.show', $po) }}"><strong>{{ $po->po_number }}</strong></a></td>
                            <td>{{ $po->supplier->name ?? '—' }}</td>
                            <td>{{ optional($po->order_date)->format('Y-m-d') }}</td>
                            <td>{{ number_format($po->total_amount, 2) }} {{ $po->currency }}</td>
                            <td><x-status-badge :status="$po->status" /></td>
                            <td class="text-right text-nowrap">
                                <a href="{{ route('purchase-orders.show', $po) }}" class="procure-btn"><i class="fas fa-eye"></i></a>
                                @if($po->status === 'draft')
                                    <a href="{{ route('purchase-orders.edit', $po) }}" class="procure-btn"><i class="fas fa-edit"></i></a>
                                @endif
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        @if(method_exists($purchaseOrders, 'links'))
            <div class="px-3 pb-3">{{ $purchaseOrders->withQueryString()->links() }}</div>
        @endif
    </div>
@endif
@endsection