@extends('backend.layouts.app')
{{--{{dd(app_name()) }}--}}
@section('page-header')
    <h1>
        {{ app_name() }}
        <small>{{ app_name() }}</small>
    </h1>
    {!! Charts::styles() !!}
@endsection

@section('content')

    <div class="box box-success">
        <div class="box-header with-border">
            <h3 class="box-title">{{ trans('strings.backend.dashboard.welcome') }} {{ $logged_in_user->name }}!</h3>
            <div class="box-tools pull-right">
                <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
            </div><!-- /.box tools -->
        </div><!-- /.box-header -->

        <div class="box-body">
{{--            {!! trans('strings.backend.welcome') !!}--}}
        </div><!-- /.box-body -->
    </div><!--box box-success-->
    <section class="content">
        <!-- Small boxes (Stat box) -->
        <div class="row">
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-aqua">
                    <div class="inner">
                        <h3>{{$agencies}}</h3>

                        <p>Total Agencies</p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-bag"></i>
                    </div>
                </div>
            </div>
            <!-- ./col -->
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-green">
                    <div class="inner">
                        <h3>{{$agents}}</h3>
                        {{--<sup style="font-size: 20px">%</sup>--}}
                        <p>Total Numbers of Agents</p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-stats-bars"></i>
                    </div>
                </div>
            </div>
            <!-- ./col -->
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-teal-gradient">
                    <div class="inner">
                        <h3>{{$online}}</h3>

                        <p>Total Numbers of Online Users</p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-person-add"></i>
                    </div>
                </div>
            </div>

            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-yellow">
                    <div class="inner">
                        <h3>{{$totalusers}}</h3>

                        <p>Total Numbers of Registered Users</p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-person-add"></i>
                    </div>
                </div>
            </div>
            <!-- ./col -->
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-aqua">
                    <div class="inner">
                        <h3>{{$unvarifyleads}}</h3>

                        <p>Total Numbers of Unverified Leads</p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-pie-graph"></i>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-green">
                    <div class="inner">
                        <h3>{{$validleads}}</h3>

                        <p>Total Numbers of Verified Leads</p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-pie-graph"></i>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-teal-gradient">
                    <div class="inner">
                        <h3>{{$transfers}}</h3>

                        <p>Total Numbers of Leads Transfers</p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-pie-graph"></i>
                    </div>
                </div>
            </div>
            <!-- ./col -->
        </div>
        <!-- /.row -->

        <!-- Main row -->

        <div class="row">
            <!-- Left col -->
            <section class="col-lg-12 connectedSortable">
                <!-- Custom tabs (Charts with tabs)-->
                <center>
                    {!! $caller_chart->html() !!}
                </center>
            </section>
        </div>

        <div class="row">
            <!-- Left col -->
            <section class="col-lg-12 connectedSortable">
                <!-- Custom tabs (Charts with tabs)-->
                <center>
                    {!! $chart->html() !!}
                </center>
            </section>
        </div>

        <!-- /.row (main row) -->

    </section>

@endsection
@section('after-scripts')
    {!! Charts::scripts() !!}
    {!! $chart->script() !!}
    {!! $caller_chart->script() !!}
    @endsection