scp-syria/resources/views/user/dashboard.blade.php

117 lines
5.6 KiB
PHP

@extends('layouts.user')
@section('title', 'حجوزاتي — دمشق باركينغ')
@section('content')
{{-- Page header --}}
<div class="d-flex align-items-center gap-3 mb-4">
<a href="{{ route('parking.index') }}"
class="btn btn-sm"
style="background:#f1f5f9;color:#475569;border:none;border-radius:.5rem;font-family:'Cairo',sans-serif;">
<i class="bi bi-arrow-right me-1"></i>العودة
</a>
<div>
<h1 class="fw-800 mb-0" style="font-size:1.25rem;color:#0f172a;">حجوزاتي</h1>
<p class="text-sm mb-0" style="color:#64748b;">سجل حجوزاتك في مواقف السيارات</p>
</div>
</div>
{{-- ── Stats row ──────────────────────────────────────────────────────────── --}}
<div class="row g-3 mb-4">
@php
$statCards = [
['label' => 'إجمالي الحجوزات', 'value' => $stats['total'], 'icon' => 'bi-calendar3', 'color' => '#6366f1', 'bg' => 'rgba(99,102,241,.1)'],
['label' => 'نشطة', 'value' => $stats['active'], 'icon' => 'bi-clock-history', 'color' => '#f59e0b', 'bg' => 'rgba(245,158,11,.1)'],
['label' => 'مكتملة', 'value' => $stats['completed'], 'icon' => 'bi-check-circle', 'color' => '#10b981', 'bg' => 'rgba(16,185,129,.1)'],
['label' => 'ملغاة', 'value' => $stats['cancelled'], 'icon' => 'bi-x-circle', 'color' => '#ef4444', 'bg' => 'rgba(239,68,68,.1)'],
];
@endphp
@foreach($statCards as $s)
<div class="col-6 col-md-3">
<div class="card stat-card">
<div class="card-body p-3 d-flex align-items-center gap-3">
<div class="rounded-3 d-flex align-items-center justify-content-center flex-shrink-0"
style="width:44px;height:44px;background:{{ $s['bg'] }};">
<i class="bi {{ $s['icon'] }}" style="font-size:1.2rem;color:{{ $s['color'] }};"></i>
</div>
<div>
<div class="fw-800" style="font-size:1.4rem;color:{{ $s['color'] }};line-height:1;">{{ $s['value'] }}</div>
<div class="text-xs" style="color:#64748b;">{{ $s['label'] }}</div>
</div>
</div>
</div>
</div>
@endforeach
</div>
{{-- ── Bookings table ──────────────────────────────────────────────────────── --}}
<div class="card">
<div class="card-header d-flex align-items-center justify-content-between">
<span class="fw-700" style="font-size:.9rem;">
<i class="bi bi-list-check me-2" style="color:#6366f1;"></i>
قائمة الحجوزات
</span>
<span class="badge badge-soft-secondary text-xs">{{ $stats['total'] }} حجز</span>
</div>
@if($bookings->isEmpty())
<div class="text-center py-5" style="color:#94a3b8;">
<i class="bi bi-calendar-x d-block mb-2" style="font-size:2.5rem;opacity:.35;"></i>
<p class="fw-600 mb-1" style="color:#64748b;">لا توجد حجوزات بعد</p>
<p class="text-sm mb-3" style="color:#94a3b8;">ابدأ بالبحث عن موقف وحجز مكانك</p>
<a href="{{ route('parking.index') }}"
class="btn btn-sm fw-600"
style="background:#6366f1;color:#fff;border:none;border-radius:.5rem;font-family:'Cairo',sans-serif;">
<i class="bi bi-search me-1"></i>تصفح المواقف
</a>
</div>
@else
<div class="table-responsive">
<table class="app-table w-100">
<thead>
<tr>
<th>#</th>
<th>الموقف</th>
<th>تاريخ البدء</th>
<th>تاريخ الانتهاء</th>
<th>الحالة</th>
</tr>
</thead>
<tbody>
@foreach($bookings as $booking)
<tr>
<td class="text-sm" style="color:#94a3b8;">{{ $booking->id }}</td>
<td>
<span class="fw-600" style="color:#0f172a;">
{{ $booking->parkingLot?->name ?? '—' }}
</span>
<div class="text-xs" style="color:#94a3b8;">{{ $booking->parkingLot?->address }}</div>
</td>
<td class="text-sm" style="color:#475569;">
{{ $booking->start_time->format('Y/m/d') }}
<div class="text-xs" style="color:#94a3b8;">{{ $booking->start_time->format('H:i') }}</div>
</td>
<td class="text-sm" style="color:#475569;">
{{ $booking->end_time->format('Y/m/d') }}
<div class="text-xs" style="color:#94a3b8;">{{ $booking->end_time->format('H:i') }}</div>
</td>
<td>
@if($booking->status === 'active')
<span class="badge badge-soft-warning">نشط</span>
@elseif($booking->status === 'completed')
<span class="badge badge-soft-success">مكتمل</span>
@else
<span class="badge badge-soft-danger">ملغي</span>
@endif
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
@endif
</div>
@endsection