@extends('layouts.master')

@section('title')
Profession
@endsection


@section('content')

<div class="row">
    <div class="col-lg-3 col-6">
        <!-- small box -->
        <div class="small-box bg-info p-2">
            <div class="inner">
                <h4 class="text-light">Number of Professionls</h4>

                <h3 class="text-light"> By City</h3>
            </div>
            <div class="icon">
                <i class="ion ion-bag"></i>
            </div>
            <a href="{{route('noOfProfessionalByCity')}}" class="small-box-footer text-light">More info <i
                    class="fas fa-arrow-circle-right"></i></a>
        </div>
    </div>
    <!-- ./col -->
    <div class="col-lg-3 col-6">
        <!-- small box -->
        <div class="small-box bg-success p-2">
            <div class="inner">
                <h4 class="text-light">Number of Professionls</h4>

                <h3 class="text-light">By State</h3>
            </div>
            <div class="icon">
                <i class="ion ion-stats-bars"></i>
            </div>
            <a href="{{route('noOfProfessionalByState')}}" class="small-box-footer text-light">More info <i
                    class="fas fa-arrow-circle-right"></i></a>
        </div>
    </div>
    <!-- ./col -->
    <div class="col-lg-3 col-6">
        <!-- small box -->
        <div class="small-box bg-secondary p-2">
            <div class="inner">
                <h4 class="text-light">Number of Users</h4>

                <h3 class="text-light">By City</h3>
            </div>
            <div class="icon">
                <i class="ion ion-person-add"></i>
            </div>
            <a href="{{route('noOfUserByCity')}}" class="small-box-footer text-light">More info <i
                    class="fas fa-arrow-circle-right"></i></a>
        </div>
    </div>
    <!-- ./col -->
    <div class="col-lg-3 col-6">
        <!-- small box -->
        <div class="small-box bg-danger p-2">
            <div class="inner">
                <h4 class="text-light">Number of Users</h4>

                <h3 class="text-light">By State</h3>
            </div>
            <div class="icon">
                <i class="ion ion-pie-graph"></i>
            </div>
            <a href="{{route('noOfUserByState')}}" class="small-box-footer text-light">More info <i class="fas fa-arrow-circle-right"></i></a>
        </div>
    </div>
    <!-- ./col -->
</div>

<div class="row mt-3">
    <div class="col-lg-6 col-12">
        <!-- small box -->
        <div class="small-box bg-danger p-2">
            <div class="inner">
                <h3 class="text-light">{{$loggedInUserCount}}</h3>

                <h5 class="text-light">Number of Logged in Users</h5>
            </div>
            <div class="icon">
                <i class="ion ion-bag"></i>
            </div>
            <a href="#" class="small-box-footer text-light">More info <i
                    class="fas fa-arrow-circle-right"></i></a>
        </div>
    </div>
    <!-- ./col -->
    <div class="col-lg-6 col-12">
        <!-- small box -->
        <div class="small-box bg-info p-2">
            <div class="inner">
                <h3 class="text-light">{{$loggedInProfessionalCount}}</h3>

                <h5 class="text-light">Number of Logged in Professional</h5>
            </div>
            <div class="icon">
                <i class="ion ion-stats-bars"></i>
            </div>
            <a href="#" class="small-box-footer text-light">More info <i
                    class="fas fa-arrow-circle-right"></i></a>
        </div>
    </div>
    
</div>

<div class="row mt-3">
    <!-- ./col -->
    <div class="col-lg-3 col-6">
        <!-- small box -->
        <div class="small-box bg-success p-2">
            <div class="inner">
                <h3 class="text-light">{{$bookingArrayforCancelCount}}</h3>

                <h5 class="text-light">Number of Cancelled Booking</h5>
            </div>
            <div class="icon">
                <i class="ion ion-person-add"></i>
            </div>
            <a href="#" class="small-box-footer text-light">More info <i
                    class="fas fa-arrow-circle-right"></i></a>
        </div>
    </div>
    <!-- ./col -->
    <div class="col-lg-3 col-6">
        <!-- small box -->
        <div class="small-box bg-info p-2">
            <div class="inner">
                <h3 class="text-light">{{$bookingArrayforCompletedCount}}</h3>

                <h5 class="text-light">Number of Completed Booking</h5>
            </div>
            <div class="icon">
                <i class="ion ion-pie-graph"></i>
            </div>
            <a href="#" class="small-box-footer text-light">More info <i class="fas fa-arrow-circle-right"></i></a>
        </div>
    </div>
    <!-- ./col -->
    <div class="col-lg-3 col-6">
        <!-- small box -->
        <div class="small-box bg-secondary p-2">
            <div class="inner">
                <h3 class="text-light">{{$bookingArrayforUpcomingCount}}</h3>

                <h5 class="text-light">Number of Upcoming Booking</h5>
            </div>
            <div class="icon">
                <i class="ion ion-bag"></i>
            </div>
            <a href="#" class="small-box-footer text-light">More info <i
                    class="fas fa-arrow-circle-right"></i></a>
        </div>
    </div>
    <!-- ./col -->
    <div class="col-lg-3 col-6">
        <!-- small box -->
        <div class="small-box bg-danger  p-2">
            <div class="inner">
                <h3 class="text-light">{{$bookingArrayforTodayCount}}</h3>

                <h5 class="text-light">Number of Today's Booking</h5>
            </div>
            <div class="icon">
                <i class="ion ion-stats-bars"></i>
            </div>
            <a href="#" class="small-box-footer text-light">More info <i
                    class="fas fa-arrow-circle-right"></i></a>
        </div>
    </div>
</div>
@endsection


@section('scripts')
@endsection