@extends('layouts.app')
@section('title', 'Vendor assignments')

@section('content')
@php
    $pills = filter_pills([
        'status' => ['Status', ['unpaid' => 'Unpaid', 'partial' => 'Partly paid', 'paid' => 'Paid']],
        'vendor_id' => ['Vendor', fn ($id) => optional($vendors->firstWhere('id', $id))->name ?? $id],
        'from' => ['From', fn ($d) => pretty_date($d)],
        'to' => ['To', fn ($d) => pretty_date($d)],
    ]);
    $filtered = count($pills) > 0 || request()->filled('q');
    $chips = [[null, 'All', 'all'], ['unpaid', 'Unpaid', 'unpaid'], ['partial', 'Partly paid', 'partial'], ['paid', 'Paid', 'paid']];
@endphp
<x-page-header title="Vendor assignments" subtitle="Orders you have given to vendors, what was agreed, and what is paid">
    @can('data.export')
    <a href="{{ request()->fullUrlWithQuery(['export' => 'csv']) }}" class="btn btn-ghost"><i class="bi bi-download" aria-hidden="true"></i> Export</a>
    @endcan
    @can('vendor_assignments.create')
    <a href="{{ route('vendor-assignments.create') }}" class="btn btn-primary"><i class="bi bi-plus-lg" aria-hidden="true"></i> Assign orders</a>
    @endcan
</x-page-header>

<div class="chip-row mb-3">
    @foreach ($chips as [$key, $label, $ck])
        <a class="chip {{ request('status') == $key ? 'active' : '' }}" href="{{ request()->fullUrlWithQuery(['status' => $key, 'page' => null]) }}">{{ $label }} <span class="n">{{ $stateCounts[$ck] }}</span></a>
    @endforeach
</div>

<x-filter-bar placeholder="Search vendor, order number or description…" :pills="$pills" :keep="['status', 'sort', 'dir', 'per_page']">
    <x-slot:panel>
        <div class="col-md-4">
            <label class="form-label" for="f-vendor">Vendor</label>
            <select id="f-vendor" name="vendor_id" class="form-select">
                <option value="">All vendors</option>
                @foreach ($vendors as $v)<option value="{{ $v->id }}" @selected(request('vendor_id') == $v->id)>{{ $v->name }}</option>@endforeach
            </select>
        </div>
        <div class="col-md-4"><label class="form-label" for="f-from">Assigned from</label><input id="f-from" type="date" name="from" value="{{ request('from') }}" class="form-control"></div>
        <div class="col-md-4"><label class="form-label" for="f-to">to</label><input id="f-to" type="date" name="to" value="{{ request('to') }}" class="form-control"></div>
    </x-slot:panel>
</x-filter-bar>

