{{--@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="card">
                <div class="card-header">Dashboard</div>

                <div class="card-body">
                    @if (session('status'))
                        <div class="alert alert-success" role="alert">
                            {{ session('status') }}
                        </div>
                    @endif

                    You are logged in!
                </div>
            </div>
        </div>
    </div>
</div>
@endsection--}}

@extends('layouts.master')

@section('content')
<div class="main-panel">
        <!-- BEGIN : Main Content-->
        <div class="main-content">
          <div class="content-wrapper">
            <!-- Minimal statistics section start -->
            <section id="minimal-statistics">
              <div class="row">
                <div class="col-12 mt-3 mb-1">
                  <div class="content-header">Running Orders</div>
                  {{-- <p class="content-sub-header">Statistics on minimal cards.</p> --}}
                </div>
              </div>

              <div class="row" matchheight="card">
                  
          
                  <div class="col-xl-4 col-lg-6 col-12">
                    <div class="card">
                      <div class="card-content">
                        <div class="px-3 py-3">
                          <div class="media">
                            <a href="@if(!empty($businessOrders)){{ route('runningOrders', $businessOrders) }} @endif">
                            <div class="media-body text-left">
                              <h3 class="mb-1 primary">
                              @if($businessOrders=='')
                              0
                              @else
                             
                              {{ count(explode(",",$businessOrders)) }}

                              @endif
                                </h3>
                              <span>Business owners</span>
                            </div>
                          </a>
                            <div class="media-right align-self-center">
                              <i class="fa fa-users primary font-large-2 float-right"></i>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>

                  <div class="col-xl-4 col-lg-6 col-12">
                    <div class="card">
                      <div class="card-content">
                        <div class="px-3 py-3">
                          <div class="media">
                            <a href="@if(!empty($freelancerOrders)){{ route('freelancerOrders', $freelancerOrders) }} @endif">
                            <div class="media-body text-left">
                              <h3 class="mb-1 primary">
                                @if($freelancerOrders=='')
                              0
                              @else
                             
                              {{ count(explode(",",$freelancerOrders)) }}

                              @endif
                                </h3>
                              <span>Freelancers</span>
                            </div>
                            </a>
                            <div class="media-right align-self-center">
                              <i class="fa fa-users primary font-large-2 float-right"></i>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>

                  <div class="col-xl-4 col-lg-6 col-12">
                    <div class="card">
                      <div class="card-content">
                        <div class="px-3 py-3">
                          <div class="media">
                            <a href="@if(!empty($driverOrders)){{ route('driverOrders', $driverOrders) }} @endif">
                            <div class="media-body text-left">
                              <h3 class="mb-1 primary">
                                @if($driverOrders=='')
                              0
                              @else
                             
                              {{ count(explode(",",$driverOrders)) }}

                              @endif
                                </h3>
                              <span>Drivers</span>
                            </div>
                            </a>
                            <div class="media-right align-self-center">
                              <i class="fa fa-users primary font-large-2 float-right"></i>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                 
                  <!--
     > Business owner  (Show number of assigned ones)
     > Freelancer  (Show number of assigned ones)
     > Drivers (Show how many drivers are running)
                  -->
                  
          
            
                  </div>

              <div class="row" matchHeight="card">
                {{-- <div class="col-xl-3 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                          <div class="media-body text-left">
                            <h3 class="mb-1 primary">278</h3>
                            <span>New Posts</span>
                          </div>
                          <div class="media-right align-self-center">
                            <i class="icon-book-open primary font-large-2 float-right"></i>
                          </div>
                        </div>
                        <div class="mt-2 mb-0">
                          <ngb-progressbar type="primary" [value]="80" class="progress-bar-sm"></ngb-progressbar>
                        </div>
                      </div>
                    </div>
                  </div>
                </div> --}}
                {{-- <div class="col-xl-3 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                          <div class="media-body text-left">
                            <h3 class="mb-1 warning">156</h3>
                            <span>New Comments</span>
                          </div>
                          <div class="media-right align-self-center">
                            <i class="icon-bubbles warning font-large-2 float-right"></i>
                          </div>
                        </div>
                        <div class="mt-2 mb-0">
                          <ngb-progressbar type="warning" [value]="35" class="progress-bar-sm"></ngb-progressbar>
                        </div>
                      </div>
                    </div>
                  </div>
                </div> --}}

                {{-- <div class="col-xl-3 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                          <div class="media-body text-left">
                            <h3 class="mb-1 success">64.89 %</h3>
                            <span>Bounce Rate</span>
                          </div>
                          <div class="media-right align-self-center">
                            <i class="icon-cup success font-large-2 float-right"></i>
                          </div>
                        </div>
                        <div class="mt-2 mb-0">
                          <ngb-progressbar type="success" [value]="60" class="progress-bar-sm"></ngb-progressbar>
                        </div>
                      </div>
                    </div>
                  </div>
                </div> --}}
                {{-- <div class="col-xl-3 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                          <div class="media-body text-left">
                            <h3 class="mb-1 danger">423</h3>
                            <span>Total Visits</span>
                          </div>
                          <div class="media-right align-self-center">
                            <i class="icon-direction danger font-large-2 float-right"></i>
                          </div>
                        </div>
                        <div class="mt-2 mb-0">
                          <ngb-progressbar type="danger" [value]="40" class="progress-bar-sm"></ngb-progressbar>
                        </div>
                      </div>
                    </div>
                  </div>
                </div> --}}
              </div>
            </section>

            <section id="minimal-statistics">
              <div class="row">
                <div class="col-12 mt-3 mb-1">
                  <div class="content-header">Completed Orders</div>
                  {{-- <p class="content-sub-header">Statistics on minimal cards.</p> --}}
                </div>
              </div>

              <div class="row" matchheight="card">
                <div class="col-xl-4 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                          <a href="@if(!empty($completedBusinessOrders)){{ route('bocOrders', $completedBusinessOrders) }} @endif">
                          <div class="media-body text-left">
                            <h3 class="mb-1 primary"> 
                              @if($completedBusinessOrders=='')
                              0
                              @else
                             
                              {{ count(explode(",",$completedBusinessOrders)) }}

                              @endif
                              </h3>
                            <span>Business owners</span>
                          </div>
                          </a>
                          <div class="media-right align-self-center">
                            <i class="fa fa-users primary font-large-2 float-right"></i>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>

                <div class="col-xl-4 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                          <a href="@if(!empty($completedFreelancerOrders)){{ route('focOrders', $completedFreelancerOrders) }} @endif">
                          <div class="media-body text-left">
                            <h3 class="mb-1 primary">
                              @if($completedFreelancerOrders=='')
                              0
                              @else
                             
                              {{ count(explode(",",$completedFreelancerOrders)) }}

                              @endif
                              </h3>
                            <span>Freelancers</span>
                          </div>
                          </a>
                          <div class="media-right align-self-center">
                            <i class="fa fa-users primary font-large-2 float-right"></i>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                
                <div class="col-xl-4 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                          <a href="@if(!empty($totalCompletedOrders)){{ route('totalOrders', $totalCompletedOrders) }} @endif">
                            <div class="media-body text-left">
                            <h3 class="mb-1 primary">
                              @if($totalCompletedOrders=='')
                              0
                              @else
                             
                              {{ count(explode(",",$totalCompletedOrders)) }}

                              @endif
                              
                              </h3>
                            <span>Total</span>
                          </div>
                          </a>
                          <div class="media-right align-self-center">
                            <i class="fa fa-users primary font-large-2 float-right"></i>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>

              <div class="row" matchHeight="card">
             </div>
            </section>

            <section id="minimal-statistics">
              <div class="row">
                <div class="col-12 mt-3 mb-1">
                  <div class="content-header">Overview</div>
                  {{-- <p class="content-sub-header">Statistics on minimal cards.</p> --}}
                </div>
              </div>

              <div class="row" matchheight="card">
                <div class="col-xl-4 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                        <a href="{{route('list_business_owners')}}">
                          <div class="media-body text-left">
                            <h3 class="mb-1 primary">{{ \App\BusinessOwner::count() }}</h3>
                            <span>Business Owners</span>
                          </div>
                          </a>
                          <div class="media-right align-self-center">
                            <i class="fa fa-users primary font-large-2 float-right"></i>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="col-xl-4 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                          <a href="{{route('list_freelancers')}}">
                          <div class="media-body text-left">
                            <h3 class="mb-1 primary">{{ \App\Driver::where('owner_id', 0)->count() }}</h3>
                            <span>Freelancers</span>
                          </div>
                          </a>
                          <div class="media-right align-self-center">
                            <i class="fa fa-users primary font-large-2 float-right"></i>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                  
                  <div class="col-xl-4 col-lg-6 col-12">
                    <div class="card">
                      <div class="card-content">
                        <div class="px-3 py-3">
                          <div class="media">
                            <a href="{{route('list_users')}}">
                            <div class="media-body text-left">
                              <h3 class="mb-1 success">{{ \App\User::where('role', 'user')->count() }}</h3>
                              <span>Users</span>
                            </div>
                            </a>
                            <div class="media-right align-self-center">
                              <i class="fa fa-user success font-large-2 float-right"></i>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                  
                  
                  </div>

              <div class="row" matchHeight="card">
                <div class="col-xl-4 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                        <a href="{{route('lorryList')}}">
                          <div class="media-body text-left">
                            <h3 class="mb-1 danger">{{ \App\Lorry::count() }}</h3>
                            <span>Lorries</span>
                          </div>
                          </a>
                          <div class="media-right align-self-center">
                            <i class="fa fa-truck danger font-large-2 float-right"></i>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
               
                <div class="col-xl-4 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                        <a href="{{route('driverList')}}">
                          <div class="media-body text-left">
                            <h3 class="mb-1 success">{{ \App\Driver::where('owner_id','!=',0)->count() }}</h3>
                            <span>Drivers</span>
                          </div>
                          </a>
                          <div class="media-right align-self-center">
                            <i class="fa fa-user success font-large-2 float-right"></i>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                
        
                <div class="col-xl-4 col-lg-6 col-12">
                  <div class="card">
                    <div class="card-content">
                      <div class="px-3 py-3">
                        <div class="media">
                          <a href="{{route('list_orders')}}">
                          <div class="media-body text-left">
                            <h3 class="mb-1 warning">{{ \App\Order::count() }}</h3>
                            <span>Orders</span>
                          </div>
                          </a>
                          <div class="media-right align-self-center">
                            <i class="fa fa-shopping-cart warning font-large-2 float-right"></i>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
             </div>
            </section>


            <!-- // Minimal statistics section end -->

            <!--Line with Area Chart 1 Starts-->
            {{-- <div class="row">
              <div class="col-sm-12">
                <div class="card">
                  <div class="card-header">
                    <h4 class="card-title">PRODUCTS SALES</h4>
                  </div>
                  <div class="card-content">
                    <div class="card-body">
                      <div class="chart-info mb-3 ml-3">
                        <span class="gradient-blackberry d-inline-block rounded-circle mr-1" style="width:15px; height:15px;"></span>
                        Sales
                        <span class="gradient-mint d-inline-block rounded-circle mr-1 ml-2" style="width:15px; height:15px;"></span>
                        Visits
                      </div>
                      <div id="line-area" class="height-350 lineArea">
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div> --}}
            <!--Line with Area Chart 1 Ends-->



            {{-- <div class="row match-height">
              <div class="col-xl-6 col-lg-12">
                <div class="card">
                  <div class="card-header">
                    <h4 class="card-title mb-0">User List</h4>
                  </div>
                  <div class="card-content">
                    <div class="card-body">
                      <div class="media mb-1">
                        <a>
                          <img alt="96x96" class="media-object d-flex mr-3 bg-primary height-50 rounded-circle" src="app-assets/img/portrait/small/avatar-s-12.png">
                        </a>
                        <div class="media-body">
                          <h4 class="font-medium-1 mt-1 mb-0">Jessica Rice</h4>
                          <p class="text-muted font-small-3">UX Designer</p>
                        </div>
                        <div class="mt-1">
                          <div class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
                            <input type="checkbox" class="custom-control-input" checked id="customcheckbox1">
                            <label class="custom-control-label" for="customcheckbox1"></label>
                          </div>

                        </div>
                      </div>
                      <div class="media mb-1">
                        <a>
                          <img alt="96x96" class="media-object d-flex mr-3 bg-danger height-50 rounded-circle" src="app-assets/img/portrait/small/avatar-s-11.png">
                        </a>
                        <div class="media-body">
                          <h4 class="font-medium-1 mt-1 mb-0">Jacob Rios</h4>
                          <p class="text-muted font-small-3">HTML Developer</p>
                        </div>
                        <div class="mt-1">
                          <div class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
                            <input type="checkbox" class="custom-control-input" id="customcheckbox2">
                            <label class="custom-control-label" for="customcheckbox2"></label>
                          </div>

                        </div>
                      </div>
                      <div class="media mb-1">
                        <a>
                          <img alt="96x96" class="media-object d-flex mr-3 bg-success height-50 rounded-circle" src="app-assets/img/portrait/small/avatar-s-3.png">
                        </a>
                        <div class="media-body">
                          <h4 class="font-medium-1 mt-1 mb-0">Russell Delgado</h4>
                          <p class="text-muted font-small-3">Database Designer</p>
                        </div>
                        <div class="mt-1">
                          <div class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
                            <input type="checkbox" class="custom-control-input" id="customcheckbox3">
                            <label class="custom-control-label" for="customcheckbox3"></label>
                          </div>

                        </div>
                      </div>
                      <div class="media mb-1">
                        <a>
                          <img alt="96x96" class="media-object d-flex mr-3 bg-warning height-50 rounded-circle" src="app-assets/img/portrait/small/avatar-s-6.png">
                        </a>
                        <div class="media-body">
                          <h4 class="font-medium-1 mt-1 mb-0">Sara McDonald</h4>
                          <p class="text-muted font-small-3">Team Leader</p>
                        </div>
                        <div class="mt-1">
                          <div class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
                            <input type="checkbox" class="custom-control-input" checked id="customcheckbox4">
                            <label class="custom-control-label" for="customcheckbox4"></label>
                          </div>

                        </div>
                      </div>
                      <div class="media mb-1">
                        <a>
                          <img alt="96x96" class="media-object d-flex mr-3 bg-info height-50 rounded-circle" src="app-assets/img/portrait/small/avatar-s-18.png">
                        </a>
                        <div class="media-body">
                          <h4 class="font-medium-1 mt-1 mb-0">Janet Lucas</h4>
                          <p class="text-muted font-small-3">Project Manger</p>
                        </div>
                        <div class="mt-1">
                          <div class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
                            <input type="checkbox" class="custom-control-input" id="customcheckbox5">
                            <label class="custom-control-label" for="customcheckbox5"></label>
                          </div>

                        </div>
                      </div>
                      <div class="action-buttons mt-2 text-center">
                        <a class="btn btn-raised gradient-blackberry py-2 px-4 white mr-2">Add New</a>
                      </div>
                    </div>
                  </div>
                </div>
              </div>

              <div class="col-xl-6 col-lg-12">
                <div class="card">
                  <div class="card-header">
                    <h4 class="card-title">Project Stats</h4>
                  </div>
                  <div class="card-content">

                    <p class="font-medium-2 text-muted text-center">Project Tasks</p>
                    <div id="donut-dashboard-chart" class="height-250 donut">
                    </div>

                    <div class="card-body">
                      <div class="row mb-3">
                        <div class="col">
                          <span class="mb-1 text-muted d-block">23% - Started</span>
                          <div class="progress" style="height: 5px;">
                            <div class="progress-bar bg-success" role="progressbar" style="width: 23%;" aria-valuenow="23"
                              aria-valuemin="0" aria-valuemax="100"></div>
                          </div>
                        </div>
                        <div class="col">
                          <span class="mb-1 text-muted d-block">14% - In Progress</span>
                          <div class="progress" style="height: 5px;">
                            <div class="progress-bar bg-amber" role="progressbar" style="width: 14%;" aria-valuenow="14"
                              aria-valuemin="0" aria-valuemax="100"></div>
                          </div>
                        </div>
                      </div>
                      <div class="row mb-2">
                        <div class="col">
                          <span class="mb-1 text-muted d-block">35% - Remaining</span>
                          <div class="progress" style="height: 5px;">
                            <div class="progress-bar bg-deep-purple bg-lighten-1" role="progressbar" style="width: 35%;"
                              aria-valuenow="35" aria-valuemin="0" aria-valuemax="100"></div>
                          </div>
                        </div>
                        <div class="col">
                          <span class="mb-1 text-muted d-block">28% - Done</span>
                          <div class="progress" style="height: 5px;">
                            <div class="progress-bar bg-blue" role="progressbar" style="width: 28%;" aria-valuenow="28"
                              aria-valuemin="0" aria-valuemax="100"></div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div> --}}

          </div>
        </div>
        <!-- END : End Main Content-->

        @include('partials.footer')

      </div>
@endsection