@extends('backend.layouts.master')

@section('title')
Quản lý Quản trị viên
@endsection

@section('page-header')
<div class="row g-2 align-items-center">
    <div class="col">
        <h2 class="page-title">
            Tất cả Quản trị viên
        </h2>
    </div>
    <div class="col-auto ms-auto d-print-none">
        @if (Auth::guard('admin')->user()->can('admin.create'))
        <a href="{{ route('admin.admins.create') }}" class="btn btn-primary">
            <!-- Download SVG icon from http://tabler-icons.io/i/plus -->
            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24"
                stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                <path d="M12 5l0 14"></path>
                <path d="M5 12l14 0"></path>
            </svg>
            Tạo mới Quản trị viên
        </a>
        @endif
    </div>
</div>
@endsection

@section('styles')
@include('backend.pages.partials.style_index')
@endsection

@section('admin-content')
<div class="card">
    <div class="card-body">
        <div class="row">
            <div class="col-sm-5">
                <h4 class="card-title mb-0">
                    Danh sách Quản trị viên
                </h4>
            </div>
            <!--col-->
        </div>
        <!--row-->
        <div class="row mt-4">
            <div class="col">
                <div class="table-responsive" style="overflow-y:visible;overflow-x:visible;">
                    @include('backend.layouts.partials.messages')
                    <table class="table" id="dataTable">
                        <thead>
                            <tr>
                                <th width="5%">No</th>
                                <th width="10%">Tên</th>
                                <th width="10%">Email</th>
                                <th width="40%">Vai trò</th>
                                <th width="15%"></th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($admins as $admin)
                            <tr>
                                <td>{{ $loop->index+1 }}</td>
                                <td>{{ $admin->name }}</td>
                                <td>{{ $admin->email }}</td>
                                <td>
                                    @foreach ($admin->roles as $role)
                                    <span class="badge badge-info mr-1">
                                        {{ $role->name }}
                                    </span>
                                    @endforeach
                                </td>
                                <td>
                                    @if (Auth::guard('admin')->user()->can('admin.edit'))
                                    <a class="btn btn-success text-white btn-edit"
                                        href="{{ route('admin.admins.edit', $admin->id) }}">Sửa</a>
                                    @endif

                                    @if (Auth::guard('admin')->user()->can('admin.delete'))
                                    <form method="POST" action="{{ route('admin.admins.destroy', $admin->id) }}">
                                        @method('DELETE')
                                        @csrf
                                        <input name="_method" type="hidden" value="DELETE">
                                        <button type="submit" class="btn btn-danger btn-flat remove_row"
                                            data-toggle="tooltip" title="Delete">
                                            <i class="fa fa-trash"></i> Xóa
                                        </button>
                                    </form>
                                    @endif
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
            <!--col-->
        </div>
        <!--row-->
    </div>
    <!--card-body-->
</div>
@endsection

@section('scripts')
@include('backend.pages.partials.script_index')

<script>
    /*================================
datatable active
==================================*/
if ($('#dataTable').length) {
    $('#dataTable').DataTable({
        responsive: false
    });
}

$('.remove_row').click(function(event) {
    event.preventDefault();

    Swal.fire({
        title: "Bạn có chắc muốn xóa dòng này không?",
        text: "Nếu như bạn xóa, dòng dữ liệu này sẽ không thể khôi phục.",
        icon: "warning",
        showCancelButton: true,
        confirmButtonColor: "#3085d6",
        cancelButtonColor: "#d33",
        confirmButtonText: "Xóa"
    }).then((result) => {
        if (result.isConfirmed) {
            $(this).closest("form").submit();
        }
    });
});
</script>
@endsection