@extends('layouts.app')
@section('title', 'Purchase orders')

@section('content')
    <div class="page-head">
        <div><h1>Purchase orders</h1><p>{{ $orders->total() }} order(s) matching your filters.</p></div>
        <div class="page-actions">
            <a href="{{ route('purchase-orders.create') }}" class="btn">+ New purchase order</a>
        </div>
    </div>

    <div class="grid grid-4 mb-2">
        @include('components.kpi', ['label' => 'Open value', 'value' => money($totals['open']), 'variant' => 'warn'])
        @include('components.kpi', ['label' => 'Received', 'value' => money($totals['received']), 'variant' => 'good'])
        @include('components.kpi', ['label' => 'Awaiting receipt', 'value' => (string) $totals['pending'], 'variant' => 'info'])
        @include('components.kpi', ['label' => 'Drafts', 'value' => (string) $totals['drafts']])
    </div>

    <form class="filters" method="GET">
        <div class="field" style="flex:2 1 240px;">
            <label>Search</label>
            <input type="search" name="q" value="{{ $filters['q'] ?? '' }}" placeholder="PO number, supplier, notes…">
        </div>
        <div class="field">
            <label>Status</label>
            <select name="status" data-auto-submit>
                <option value="">All</option>
                @foreach ($statuses as $s)
                    <option value="{{ $s }}" @selected(($filters['status'] ?? '') === $s)>{{ title_case_words($s) }}</option>
                @endforeach
            </select>
        </div>
        <div class="field">
            <label>Supplier</label>
            <select name="supplier_id" data-auto-submit>
                <option value="">All</option>
                @foreach ($suppliers as $s)
                    <option value="{{ $s->id }}" @selected(($filters['supplier_id'] ?? '') == $s->id)>{{ $s->name }}</option>
                @endforeach
            </select>
        </div>
        <div class="field"><label>&nbsp;</label><button class="btn secondary" type="submit">Filter</button></div>
    </form>

    <div class="card">
        <div class="card-body" style="padding:0;">
            @if ($orders->isEmpty())
                @include('components.empty-state', [
                    'icon' => '&#128230;',
                    'title' => 'No purchase orders yet',
                    'message' => 'Raise one to buy CPE, radios or fibre from a supplier.',
                ])
            @else
                <table class="data">
                    <thead>
                    <tr>
                        <th>PO number</th><th>Supplier</th><th>Ordered</th><th>Expected</th>
                        <th>Warehouse</th><th class="num">Total</th><th>Status</th><th></th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach ($orders as $order)
                        <tr>
                            <td class="mono"><a href="{{ route('purchase-orders.show', $order) }}">{{ $order->po_number }}</a></td>
                            <td class="small">{{ $order->supplier?->name ?: '—' }}</td>
                            <td class="small nowrap">{{ $order->order_date?->format('d M Y') }}</td>
                            <td class="small nowrap">{{ $order->expected_date?->format('d M Y') ?: '—' }}</td>
                            <td class="small">{{ $order->warehouse?->name ?: '—' }}</td>
                            <td class="num strong">{{ money($order->total) }}</td>
                            <td><span class="badge {{ status_color($order->status) }}">
                                <span class="dot"></span>{{ title_case_words($order->status) }}</span></td>
                            <td class="right nowrap">
                                <a href="{{ route('purchase-orders.show', $order) }}" class="btn xs secondary">Open</a>
                            </td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
            @endif
        </div>
        @if ($orders->hasPages())<div class="card-foot">{{ $orders->links('partials.pagination') }}</div>@endif
    </div>
@endsection