@extends('admin.layouts.master')
@section('title', 'Dashboard')
@section('content')

    <!-- Page Wrapper -->
    <div class="page-wrapper">
        <div class="content container-fluid">
            <!-- Page Header -->
            <div class="page-header">
                <div class="row">
                    <div class="col-sm-12">
                        <h3 class="page-title">Welcome Admin</h3>
                        <ul class="breadcrumb">
                            <li class="breadcrumb-item active">Dashboard</li>
                        </ul>
                    </div>
                </div>
            </div>
            <!-- /Page Header -->

            <div class="row">
                <div class="col-xl-3 col-sm-6 col-12">
                    <div class="card">
                        <div class="card-body">
                            <div class="dash-widget-header">
									<span class="dash-widget-icon bg-primary">
										<i class="fe fe-users"></i>
									</span>
                                <div class="dash-count">
                                    <a href="{{ url('customer') }}"><i class="fa fa-arrow-right text-success"></i></a>
                                </div>
                            </div>
                            <div class="dash-widget-info">
                                <h3>16</h3>
                                <h6 class="text-muted">Users</h6>
                                <div class="progress progress-sm">
                                    <div class="progress-bar bg-primary w-100"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-sm-6 col-12">
                    <div class="card">
                        <div class="card-body">
                            <div class="dash-widget-header">
									<span class="dash-widget-icon bg-success">
										<i class="fe fe-money"></i>
									</span>
                                <div class="dash-count">
                                    <a href="{{ url('product') }}"><i class="fa fa-arrow-right text-danger"></i></a>
                                </div>
                            </div>
                            <div class="dash-widget-info">
                                <h3>3</h3>
                                <h6 class="text-muted">Product</h6>
                                <div class="progress progress-sm">
                                    <div class="progress-bar bg-success w-100"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-sm-6 col-12">
                    <div class="card">
                        <div class="card-body">
                            <div class="dash-widget-header">
									<span class="dash-widget-icon bg-danger">
										<i class="fe fe-credit-card"></i>
									</span>
                                <div class="dash-count">
                                    <a href="{{ url('category') }}"><i class="fa fa-arrow-right text-danger"></i></a>
                                </div>
                            </div>
                            <div class="dash-widget-info">
                                <h3>5</h3>
                                <h6 class="text-muted">Category</h6>
                                <div class="progress progress-sm">
                                    <div class="progress-bar bg-danger w-100"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-sm-6 col-12">
                    <div class="card">
                        <div class="card-body">
                            <div class="dash-widget-header">
									<span class="dash-widget-icon bg-warning">
										<i class="fe fe-folder"></i>
									</span>
                                <div class="dash-count">
                                    <a href="{{ url('blog') }}"><i class="fa fa-arrow-right text-success"></i></a>
                                </div>
                            </div>
                            <div class="dash-widget-info">
                                <h3>3</h3>
                                <h6 class="text-muted">Blogs</h6>
                                <div class="progress progress-sm">
                                    <div class="progress-bar bg-warning w-100"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12">
            <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
            <script type="text/javascript">
                google.charts.load('current', {'packages':['corechart']});
                google.charts.setOnLoadCallback(drawChart);

                function drawChart() {
                    var data = google.visualization.arrayToDataTable([
                        ['Date', 'Sales', 'Visitors'],
                        ['01',  1000,      400],
                        ['02',  1170,      460],
                        ['03',  660,       1120],
                        ['04',  1500,       500],
                        ['05',  1200,       120],
                        ['06',  2000,       1130],
                        ['07',  2500,       350],
                        ['08',  2200,       520],
                        ['09',  3120,       512],
                        ['10',  1280,       428],
                        ['11',  329,       558],
                        ['12',  350,       228],
                        ['13',  550,       1500],
                        ['14',  2000,       258],
                        ['15',  1800,       112],
                        ['16',  1000,       998],
                        ['17',  1899,       825],
                        ['18',  1030,      540]
                    ]);

                    var options = {
                        title: 'Daily sales & visitors',
                        hAxis: {title: 'Day',  titleTextStyle: {color: '#333'}},
                        vAxis: {minValue: 0}
                    };

                    var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
                    chart.draw(data, options);
                }
            </script>
            <div id="chart_div" style="width: 100%; height: 500px;"></div>
        </div>
        </div>

    </div>
    <!-- /Page Wrapper -->

@endsection