@extends('layouts.app')
@section('content')

    <!-- Content Header (Page header) -->
    <section class="content-header content-header{{setting('fixed_header')}}">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1>{{trans('lang.dashboard')}}</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="#">{{trans('lang.dashboard')}}</a></li>
                        <li class="breadcrumb-item active">{{trans('lang.dashboard')}}</li>
                    </ol>
                </div>
            </div>
        </div><!-- /.container-fluid -->
    </section>

    <div class="content">
        <!-- Small boxes (Stat box) -->
        <div class="row">
            <div class="col-lg-3 col-6">
                <!-- small box -->
                <div class="small-box bg-info">
                    <div class="inner">
                        <h3>{{$ordersCount}}</h3>

                        <p>{{trans('lang.dashboard_total_orders')}}</p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-shopping-bag"></i>
                    </div>
                    <a href="{!! route('orders.index') !!}" class="small-box-footer">{{trans('lang.dashboard_more_info')}}
                        <i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
            <!-- ./col -->
            <div class="col-lg-3 col-6">
                <!-- small box -->
                <div class="small-box bg-danger">
                    <div class="inner">
                        <h3>{{$totalstoreCount}}</h3>
                        <p>{{trans('lang.dashboard_total_stores')}} 
                        <!--<span style="font-size: 11px">({{trans('lang.dashboard_after taxes')}})</span>-->
                        </p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-money"></i>
                    </div>
                    <a href="{{ url('/store') }}" class="small-box-footer">{{trans('lang.dashboard_more_info')}}
                        <i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
            <!-- ./col -->
            <div class="col-lg-3 col-6">
                <!-- small box -->
                <div class="small-box bg-success">
                    <div class="inner">
                        <h3>{{$vehicle}}</h3>
                        <p>{{trans('lang.dashboard_total_vehicle')}}</p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-cutlery"></i>
                    </div>
                    <a href="{!! route('vehicle.index') !!}" class="small-box-footer">{{trans('lang.dashboard_more_info')}}
                        <i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
            <!-- ./col -->
            <div class="col-lg-3 col-6">
                <!-- small box -->
                <div class="small-box bg-warning">
                    <div class="inner">
                        <h3>{{$driver}}</h3>

                        <p>{{trans('lang.dashboard_total_driver')}}</p>
                    </div>
                    <div class="icon">
                        <i class="fa fa-group"></i>
                    </div>
                    <a href="{!! route('drivers.index') !!}" class="small-box-footer">{{trans('lang.dashboard_more_info')}}
                        <i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
            <!-- ./col -->

        </div>
        <!-- /.row -->

        <div class="row">
            
            <!--<div class="col-lg-6">-->
            <!--    <div class="card">-->
            <!--        <div class="card-header no-border">-->
            <!--            <div class="d-flex justify-content-between">-->
            <!--                <h3 class="card-title">{{trans('lang.earning_plural')}}</h3>-->
            <!--                <a href="{!! route('payments.index') !!}">{{trans('lang.dashboard_view_all_payments')}}</a>-->
            <!--            </div>-->
            <!--        </div>-->
            <!--        <div class="card-body">-->
            <!--            <div class="d-flex">-->
            <!--                <p class="d-flex flex-column">-->
            <!--                    @if(setting('currency_right', false) != false)-->
            <!--                        <span class="text-bold text-lg">{{$earning}}{{setting('default_currency')}}</span>-->
            <!--                    @else-->
            <!--                        <span class="text-bold text-lg">{{setting('default_currency')}}{{$earning}}</span>-->
            <!--                    @endif-->
            <!--                    <span>{{trans('lang.dashboard_earning_over_time')}}</span>-->
            <!--                </p>-->
            <!--                <p class="ml-auto d-flex flex-column text-right">-->
            <!--                    <span class="text-success"> {{$ordersCount}}</span></span>-->
            <!--                    <span class="text-muted">{{trans('lang.dashboard_total_orders')}}</span>-->
            <!--                </p>-->
            <!--            </div>-->
                        <!-- /.d-flex -->

            <!--            <div class="position-relative mb-4">-->
            <!--                <canvas id="sales-chart" height="200"></canvas>-->
            <!--            </div>-->

            <!--            <div class="d-flex flex-row justify-content-end">-->
            <!--                <span class="mr-2"> <i class="fa fa-square text-primary"></i> {{trans('lang.dashboard_this_year')}} </span>-->
            <!--            </div>-->
            <!--        </div>-->
            <!--    </div>-->
            <!--</div>-->
            <!--<div class="col-lg-6">-->
            <!--    <div class="card">-->
            <!--        <div class="card-header no-border">-->
            <!--            <h3 class="card-title">{{trans('lang.market_plural')}}</h3>-->
            <!--            <div class="card-tools">-->
            <!--                <a href="{{route('markets.index')}}" class="btn btn-tool btn-sm"><i class="fa fa-bars"></i> </a>-->
            <!--            </div>-->
            <!--        </div>-->
            <!--        <div class="card-body p-0">-->
            <!--            <table class="table table-striped table-valign-middle">-->
            <!--                <thead>-->
            <!--                <tr>-->
            <!--                    <th>{{trans('lang.market_image')}}</th>-->
            <!--                    <th>{{trans('lang.market')}}</th>-->
            <!--                    <th>{{trans('lang.market_address')}}</th>-->
            <!--                    <th>{{trans('lang.actions')}}</th>-->
            <!--                </tr>-->
            <!--                </thead>-->
            <!--                <tbody>-->
            <!--                @foreach($markets as $market)-->

            <!--                    <tr>-->
            <!--                        <td>-->
            <!--                            {!! getMediaColumn($market, 'image','img-circle img-size-32 mr-2') !!}-->
            <!--                        </td>-->
            <!--                        <td>{!! $market->name !!}</td>-->
            <!--                        <td>-->
            <!--                            {!! $market->address !!}-->
            <!--                        </td>-->
            <!--                        <td class="text-center">-->
            <!--                            <a href="{!! route('markets.edit',$market->id) !!}" class="text-muted"> <i class="fa fa-edit"></i> </a>-->
            <!--                        </td>-->
            <!--                    </tr>-->
            <!--                @endforeach-->
            <!--                </tbody>-->
            <!--            </table>-->
            <!--        </div>-->
            <!--    </div>-->
            <!--</div>-->
            
        </div>
        <div class="content">
         
