@extends('admin.layouts.app')

@section('breadcrumb')
<div><h1 class="page-title fw-medium fs-18 mb-1">داشبورد مدیریت</h1><span class="text-muted fs-12">نمای کلی سامانه هواپیمایی و تور</span></div>
@endsection

@section('content')
<div class="container-fluid pt-4">
    <div class="row g-3">
        @php($cards = [
            ['title'=>'کاربران ثبت‌نام‌شده','value'=>$usersCount ?? 0,'icon'=>'ri-group-line','class'=>'primary'],
            ['title'=>'پروازهای فعال','value'=>$flightsCount ?? 0,'icon'=>'ri-flight-takeoff-line','class'=>'success'],
            ['title'=>'تورهای فعال','value'=>$toursCount ?? 0,'icon'=>'ri-map-2-line','class'=>'warning'],
            ['title'=>'رزروهای در انتظار','value'=>$pendingBookings ?? 0,'icon'=>'ri-calendar-check-line','class'=>'danger'],
        ])
        @foreach($cards as $card)
        <div class="col-xl-3 col-lg-6 col-md-6"><div class="card custom-card h-100"><div class="card-body"><div class="d-flex align-items-center gap-3"><div class="avatar avatar-md bg-{{ $card['class'] }} svg-white"><i class="{{ $card['icon'] }} fs-24"></i></div><div><div class="fw-medium fs-13 text-dark">{{ $card['title'] }}</div><div class="fs-22 fw-semibold text-primary mt-1">{{ number_format($card['value']) }}</div></div></div></div></div></div>
        @endforeach
    </div>

    <div class="row g-3 mt-1">
        <div class="col-xl-8"><div class="card custom-card"><div class="card-header"><div class="card-title">تعداد بازدید سایت در ۱۰ روز اخیر</div></div><div class="card-body"><div id="visits-chart" style="min-height:320px"></div></div></div></div>
        <div class="col-xl-4"><div class="card custom-card h-100"><div class="card-header"><div class="card-title">آخرین فعالیت‌ها</div></div><div class="card-body"><div class="list-group list-group-flush">
            @forelse(($latestLogs ?? []) as $log)
                <div class="list-group-item px-0"><div class="d-flex justify-content-between"><span class="fw-semibold">{{ $log->action ?? 'تغییر اطلاعات' }}</span><small class="text-muted">{{ isset($log->created_at) ? $log->created_at->toJalali()->format('Y/m/d H:i') : '-' }}</small></div><div class="text-muted fs-12 mt-1">{{ $log->description ?? '' }}</div></div>
            @empty
                <div class="text-muted text-center py-5">فعالیتی برای نمایش وجود ندارد.</div>
            @endforelse
        </div></div></div></div>
    </div>
</div>
@endsection

@push('scripts')
<script src="{{ asset('assets/admin/plugins/apexcharts/apexcharts.min.js') }}"></script>
<script>
document.addEventListener('DOMContentLoaded', function(){
    const el=document.querySelector('#visits-chart'); if(!el || !window.ApexCharts) return;
    new ApexCharts(el,{chart:{type:'area',height:320,toolbar:{show:false}},series:[{name:'بازدید',data:@json($visitData ?? [])}],xaxis:{categories:@json($visitLabels ?? [])},stroke:{curve:'smooth',width:3},dataLabels:{enabled:false},grid:{borderColor:'#eee'}}).render();
});
</script>
@endpush