@extends('layouts.app')
@section('title', __('repair::lang.repair') . ' '. __('business.dashboard'))

@section('content')
@include('repair::layouts.nav')
<!-- Content Header (Page header) -->
<section class="content-header">
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5">
            <li class="breadcrumb-item text-sm">
              <a class="text-white opacity-7" href="{{action([\Modules\Repair\Http\Controllers\DashboardController::class, 'index'])}}">
                <i class="ni ni-settings text-sm-i"></i> @lang('repair::lang.repair')
              </a>
            </li>
            <li class="breadcrumb-item text-sm text-white" aria-current="page">
                @lang('business.dashboard')
            </li>
          </ol>
    </nav>
</section>

<!-- Main content -->
<section class="content no-print">
	<div class="pad-15">
		<div class="row">
			<div class="col-md-12">
				<div class="card h-100 shadow-lg mb-20">
		            <div class="card-header pb-0 pt-3 bg-transparent">
		                <h5 class="text-capitalize">
		                <span class="icon icon-shape icon-sm border-radius-md text-center me-2 align-items-center justify-content-center">
		                <i class="fa fa-gem text-primary text-lg opacity-10"></i>
		                </span> @lang('repair::lang.job_sheets_by_status') </h5>
		                <hr class="line-light">
		            </div>
					<div class="card-body p-3">
						<div class="row">
					        @forelse($job_sheets_by_status as $job_sheet)
								<div class="col-md-3 col-sm-6 col-xs-12">
									<div class="small-box" style="background-color: {{$job_sheet->color}};color: #fff;">
							            <div class="inner">
							              	<p>{{$job_sheet->status_name}}</p>
							              	<h3>{{$job_sheet->total_job_sheets}}</h3>
							            </div>
						          	</div>
						        </div>
						    @empty
						    	<div class="col-md-12">
		    						<div class="alert alert-danger">
						                <h4>@lang('repair::lang.no_report_found')</h4>
						            </div>
					           	</div>
							@endforelse
						</div>
					</div>
				</div>
			</div>
		</div>
		@if(in_array('service_staff', $enabled_modules))
			<div class="row">
			    <div class="col-xs-12">
			        @component('components.widget', ['class' => 'box-primary', 'icon' => 'fa fa-address-book text-primary', 'title' => __( 'repair::lang.job_sheets_by_service_staff')])
			        <div class="card">
			            <div class="table-responsive">
							<table class="table align-items-center mb-0 full-width">
								<thead class="thead-light">
									<tr>
										<th class="text-uppercase text-dark text-xs font-weight-bolder">#</th>
										<th class="text-uppercase text-dark text-xs font-weight-bolder">@lang('restaurant.service_staff')</th>
										<th class="text-uppercase text-dark text-xs font-weight-bolder">@lang('repair::lang.total_job_sheets')</th>
									</tr>
								</thead>
								<tbody>
									@foreach($job_sheets_by_service_staff as $job_sheet)
										<tr>
											<td>{{$loop->iteration}}</td>
											<td>{{$job_sheet->service_staff}}</td>
											<td>{{$job_sheet->total_job_sheets}}</td>
										</tr>
									@endforeach
								</tbody>
							</table>
						</div>
					</div>
			        @endcomponent
			    </div>
			</div>
		@endif
		<div class="row">
		    <div class="col-xs-12">
		        @component('components.widget', ['class' => 'box-primary', 'icon' => 'fa fa-chart-line text-primary', 'title' => __( 'repair::lang.trending_brands')])
		            {!!$trending_brand_chart->container()!!}
		        @endcomponent
		    </div>
		</div>
		<div class="row">
		    <div class="col-xs-12">
		        @component('components.widget',['class' => 'box-primary', 'icon' => 'ni ni-chart-bar-32 text-primary', 'title' => __( 'repair::lang.trending_devices')])
		            {!!$trending_devices_chart->container()!!}
		        @endcomponent
		    </div>
		</div>
		<div class="row">
		    <div class="col-xs-12">
		        @component('components.widget',['class' => 'box-primary', 'icon' => 'fa fa-chart-bar text-primary', 'title' => __( 'repair::lang.trending_device_models')])
		            {!!$trending_dm_chart->container()!!}
		        @endcomponent
		    </div>
		</div>
	</div>
</section>
@stop
@section('javascript')
	{!!$trending_devices_chart->script()!!}
	{!!$trending_dm_chart->script()!!}
	{!!$trending_brand_chart->script()!!}
@endsection