This commit is contained in:
xds
2026-03-16 15:43:20 +03:00
parent 002e4cca31
commit 1d76f29244
14 changed files with 546 additions and 89 deletions

View File

@@ -1,5 +1,6 @@
<script setup lang="ts">
import { onMounted, ref, computed, nextTick } from 'vue'
import { RouterLink } from 'vue-router'
import { useCoachingStore } from '../stores/coaching'
import { useAuthStore } from '../stores/auth'
import type { ChatMessage, TrainingPlan, ComplianceWeek, TodayWorkout } from '../types/models'
@@ -186,11 +187,14 @@ onMounted(async () => {
</div>
<!-- Today's workout card -->
<Card v-if="todayWorkout && onboardingCompleted" class="mb-6 border-l-4 border-l-primary">
<Card v-if="todayWorkout && onboardingCompleted" :class="['mb-6 border-l-4', todayWorkout.completed ? 'border-l-green-500' : 'border-l-primary']">
<template #content>
<div class="flex items-center justify-between">
<div>
<p class="text-surface-500 text-xs uppercase mb-1">Тренировка на сегодня</p>
<div class="flex items-center gap-2 mb-1">
<p class="text-surface-500 text-xs uppercase">Тренировка на сегодня</p>
<Tag v-if="todayWorkout.completed" value="Выполнено" severity="success" class="text-xs" />
</div>
<p class="text-lg font-bold">{{ todayWorkout.title }}</p>
<p class="text-surface-600 text-sm mt-1">{{ todayWorkout.description }}</p>
</div>
@@ -351,44 +355,74 @@ onMounted(async () => {
<div v-else class="space-y-4">
<Card v-for="week in compliance" :key="week.week_number">
<template #content>
<div class="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
<div class="flex-1">
<div class="flex items-center gap-3 mb-2">
<h3 class="font-semibold">Неделя {{ week.week_number }}</h3>
<Tag
:value="week.status === 'upcoming' ? 'Впереди' : week.status === 'current' ? 'Текущая' : 'Завершена'"
:severity="week.status === 'upcoming' ? 'secondary' : week.status === 'current' ? 'info' : 'success'"
class="text-xs"
/>
<span class="text-sm text-surface-500">{{ week.focus }}</span>
<div class="flex flex-col gap-4">
<div class="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
<div class="flex-1">
<div class="flex items-center gap-3 mb-2">
<h3 class="font-semibold">Неделя {{ week.week_number }}</h3>
<Tag
:value="week.status === 'upcoming' ? 'Впереди' : week.status === 'current' ? 'Текущая' : 'Завершена'"
:severity="week.status === 'upcoming' ? 'secondary' : week.status === 'current' ? 'info' : 'success'"
class="text-xs"
/>
<span class="text-sm text-surface-500">{{ week.focus }}</span>
</div>
<div class="mb-2">
<div class="flex items-center justify-between text-sm mb-1">
<span class="text-surface-500">Выполнение</span>
<span class="font-semibold">{{ week.adherence_pct }}%</span>
</div>
<ProgressBar
:value="week.adherence_pct"
:showValue="false"
style="height: 8px"
:class="week.adherence_pct >= 80 ? '' : week.adherence_pct >= 50 ? '[&_.p-progressbar-value]:!bg-amber-500' : '[&_.p-progressbar-value]:!bg-red-500'"
/>
</div>
</div>
<div class="mb-2">
<div class="flex items-center justify-between text-sm mb-1">
<span class="text-surface-500">Выполнение</span>
<span class="font-semibold">{{ week.adherence_pct }}%</span>
<div class="grid grid-cols-3 gap-4 text-center text-sm">
<div>
<p class="text-surface-500 text-xs">Тренировки</p>
<p class="font-semibold">{{ week.actual_rides }}/{{ week.planned_rides }}</p>
</div>
<div>
<p class="text-surface-500 text-xs">TSS</p>
<p class="font-semibold">{{ week.actual_tss }}/{{ week.planned_tss }}</p>
</div>
<div>
<p class="text-surface-500 text-xs">Часы</p>
<p class="font-semibold">{{ week.actual_hours }}/{{ week.planned_hours }}</p>
</div>
<ProgressBar
:value="week.adherence_pct"
:showValue="false"
style="height: 8px"
:class="week.adherence_pct >= 80 ? '' : week.adherence_pct >= 50 ? '[&_.p-progressbar-value]:!bg-amber-500' : '[&_.p-progressbar-value]:!bg-red-500'"
/>
</div>
</div>
<div class="grid grid-cols-3 gap-4 text-center text-sm">
<div>
<p class="text-surface-500 text-xs">Тренировки</p>
<p class="font-semibold">{{ week.actual_rides }}/{{ week.planned_rides }}</p>
</div>
<div>
<p class="text-surface-500 text-xs">TSS</p>
<p class="font-semibold">{{ week.actual_tss }}/{{ week.planned_tss }}</p>
</div>
<div>
<p class="text-surface-500 text-xs">Часы</p>
<p class="font-semibold">{{ week.actual_hours }}/{{ week.planned_hours }}</p>
<!-- Per-day breakdown -->
<div v-if="week.days?.length" class="flex flex-wrap gap-2">
<div
v-for="d in week.days"
:key="d.day"
:class="[
'flex items-center gap-2 px-3 py-1.5 rounded-lg text-xs border',
d.completed
? 'bg-green-50 border-green-200 text-green-700'
: d.workout_type === 'rest'
? 'bg-surface-50 border-surface-200 text-surface-400'
: 'bg-white border-surface-200 text-surface-600'
]"
>
<i :class="['pi text-xs', d.completed ? 'pi-check-circle text-green-500' : d.workout_type === 'rest' ? 'pi-minus text-surface-300' : 'pi-circle text-surface-300']"></i>
<span class="font-semibold">{{ dayLabel(d.day) }}</span>
<span>{{ d.planned }}</span>
<RouterLink
v-if="d.activity_id"
:to="{ name: 'activity-detail', params: { id: d.activity_id } }"
class="text-primary hover:underline ml-1"
@click.stop
>
<i class="pi pi-external-link text-xs"></i>
</RouterLink>
</div>
</div>
</div>