@extends('settings::layouts.master',[

'title' => __('users') ,

'crumbs' => [
    [ '#',__('users') ],
]])
@can ( 'create_users')
    @section('header-l')


        <a href={{ route('settings.users.create') }} class="btn btn-primary">
            <i class='fa fa-plus'></i> @lang('add') </a>
    @stop
@endcan
@section('content')


@component('settings::components.table')
@slot('th')
    <th># </th>
    <th>@lang('name')</th>
    <th>@lang('phone')</th>
    <th>@lang('email')</th>
    <th>@lang('role')</th>

    {{-- <th>@lang('image')</th> --}}
    <th>@lang('action')</th>
@endslot
@slot('tbody')

@forelse($users as $user)




          <tr>
            <td>
                {{$user->id}}
              </td>
            <td>
              <div class="d-flex px-2">
                <div>
                  <img src="https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-xd.svg" class="avatar avatar-sm rounded-circle me-2">
                </div>
                <div class="my-auto">
                  <h6 class="mb-0 text-xs">{{$user->name}}</h6>
                </div>
              </div>
            </td>
            <td>
              {{$user->phone}}
            </td>
            <td>
                {{$user->email}}
              </td>
              <td>
                {{$user->my_roles}}
              </td>


            <td class="align-middle">
                <div class="dropdown">
                    <button class="btn bg-gradient-info dropdown-toggle" type="button" id="dropdownMenuButton" data-bs-toggle="dropdown" aria-expanded="false">
                     @lang('action')
                    </button>
                    <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                      <li><a class="dropdown-item" href="{{route('settings.users.show',$user->id)}}">

                        @lang('show')
                    </a></li>
                      <li><a class="dropdown-item" href="{{route('settings.users.edit',$user->id)}}"> @lang('edit')</a></li>
                      <li><a class="dropdown-item" href="#">Something else here</a></li>
                    </ul>
                  </div>
            </td>
          </tr>
          @empty
          @endforelse
@endslot
@endcomponent




@endsection