@extends('layouts.app')
@section('title', __('customers.customers'))
@section('content')
<div class="d-flex justify-content-between align-items-center mb-3">
  <h5 class="fw-bold mb-0">{{ __('customers.customers') }}</h5>
  <a href="{{ route('customers.create') }}" class="btn btn-primary"><i class="bi bi-plus-lg"></i> {{ __('customers.add') }}</a>
</div>

<div class="card">
  <div class="card-body">
    <form class="row g-2 mb-3">
      <div class="col-md-5"><input type="search" name="q" value="{{ request('q') }}" class="form-control" placeholder="{{ __('app.search') }}"></div>
      <div class="col-md-3">
        <select name="archived" class="form-select" onchange="this.form.submit()">
          <option value="">{{ __('app.active') }}</option>
          <option value="1" @selected(request('archived'))>{{ __('customers.archived') }}</option>
        </select>
      </div>
      <div class="col-auto"><button class="btn btn-outline-primary">{{ __('app.filter') }}</button></div>
    </form>

    <div class="table-responsive">
      <table class="table table-hover align-middle">
        <thead><tr>
          <th>{{ __('customers.code') }}</th><th>{{ __('app.name') }}</th><th>{{ __('app.phone') }}</th>
          <th>{{ __('customers.total_purchases') }}</th><th>{{ __('customers.balance') }}</th><th></th>
        </tr></thead>
        <tbody>
          @forelse($customers as $customer)
          <tr>
            <td><span class="badge text-bg-light">{{ $customer->code }}</span></td>
            <td><a href="{{ route('customers.show', $customer) }}" class="fw-semibold text-decoration-none">{{ $customer->name }}</a></td>
            <td dir="ltr">{{ $customer->phone }}</td>
            <td>{{ money($customer->total_purchases) }}</td>
            <td>@if($customer->balance > 0)<span class="text-danger fw-bold">{{ money($customer->balance) }}</span>@else <span class="text-success">0</span>@endif</td>
            <td class="text-end">
              <a href="{{ route('customers.show', $customer) }}" class="btn btn-sm btn-outline-secondary"><i class="bi bi-eye"></i></a>
              <a href="{{ route('customers.edit', $customer) }}" class="btn btn-sm btn-outline-primary"><i class="bi bi-pencil"></i></a>
            </td>
          </tr>
          @empty
          <tr><td colspan="6" class="text-center text-secondary py-4">{{ __('app.no_data') }}</td></tr>
          @endforelse
        </tbody>
      </table>
    </div>
    {{ $customers->links() }}
  </div>
</div>
@endsection