@extends('admin.layouts.app')

@section('title', $title)

@section('content')

    <div class="row">
        <div class="col-md-12">
            @php
                $releaseDate = null;
                if (!empty($updateStatus['released_at'])) {
                    try {
                        $releaseDate = \Carbon\Carbon::parse($updateStatus['released_at'])->toFormattedDateString();
                    } catch (\Exception $exception) {
                        $releaseDate = null;
                    }
                }
            @endphp
            @if (!($updateStatus['license_key_present'] ?? false))
                <div class="alert alert-warning d-flex justify-content-between align-items-center">
                    <div>
                        <strong>License key missing.</strong> Add your license key in <a href="{{ route('ch-admin.settings.show', ['update']) }}" class="alert-link">Settings → Update</a> to receive release notifications.
                    </div>
                </div>
            @elseif (($updateStatus['status'] ?? 'ok') === 'error')
                <div class="alert alert-danger">
                    <strong>Update check failed.</strong> {{ $updateStatus['message'] ?? 'Please try again later.' }}
                </div>
            @elseif ($updateStatus['update_available'] ?? false)
                <div class="alert alert-info d-flex justify-content-between align-items-center">
                    <div>
                        <strong>Update available:</strong> Version {{ $updateStatus['version'] }} ({{ ucfirst($updateStatus['type'] ?? 'major') }} update) was released {{ $releaseDate ? 'on ' . $releaseDate : 'recently' }}.
                        <span class="d-block">Current version: {{ $updateStatus['current_version'] ?? config('app.version') }}.</span>
                    </div>
                    <div>
                        <a href="{{ route('ch-admin.ch_admin_update') }}" class="btn btn-sm btn-primary text-white">Review update</a>
                    </div>
                </div>
            @endif
        </div>
    </div>

    <div class="row">
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-aqua">
                <div class="inner">
                    <h3>{{ $completed }}</h3>
                    <p>Completed Orders</p>
                </div>
                <div class="icon">
                    <i class="ion ion-bag"></i>
                </div>
                <a href="{{route('ch-admin.order.index', ['status' => getConstant('ORDER_STATUS_COMPLETED')])}}" class="small-box-footer">More Details <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>
        <!-- ./col -->
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-green">
                <div class="inner">
                    <h3>{{ $processing }}</h3>
                    <p>Processing Orders</p>
                </div>
                <div class="icon">
                    <i class="ion ion-code-working"></i>
                </div>
                <a href="{{route('ch-admin.order.index', ['status' => getConstant('ORDER_STATUS_PROCESSING')])}}" class="small-box-footer">More Details <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>
        <!-- ./col -->
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-yellow">
                <div class="inner">
                    <h3>{{ $pending }}</h3>
                    <p>Pending Payment Orders</p>
                </div>
                <div class="icon">
                    <i class="ion ion-load-c"></i>
                </div>
                <a href="{{route('ch-admin.order.index', ['status' => getConstant('ORDER_STATUS_PENDING')])}}" class="small-box-footer">More Details <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>
        <!-- ./col -->
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-red">
                <div class="inner">
                    <h3>{{ $cancel }}</h3>
                    <p>Cancelled Orders</p>
                </div>
                <div class="icon">
                    <i class="ion ion-minus-circled"></i>
                </div>
                <a href="{{route('ch-admin.order.index', ['status' => getConstant('ORDER_STATUS_CANCELLED')])}}" class="small-box-footer">More Details <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>
        <!-- ./col -->
    </div>


    <div class="row mt-3">

        <div class="col-md-12">
            <h3><i class="fa fa-inbox"></i> Sales Last 30 days</h3>
            <!-- Custom tabs (Charts with tabs)-->
            <div class="nav-tabs-custom">
                <!-- Tabs within a box -->
                <div class="tab-content no-padding">
                    <!-- Morris chart - Sales -->
                    <div class="chart tab-pane active" id="revenue-chart"></div>
                    <div class="chart tab-pane" id="sales-chart"></div>
                </div>
            </div>
            <!-- /.nav-tabs-custom -->
        </div>

    </div>


@endsection

@push('scripts')
    <script src="{{url('assets/backend/js/vendors/raphael.min.js')}}"></script>
    <script src="{{url('assets/backend/js/vendors/morris.min.js')}}"></script>

    <script>
        var area = new Morris.Area({
            element   : 'revenue-chart',
            resize    : true,
            xkey      : 'y',
            ykeys     : ['sales'],
            labels    : ['Sale'],
            lineColors: ['#a0d0e0'],
            hideHover : 'auto',
            data      : {!! $sales !!}
        });
    </script>

@endpush