@extends('layouts.blank')

@push('stylesheets')

@endpush

@push('scripts')
<script>
$('#date_from').datepicker({
}); 
$('#date_to').datepicker({
}); 
</script>
<script src="{{ asset("js/salessummary1.js") }}"></script>
<script type="text/javascript">
window.onload = function () {

//Better to construct options first and then pass it as a parameter
var chart = new CanvasJS.Chart("chartContainer", {
    animationEnabled: true,
    axisX:{
        valueFormatString: "Day #",
        interval: 1
    },
    axisY:{
        gridTickness: 0,
        stripLines:[{
            value: 0,
            color: "#BBBBBB",
            thickness: 2,
            showOnTop: true
        }]
    },
    data: [{
            type: "area", //change it to line, area, column, pie, etc
            click: onClick,
            dataPoints: null        }]
});
chart.render();

function onClick(e) {
    swal("Total Number of Respondents: "+e.dataPoint.counter);
}
}
</script>
@endpush


@section('main_container')
<div class="right_col" role="main">
    <div class="">
        <div class="page-title">
        </div>

        @include('includes/notifications')

        <div class="clearfix"></div>

        <div class="row">
            <div class="col-md-12 col-sm-12 col-xs-12">
                <div class="x_panel">
                    <div class="x_title">
                        <h2>Branch Performance</h2>
                        <div class="clearfix"></div>
                    </div>
                    {{Form::open(array('route' => 'survey_summary.store', 'class' => 'form-horizontal form-label-left'))}}
                    <p><strong>Note: </strong>Select dates within the same month only. Click the points to see number of respondents.</p>
                    <div class="col-md-3 col-xs-12">
                        <div class="form-group">
                            <label for="company">Branch</label>
                            {!! Form::select('branch',  $branches, null, array('id' => 'company', 'class' => 'form-control' ,'data-placeholder' => 'SELECT BRANCH')) !!}
                        </div>
                    </div>
                    <div class="col-md-3 col-xs-12">
                        <div class="form-group">
                            <label for="date_from">Date From</label>
                            {!! Form::text('date_from',$date_from,array('class' => 'form-control', 'id' => 'surveyResultsDateFrom')) !!}
                        </div>
                    </div>
                    <div class="col-md-3 col-xs-12">
                        <div class="form-group">
                            <label for="date_from">Date To</label>
                            {!! Form::text('date_to',$date_to,array('class' => 'form-control', 'id' => 'surveyResultsDateTo')) !!}
                        </div>
                    </div>
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group">
                            <button class="btn btn-primary">Process</button>
                        </div>
                    </div>
                    {{Form::close()}}
                    <div class="canvas-container">
                        <div class="chart-legend">
                            @if(!empty($se_branch))
                            <h3>OWNDAYS {{$se_branch->branch_name}} Performance per Day (Based on survey ratings)</h3>
                            @endif
                        </div>
                        <br/>
                        <div id="chartContainer" style="height: 300px; width: 100%;"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


@endsection