You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
234 lines
11 KiB
234 lines
11 KiB
<div class="pt-2 pb-6">
|
|
|
|
<nav class="text-black font-bold" aria-label="Breadcrumb">
|
|
<ol class="list-none p-0 inline-flex">
|
|
<li class="flex items-center">
|
|
<span>
|
|
{{ __('associates.model') }}
|
|
</span>
|
|
@svg('breadcrumb-separator', 'fill-current w-3 h-3 mx-3')
|
|
</li>
|
|
<li>
|
|
<a href="{{ route('collaborators.associates.index') }}" class="text-gray-500" aria-current="page">
|
|
{{ __('associates.index') }}
|
|
</a>
|
|
</li>
|
|
</ol>
|
|
</nav>
|
|
|
|
<div class="flex items-center justify-between mt-4 py-4">
|
|
|
|
<div class="flex space-x-4">
|
|
|
|
<label class="flex-grow">
|
|
|
|
<span class="sr-only">
|
|
{{ __('Search:') }}
|
|
</span>
|
|
|
|
<div class="-mt-1">
|
|
<x-input.text wire:model.debounce.300ms="search" placeholder="{{ __('Search') }}" />
|
|
</div>
|
|
|
|
</label>
|
|
|
|
<div x-data="">
|
|
<button type="button" x-on:click="document.getElementById('filters-modal').dispatchEvent(new Event('open-modal'))" class="flex justify-center px-4 py-2 text-sm font-medium text-gray-800 bg-gray-300 border border-transparent rounded-md hover:bg-gray-600 hover:text-white flex-grow-0 focus:outline-none focus:border-green-700 focus:shadow-outline-green active:bg-green-700 transition duration-150 ease-in-out">
|
|
{{ __('Advanced') }}
|
|
</button>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<label class="flex items-center">
|
|
|
|
<span class="text-gray-700">
|
|
{{ __('Show') }}
|
|
</span>
|
|
|
|
<div class="mx-2 -mt-1">
|
|
<x-input.select wire:model="perPage">
|
|
<option>10</option>
|
|
<option>25</option>
|
|
<option>50</option>
|
|
<option>100</option>
|
|
</x-input.select>
|
|
</div>
|
|
|
|
<span class="text-gray-700">
|
|
{{ __('entries') }}
|
|
</span>
|
|
|
|
</label>
|
|
|
|
</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 class="hover:bg-gray-100">
|
|
|
|
<td class="px-6 py-4 whitespace-no-wrap border-b border-gray-200">
|
|
<a href="{{ route('collaborators.associates.show', compact('associate')) }}" 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>
|
|
</a>
|
|
</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="{{ route('collaborators.associates.edit', compact('associate')) }}" class="text-indigo-600 hover:text-indigo-900">
|
|
{{ __('Edit') }}
|
|
</a>
|
|
</td>
|
|
|
|
</tr>
|
|
@endforeach
|
|
</tbody>
|
|
</table>
|
|
{{ $associates->links() }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@section('modals')
|
|
<div
|
|
id="filters-modal"
|
|
x-data="{ open: false }"
|
|
x-on:open-modal="open = true"
|
|
x-on:keydown.escape.window="open = false"
|
|
>
|
|
<div
|
|
x-bind:class="{
|
|
'hidden': ! open,
|
|
'fixed inset-0 w-full h-full flex items-center justify-center': true,
|
|
}"
|
|
role="dialog"
|
|
aria-labeledby="filters-modal-title"
|
|
>
|
|
<div
|
|
x-on:click.away="open = false"
|
|
class="modal-container bg-white w-11/12 md:max-w-md mx-auto rounded shadow-lg z-50 overflow-y-auto"
|
|
>
|
|
|
|
<div class="modal-content py-4 text-left px-6">
|
|
|
|
<div class="flex justify-between items-center">
|
|
|
|
<h2 id="filters-modal-title" class="text-2xl font-bold">
|
|
{{ __('Advanced filters') }}
|
|
</h2>
|
|
|
|
<div
|
|
x-on:click="open = false"
|
|
class="modal-close cursor-pointer z-50"
|
|
>
|
|
<svg class="fill-current text-black" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
|
|
<path d="M14.53 4.53l-1.06-1.06L9 7.94 4.53 3.47 3.47 4.53 7.94 9l-4.47 4.47 1.06 1.06L9 10.06l4.47 4.47 1.06-1.06L10.06 9z"></path>
|
|
</svg>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="mt-6">
|
|
<form method="GET" id="filters-form" class="flex flex-col space-y-4">
|
|
|
|
<x-input.group label="{{ __('associate_categories.model') }}" for="associate_category_id">
|
|
<x-input.select name="associate_category_id" id="associate_category_id">
|
|
@foreach (\App\AssociateCategory::all() as $category)
|
|
<option value="{{ $category->id }}">
|
|
{{ __('associate_categories.' . $category->key) }}
|
|
</option>
|
|
@endforeach
|
|
</x-input.select>
|
|
</x-input.group>
|
|
|
|
<x-input.group label="{{ __('associates.attributes.profile.gender') }}" for="gender">
|
|
<x-input.select name="gender" id="gender">
|
|
<option value="male">Homem</option>
|
|
<option value="female">Mulher</option>
|
|
<option value="other">Outro</option>
|
|
</x-input.select>
|
|
</x-input.group>
|
|
|
|
</form>
|
|
</div>
|
|
|
|
<div class="flex justify-end space-x-2 mt-6">
|
|
|
|
<button
|
|
x-on:click="open = false"
|
|
class="bg-transparent px-4 py-2 rounded-lg text-green-700 hover:bg-gray-100 transition duration-150 ease-in-out"
|
|
>
|
|
{{ __('Cancel') }}
|
|
</button>
|
|
|
|
<button type="submit" form="filters-form" class="flex justify-center px-4 py-2 text-sm font-medium text-gray-800 bg-gray-300 border border-transparent rounded-md hover:bg-gray-600 hover:text-white flex-grow-0 focus:outline-none focus:border-green-700 focus:shadow-outline-green active:bg-green-700 transition duration-150 ease-in-out">
|
|
{{ __('Filter') }}
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal-overlay absolute w-full h-full bg-gray-900 opacity-50"></div>
|
|
|
|
</div>
|
|
</div>
|
|
@endsection
|