@extends('layouts.master')

@include('budget.dashboard.script')
@include('budget.dashboard.style')

@section('browser-title', 'Orçamento - Dashboard')

@section('content')
    @include('budget.dashboard.partials.filters')
    <div class="row m-t-20">
        <div class="col-12">
            <div id="chart"></div>
        </div>
    </div>

    <div class="row m-t-20">
        {{--<div class="col-4">
            <div class="card">
                <div class="card-body">
                    <div id="circle-consolidado"></div>
                </div>
            </div>
        </div>
        @forelse([1, 2, 3, 4, 5, 6, 7, 8] as $circle)
            <div class="col-1">
                <div class="card">
                    <div class="card-body">
                        <div id="circle-{{ $loop->iteration }}"></div>
                    </div>
                </div>
            </div>
        @empty
            <div class="col-12">
                <h4><i>Não há dados para este ciclo.</i></h4>
            </div>
        @endforelse--}}
        <div class="col-12">
            <div id="carousel-cycle" class="carousel slide" data-interval="false">
                @forelse([1, 2, 3, 4, 5, 6, 7, 8] as $circle)
                    @push('carousel-content')
                        @if($loop->first)
                            <div class="row card-consolidado">
                                <div class="col-2 offset-1">
                                    <div class="card">
                                        <div class="card-body">
                                            <div id="card-0"></div>
                                        </div>
                                    </div>
                                    @foreach([1, 2, 3, 4, 5] as $table)
                                        <div class="card" id="card-0-{{$loop->index}}">
                                            <div class="card-body p-0">
                                                <div class="custom-card-header text-center text-white text-capitalize">
                                                    <span class="h6"></span>
                                                </div>
                                                <table style="margin: 0 !important" class="card-table table table-sm table-active" cellspacing="0" cellpadding="0"
                                                       width="100%">
                                                    {{--<thead class="text-white bg-primary font-12"></thead>--}}
                                                </table>
                                            </div>
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                        @endif

                        @if($loop->first || $loop->iteration === 5)
                            <div class="carousel-item {{ $loop->first ? 'active' : '' }}">
                                <div class="row">
                        @endif
                                    <div class="col-2 @if($loop->first || $loop->iteration === 5) offset-3 @endif">
                                        <div class="card">
                                            <div class="card-body">
                                                <div id="card-{{ $loop->iteration }}"></div>
                                            </div>
                                        </div>
                                        @foreach([1, 2, 3, 4, 5] as $table)
                                            <div class="card" id="card-{{$loop->parent->iteration}}-{{$loop->index}}">
                                                <div class="card-body p-0">
                                                    <div class="custom-card-header text-center text-white text-capitalize">
                                                        <span class="h6"></span>
                                                    </div>
                                                    <table style="margin: 0 !important" class="card-table table table-sm table-active" cellspacing="0" cellpadding="0"
                                                           width="100%">
                                                        {{--<thead class="text-white bg-primary font-12"></thead>--}}
                                                    </table>
                                                </div>
                                            </div>
                                        @endforeach
                                    </div>


                        @if($loop->last || $loop->iteration === 4)
                                </div>
                            </div>
                        @endif
                    @endpush
                @empty
                    <div class="carousel-item custom-crl-inner active">
                        <div class="row">
                            <div class="col-12">
                                <h4><i>Não há dados.</i></h4>
                            </div>
                        </div>
                    </div>
                @endforelse
                <div class="carousel-inner" role="listbox">
                    @stack('carousel-content')
                </div>

                <a class="carousel-control-prev wd-5" href="#carousel-cycle" role="button" data-slide="prev">
                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                    <span class="sr-only">Anterior</span>
                </a>
                <a class="carousel-control-next wd-5" href="#carousel-cycle" role="button" data-slide="next">
                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                    <span class="sr-only">Próximo</span>
                </a>
            </div>
        </div>
    </div>
@endsection