<div>
|
|
|
|
<h1 class="text-3xl font-bold">
|
|
{{ __('associates.model') }}
|
|
</h1>
|
|
|
|
<div class="flex items-center justify-between px-4 py-3 sm:px-6">
|
|
|
|
<x-input.select wire:model="perPage">
|
|
<option>10</option>
|
|
<option>25</option>
|
|
<option>50</option>
|
|
<option>100</option>
|
|
</x-input.select>
|
|
|
|
<x-input.text wire:model.debounce.300ms="search" />
|
|
|
|
</div>
|
|
|
|
<div class="flex flex-col">
|
|
<div class="-my-2 py-2 overflow-x-auto sm:-mx-6 sm:px-6 lg:-mx-8 lg:px-8">
|
|
<div class="align-middle inline-block min-w-full shadow overflow-hidden sm:rounded-lg border-b border-gray-200">
|
|
<table class="min-w-full">
|
|
|
|
<thead>
|
|
<tr>
|
|
<th class="px-6 py-3 border-b border-gray-200 bg-gray-50 text-left text-xs leading-4 font-medium text-gray-500 uppercase tracking-wider">
|
|
{{ __('associates.attributes.name') }}
|
|
</th>
|
|
<th class="px-6 py-3 border-b border-gray-200 bg-gray-50 text-left text-xs leading-4 font-medium text-gray-500 uppercase tracking-wider">
|
|
{{ __('associates.attributes.category') }}
|
|
</th>
|
|
<th class="px-6 py-3 border-b border-gray-200 bg-gray-50 text-left text-xs leading-4 font-medium text-gray-500 uppercase tracking-wider">
|
|
{{ __('associates.attributes.address.city') }}
|
|
</th>
|
|
<th class="px-6 py-3 border-b border-gray-200 bg-gray-50 text-left text-xs leading-4 font-medium text-gray-500 uppercase tracking-wider">
|
|
{{ __('associates.attributes.created_at') }}
|
|
</th>
|
|
<th class="px-6 py-3 border-b border-gray-200 bg-gray-50"></th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody class="bg-white">
|
|
@foreach ($associates as $associate)
|
|
<tr>
|
|
|
|
<td class="px-6 py-4 whitespace-no-wrap border-b border-gray-200">
|
|
<div class="flex items-center">
|
|
|
|
<div class="flex-shrink-0 h-10 w-10">
|
|
<img class="h-10 w-10 rounded-full" src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="" />
|
|
</div>
|
|
|
|
<div class="ml-4">
|
|
<div class="text-sm leading-5 font-medium text-gray-900">
|
|
{{ $associate->name }}
|
|
</div>
|
|
<div class="text-sm leading-5 text-gray-500">
|
|
{{ $associate->email }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
|
|
<td class="px-6 py-4 whitespace-no-wrap border-b border-gray-200">
|
|
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">
|
|
{{ __('associate_categories.' . $associate->category->key ) }}
|
|
</span>
|
|
</td>
|
|
|
|
<td class="px-6 py-4 whitespace-no-wrap border-b border-gray-200">
|
|
|
|
<div class="text-sm leading-5 text-gray-900">
|
|
{{ $associate->address['city'] }}
|
|
</div>
|
|
|
|
<div class="text-sm leading-5 text-gray-500">
|
|
{{ $associate->address['state'] }}
|
|
</div>
|
|
|
|
</td>
|
|
|
|
<td class="px-6 py-4 whitespace-no-wrap border-b border-gray-200 text-sm leading-5 text-gray-500">
|
|
{{ $associate->created_at->format('d/m/Y') }}
|
|
</td>
|
|
|
|
<td class="px-6 py-4 whitespace-no-wrap text-right border-b border-gray-200 text-sm leading-5 font-medium">
|
|
<a href="#" class="text-indigo-600 hover:text-indigo-900">Edit
|
|
</a>
|
|
</td>
|
|
|
|
</tr>
|
|
@endforeach
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-4">
|
|
{{ $associates->links() }}
|
|
</div>
|
|
|
|
</div>
|