@extends('laravelticket::layouts.master')

@section('page', trans('laravelticket::admin.agent-index-title'))

@section('laravelticket_header')
    {{ html()->a(route($setting->grab('admin_route').'.agent.create'), trans('laravelticket::admin.btn-create-new-agent'))
        ->class('inline-flex items-center px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium rounded-md transition-colors') }}
@stop

@section('laravelticket_content_parent_class', 'p-0')

@section('laravelticket_content')
    @if ($agents->isEmpty())
        <div class="p-6 text-center text-gray-500 dark:text-gray-400">
            {{ trans('laravelticket::admin.agent-index-no-agents') }}
            <a href="{{ route($setting->grab('admin_route').'.agent.create') }}" class="text-blue-600 dark:text-blue-400 underline ml-1">
                {{ trans('laravelticket::admin.agent-index-create-new') }}
            </a>
        </div>
    @else
        <div id="message"></div>
        <div class="overflow-x-auto">
            <table class="w-full text-sm text-left text-gray-400 dark:text-gray-400">
                <thead class="text-xs text-white uppercase bg-gray-700 dark:bg-gray-900">
                    <tr>
                        <th class="px-4 py-3">{{ trans('laravelticket::admin.table-id') }}</th>
                        <th class="px-4 py-3">{{ trans('laravelticket::admin.table-name') }}</th>
                        <th class="px-4 py-3">{{ trans('laravelticket::admin.table-categories') }}</th>
                        <th class="px-4 py-3">{{ trans('laravelticket::admin.table-join-category') }}</th>
                        <th class="px-4 py-3">{{ trans('laravelticket::admin.table-remove-agent') }}</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-gray-200 dark:divide-gray-700">
                @foreach($agents as $agent)
                    <tr class="hover:bg-gray-50 dark:hover:bg-gray-700/50">
                        <td class="px-4 py-3">{{ $agent->id }}</td>
                        <td class="px-4 py-3">{{ $agent->name }}</td>
                        <td class="px-4 py-3">
                            @foreach($agent->categories as $category)
                                <span style="color: {{ $category->color }}" class="text-sm">{{ $category->name }}</span>
                            @endforeach
                        </td>
                        <td class="px-4 py-3">
                            {!! html()->form('PATCH', route($setting->grab('admin_route').'.agent.update', $agent->id))->open() !!}
                            <div class="space-y-1">
                                @foreach(\Binshops\LaravelTicket\Models\Category::all() as $agent_cat)
                                    <label class="flex items-center gap-2 text-sm text-gray-700 dark:text-gray-300">
                                        <input name="agent_cats[]" type="checkbox" class="rounded border-gray-300 dark:border-gray-600"
                                               value="{{ $agent_cat->id }}"
                                               {!! ($agent_cat->agents()->where("id", $agent->id)->count() > 0) ? "checked" : "" !!}>
                                        {{ $agent_cat->name }}
                                    </label>
                                @endforeach
                            </div>
                            {!! html()->submit(trans('laravelticket::admin.btn-join'))
                                ->class('mt-2 inline-flex items-center px-3 py-1 bg-indigo-600 hover:bg-indigo-700 text-white text-xs font-medium rounded transition-colors') !!}
                            {!! html()->closeModelForm() !!}
                        </td>
                        <td class="px-4 py-3">
                            {!! html()->form('DELETE', route($setting->grab('admin_route').'.agent.destroy', $agent->id))->id("delete-$agent->id")->open() !!}
                            {!! html()->submit(trans('laravelticket::admin.btn-remove'))
                                ->class('inline-flex items-center px-3 py-1 bg-red-600 hover:bg-red-700 text-white text-xs font-medium rounded transition-colors') !!}
                            {!! html()->closeModelForm() !!}
                        </td>
                    </tr>
                @endforeach
                </tbody>
            </table>
        </div>
    @endif
@stop