@extends('dashboard.layouts.master')
@section('title', __('backend.dashboard'))
@push('after-styles')
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.24/css/jquery.dataTables.min.css" type="text/css" />
    <link rel="stylesheet" href="{{ asset('assets/dashboard/css/flags.css') }}" type="text/css" />
@endpush
@section('content')
    <style>
        .container {
            width: 100%;
            margin: 15px auto;
        }
        .icon-img img{
            height: 50px;
        }
    </style>
    <div class="upskild-dashboard">
        <div class="row align-items-center title-row">
            <div class="col-xl-4">
                <h1 class="heading-two m-b-0">{{ __('backend.hi') }}
                    <span class="text-primary">{{ Auth::user()->name }}</span> , {{ __('backend.welcomeBack') }}
                </h1>
            </div>
            <div class="col-xl-8 title-right-col">
                <form action="{{ route('dashboardfilter') }}" method="post" style="padding-left: %;" id="datafilter">
                    @csrf
                    <div class="filter-date-block">
                        <input type="text" class="form-control filter_message" value="{{ isset($filterdate) ? $filterdate : old('date_filter') }}" placeholder="DD-MM-YYYY - DD-MM-YYYY"
                        name="date_filter" id="date_filter" />

                        <span class="removeError1" style="color: red; display: none; margin-right: -25px;" id="span">Please
                            select start date and end date
                        </span>
                    </div>
                    <div class="filter-button-block">
                        <input type="submit" name="filter_submit" class="solid-button" value="Filter" id="filter_submit" disabled />
                        <a href="{{ route('adminHome') }}">
                            <input type="button" name="clear" class="btn btn-danger" value="Clear" id="filter_clear"/>
                        </a>
                    </div>

                    <input type="hidden" name="startdate" value="{{ isset($startdate) ? $startdate : '' }}"
                        id="export_start_date" class="start_date">
                    <input type="hidden" name="enddate" value="{{ isset($enddate) ? $enddate : '' }}"
                        id="export_end_date" class="end_date">
                </form>
            </div>
            
        </div>
        
        <div class="row">
            <div class="col-xl-12">
                <div class="row box-inner-row dashboard-box-row">
                   
                    <div class="col-sm-3">
                        <div class="box p-a">
                            <a href="{{ route('user') }}">
                                <div>
                                    <i class="fas fa-users" style="font-size:24px;"></i>
                                </div>
                                <div class="clear">
                                    <h3 class="heading-four m-a-0 text-md _600">
                                        {{ $total_user ?? 0 }}
                                    </h3>
                                    <div class="text-muted">Total Users</div>
                                </div>
                            </a>
                        </div>
                    </div>

                    <div class="col-sm-3">
                        <div class="box p-a">
                            <a href="{{ route('business_owner') }}">
                                <div>
                                    <i class="fas fa-users" style="font-size:24px;"></i>
                                </div>
                                <div class="clear">
                                    <h3 class="heading-four m-a-0 text-md _600">
                                        {{ $total_business_user ?? 0 }}
                                    </h3>
                                    <div class="text-muted">Total Business Owners</div>
                                </div>
                            </a>
                        </div>
                    </div>

                    <div class="col-sm-3">
                        <div class="box p-a">
                            <a href="{{ route('event') }}">
                                <div>
                                    <i class="fas fa-users" style="font-size:24px;"></i>
                                </div>
                                <div class="clear">
                                    <h3 class="heading-four m-a-0 text-md _600">
                                        {{ $total_event ?? 0 }}
                                    </h3>
                                    <div class="text-muted">Total Events</div>
                                </div>
                            </a>
                        </div>
                    </div>

                    <div class="col-sm-3">
                        <div class="box p-a">
                            <a href="{{ route('tourism-places') }}">
                                <div>
                                    <i class="fas fa-users" style="font-size:24px;"></i>
                                </div>
                                <div class="clear">
                                    <h3 class="heading-four m-a-0 text-md _600">
                                        {{ $total_place ?? 0 }}
                                    </h3>
                                    <div class="text-muted">Total Tourism Places</div>
                                </div>
                            </a>
                        </div>
                    </div>
                    
                    <div class="col-sm-3">
                        <div class="box p-a">
                            <a href="{{ route('business.report') }}">
                                <div>
                                    <i class="fas fa-users" style="font-size:24px;"></i>
                                </div>
                                <div class="clear">
                                    <h3 class="heading-four m-a-0 text-md _600">
                                        {{ $business_sponsorship_status ?? 0 }}
                                    </h3>
                                    <div class="text-muted">Business Active Subscriptions</div>
                                </div>
                            </a>
                        </div>
                    </div>


                    <div class="col-sm-3">
                        <div class="box p-a">
                            <a href="{{ route('event.report') }}">
                                <div>
                                    <i class="fas fa-users" style="font-size:24px;"></i>
                                </div>
                                <div class="clear">
                                    <h3 class="heading-four m-a-0 text-md _600">
                                        {{ $event_sponsorship_status ?? 0 }}
                                    </h3>
                                    <div class="text-muted">Event Active Subscriptions</div>
                                </div>
                            </a>
                        </div>
                    </div>

                    <div class="col-sm-3">
                        <div class="box p-a">
                            <a href="{{ route('business_owner') }}" style="text-decoration: none; color: inherit;">
                                <div>
                                    <i class="fas fa-users text-primary" style="font-size:24px;"></i>
                                </div>
                    
                                <div class="clear">
                                    <h3 class="heading-four m-a-0 text-md _600">
                                        Business Status
                                    </h3>
                    
                                    <div class="m-t-sm">
                                        <div>
                                            <span class="text-success">
                                                <strong>Approved:</strong>
                                            </span>
                                            <span class="text-success">
                                                {{ $business_approve ?? 0 }}
                                            </span>
                                        </div>
                    
                                        <div>
                                            <span class="text-danger">
                                                <strong>Rejected:</strong>
                                            </span>
                                            <span class="text-danger">
                                                {{ $business_reject ?? 0 }}
                                            </span>
                                        </div>
                    
                                        <div>
                                            <span class="text-warning">
                                                <strong>Pending:</strong>
                                            </span>
                                            <span class="text-warning">
                                                {{ $business_pending ?? 0 }}
                                            </span>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>

                    <div class="col-sm-3">
                        <div class="box p-a">
                            <a href="{{ route('event') }}" style="text-decoration: none; color: inherit;">
                                <div>
                                    <i class="fas fa-users text-primary" style="font-size:24px;"></i>
                                </div>
                    
                                <div class="clear">
                                    <h3 class="heading-four m-a-0 text-md _600">
                                        Event Status
                                    </h3>
                    
                                    <div class="m-t-sm">
                                        <div>
                                            <span class="text-success">
                                                <strong>Approved:</strong>
                                            </span>
                                            <span class="text-success">
                                                {{ $event_approve ?? 0 }}
                                            </span>
                                        </div>
                    
                                        <div>
                                            <span class="text-danger">
                                                <strong>Rejected:</strong>
                                            </span>
                                            <span class="text-danger">
                                                {{ $event_reject ?? 0 }}
                                            </span>
                                        </div>
                    
                                        <div>
                                            <span class="text-warning">
                                                <strong>Pending:</strong>
                                            </span>
                                            <span class="text-warning">
                                                {{ $event_pending ?? 0 }}
                                            </span>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>

                    <div class="col-sm-3">
                        <div class="box p-a">
                            <a href="{{ route('business.report') }}">
                                <div>
                                    <i class="fas fa-users" style="font-size:24px;"></i>
                                </div>
                                <div class="clear">
                                    <h3 class="heading-four m-a-0 text-md _600">
                                        {{ $total_business_revenue ?? 0 }}
                                    </h3>
                                    <div class="text-muted">Business Revenue</div>
                                </div>
                            </a>
                        </div>
                    </div>

                    <div class="col-sm-3">
                        <div class="box p-a">
                            <a href="{{ route('event.report') }}">
                                <div>
                                    <i class="fas fa-users" style="font-size:24px;"></i>
                                </div>
                                <div class="clear">
                                    <h3 class="heading-four m-a-0 text-md _600">
                                        {{ $total_event_revenue ?? 0 }}
                                    </h3>
                                    <div class="text-muted">Event Revenue</div>
                                </div>
                            </a>
                        </div>
                    </div>

                    
                </div>
            </div>
        </div>
    </div>
