@extends('frontend.user_dashboard.layouts.app')
@section('content')
    <div class="content-page">
        <div class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-12">
                        <div class="page-title-box">
                            <h4 class="page-title">Dashboard</h4>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-12">
                        <div class="row">
                            <div class="col-sm-3 mb-2">
                                <div class="card widget-flat crd1" data-aos="fade-left" data-aos-duration="500" data-aos-once="true">
                                    <div class="card-body">
                                        <h3 class="text-white"><small><i class="fal fa-rupee-sign"></i></small> <span class="counter-value">{{$today_earning}}</span></h3>
                                        <h5 class="text-white mt-3" title="Number of Customers">Today's Earning</h5>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-3 mb-2">
                                <div class="card widget-flat crd2">
                                    <div class="card-body">
                                        <h3 class="text-white"><small><i class="fal fa-rupee-sign"></i></small> <span class="counter-value">{{$last_7_day_earning}}</span></h3>
                                        <h5 class="text-white mt-3" title="Number of Orders">Last 7 Days Earning</h5>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-3 mb-2">
                                <div class="card widget-flat crd3">
                                    <div class="card-body">
                                        <h3 class="text-white"><small><i class="fal fa-rupee-sign"></i></small> <span class="counter-value">{{$last_30_day_earning}}</span></h3>
                                        <h5 class="text-white mt-3" title="Number of Orders">Last 30 Days Earning</h5>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-3 mb-2">
                                <div class="card widget-flat crd4">
                                    <div class="card-body">
                                        <h3 class="text-white"><small><i class="fal fa-rupee-sign"></i></small> <span class="counter-value">{{$all_time_earning}}</span></h3>
                                        <h5 class="text-white mt-3" title="Number of Orders">All Time Earning</h5>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-3 mb-2">
                                <div class="card widget-flat crd5">
                                    <div class="card-body">
                                        <h3 class="text-white"><small><i class="fal fa-rupee-sign"></i></small> <span class="counter-value">{{round($pending_payout)}}</span></h3>
                                        <h5 class="text-white mt-3" title="Number of Customers">Pending Payout</h5>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-3 mb-2">
                                <div class="card widget-flat crd6">
                                    <div class="card-body">
                                        <h3 class="text-white"><small><i class="fas fa-chart-line"></i></small><span >{{Auth::guard('web')->user()->userProfile->level}} ({{Auth::guard('web')->user()->userProfile->levelPercent->percent}} %)</span></h3>
                                        <h5 class="text-white mt-3" title="Number of Customers">Level</h5>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-3 mb-2">
                                <div class="card widget-flat crd6">
                                    <div class="card-body">
                                        <h3 class="text-white"><small><i class="uil-building"></i></small><span >{{$total_book_property}}</span></h3>
                                        <h5 class="text-white mt-3" title="Number of Customers">Total Book Property</h5>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-3 mb-2">
                                <div class="card widget-flat crd6">
                                    <div class="card-body">
                                        <h3 class="text-white"><small><i class="fal fa-rupee-sign"></i></small><span >{{$total_collection}}</span></h3>
                                        <h5 class="text-white mt-3" title="Number of Customers">Total Collection</h5>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        $(document).ready(function() {
            $('.counter-value').each(function() {
                $(this).prop('Counter', 0).animate({
                    Counter: $(this).text()
                }, {
                    duration: 5000,
                    easing: 'swing',
                    step: function(now) {
                        $(this).text(Math.ceil(now));
                    }
                });
            });
        });
    </script>
@endsection