Files
fitness/resources/views/dashboard.blade.php
T

93 lines
6.1 KiB
PHP

<x-app-layout>
<section class="bg-white dark:bg-gray-900 border-b border-gray-100 dark:border-gray-800">
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-8">
<div class="flex items-center justify-between">
<div>
<h1 class="text-2xl sm:text-3xl font-extrabold tracking-tight text-gray-900 dark:text-white">{{ __('app.dashboard.title') }}</h1>
<p class="mt-2 text-gray-600 dark:text-gray-300">{{ __('app.dashboard.subtitle') }}</p>
</div>
</div>
</div>
</section>
<section class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-6">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
<div class="rounded-2xl ring-1 ring-gray-200 dark:ring-gray-700 bg-white dark:bg-gray-800 p-5">
<div class="text-sm text-gray-500">{{ __('app.dashboard.metrics.workouts') }}</div>
<div class="mt-2 text-3xl font-bold text-gray-900 dark:text-white">{{ $workoutsCount }}</div>
</div>
<div class="rounded-2xl ring-1 ring-gray-200 dark:ring-gray-700 bg-white dark:bg-gray-800 p-5">
<div class="text-sm text-gray-500">{{ __('app.dashboard.metrics.sessions') }}</div>
<div class="mt-2 text-3xl font-bold text-gray-900 dark:text-white">{{ $sessionsCount }}</div>
</div>
<div class="rounded-2xl ring-1 ring-gray-200 dark:ring-gray-700 bg-white dark:bg-gray-800 p-5">
<div class="text-sm text-gray-500">{{ __('app.dashboard.metrics.completed') }}</div>
<div class="mt-2 text-3xl font-bold text-gray-900 dark:text-white">{{ $completedSessions }}</div>
</div>
<div class="rounded-2xl ring-1 ring-gray-200 dark:ring-gray-700 bg-white dark:bg-gray-800 p-5">
<div class="flex items-center justify-between">
<div class="text-sm text-gray-500">{{ __('app.dashboard.metrics.completion_rate') }}</div>
<div class="text-sm font-semibold text-indigo-600">{{ $completionRate }}%</div>
</div>
<div class="mt-3 h-2 w-full rounded-full bg-gray-200 dark:bg-gray-700 overflow-hidden">
<div class="h-2 bg-gradient-to-r from-emerald-500 to-teal-500" style="width: {{ $completionRate }}%"></div>
</div>
</div>
</div>
<div class="mt-8 grid grid-cols-1 lg:grid-cols-12 gap-6">
<div class="lg:col-span-7 rounded-2xl ring-1 ring-gray-200 dark:ring-gray-700 bg-white dark:bg-gray-800 p-5">
<div class="flex items-center justify-between">
<h2 class="text-lg font-semibold text-gray-900 dark:text-white">{{ __('app.dashboard.recent_sessions') }}</h2>
</div>
@if($recentSessions->isEmpty())
<div class="mt-3 rounded-xl border border-dashed border-gray-300 dark:border-gray-700 p-6 text-sm text-gray-600 dark:text-gray-300">{{ __('app.dashboard.no_sessions') }}</div>
@else
<ul class="mt-4 space-y-4">
@foreach($recentSessions as $s)
<li class="rounded-xl ring-1 ring-gray-200 dark:ring-gray-700 bg-white dark:bg-gray-900 p-4">
<div class="flex items-center justify-between gap-4">
<div>
<div class="text-base font-semibold text-gray-900 dark:text-white">{{ $s['workout_title'] }}</div>
<div class="mt-1 text-sm text-gray-600 dark:text-gray-300">
{{ $s['done'] }} / {{ $s['total'] }} · {{ $s['pct'] }}%
@if($s['completed_at'])
· <span class="text-emerald-600">{{ __('app.dashboard.completed') }}</span>
@endif
</div>
<div class="mt-2 h-2 w-56 rounded-full bg-gray-200 dark:bg-gray-700 overflow-hidden">
<div class="h-2 bg-indigo-500" style="width: {{ $s['pct'] }}%"></div>
</div>
</div>
<a href="{{ route('sessions.show', $s['id']) }}" class="text-sm font-semibold text-indigo-600 hover:text-indigo-500">{{ __('app.dashboard.view_session') }}</a>
</div>
</li>
@endforeach
</ul>
@endif
</div>
<div class="lg:col-span-5 rounded-2xl ring-1 ring-gray-200 dark:ring-gray-700 bg-white dark:bg-gray-800 p-5">
<h2 class="text-lg font-semibold text-gray-900 dark:text-white">{{ __('app.dashboard.activity_30d') }}</h2>
<p class="mt-1 text-sm text-gray-600 dark:text-gray-300">{{ __('app.dashboard.activity_30d_help') }}</p>
@php
$today = now()->startOfDay();
$days = [];
for ($i = 29; $i >= 0; $i--) { $d = $today->copy()->subDays($i)->format('Y-m-d'); $days[] = $d; }
$max = max(1, $dailyActivity->max() ?? 0);
@endphp
<div class="mt-4 grid grid-cols-10 gap-2">
@foreach($days as $d)
@php $count = $dailyActivity[$d] ?? 0; $pct = $max ? intval(($count / $max) * 100) : 0; @endphp
<div class="h-14 rounded-lg bg-gray-100 dark:bg-gray-900 ring-1 ring-gray-200 dark:ring-gray-700 flex items-center justify-center">
<div class="w-8 h-8 rounded-full bg-indigo-500/20 flex items-center justify-center">
<span class="text-xs font-semibold text-indigo-600">{{ $count }}</span>
</div>
</div>
@endforeach
</div>
</div>
</div>
</section>
</x-app-layout>