@extends('layouts.adminLayout.admin_design') @section('content')
<div class="content-wrapper">
    <section class="content-header">
        <div class="box box-default">
            <div class="box-header without-border">
                <div class="row">
                    <div class="col-md-3">
                        <h4>
                            {{ config('app.name') }}
                            <small>{{ __('lbl.version') }} {{Config::get('constants.VERSION')}}</small>
                        </h4>
                    </div>
                    <div class="box-tools col-md-8 ">
                        <div class="col-md-1 no-padding" style="margin: 4px 0;font-weight: bold;">
                            <small>{{ __('lbl.date')}}</small>
                        </div>
                        <div class="col-md-3 no-padding">
                            {{ Form::text('datetimes', '',["class"=>"form-control datetimes","id"=>"datetimes","name"=>"datetimes"]) }}
                        </div>
                        <div class="col-md-6 multipleItemSelection">
                            <!-- <label>{{ __('lbl.establishment')}} </label> --> 
                            {{ Form::select('establishmentsgroup[]', $establishmentsgroup, '', ["multiple"=>"multiple",'class' => 'form-control select2 establishmentsgroup input-sm', 'id'=>'establishmentsgroup']) }}
                        </div>
                        <div class="col-md-2">
                            {{ Form::button('<i class="fa fa-filter fa-1x"></i> '. __('lbl.filter'), ["class"=>"clickbtncommon btn btn-sm btn-primary","id"=>"dateSearch",'type' => 'submit']) }}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="content">
        @if(Session::get('establishmentId') === 0)
        <div class="callout callout-danger">
            <h4>{{ __("messages.warning") }}</h4>
            <p>{{ __("messages.esta_selection_info") }}</p>
        </div>
        @else
        <!-- Small boxes (Stat box) -->
        <div class="row">
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-blue">
                    <div class="inner">
                        <h3>
                            <div id="GrossSales">{{storecurrency()}}0.00</div>
                        </h3>
                        <p>{{ __('lbl.gross_sales') }}</p> <!--total_credit-->
                    </div>
                    <div class="icon">
                        <i class="ion ion-bag"></i>
                    </div>
                    <!-- <a href="#" class="small-box-footer">&nbsp; </a> -->
                </div>
            </div>
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-green">
                    <div class="inner">
                        <h3>
                            <div id="NetSales">{{storecurrency()}}0.00</div>
                        </h3>
                        <p>{{ __('lbl.net_sales') }}</p>  
                    </div>
                    <div class="icon">
                        <i class="fa fa-shopping-cart"></i>
                    </div>
                    <!-- <a href="#" class="small-box-footer">&nbsp; </a> -->
                </div>
            </div>
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-red">
                    <div class="inner">
                        <h3>
                            <div id="PriorityPass">0</div> <!-- 0.00 for others-->
                        </h3>
                        <!-- FOR GAMEWAY PROJECT-->
                        <div id="fixproductName"><p>{{ __('lbl.priority_pass_count') }}</p></div>
                        <!-- FOR OTHER PROJECT-->
                        <!-- <p>{{ __('lbl.total_discounts') }}</p>-->
                    </div>
                    <div class="icon">
                        <i class="fa fa-shopping-cart"></i>
                    </div>
                    <!-- <a href="#" class="small-box-footer">&nbsp; </a> -->
                </div>
            </div>
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-aqua">
                    <div class="inner">
                        <h3>
                            <div id="NewCustPayment" style="float:left;" re1="Orders From Recently Join Customers">0</div>
                            <div style="float:left;">&nbsp;&&nbsp;</div>
                            <div id="RepeatCustPayment" re1="Orders From All Customers Minus New customers">0</div>
                        </h3>
                        <p>{{ __('lbl.new_repeat_loyalty') }} </p> <!--sales_tax-->
                    </div>   
                    <div class="icon">
                        <i class="fa fa-dollar"></i>
                    </div>
                    <!-- <a href="#" class="small-box-footer">&nbsp; </a> -->
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="box box-default">
                    <div class="box-header with-border">
                        <h3 class="box-title">{{ __('lbl.sales_overview') }}</h3>
                        <div class="box-tools pull-right" id="filteredDate">
                            {{date("Y:m:d 03:00:00")}} - {{date("Y:m:d 02:59:59", strtotime("+1 days"))}}
                        </div>
                    </div>
                    <div id="hourlySalesChartContainer" style="height: 300px; width: 100%;"></div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="box box-default">
                    <div class="box-header with-border">
                        <h3 class="box-title">{{ __('lbl.monthly_sales') }}</h3>
                    </div>
                    <div id="averagePayments" style="height: 300px; width: 100%;"></div>
                    <!--div id="columnchart_values" style="width: 1000px; height: 400px; overflow: hidden"></div-->
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6 " style="display: none;">
                <div class="box box-default">
                    <div class="box-header with-border">
                        <h3 class="box-title">{{ __('lbl.total_payments') }}</h3>
                    </div>
                    <div id="totalPayment" style="height: 300px; width: 100%;"></div>
                </div>
            </div>
            <div class="col-md-12">
                <div class="box box-default">
                    <div class="box-header with-border">
                        <h3 class="box-title">{{ __('lbl.top_ten_quantity') }}</h3>
                    </div>
                    <!--div id="totalCustomers" style="height: 300px; width: 100%;"></div-->
                    <div class="box-body">
                        <div class="table-responsive">
                            <table class="table no-margin" id="topTenQuantity">
                                <!--thead>
                                    <tr>
                                        <th width="80%">{{__('lbl.product_name')}}</th>
                                        <th width="20%" align="right">&nbsp;</th>
                                    </tr>
                                </thead-->
                                <tbody></tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @endif
    </section>
    <input type="hidden" id="dashboardChart" value="{{route('dashboardChart')}}" />
</div>
<!-- /.content-wrapper -->
@endsection 

@section('pagescript') 
<!-- //'js/lib/moment/min/moment.min.js', -->
<!-- <script src="https://momentjs.com/downloads/moment-timezone.js"></script> --> 
<script src="https://momentjs.com/downloads/moment.js"></script>
<script src="https://momentjs.com/downloads/moment-timezone.min.js"></script>
{!! Helper::pagejs(['js/backend/canvasjs/loader.js', 
'js/lib/select2/dist/js/select2.full.min.js', 
'js/lib/bootstrap-daterangepicker/daterangepicker.js',
'js/lib/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js', 
'js/lib/plugins/timepicker/bootstrap-timepicker.min.js', 
'js/backend/report/bootstrap-multiselect.js', 
'js/backend/canvasjs/canvasjs.min.js', 
'js/backend/report/dashboard.js'
]) !!} @stop