@extends('admin.layouts.default')

{{-- Page title --}}
@section('title')
    Sales Profitability
    @parent
@stop

{{-- page level styles --}}
@section('header_styles')
    {{--      <link href="{{ asset('assets/css/pages/form2.css') }}" rel="stylesheet"/>--}}
    {{--      <link href="{{ asset('assets/css/pages/pareto.css') }}" rel="stylesheet" type="text/css"/>--}}
@stop

{{-- Page content --}}
@section('content')
    <div class="popup-wrapper">
        <div class="popup">
        </div>
    </div>
    <section class="content-header">
        <ol class="breadcrumb">
            <li>
                <a href="{{ route('admin.dashboard') }}">
                    <i class="livicon" data-name="home" data-size="14" data-color="#000"></i>
                    Home
                </a>
            </li>
            <li><a>Sales Dashboard</a></li>
            <li class="active">Profitability</li>
        </ol>
    </section>


    <!-- Main content -->
    <section class="content paddingleft_right15 sd_overview_table">
        <div class="row">
            <div class=" panel-primary ">
                <div class="sd_sales_title">
                    <h1>Profitability </h1>
                </div>
                <div class="sd_profitability_content">
                        <div class="quarter_profitability">
                            <div class="sd_sales_title_content">CM2 % PERFORMANCE (YTD)</div>
                            <canvas id="sd_profitability_performance"></canvas>
                        </div>
                        <div class="quarter_profitability">
                            <div class="sd_sales_title_content">CM2 % DEVELOPMENT (12M)</div>
                            <canvas id="sd_profitability_development"></canvas>
                        </div>
                        <div class="quarter_profitability">
                            <div class="sd_sales_title_content">CUSTOMER PORTFOLIO (YTD)</div>
                            <canvas id="sd_profitability_customer"></canvas>
                        </div> <div class="quarter_profitability">
                        <div class="sd_sales_title_content">PORTFOLIO CHANGE <p>(Last 3M vs previous 3M)</p>
                            </div>
                        <canvas id="sd_profitability_portofolio"></canvas>
                        </div>
                </div>
            </div>
        </div>
    </section>
@stop

{{-- page level scripts --}}
@section('footer_scripts')
    <script type="text/javascript" src="{{ asset('assets/vendors/datatables/js/jquery.dataTables.js') }}"></script>
    <script type="text/javascript" src="{{ asset('assets/vendors/datatables/js/dataTables.bootstrap.js') }}"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-annotation/0.5.7/chartjs-plugin-annotation.js"></script>
    <script language="javascript" type="text/javascript" src="{{ asset('assets/js/pages/html2canvas.js') }}"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/numeral.js/2.0.6/numeral.min.js"></script>
    <script type="text/javascript" src="{{ asset('assets/js/pages/sd_profitability.js') }}"></script>
    <script>


        var route_pipeline = "{{route("admin.sd_overview.ajax.pipeline")}}";
        var route_cdp = "{{route("admin.sd_overview.ajax.cdp")}}";
        var route_redis_values = "{{route("admin.sd_overview.ajax.redis_values")}}";
        var path_arrow_red = "{{ asset('assets/img/red-arrow.png') }}";
        var path_arrow_green = "{{ asset('assets/img/green-arrow.png') }}";


    </script>


@stop