<x-owner-layout>
@section('page_css')
    <link rel="stylesheet" type="text/css" href="{{ asset('app-assets/css/core/menu/menu-types/vertical-menu.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('app-assets/css/core/colors/palette-gradient.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('app-assets/css/pages/dashboard-analytics.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('app-assets/css/pages/card-analytics.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('app-assets/css/plugins/tour/tour.css') }}">
    @endsection
    <div class="app-content content">

        <div class="content-overlay"></div>
        <div class="header-navbar-shadow"></div>
        <div class="content-wrapper">
            <div class="content-header row">
            </div>
            <div class="content-body">
                <section id="dashboard-analytics">
                    @if($revenuePermissionCount > 0)
                        <div class="row"> 
                            <?php $i=0; ?>     
                            @foreach ($cards as $card)   
                                @if($i == 0)
                                <div class="col-md-12">
                                    <h5>Today's Revenue</h5>
                                </div>
                                @endif 
                                @if($i == 4)
                                <div class="col-md-12">
                                    <h5>Month To Date Revenue</h5>
                                </div>
                                @endif 
                                @if($i == 8)
                                <div class="col-md-12">
                                    <h5>Year To Date Revenue</h5>
                                </div>
                                @endif 
                                @if($i == 12)
                                <div class="col-md-12">
                                    <h5>Total Cars Washed</h5>
                                </div>
                                @endif 
                                @if($i == 15)
                                <div class="col-md-12">
                                    <h5>Total # of Products/Services Sold</h5>
                                </div>
                                @endif 
                                @if($i == 18)
                                <div class="col-md-12">
                                    <h5>Other Products/Services Revenue</h5>
                                </div>
                                @endif     
                                <?php $i++; ?>            
                                <div class="col-lg-3 col-md-6 col-12">
                                    <div class="card" style="background-color: {{@$card['color']}};">
                                        <a href="">     
                                            <div class="card-body d-flex align-items-center justify-content-between">
                                                <!-- <div class="avatar p-50 m-0">
                                                    <div class="avatar-content">
                                                        <i class="feather {{@$card['icon']}}"></i>
                                                    </div>
                                                </div> -->
                                                <!-- <div class="text-right box-card-content">
                                                    <p>{{$card['title']}}</p>
                                                    <h2>{{$card['count']}}</h2>
                                                </div> -->
                                                <div class="box-card-content">
                                                    <p>{{$card['title']}}</p>
                                                    <h2>{{$card['count']}}</h2>
                                                </div>
                                            </div>
                                        </a>
                                    </div>
                                </div>
                            @endforeach    
                        </div>
                    @else
                    
                    <div class="row">
                        <div class="col-md-12 col-12">
                            <div class="card">
                                <div class="card-content">
                                    <div class="card-body">
                                        <h5>Hello {{ Auth::user()->name }}!</h5>
                                        <p>Welcome to Autoclick Carwash App partners web administration panel.</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    @endif    

                </section>
                

            </div>
        </div>
    </div>
    @section('page_scripts')
    <script src="{{asset('app-assets/vendors/js/charts/apexcharts.min.js')}}"></script>
    <script src="{{asset('app-assets/vendors/js/extensions/tether.min.js')}}"></script>
    <script src="{{asset('app-assets/vendors/js/extensions/shepherd.min.js')}}"></script>
    <script src="{{ asset('app-assets/js/scripts/pages/dashboard-analytics.js') }}"></script>
    @endsection
</x-owner-layout>
