@extends('Statistiky::layouts.integrated')

@section('content')
    @parent

    <section class="bg-white space-sm pb-4">
        <div class="container">
            <div class="row justify-content-between align-items-center">
                <div class="col-auto">
                    <h1 class="h2 mb-2">Štatistiky výkonu pracoviska</h1>
                    <span>Východzie údaje pre štatistiky sa spracovávajú spätne, nereflektujú aktuálne údaje v daný moment vytvorenia výstupu</span>
                    @include('flash::message')
                </div>
            </div>
        </div>
    </section>

    <section>
        <div class="container">
            <div class="row">
                <div class="col">
                    @include('Statistiky::frontend.partials.datatable_zaznam_date_filter')
                </div>
            </div>
        </div>

        <hr>

        <div class="container">
            <div class="row my-4">
                <div class="col">
                    <div class="alert alert-primary text-small" role="alert">
                        <i class="icon-info mr-2"></i>
                        <span>Zobrazujú sa údaje za obdobie od <b>{{ $datumOd }}</b> do <b>{{ $datumDo }}</b></span>
                    </div>
                </div>
            </div>
        </div>

        <div class="container">
            <div class="row">
                <div class="col">
                    <h2 class="h3 mb-2">Počet kontrol podľa druhu a hodnotenia</h2>
                </div>
            </div>
            <div class="row">
                <div class="col">
                    <div class="card shadow">
                        <div class="card-body">
                            <ul class="nav nav-tabs" id="myTab" role="tablist">
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link active bg-transparent"
                                            id="pocetKontrolPodlaDruhuAHodnoteniaEChartTab"
                                            type="button" data-toggle="tab"
                                            data-target="#pocetKontrolPodlaDruhuAHodnoteniaEChartTab-content"
                                            aria-controls="pocetKontrolPodlaDruhuAHodnoteniaEChartTab-content"
                                            role="tab"
                                            aria-selected="true">
                                        <i class="icon-chart-bar"></i>
                                    </button>
                                </li>
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link bg-transparent"
                                            id="pocetKontrolPodlaDruhuAHodnoteniaDataTableTab" type="button"
                                            data-toggle="tab"
                                            data-target="#pocetKontrolPodlaDruhuAHodnoteniaDataTableTab-content"
                                            aria-controls="pocetKontrolPodlaDruhuAHodnoteniaDataTableTab-content"
                                            role="tab" aria-selected="false">
                                        <i class="icon-database"></i>
                                    </button>
                                </li>
                            </ul>

                            <div class="tab-content space-sm pb-0">
                                <div class="tab-pane fade show active"
                                     id="pocetKontrolPodlaDruhuAHodnoteniaEChartTab-content"
                                     role="tabpanel"
                                     aria-labelledby="pocetKontrolPodlaDruhuAHodnoteniaEChartTab-content">
                                    @includeIf('Statistiky::frontend.pages.pracovisko.partials.echarts.pocetKontrolPodlaDruhuAHodnoteniaEChart')
                                </div>
                                <div class="tab-pane" id="pocetKontrolPodlaDruhuAHodnoteniaDataTableTab-content"
                                     role="tabpanel"
                                     aria-labelledby="pocetKontrolPodlaDruhuAHodnoteniaDataTableTab-content">
                                    @includeIf('Statistiky::frontend.pages.pracovisko.partials.datatables.pocetKontrolPodlaDruhuAHodnoteniaDataTable')
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <hr>

        <div class="container">
            <div class="row">
                <div class="col">
                    <h2 class="h3 mb-2">Počet kontrol podľa stavu</h2>
                </div>
            </div>
            <div class="row">
                <div class="col">
                    <div class="card shadow">
                        <div class="card-body">
                            <ul class="nav nav-tabs" id="myTab" role="tablist">
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link active bg-transparent" id="pocetKontrolPodlaStavuEChartTab"
                                            type="button" data-toggle="tab"
                                            data-target="#pocetKontrolPodlaStavuEChartTab-content"
                                            aria-controls="pocetKontrolPodlaStavuEChartTab-content" role="tab"
                                            aria-selected="true">
                                        <i class="icon-chart-bar"></i>
                                    </button>
                                </li>
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link bg-transparent" id="pocetKontrolPodlaStavuDataTableTab"
                                            type="button" data-toggle="tab"
                                            data-target="#pocetKontrolPodlaStavuDataTableTab-content"
                                            aria-controls="pocetKontrolPodlaStavuDataTableTab-content" role="tab"
                                            aria-selected="false">
                                        <i class="icon-database"></i>
                                    </button>
                                </li>
                            </ul>

                            <div class="tab-content space-sm pb-0">
                                <div class="tab-pane fade show active" id="pocetKontrolPodlaStavuEChartTab-content"
                                     role="tabpanel" aria-labelledby="pocetKontrolPodlaStavuEChartTab-content">
                                    @includeIf('Statistiky::frontend.pages.pracovisko.partials.echarts.pocetKontrolPodlaStavuEChart')
                                </div>
                                <div class="tab-pane" id="pocetKontrolPodlaStavuDataTableTab-content" role="tabpanel"
                                     aria-labelledby="pocetKontrolPodlaStavuDataTableTab-content">
                                    @includeIf('Statistiky::frontend.pages.pracovisko.partials.datatables.pocetKontrolPodlaStavuDataTable')
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <hr>

        <div class="container">
            <div class="row">
                <div class="col">
                    <h2 class="h3 mb-2">Počet kontrol podľa kategórie vozidla</h2>
                </div>
            </div>
            <div class="row">
                <div class="col">
                    <div class="card shadow">
                        <div class="card-body">
                            <ul class="nav nav-tabs" id="myTab" role="tablist">
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link active bg-transparent"
                                            id="pocetKontrolPodlaKategorieVozidlaEChartTab" type="button"
                                            data-toggle="tab"
                                            data-target="#pocetKontrolPodlaKategorieVozidlaEChartTab-content"
                                            aria-controls="pocetKontrolPodlaKategorieVozidlaEChartTab-content"
                                            role="tab" aria-selected="true">
                                        <i class="icon-chart-pie"></i>
                                    </button>
                                </li>
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link bg-transparent"
                                            id="pocetKontrolPodlaKategorieVozidlaDataTableTab" type="button"
                                            data-toggle="tab"
                                            data-target="#pocetKontrolPodlaKategorieVozidlaDataTableTab-content"
                                            aria-controls="pocetKontrolPodlaKategorieVozidlaDataTableTab-content"
                                            role="tab" aria-selected="false">
                                        <i class="icon-database"></i>
                                    </button>
                                </li>
                            </ul>

                            <div class="tab-content space-sm pb-0">
                                <div class="tab-pane fade show active"
                                     id="pocetKontrolPodlaKategorieVozidlaEChartTab-content" role="tabpanel"
                                     aria-labelledby="pocetKontrolPodlaKategorieVozidlaEChartTab-content">
                                    @includeIf('Statistiky::frontend.pages.pracovisko.partials.echarts.pocetKontrolPodlaKategorieVozidlaEChart')
                                </div>
                                <div class="tab-pane" id="pocetKontrolPodlaKategorieVozidlaDataTableTab-content"
                                     role="tabpanel"
                                     aria-labelledby="pocetKontrolPodlaKategorieVozidlaDataTableTab-content">
                                    @includeIf('Statistiky::frontend.pages.pracovisko.partials.datatables.pocetKontrolPodlaKategorieVozidlaDataTable')
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <hr>

        <div class="container">
            <div class="row">
                <div class="col">
                    <h2 class="h3 mb-2">Počet kontrol podľa emisného systému vozidla</h2>
                </div>
            </div>
            <div class="row">
                <div class="col">
                    <div class="card shadow">
                        <div class="card-body">
                            <ul class="nav nav-tabs" id="myTab" role="tablist">
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link active bg-transparent"
                                            id="pocetKontrolPodlaEmisnehoSystemuVozidlaEChartTab" type="button"
                                            data-toggle="tab"
                                            data-target="#pocetKontrolPodlaEmisnehoSystemuVozidlaEChartTab-content"
                                            aria-controls="pocetKontrolPodlaEmisnehoSystemuVozidlaEChartTab-content"
                                            role="tab" aria-selected="true">
                                        <i class="icon-chart-pie"></i>
                                    </button>
                                </li>
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link bg-transparent"
                                            id="pocetKontrolPodlaEmisnehoSystemuVozidlaDataTableTab" type="button"
                                            data-toggle="tab"
                                            data-target="#pocetKontrolPodlaEmisnehoSystemuVozidlaDataTableTab-content"
                                            aria-controls="pocetKontrolPodlaEmisnehoSystemuVozidlaDataTableTab-content"
                                            role="tab" aria-selected="false">
                                        <i class="icon-database"></i>
                                    </button>
                                </li>
                            </ul>

                            <div class="tab-content space-sm pb-0">
                                <div class="tab-pane fade show active"
                                     id="pocetKontrolPodlaEmisnehoSystemuVozidlaEChartTab-content" role="tabpanel"
                                     aria-labelledby="pocetKontrolPodlaEmisnehoSystemuVozidlaEChartTab-content">
                                    @includeIf('Statistiky::frontend.pages.pracovisko.partials.echarts.pocetKontrolPodlaEmisnehoSystemuVozidlaEChart')
                                </div>
                                <div class="tab-pane" id="pocetKontrolPodlaEmisnehoSystemuVozidlaDataTableTab-content"
                                     role="tabpanel"
                                     aria-labelledby="pocetKontrolPodlaEmisnehoSystemuVozidlaDataTableTab-content">
                                    @includeIf('Statistiky::frontend.pages.pracovisko.partials.datatables.pocetKontrolPodlaDruhuPalivaAEmisnehoSystemuVozidlaDataTable')
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <hr>

        <div class="container">
            <div class="row">
                <div class="col">
                    <h2 class="h3 mb-2">Počet kontrol a vytvorený obrat podľa subjektu fakturácie</h2>
                </div>
            </div>
            <div class="row">
                <div class="col">
                    <div class="card shadow">
                        <div class="card-body">
                            <ul class="nav nav-tabs" id="myTab" role="tablist">
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link active bg-transparent"
                                            id="pocetKontrolAVytvorenyObratPodlaSubjektuFakturacieEChartTab"
                                            type="button"
                                            data-toggle="tab"
                                            data-target="#pocetKontrolAVytvorenyObratPodlaSubjektuFakturacieEChartTab-content"
                                            aria-controls="pocetKontrolAVytvorenyObratPodlaSubjektuFakturacieEChartTab-content"
                                            role="tab" aria-selected="true">
                                        <i class="icon-chart-bar"></i>
                                    </button>
                                </li>
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link bg-transparent"
                                            id="pocetKontrolAObratuPodlaSubjektuFakturacieDataTableTab" type="button"
                                            data-toggle="tab"
                                            data-target="#pocetKontrolAObratuPodlaSubjektuFakturacieDataTableTab-content"
                                            aria-controls="pocetKontrolAObratuPodlaSubjektuFakturacieDataTableTab-content"
                                            role="tab" aria-selected="false">
                                        <i class="icon-database"></i>
                                    </button>
                                </li>
                            </ul>

                            <div class="tab-content space-sm pb-0">
                                <div class="tab-pane fade show active"
                                     id="pocetKontrolAVytvorenyObratPodlaSubjektuFakturacieEChartTab-content"
                                     role="tabpanel"
                                     aria-labelledby="pocetKontrolAVytvorenyObratPodlaSubjektuFakturacieEChartTab-content">
                                    @includeIf('Statistiky::frontend.pages.pracovisko.partials.echarts.pocetKontrolAVytvorenyObratPodlaSubjektuFakturacieEChart')
                                </div>
                                <div class="tab-pane"
                                     id="pocetKontrolAObratuPodlaSubjektuFakturacieDataTableTab-content" role="tabpanel"
                                     aria-labelledby="pocetKontrolAObratuPodlaSubjektuFakturacieDataTableTab-content">
                                    @includeIf('Statistiky::frontend.pages.pracovisko.partials.datatables.pocetKontrolAObratuPodlaSubjektuFakturacieDataTable')
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    @include('Statistiky::frontend.pages.partials._datatables')
    @include('Statistiky::frontend.pages.partials._echarts')
@endsection