@extends('mpClient.layouts.main')

@section('title')
Correlation Chart
@endsection

@section('content')
<main>
    <loading :active.sync="isLoading"></loading>
    <div class="single-col client-dashboard" v-cloak>
        
        @include('mpClient.common/secondary_header')

        <div class="container-fluid p-4">
            <div class="top-bar d-flex align-items-center justify-content-between">
                <h2 class="mb-0">Correlation Chart</h2>
                <a href="javascript:void(0)" name="resetForm" id="resetForm" class="btn btn-bordered-primary float-right" 
                    @click="$refs.report_component.resetCorellationChartForm()">{{ @trans('report.reset') }}</a>
            </div>
            <corellation-chart-report charturl="{{ route('mpClient.dashboard.report.getCorellationChartReportDataByAjax',['panel' => Session::get('panel')]) }}"
                ref="report_component"></corellation-chart-report>
        </div>
    </div>
</main>
@endsection('content')

@include('mpClient.modules.reports.corellationGraphComponent')
@push('pageModals')
    @include('admin.modules.report.manage_group_modal')
    @include('admin.components.modal_delete_js')
@endpush

@push('pageJs')
<script>
    var storeReportManageGroupUrl = "{{ route('mpClient.reports.storeManageGroup',['panel' => Session::get('panel')]) }}";
    var deleteReportManageGroupUrl = "{{ route('mpClient.reports.deleteManageGroup',['panel' => Session::get('panel'), 'id' => null]) }}";
    var getCustomGroupsByMpIdUrl = "{{ route('mpClient.reports.getManageGroup',['panel' => Session::get('panel'), 'id' => null]) }}";
</script>
<script type="text/javascript" src="{{ asset('js/vendor/vuelidate.min.js') }}"></script>
<script type="text/javascript" src="{{ asset('js/vendor/validators.min.js') }}"></script>
<script type="text/javascript" src="{{ asset('js/admin/reportManageGroupMixin.js') }}?date=20200826"></script>
<script src="{{ asset('js/mpClient/chart-reports/bar_graph_report.js') }}?date=20200826"></script>
@endpush