@extends('header.header')
@section('content')

    <div class="header bg-primary pb-6  pt-5">
        <div class="container-fluid">
            <div class="header-body">
                <div class="row align-items-center py-4">
                    <div class="col-lg-6 col-7">
                        <h6 class="h2 text-white d-inline-block mb-0">Users</h6>
                        <nav aria-label="breadcrumb" class="d-none d-md-inline-block ml-md-4">
                            <ol class="breadcrumb breadcrumb-links breadcrumb-dark">
                                <li class="breadcrumb-item"><a href="#"><i class="fas fa-home"></i></a></li>
                                <li class="breadcrumb-item"><a href="/">Dashboard</a></li>
                                <li class="breadcrumb-item active" aria-current="page"> Users Admins Table</li>
                            </ol>
                        </nav>
                    </div><br>
                </div>
            </div>
        </div>
    </div>


    <div class="container-fluid mt--6">
        <div class="row">
            <div class="col">
                <div class="card">
                    <!-- Card header -->
                    <div class="card-header border-0">
                        <input class="form-control" id="myInput" type="text" placeholder="Search..">
                    </div>
                    <!-- Light table -->
                    <div class="table-responsive">
                        <table class="table align-items-center table-flush">
                            <thead class="thead-light">
                            <tr >
                                <th scope="col" class="sort" data-sort="budget">ID</th>
                                <th scope="col" class="sort" data-sort="budget">image</th>
                                <th scope="col" class="sort" data-sort="budget">Name</th>
                                <th scope="col" class="sort" data-sort="budget">Email</th>
                                <th scope="col" class="sort" data-sort="budget">Mobile number</th>
                                <th scope="col" class="sort" data-sort="budget">Type</th>
                                <th scope="col" class="sort" data-sort="budget">Status</th>
                                <th scope="col" class="sort" data-sort="budget">Action</th>


                                <th scope="col"></th>
                            </tr>
                            </thead>
                            <tbody class="list" id="myTable">
                            @foreach($users as $user)
                                <tr id="User{{$user->id}}">
                                    <td>{{$user->id}}</td>
                                    <td>
                                        <a href="#" class="avatar rounded-circle mr-3">
                                            <img alt="Image placeholder" src="{{asset('assets/img/brand/Deselect.png')}}">
                                        </a>
                                    </td>
                                    <td>{{$user->name}}</td>
                                    <td>{{$user->email}}</td>
                                    <td>{{$user->MobileNumber}}</td>
                                    <td>{{$user->role == 2 ? "super admin" : "admin"}}</td>
                                    <td>
                                        <div class="onoffswitch">
                                            <input type="checkbox" name="onoffswitch"  class="onoffswitch-checkbox" id="myonoffswitch1{{$user->id}}" tabindex="0" {{ checked("status", 1, $user) }}>
                                            <label class="onoffswitch-label" for="myonoffswitch1{{$user->id}}">
                                                <span class="onoffswitch-inner"></span>
                                                <span class="onoffswitch-switch"></span>
                                            </label>
                                        </div>
                                    </td>
                                    <td id="ignorStyle">
{{--                                        <form action="#" method="post" class="makeITinline">--}}
{{--                                            <button type="button" class="btn btn-outline-default" >--}}
{{--                                                <i class="fas fa-paper-plane"></i>--}}
{{--                                            </button>--}}
{{--                                        </form>--}}
                                        @if(Gate::check("update-employee-or-admin-user") || Auth::user()->role <= 2)
                                            <form action="" method="get" class="makeITinline">
                                                <a href="{{route("admin.users.edit", $user->id)}}" type="button" class="btn btn-outline-primary" >
                                                    <i class="fas fa-user-edit"></i>
                                                </a>
                                            </form>
                                        @endif
                                        @if(Gate::check("delete-employee-or-admin-user") || Auth::user()->role <= 2)
                                            <form action="{{route("admin.users.destroy", $user->id)}}" method="post" class="makeITinline">
                                                @csrf
                                                @method("delete")
                                                <button type="submit" class="btn btn-outline-danger" >
                                                    <i class="fas fa-user-times"></i>
                                                </button>
                                            </form>
                                        @endif
                                    </td>
                                </tr>


                            @endforeach
                            </tbody>
                        </table>
                    </div>
                    <!-- Card footer -->
{{--                    <div class="card-footer py-4">--}}
{{--                        <nav aria-label="...">--}}
{{--                            <ul class="pagination justify-content-end mb-0">--}}
{{--                                <li class="page-item disabled">--}}
{{--                                    <a class="page-link" href="#" tabindex="-1">--}}
{{--                                        <i class="fas fa-angle-left"></i>--}}
{{--                                        <span class="sr-only">Previous</span>--}}
{{--                                    </a>--}}
{{--                                </li>--}}
{{--                                <li class="page-item active">--}}
{{--                                    <a class="page-link" href="#">1</a>--}}
{{--                                </li>--}}
{{--                                <li class="page-item">--}}
{{--                                    <a class="page-link" href="#">2 <span class="sr-only">(current)</span></a>--}}
{{--                                </li>--}}
{{--                                <li class="page-item"><a class="page-link" href="#">3</a></li>--}}
{{--                                <li class="page-item">--}}
{{--                                    <a class="page-link" href="#">--}}
{{--                                        <i class="fas fa-angle-right"></i>--}}
{{--                                        <span class="sr-only">Next</span>--}}
{{--                                    </a>--}}
{{--                                </li>--}}
{{--                            </ul>--}}
{{--                        </nav>--}}
{{--                    </div>--}}
                </div>
            </div>
        </div>
    </div>
        <!-- Dark table -->



@endsection