@endsection
@push('after-scripts')
    <script type="text/javascript" src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

    <script type="text/javascript">
        $(function() {
            let dateInterval = getQueryParameter('date_filter');
            let start = " ";
            let end = " ";
            $('#filter_submit').prop('disabled', true);

            if (dateInterval) {
                dateInterval = dateInterval.split(' - ');
                start = dateInterval[0];
                end = dateInterval[1];
                $('#filter_submit').prop('disabled', false);
            }
            $('#date_filter').daterangepicker({
                "showDropdowns": true,
                "showWeekNumbers": true,
                "alwaysShowCalendars": true,
                autoUpdateInput: false,
                startDate: moment().startOf('month'),
                endDate: moment().endOf('month'),
                maxDate: new Date(),
                startDate: start,
                endDate: end,
                locale: {
                   /// format: 'DD/MM/YYYY',
                    firstDay: 1,
                },
            });
            $('#date_filter').on('apply.daterangepicker', function(ev, picker) {
                $(this).val(picker.startDate.format('DD-MM-YYYY') + ' - ' + picker.endDate.format(
                    'DD-MM-YYYY'));
                $('#filter_submit').prop('disabled', false);
            });

            $('#date_filter').on('cancel.daterangepicker', function () {
                $(this).val('');
                $('#filter_submit').prop('disabled', true);
            });
        });

        function getQueryParameter(name) {
            const url = window.location.href;
            name = name.replace(/[\[\]]/g, "\\$&");
            const regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
                results = regex.exec(url);
            if (!results) return null;
            if (!results[2]) return '';
            return decodeURIComponent(results[2].replace(/\+/g, " "));
        }
    </script>
@endpush