@extends('admin.layout.app')
@section('content')
    <div class="content-area">
        <div class="row row-cards-one">
            <div class="col-md-12 col-lg-6 col-xl-4">
                <div class="mycard bg1">
                    <div class="left">
                        <h5 class="title">Total Orders! </h5>
                        <span class="number">{{$data['countOrder']}}</span>
                        <a href="{{route('admin.order.index')}}"
                           class="link">View All</a>
                    </div>
                    <div class="right d-flex align-self-center">
                        <div class="icon">
                            <i class="icofont-dollar"></i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-12 col-lg-6 col-xl-4">
                <div class="mycard bg2">
                    <div class="left">
                        <h5 class="title">Orders Procsessing!</h5>
                        <span class="number">{{$data['countProgressOrders']}}</span>
                        <a href="{{route('admin.order.status','in-progress')}}"
                           class="link">View All</a>
                    </div>
                    <div class="right d-flex align-self-center">
                        <div class="icon">
                            <i class="icofont-truck-alt"></i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-12 col-lg-6 col-xl-4">
                <div class="mycard bg3">
                    <div class="left">
                        <h5 class="title">Orders Completed!</h5>
                        <span class="number">{{$data['countCompletedOrders']}}</span>
                        <a href="{{route('admin.order.status','completed')}}"
                           class="link">View All</a>
                    </div>
                    <div class="right d-flex align-self-center">
                        <div class="icon">
                            <i class="icofont-check-circled"></i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-12 col-lg-6 col-xl-4">
                <div class="mycard bg4">
                    <div class="left">
                        <h5 class="title">Total Products!</h5>
                        <span class="number">{{$data['countProduct']}}</span>
                        <a href="{{route('admin.product.index')}}" class="link">View
                            All</a>
                    </div>
                    <div class="right d-flex align-self-center">
                        <div class="icon">
                            <i class="icofont-cart-alt"></i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-12 col-lg-6 col-xl-4">
                <div class="mycard bg5">
                    <div class="left">
                        <h5 class="title">Total Customers!</h5>
                        <span class="number">0</span>
                        <a href="#" class="link">View
                            All</a>
                    </div>
                    <div class="right d-flex align-self-center">
                        <div class="icon">
                            <i class="icofont-users-alt-5"></i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-12 col-lg-6 col-xl-4">
                <div class="mycard bg6">
                    <div class="left">
                        <h5 class="title">Total Posts!</h5>
                        <span class="number">3</span>
                        <a href="#" class="link">View
                            All</a>
                    </div>
                    <div class="right d-flex align-self-center">
                        <div class="icon">
                            <i class="icofont-newspaper"></i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-12 col-lg-6 col-xl-4">
                <div class="mycard" style="background: #007bff">
                    <div class="left">
                        <h5 class="title">Total Visits</h5>
                        <span class="number">{{$data['total_views']}}</span>

                    </div>
                    <div class="right d-flex align-self-center">
                        <div class="icon">
                            <i class="icofont-eye"></i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-12 col-lg-6 col-xl-4">
                <div class="mycard" style="background: #007bff">
                    <div class="left">
                        <h5 class="title">Unique Visitors</h5>
                        <span class="number">{{$data['unique_ips']}}</span>

                    </div>
                    <div class="right d-flex align-self-center">
                        <div class="icon">
                            <i class="icofont-eye"></i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-12 col-lg-6 col-xl-4">
                <div class="mycard" style="background: #007bff">
                    <div class="left">
                        <h5 class="title">Today's Visits</h5>
                        <span class="number">{{11120 - $data['today_views']}}</span>

                    </div>
                    <div class="right d-flex align-self-center">
                        <div class="icon">
                            <i class="icofont-eye"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="row row-cards-one">
            <div class="col-md-6 col-xl-3">
                <div class="card c-info-box-area">
                    <div class="c-info-box box1">
                        <p>0</p>
                    </div>
                    <div class="c-info-box-content">
                        <h6 class="title">New Customers</h6>
                        <p class="text">Last 30 Days</p>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-xl-3">
                <div class="card c-info-box-area">
                    <div class="c-info-box box2">
                        <p>0</p>
                    </div>
                    <div class="c-info-box-content">
                        <h6 class="title">Total Customers</h6>
                        <p class="text">All Time</p>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-xl-3">
                <div class="card c-info-box-area">
                    <div class="c-info-box box3">
                        <p>0</p>
                    </div>
                    <div class="c-info-box-content">
                        <h6 class="title">Total Sales</h6>
                        <p class="text">Last 30 days</p>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-xl-3">
                <div class="card c-info-box-area">
                    <div class="c-info-box box4">
                        <p>0</p>
                    </div>
                    <div class="c-info-box-content">
                        <h6 class="title">Total Sales</h6>
                        <p class="text">All Time</p>
                    </div>
                </div>
            </div>
        </div>

        <div class="row row-cards-one">

            <div class="col-md-12 col-lg-6 col-sm-12 col-xl-6">
                <div class="card">
                    <h5 class="card-header">Recent Order(s)</h5>
                    <div class="card-body">

                        <div class="table-responsive  dashboard-home-table">
                            <table id="poproducts" class="table table-hover dt-responsive" cellspacing="0"
                                   width="100%">
                                <thead>
                                <tr>

                                    <th>Order Number</th>
                                    <th>Order Date</th>
                                </tr>
                                @foreach($data['orders'] as $order)
                                    <tr>
                                        <td>{{$order->order_number ?? ''}}</td>
                                        <td>{{ $order->created_at->format('Y-m-d') }}</td>
                                        <td>
                                            <div class="action-list"><a
                                                    href="{{route('admin.order.show',$order->id)}}"><i
                                                        class="fas fa-eye"></i> Details</a>
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                                </thead>
                            </table>
                        </div>

                    </div>
                </div>

            </div>

            <div class="col-md-12 col-lg-6 col-sm-12 col-xl-6">
                <div class="card">
                    <h5 class="card-header">Recent Customer(s)</h5>
                    <div class="card-body">

                        <div class="table-responsive  dashboard-home-table">
                            <table id="poproducts" class="table table-hover dt-responsive" cellspacing="0"
                                   width="100%">
                                <thead>
                                <tr>
                                    <th>Customer Email</th>
                                    <th>Joined</th>
                                </tr>
                                <tr>
                                    <td>No Customer Found</td>
                                </tr>
                                {{--                                <tr>--}}
                                {{--                                    <td>ajay.chopra@gmail.com</td>--}}
                                {{--                                    <td>2025-10-03 06:33:55</td>--}}
                                {{--                                    <td>--}}
                                {{--                                        <div class="action-list"><a--}}
                                {{--                                                href="https://demo.geniusocean.com/ecommerce-king2/admin/user/52/show"><i--}}
                                {{--                                                    class="fas fa-eye"></i> Details</a>--}}
                                {{--                                        </div>--}}
                                {{--                                    </td>--}}
                                {{--                                </tr>--}}

                                </thead>
                            </table>
                        </div>

                    </div>
                </div>
            </div>
        </div>

        <div class="row row-cards-one">

            <div class="col-md-12 col-lg-12 col-sm-12 col-xl-12">
                <div class="card">
                    <h5 class="card-header">Recent Product(s)</h5>
                    <div class="card-body">

                        <div class="table-responsive dashboard-home-table">
                            <table id="pproducts" class="table table-hover dt-responsive" cellspacing="0"
                                   width="100%">
                                <thead>
                                <tr>
                                    <th>Featured Image</th>
                                    <th>Name</th>
                                    <th>Category</th>
                                    <th>Type</th>
                                    <th>Price</th>
                                    <th></th>

                                </tr>
                                </thead>
                                <tbody>
                                @foreach($data['products'] as $product)
                                    <tr>
                                        <td><img
                                                src="{{asset('assets/products/'.($product->photo ?? ''))}}">
                                        </td>
                                        <td>{{$product->name ?? ''}}</td>
                                        <td>{{$product->category->name ?? ''}}
                                            <br> {{$product->subcategory->name ?? ''}}
                                            <br>{{$product->subcategory->childcategory ?? ''}}

                                        </td>
                                        <td>{{$product->type ?? ''}}</td>
                                        <td>{{$product->price ?? ''}}$</td>
                                        <td>
                                            <div class="action-list"><a
                                                    href="https://demo.geniusocean.com/ecommerce-king2/admin/products/edit/427"><i
                                                        class="fas fa-eye"></i> Details</a>
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>

                    </div>
                </div>

            </div>

        </div>

        <div class="row row-cards-one">

            <div class="col-md-12 col-lg-12 col-sm-12 col-xl-12">
                <div class="card">
                    <h5 class="card-header">Total Sales in Last 30 Days</h5>
                    <div class="card-body">

                        <canvas id="lineChart"></canvas>

                    </div>
                </div>

            </div>

        </div>


        <div class="row row-cards-one">

            <div class="col-md-12 col-sm-12 col-lg-6 col-xl-6">
                <div class="card">
                    <h5 class="card-header">Top Referrals</h5>
                    <div class="card-body">
                        <div class="admin-fix-height-card">
                            <div id="chartContainer-topReference"></div>
                        </div>

                    </div>
                </div>

            </div>


        </div>
    </div>
@endsection