@extends('layouts.app')
@section('title', 'Vendors')

@section('content')
@php
    $pills = filter_pills([
        'status' => ['Status', ['active' => 'Active', 'inactive' => 'Inactive']],
        'category' => ['Category'],
        'country' => ['Country', fn ($c) => \App\Support\Countries::name($c)],
        'balance' => ['Balance', ['owed' => 'We owe money']],
    ]);
    $chips = [[null, 'All', $counts['all']], ['active', 'Active', $counts['active']], ['inactive', 'Inactive', $counts['inactive']]];
    $filtered = count($pills) > 0 || request()->filled('q');
@endphp
<x-page-header title="Vendors" subtitle="Suppliers, weavers, dyers and other service providers">
    @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('vendors.create')
    <a href="{{ route('vendors.create') }}" class="btn btn-primary"><i class="bi bi-plus-lg" aria-hidden="true"></i> Add vendor</a>
    @endcan
</x-page-header>

<div class="chip-row mb-3">
    @foreach ($chips as [$key, $label, $n])
        <a class="chip {{ request('status') == $key && ! request('balance') ? 'active' : '' }}" href="{{ request()->fullUrlWithQuery(['status' => $key, 'balance' => null, 'page' => null]) }}">{{ $label }} <span class="n">{{ $n }}</span></a>
    @endforeach
    <a class="chip {{ request('balance') === 'owed' ? 'active' : '' }}" href="{{ request()->fullUrlWithQuery(['status' => null, 'balance' => 'owed', 'page' => null]) }}"><i class="bi bi-hourglass-split" aria-hidden="true"></i> We owe money <span class="n">{{ $counts['owed'] }}</span></a>
</div>

<x-filter-bar placeholder="Search name, phone, contact, city, country…" :pills="$pills" :keep="['status', 'sort', 'dir', 'per_page']">
    <x-slot:panel>
        <div class="col-md-4">
            <label class="form-label" for="f-cat">Category</label>
            <select id="f-cat" name="category" class="form-select">
                <option value="">All categories</option>
                @foreach ($categories as $cat)<option value="{{ $cat }}" @selected(request('category') === $cat)>{{ $cat }}</option>@endforeach
            </select>
        </div>
        <div class="col-md-4">
            <label class="form-label" for="f-country">Country</label>
            <select id="f-country" name="country" class="form-select" data-ts data-placeholder="Any country">
                <option value="">Any country</option>
                @foreach ($countries as $code => $countryName)<option value="{{ $code }}" @selected(request('country') === $code)>{{ $countryName }}</option>@endforeach
            </select>
        </div>
        <div class="col-md-4">
            <label class="form-label" for="f-balance">Balance</label>
            <select id="f-balance" name="balance" class="form-select">
                <option value="">Any</option>
                <option value="owed" @selected(request('balance') === 'owed')>We owe money</option>
            </select>
        </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="name" label="Vendor" :default="true" />
                <x-sort-th column="category" label="Category" />
                <th scope="col">Contact</th>
                <x-sort-th column="billed" label="Billed" num defaultDir="desc" />
                <x-sort-th column="paid" label="Paid" num defaultDir="desc" />
                <x-sort-th column="balance" label="We owe" num defaultDir="desc" />
                <th scope="col"><span class="visually-hidden">Actions</span></th>
            </tr></thead>
            <tbody>
            @forelse ($vendors as $v)
                <tr>
                    <td class="cell-title" data-label="Vendor">
                        <div class="d-flex align-items-center gap-3">
                            <x-avatar :name="$v->name" :size="36" />
                            <div class="min-w-0">
                                <a href="{{ route('vendors.show', $v) }}" class="cell-main text-decoration-none">{{ $v->name }}</a>
                                @unless ($v->is_active)<span class="badge-soft badge-soft-secondary no-dot ms-1">Inactive</span>@endunless
                                @if ($v->location())<span class="cell-sub">{{ $v->location() }}</span>@endif
                            </div>
                        </div>
                    </td>
                    <td data-label="Category">@if ($v->category)<span class="badge-soft badge-soft-primary no-dot">{{ $v->category }}</span>@else — @endif</td>
                    <td data-label="Contact">{{ $v->contact_person ?: '—' }}<span class="cell-sub">{{ $v->phone }}</span></td>
                    <td class="num" data-label="Billed">{{ money($v->billed()) }}</td>
                    <td class="num" data-label="Paid">{{ money($v->paid()) }}</td>
                    <td class="num fw-semibold {{ $v->balance() > 0.004 ? 'text-danger' : 'text-success' }}" data-label="We owe">{{ money($v->balance()) }}</td>
                    <td class="actions-col">
                        <x-row-actions :label="'Actions for '.$v->name">
                            <li><a class="dropdown-item" href="{{ route('vendors.show', $v) }}"><i class="bi bi-eye"></i>View</a></li>
                            @can('vendors.edit')
                            <li><a class="dropdown-item" href="{{ route('vendors.edit', $v) }}"><i class="bi bi-pencil"></i>Edit</a></li>
                            @endcan
                            @can('vendor_bills.create')
                            <li><a class="dropdown-item" href="{{ route('vendor-bills.create', ['vendor_id' => $v->id]) }}"><i class="bi bi-receipt"></i>Add bill</a></li>
                            @endcan
                            @can('payments.create')
                            <li><a class="dropdown-item" href="{{ route('payments.create', ['direction' => 'paid', 'vendor_id' => $v->id]) }}"><i class="bi bi-cash-coin"></i>Pay vendor</a></li>
                            @endcan
                            @can('vendors.delete')
                            <li><hr class="dropdown-divider"></li>
                            <li><x-delete-button item :action="route('vendors.destroy', $v)" :title="'Delete '.$v->name.'?'" confirm="Vendors with bills or payments can't be deleted — mark them inactive instead." /></li>
                            @endcan
                        </x-row-actions>
                    </td>
                </tr>
            @empty
                <tr class="empty-row"><td colspan="7">
                    <x-empty icon="truck" title="No vendors yet" text="Add the suppliers, weavers and dyers you buy from." :filtered="$filtered">
                        @can('vendors.create')
                        <a href="{{ route('vendors.create') }}" class="btn btn-primary btn-sm"><i class="bi bi-plus-lg"></i> Add your first vendor</a>
                        @endcan
                    </x-empty>
                </td></tr>
            @endforelse
            </tbody>
        </table>
    </div>
    <x-table-foot :paginator="$vendors" />
</div>
@endsection