<div class="clearfix"></div>
    <div class="card">
    <div class="card-header">
      <ul class="nav nav-tabs align-items-end card-header-tabs w-100">
        <li class="nav-item">
          <a class="nav-link active" href="{{ Route('dashboard') }}"><i class="fa fa-list mr-2"></i>Today Order List</a>
        </li>
      </ul>
    </div>
    <div class="card-body">
       <div class="table-responsive">
                      <table class="table" id="example1">
                          <thead>
                              <tr>
                                  <th>Order ID</th>
                                  <th>Delivery Date</th>
                                  <th>Picker</th>
                                  <th>Driver</th>
                              </tr>
                          </thead>
                          <tbody>
                          @if(count($orderDetails)>0)
                    @foreach ($orderDetails as $key=>$orderDetails1)
                              <tr>
                                  <th scope="row">{{ $orderDetails1->increment_id }}</th>
                                 <td>{{ $orderDetails1->dates }}</td>
                                
                                 <td>{{ $orderDetails1->pickername }}</td>
                                  <td>{{ $orderDetails1->drivername }}</td>
                              </tr>
                    @endforeach
                    @else
                       <tr>
                            <td colspan="6">No record found!</td>
                       </tr>
                    @endif
                          </tbody>
                      </table>
                <div class="col-xs-12 pull-right">
                        
                </div>
                  </div>
      <div class="clearfix"></div>
    </div>
  </div>  
  
  <div class="clearfix"></div>
    <div class="card">
    <div class="card-header">
      <ul class="nav nav-tabs align-items-end card-header-tabs w-100">
        <li class="nav-item">
          <a class="nav-link active" href="{{ Route('dashboard') }}"><i class="fa fa-list mr-2"></i>Cron List</a>
        </li>
      </ul>
    </div>
    <div class="card-body">
       <div class="table-responsive">
                      <table class="table" id="example1">
                          <tbody>
                              <tr>
                                  <th scope="row">Items</th>
                                 <td>{{ $productadd }}</td>
                              </tr>
                              <tr>
                                  <th scope="row">Price</th>
                                 <td>{{ $price }}</td>
                              </tr>
                              <tr>
                                  <th scope="row">Inventory</th>
                                 <td>{{ $inventory }}</td>
                              </tr>
                          </tbody>
                      </table>
                <div class="col-xs-12 pull-right">
                        
                </div>
                  </div>
      <div class="clearfix"></div>
    </div>
  </div>
  
</div>
</div>
       

@endsection
@push('scripts_lib')
    <script src="{{asset('plugins/chart.js/Chart.min.js')}}"></script>
@endpush
@push('scripts')
    <script type="text/javascript">
   
        var data = [1000, 2000, 3000, 2500, 2700, 2500, 3000];
        var labels = ['JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'];

        function renderChart(chartNode, data, labels) {
            var ticksStyle = {
                fontColor: '#495057',
                fontStyle: 'bold'
            };

            var mode = 'index';
            var intersect = true;
            return new Chart(chartNode, {
                type: 'bar',
                data: {
                    labels: labels,
                    datasets: [
                        {
                            backgroundColor: '#007bff',
                            borderColor: '#007bff',
                            data: data
                        }
                    ]
                },
                options: {
                    maintainAspectRatio: false,
                    tooltips: {
                        mode: mode,
                        intersect: intersect
                    },
                    hover: {
                        mode: mode,
                        intersect: intersect
                    },
                    legend: {
                        display: false
                    },
                    scales: {
                        yAxes: [{
                            // display: false,
                            gridLines: {
                                display: true,
                                lineWidth: '4px',
                                color: 'rgba(0, 0, 0, .2)',
                                zeroLineColor: 'transparent'
                            },
                            ticks: $.extend({
                                beginAtZero: true,

                                // Include a dollar sign in the ticks
                                callback: function (value, index, values) {
                                    @if(setting('currency_right', '0') == '0')
                                        return "{{setting('default_currency')}} "+value;
                                    @else
                                        return value+" {{setting('default_currency')}}";
                                        @endif

                                }
                            }, ticksStyle)
                        }],
                        xAxes: [{
                            display: true,
                            gridLines: {
                                display: false
                            },
                            ticks: ticksStyle
                        }]
                    }
                }
            })
        }

        $(function () {
            'use strict'

            var $salesChart = $('#sales-chart')
            $.ajax({
                url: "{!! $ajaxEarningUrl !!}",
                success: function (result) {
                    $("#loadingMessage").html("");
                    var data = result.data[0];
                    var labels = result.data[1];
                    renderChart($salesChart, data, labels)
                },
                error: function (err) {
                    $("#loadingMessage").html("Error");
                }
            });
            //var salesChart = renderChart($salesChart, data, labels);
        })

    </script>
@endpush