@extends('layouts.admin')

@section('content')

            <main class="content">
				<div class="container-fluid p-0">

					<div class="row mb-2 mb-xl-3">
						<div class="col-auto d-none d-sm-block">
							<h3>USER / LIST</h3>
						</div>

					</div>
					<div class="row">
						<div class="col-sm-6 col-xl-3">
							<div class="card">
								<div class="card-body">
									<div class="row">
										<div class="col mt-0">
											<h5 class="card-title">Total User</h5>
										</div>

										<div class="col-auto">
											<div class="stat text-primary">
											<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-users align-middle me-2"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle><path d="M23 21v-2a4 4 0 0 0-3-3.87"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path></svg>
											</div>
										</div>
									</div>
									<h1 class="mt-1 mb-3">{{$userCount['total']}}</h1>
								
								</div>
							</div>
						</div>
						<div class="col-sm-6 col-xl-3">
							<div class="card">
								<div class="card-body">
									<div class="row">
										<div class="col mt-0">
											<h5 class="card-title">Active User</h5>
										</div>

										<div class="col-auto">
											<div class="stat bg-success text-primary">
											<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-user-check align-middle me-2"><path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="8.5" cy="7" r="4"></circle><polyline points="17 11 19 13 23 9"></polyline></svg>
											</div>
										</div>
									</div>
									<h1 class="mt-1 mb-3">{{$userCount['active']}}</h1>
									
								</div>
							</div>
						</div>
						<div class="col-sm-6 col-xl-3">
							<div class="card">
								<div class="card-body">
									<div class="row">
										<div class="col mt-0">
											<h5 class="card-title">Inactive</h5>
										</div>

										<div class="col-auto">
											<div class="stat bg-warning text-primary">
											<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-user-minus align-middle me-2"><path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="8.5" cy="7" r="4"></circle><line x1="23" y1="11" x2="17" y2="11"></line></svg>
											</div>
										</div>
									</div>
									<h1 class="mt-1 mb-3">{{$userCount['inactive']}}</h1>
								
								</div>
							</div>
						</div>
						<div class="col-sm-6 col-xl-3">
							<div class="card">
								<div class="card-body">
									<div class="row">
										<div class="col mt-0">
											<h5 class="card-title">Disabled</h5>
										</div>

										<div class="col-auto">
											<div class="stat bg-danger text-primary">
											<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-user-x align-middle me-2"><path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="8.5" cy="7" r="4"></circle><line x1="18" y1="8" x2="23" y2="13"></line><line x1="23" y1="8" x2="18" y2="13"></line></svg>
											</div>
										</div>
									</div>
									<h1 class="mt-1 mb-3">{{$userCount['disabled']}}</h1>
								
								</div>
							</div>
						</div>
					</div>
@include('components.admin.error-message')
			        <div class="row">
    <div class="col-xl-12">
        <div class="card">
            <div class="card-header pb-0">
                <div class="card-actions float-end">
                    
                </div>
                <h5 class="card-title mb-0">Clients</h5>
            </div>
            <div class="card-body tableRes">
                <table class="table table-responsive table-striped" style="width: 100%;">
                    <thead>
                        <tr>
                            <th></th>
                            <th>USER</th>
                            <th class="">EMAIL</th>
                            <th class="">STATUS</th>
                            <th class="">DATE</th>
                            <th>ACTION</th>
                        </tr>
                    </thead>
                    <tbody>
                   @if(!empty($clients))
                                @for($i = 0; $i < count($clients); $i++)
                        <tr class="@if($i % 2 == 0 ) odd @else even @endif">
                            <td tabindex="0"></td>
                            <td>
                                <div class="d-flex justify-content-start align-items-center user-name">
                               
                                    <div class="d-flex flex-column">
                                        <a href="{{route("admin.user.single", $clients[$i]->username)}}" class="text-body text-truncate"><span class="fw-semibold">{{$clients[$i]->name}} </span></a><small class="text-muted">{{$clients[$i]->username}}</small>
                                    </div>
                                </div>
                            </td>
                            
                            <td><a href="{{route("admin.user.single", $clients[$i]->username)}}" class="text-body text-truncate">{{$clients[$i]->email}}</a></td>
                            <td><span class="badge bg-success">{{$clients[$i]->status}}</span></td>
                            <td>{{\Carbon\Carbon::parse($clients[$i]->created_at)->toDayDateTimeString()}}</td>
                            <td>
                                <div class="d-inline-flex text-nowrap">
                                    <a href='{{route("admin.user.single", $clients[$i]->username)}}' class="btn btn-sm btn-icon">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-edit align-middle me-2"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg>
                                    </a>
                                    <button class="btn btn-sm btn-icon delete_data" data-name=" user ({{$clients[$i]->email}})" data-url="{{route('admin.user.delete' , $clients[$i]->id)}}">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-trash-2 align-middle me-2"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>
                                    </button>
                                 
                                </div>
                            </td>
                        </tr>
                         @endfor
                                @endif
                        
                    </tbody>
                </table>
                
                {{$clients->links()}}
            </div>
        </div>
    </div>

</div>



				</div>
			</main>

@endsection
