@extends('central.dashboard.layouts.master')

@section('sidebar')
    @include('central.dashboard.layouts.sidebar', ['page' => 'admins'])
@endsection

@section('content')
    <div class="row justify-content-center">
        <div class="col-md-10">
            <div class="table-responsive" style="height: 50vh;">
                <div class="d-flex justify-content-between my-2">
                    <h4>مستخدمين لوحة التحكم</h4>
                    @if (Auth::guard('admin')->user()->hasPermissionTo('admins-add', 'admin'))
                        <a href="{{ route('central.dashboard.admins.create') }}" class="btn btn-success">
                            إضافة جديد <i class="fas fa-plus-circle"></i>
                        </a>
                    @endif
                </div>

                <table class="table table-bordered table-borderless table-striped table-hover">
                    <thead>
                        <tr>
                            <th class="d-md-table-cell">#</th>
                            <th class="d-md-table-cell">إسم المستخدم</th>
                            <th class="d-md-table-cell">اجراءات</th>
                        </tr>
                    </thead>

                    <tbody>
                        @forelse ($admins as $admin)
                            <tr>
                                <td class="d-md-table-cell">{{ $loop->iteration }}</td>
                                <td class="d-md-table-cell">{{ $admin->admin_name }}</td>
                                <td class="d-md-table-cell">
                                    @if (Auth::guard('admin')->user()->hasPermissionTo('admins', 'admin'))
                                        <x-operations-btn>
                                            @if (Auth::guard('admin')->user()->hasPermissionTo('admins-edit', 'admin'))
                                                <li>
                                                    <a href="{{ route('central.dashboard.admins.edit', ['admin' => $admin->id]) }}"
                                                        class="btn">
                                                        <i class="fas fa-edit"></i> تعديل
                                                    </a>
                                                </li>
                                            @endif

                                            @if (Auth::guard('admin')->user()->hasPermissionTo('admins-delete', 'admin'))
                                                <li>
                                                    <form
                                                        action="{{ route('central.dashboard.admins.destroy', ['admin' => $admin->id]) }}"
                                                        method="post" class="d-inline-block w-100">
                                                        @csrf
                                                        @method('delete')

                                                        <button type="button" class="btn confirm-delete-btn" name="delete">
                                                            <i class="fas fa-trash-alt"></i> حذف
                                                        </button>
                                                    </form>
                                                </li>
                                            @endif
                                        </x-operations-btn>
                                    @endif
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="100%">
                                    لا يوجد مستخدمين بعد ..
                                </td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection

@push('script')
    <script>
        $(() => {
            $("body").on("click", ".confirm-delete-btn", function(e) {
                $.confirm({
                    title: "هل انت متأكد من حذف هذا المستعدم؟",
                    content: "سيتم حذف هذا الذمة",
                    type: "red",
                    buttons: {
                        ok: {
                            text: "نعم",
                            btnClass: "btn-primary",
                            keys: ["enter"],
                            action: () => {
                                $(this).closest("form").submit();
                            }
                        },
                        cancel: {
                            text: "الغاء",
                            btnClass: "btn-default",
                            keys: ["esc"]
                        }
                    }
                });
            });
        });
    </script>
@endpush