@extends('admin.layouts.app')

@push('styles')
@endpush

@section('title', 'Agências')

@section('content')
    <main class="page-content">
        <!--breadcrumb-->
        <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
            <div class="breadcrumb-title pe-3">Agências</div>
            <div class="ps-3">
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb mb-0 p-0">
                        <li class="breadcrumb-item"><a href="javascript:;"><i class="bx bx-home-alt"></i></a>
                        </li>
                        <li class="breadcrumb-item active" aria-current="page">Agências</li>
                    </ol>
                </nav>
            </div>
        </div>
        <!--end breadcrumb-->

        @component('admin.components.formsearch', ['route' => route('agencias.index'), 'search' => $search])
            <div class="col-md-2">
                <select name="tipo" class="form-select">
                    <option value="">Todos os tipos</option>
                    <option value="AGÊNCIA" {{ request('tipo') === 'AGÊNCIA' ? 'selected' : '' }}>Agência</option>
                    <option value="ESCRITÓRIO" {{ request('tipo') === 'ESCRITÓRIO' ? 'selected' : '' }}>Escritório</option>
                </select>
            </div>
            <div class="col-md-4">
                <div class="text-lg-end my-1 my-lg-0">
                    @can('gerir-agencias')
                    <a class="btn btn-primary" href="{{ route('agencias.create') }}">
                        <i class="mdi mdi-plus-circle me-1"></i>
                        Adicionar Agência
                    </a>
                    @endcan
                </div>
            </div>
        @endcomponent

        @component('admin.components.table', ['listagem' => $agencias, 'search' => null])
            <thead>
                <tr>
                    <th width="10">
                        #
                    </th>
                    <th width="70">
                        Imagem
                    </th>
                    <th>
                        Nome
                    </th>
                    <th>
                        Tipo
                    </th>
                    <th>
                        Local
                    </th>
                    <th>
                        Telefone
                    </th>
                    <th>
                        Email
                    </th>
                    <th>
                        Estado
                    </th>
                    <th width="100">
                        Acções
                    </th>
                </tr>
            </thead>

            <tbody>
                @forelse ($agencias as $agencia)
                    <tr>
                        <td>
                            {{ $loop->iteration }}
                        </td>
                        <td>
                            <img src="{{ $agencia->imagem_url }}"
                                 alt="{{ $agencia->nome }}"
                                 class="rounded border"
                                 style="width: 50px; height: 35px; object-fit: cover;">
                        </td>
                        <td>
                            <strong>{{ $agencia->nome }}</strong>
                        </td>
                        <td>
                            <span class="badge bg-{{ $agencia->tipo === 'AGÊNCIA' ? 'primary' : 'info' }}">
                                {{ $agencia->tipo }}
                            </span>
                        </td>
                        <td>
                            {{ $agencia->local }}
                        </td>
                        <td>
                            {{ $agencia->telefone }}
                        </td>
                        <td>
                            {{ $agencia->email }}
                        </td>
                        <td>
                            <span class="badge bg-{{ $agencia->estado ? 'success' : 'danger' }}">
                                {{ $agencia->estado_texto }}
                            </span>
                        </td>
                        <td>
                            <div class="d-flex order-actions">
                                <a href="{{ route('agencias.show', $agencia) }}" class=""
                                    title="Visualizar">
                                    <i class="bx bxs-show text-primary"></i>
                                </a>
                                @can('gerir-agencias')
                                <a href="{{ route('agencias.edit', $agencia) }}" class=""
                                    title="Editar">
                                    <i class="bx bxs-edit text-warning"></i>
                                </a>
                                <form class="d-inline" action="{{ route('agencias.destroy', $agencia) }}"
                                    method="post" onsubmit="return confirm('Tem a certeza?')">
                                    @csrf
                                    @method('DELETE')
                                    <button type="submit" class="border-0 bg-transparent" title="Excluir">
                                        <i class="bx bxs-trash text-danger"></i>
                                    </button>
                                </form>
                                @endcan
                            </div>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td class="text-center" colspan="9">
                            Nenhuma agência encontrada
                        </td>
                    </tr>
                @endforelse
            </tbody>
        @endcomponent
    </main>
@endsection

@push('scripts')
@endpush