@extends('layouts.app', [ 'mainClass' => 'dashboard' ])
@section('content')

    @include('partials._alert')

        
    <div class="subheader">
        <h3 class="title">{{ __('messages.dashboard') }}</h3>
        {{-- <small class="subtitle">Gerencie as fazendas do sistema</small> --}}
    </div>
    
    <div class="panel">
        
        <div class="panel-heading">
            <div class="heading-title">{{ __('messages.visualize') }}</div>
            <div class="heading-controls">
                <a class="btn btn-secondary btn-filter"><span>{{ __('messages.show') }}</span> {{ __('messages.filters') }}</a>
                <a class="btn btn-primary dashboard-export">{{ __('messages.export') }}</a>
            </div>
        </div>

        @include('partials._dashboard-filter')

        <div class="panel-body">

            <ul class="nav nav-tabs" role="tablist">
                <li class="nav-item">
                    <a href="#charts" class="nav-link active nav-link-charts" data-toggle="tab" role="tab">{{ __('messages.graphs') }}</a>
                </li>
                <li class="nav-item">
                    <a href="#info" class="nav-link nav-link-info" data-toggle="tab" role="tab">{{ __('messages.data_base') }}</a>
                </li>
            </ul>

            <div class="tab-content">

                <div class="tab-pane" id="info" role="tabpanel">

                    <div class="table-area"></div>

                </div>

                <div class="tab-pane active" id="charts" role="tabpanel">

                    <div class="tab-charts">

                        <div class="row charts">
                            <div class="col-sm-6">
                                <h5 class="content-title mb15 centered">{{ __('messages.info') }}</h5>
                                <div class="chart-content plan-pie-chart">
                                    <canvas></canvas>
                                </div>
                                <div id="plan-legend" class="plan-legend legend"></div>
                            </div>
                            <div class="col-sm-6 collect-fertility-charts">
                                <div class="row">
                                    <div class="col-sm-6">
                                        <h5 class="content-title mb15 centered">{{ __('messages.soil_collect') }}</h5>
                                        <div class="chart-content">
                                            <canvas id="soil-collect-chart"></canvas>
                                        </div>
                                    </div>
                                    <div class="col-sm-6">
                                        <h5 class="content-title mb15 centered">{{ __('messages.leaf_collect') }}</h5>
                                        <div class="chart-content">
                                            <canvas id="leaf-collect-chart"></canvas>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-sm-6">
                                        <h5 class="content-title mb15 centered">{{ __('messages.bio_collect') }}</h5>
                                        <div class="chart-content">
                                            <canvas id="biologic-collect-chart"></canvas>
                                        </div>
                                    </div>
                                    <div class="col-sm-6">
                                        <h5 class="content-title mb15 centered">{{ __('messages.soil_analysis') }}</h5>
                                        <div class="chart-content">
                                            <canvas id="soil-fertility-chart"></canvas>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-sm-6 ">
                                        <h5 class="content-title mb15 centered">{{ __('messages.leaf_analysis') }}</h5>
                                        <div class="chart-content">
                                            <canvas id="biologic-analysis-chart"></canvas>
                                        </div>
                                    </div>
                                    <div class="col-sm-6 ">
                                        <h5 class="content-title mb15 centered">{{ __('messages.bio_analysis') }}</h5>
                                        <div class="chart-content">
                                            <canvas id="leaf-fertility-chart"></canvas>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>

                </div>

            </div>

        </div>
    </div>

@endsection