<div class="card">
    <div class="table-wrap">
        <table class="table table-modern table-cards align-middle">
            <thead><tr>
                <x-sort-th column="number" label="No." />
                <x-sort-th column="vendor" label="Vendor" />
                <x-sort-th column="order" label="Order" />
                <x-sort-th column="assigned_on" label="Assigned" :default="true" defaultDir="desc" />
                <x-sort-th column="assigned" label="Agreed" num defaultDir="desc" />
                <th scope="col">Progress</th>
                <th scope="col" class="num">Extra</th>
                <x-sort-th column="total" label="Total" num defaultDir="desc" />
                <x-sort-th column="paid" label="Payment" defaultDir="desc" />
                <x-sort-th column="due" label="Balance" num defaultDir="desc" />
                <th scope="col"><span class="visually-hidden">Actions</span></th>
            </tr></thead>
            <tbody>
            @forelse ($assignments as $a)
                <tr>
                    <td class="cell-title" data-label="No.">
                        <a href="{{ route('vendor-assignments.show', $a) }}" class="cell-main text-decoration-none">{{ $a->number() }}</a>
                        @if ($a->description)<span class="cell-sub cell-clip">{{ $a->description }}</span>@endif
                    </td>
                    <td data-label="Vendor"><a href="{{ route('vendors.show', $a->vendor_id) }}" class="link-plain text-decoration-none">{{ $a->vendor->name }}</a></td>
                    <td data-label="Order"><a href="{{ route('orders.show', $a->order) }}">{{ $a->order->order_no }}</a><span class="cell-sub">{{ $a->order->client->name }}</span></td>
                    <td data-label="Assigned">{{ $a->assigned_on->format('d M Y') }}</td>
                    <td class="num" data-label="Agreed">{{ money($a->assigned_amount) }}</td>
                    <td data-label="Progress">
                        <div class="mini-progress {{ $a->progress >= 100 ? '' : 'is-partial' }}" style="min-width:70px" role="progressbar" aria-valuenow="{{ $a->progress }}" aria-valuemin="0" aria-valuemax="100" aria-label="{{ $a->progress }}% done"><span style="width: {{ $a->progress }}%"></span></div>
                        <span class="cell-sub">{{ $a->isCompleted() ? 'Completed' : $a->progress.'%' }}@if ($a->manager) · {{ $a->manager->name }}@endif @if ($a->isStale())<span class="text-warning">· no recent update</span>@endif</span>
                    </td>
                    <td class="num" data-label="Extra">{{ $a->extra() > 0.004 ? money($a->extra()) : '—' }}</td>
                    <td class="num fw-semibold" data-label="Total">{{ money($a->total()) }}</td>
                    <td data-label="Payment"><x-pay-status :total="$a->total()" :paid="$a->paid()" /></td>
                    <td class="num fw-semibold {{ $a->due() > 0.004 ? 'text-danger' : 'text-success' }}" data-label="Balance">{{ money($a->due()) }}</td>
                    <td class="actions-col">
                        <x-row-actions :label="'Actions for '.$a->number()">
                            <li><a class="dropdown-item" href="{{ route('vendor-assignments.show', $a) }}"><i class="bi bi-eye"></i>View</a></li>
                            @can('vendor_assignments.edit')
                            <li><a class="dropdown-item" href="{{ route('vendor-assignments.edit', $a) }}"><i class="bi bi-pencil"></i>Edit</a></li>
                            @endcan
                            @if ($a->due() > 0.004)
                                @can('payments.create')
                                <li><a class="dropdown-item" href="{{ route('payments.create', ['direction' => 'paid', 'vendor_assignment_id' => $a->id]) }}"><i class="bi bi-cash-coin"></i>Pay this assignment</a></li>
                                @endcan
                            @endif
                            @can('vendor_assignments.delete')
                            <li><hr class="dropdown-divider"></li>
                            <li><x-delete-button item :action="route('vendor-assignments.destroy', $a)" title="Delete this assignment?" confirm="Assignments with payments can't be deleted." /></li>
                            @endcan
                        </x-row-actions>
                    </td>
                </tr>
            @empty
                <tr class="empty-row"><td colspan="11">
                    <x-empty icon="diagram-2" title="No assignments yet" text="Give orders to vendors here, then track what is agreed, what extra was added and what is paid." :filtered="$filtered">
                        @can('vendor_assignments.create')
                        <a href="{{ route('vendor-assignments.create') }}" class="btn btn-primary btn-sm"><i class="bi bi-plus-lg"></i> Assign orders</a>
                        @endcan
                    </x-empty>
                </td></tr>
            @endforelse
            </tbody>
            @if ($assignments->total() > 0)
            <tfoot>
                <tr>
                    <td colspan="4">All {{ $assignments->total() }} matching {{ \Illuminate\Support\Str::plural('assignment', $assignments->total()) }}</td>
                    <td class="num">{{ money($sums['assigned']) }}</td>
                    <td></td>
                    <td class="num">{{ money($sums['extra']) }}</td>
                    <td class="num">{{ money($sums['total']) }}</td>
                    <td class="num text-success">{{ money($sums['paid']) }} <span class="fw-normal text-muted">paid</span></td>
                    <td class="num {{ $sums['due'] > 0.004 ? 'text-danger' : '' }}">{{ money($sums['due']) }}</td>
                    <td></td>
                </tr>
            </tfoot>
            @endif
        </table>
    </div>
    <x-table-foot :paginator="$assignments" />
</div>
@endsection