@extends('layouts.basic')
@section('content')
<div class="container-fluid">
   <div class="page-title">
      <div class="row">
         <div class="col-6">
            <h3>Users  </h3>
         </div>
         <div class="col-6">
            <ol class="breadcrumb">
               <li class="breadcrumb-item"><a href="{{ route('home') }}"><i data-feather="home"></i></a></li>
               <li class="breadcrumb-item">Masters</li>
               <li class="breadcrumb-item active">Users -list</li>
            </ol>
         </div>
      </div>
   </div>
</div>
<!-- Container-fluid starts-->
<section class="content d-none">
   <div class="row page-containers">
      <div class="col-12">
         <div class="card content-card">
            <div class="card-body">
               <div class="row no-print align-items-center table-top-div">
                   <div class="col-lg-6">
                       <div>
                          <h6 class="table-headings"> Upload Users</h6>
                       </div>
                   </div>


               </div>
               <div class="row filter-row">
                   {{-- @if (session('success'))
                       <div class="alert alert-success">
                           {{ session('success') }}
                       </div>
                   @endif --}}
               <form id="import_form" action="{{ route('import-users') }}" method="post" enctype="multipart/form-data" class="row g-3 align-items-center">
                   @csrf
                   <div class="col-auto">
                       <span  class="form-text">
                           Import files hear :<span style="color: red">(It should be an .xlsx,.xls)</span>
                       </span>
                     </div>

                   <div class="col-auto">

                     <input type="file" class="form-control" name="file" required  accept=".xlsx,.xls ">
                   </div>
                   <div class="col-auto">
                       <button type="reset" class="btn btn-dark" >Clear</button>
                   </div>
                   <div class="col-auto">
                       <button type="submit" class="btn btn-success">Upload</button>
                   </div>
                 </form>
            </div>
         </div>
      </div>
   </div>
</section>
<br>
<div class="content content-card">
<div class="container-fluid">
   <div class="row">
      <div class="col-sm-12">
         <div class="card">
            <div class="card-body">
               @if ($message = Session::get('success'))
               <div class="alert alert-success">
                  <p>{{ $message }}</p>
               </div>
               @endif
               <div class="">
                  <div class="row no-print align-items-center table-top-div">
                     <div class="col-lg-6">
                        <div>
                           <h6 class="table-headings">Users List</h6>
                        </div>
                     </div>
                     <div class="col-lg-6">
                     <div class="add-button">
                        @can('role-create')
                        <a class="btn btn-secondary" href="{{ route('users.create') }}"> Create New User </a>
                        @endcan
                     </div>
                  </div>
                  </div>

               </div>
               <br>
               <table class="table table-bordered" id="user_tables">
                  <thead>
                     <tr class="table table-secondary">
                        <th>S.No</th>
                        <th>Name</th>
                        <th>Email</th>
                        <th>Mobile Number</th>
                        <th>Roles</th>
                        <th width="180px">Action</th>
                     </tr>
                  </thead>

                  <tbody>
                      @foreach ($data as $user)
                     <tr>
                        <td>{{ $loop->iteration }}</td>
                        <td>{{ $user->name }}</td>
                        <td>{{ $user->email }}</td>
                        <td>{{ $user->mobile_number ??"-" }}</td>
                        <td>
                           @if(!empty($user->getRoleNames()))
                           @foreach($user->getRoleNames() as $v)
                           <label class="badge blue-badge">{{ $v }}</label>
                           @endforeach
                           @endif
                        </td>
                        <td>
                           <a class="btn table-action-btn table-edit-btn" href="{{ route('users.show',$user->id) }}"><i class="bi bi-eye-fill"></i></a>&nbsp;
                           @can('role-edit')
                           <a class="btn table-view-btn table-action-btn" href="{{ route('users.edit',$user->id) }}"><i class="bi bi-pencil-square"></i></a>&nbsp;
                           @endcan
                           @can('role-delete')
                           <form method="POST" action="{{ route('users.destroy', $user->id) }}" style="display: inline">
                              @method('DELETE')
                              @csrf
                              <button type="submit" class="btn table-del-btn table-action-btn" onclick="return confirmDelete()">
                                  <i class="bi bi-trash-fill"></i>
                              </button>
                          </form>

                           @endcan
                        </td>
                     </tr>
                     @endforeach
                  </tbody>
               </table>
               {{-- {!! $data->render() !!} --}}
            </div>
         </div>
      </div>
   </div>
</div>
</div>
@endsection
@section('script')


<script>
   // $('#user_tables').DataTable( {
   //    responsive: true,
   //   ordering: false,
   // //   bFilter: false
   //  //  searching:true
   //   });


   $(document).ready(function() {

$('#user_tables').DataTable( {
    responsive: true,
    ordering: false,

} );
});
//   $('#user_tables').DataTable( {
//         responsive: true,
//         ordering: false,
//         pagination:true
//         } );


   function confirmDelete() {
       if (confirm('Are you sure you want to delete this user?')) {
           // If the user clicks "OK," proceed with the form submission
           return true;
       } else {
           // If the user clicks "Cancel," prevent the form submission
           return false;
       }
   }
   </script>

@endsection