import DayNavigator from '@/Components/DayNavigator'; import ExportButton from '@/Components/ExportButton'; import PrintButton from '@/Components/PrintButton'; import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout'; import BarMetricChart from '@/Pages/Metric/BarMetricChart'; import MetricMeasure from '@/Pages/Metric/MetricMeasure'; import MetricPeriodSummary from '@/Pages/Metric/MetricPeriodSummary'; import MetricSummaryCard from '@/Pages/Metric/MetricSummaryCard'; import { Activity, AggregatedMetricData, MetricPeriod, User } from '@/types'; import { Head, router, usePage } from '@inertiajs/react'; import dayjs, { Dayjs } from 'dayjs'; import { useState } from 'react'; interface ActivityMetricDetailProps { measures: Activity[]; measuresByHour: AggregatedMetricData[]; patient: User; availableDates: string[]; period: MetricPeriod<{ date: string; kcal: number }> | null; filters: { date: string }; } export default function ActivityMetricDetail({ measures, measuresByHour, patient, availableDates, period, filters, }: ActivityMetricDetailProps) { const user = usePage().props.auth.user; const [date, setDate] = useState( filters?.date || dayjs().format('YYYY-MM-DD'), ); const onDateChange = (updatedDate: Dayjs) => { const dateString = dayjs(updatedDate).format('YYYY-MM-DD'); setDate(dateString); router.get( route('activity.detail', { patient: patient.id }), { date: dateString }, { preserveState: true, preserveScroll: true, replace: true }, ); }; const onRangeChange = (from: Dayjs, to: Dayjs) => { router.get( route('activity.detail', { patient: patient.id }), { from: from.format('YYYY-MM-DD'), to: to.format('YYYY-MM-DD'), }, { preserveState: true, preserveScroll: true, replace: true }, ); }; const periodData = period ? period.data.map((point) => ({ date: dayjs(point.date).format( period.byMonth ? 'MM/YYYY' : 'DD/MM', ), value: point.kcal, })) : []; const data = measuresByHour.map((measure) => ({ date: dayjs(measure.date).format('HH:mm'), value: measure.sum, })); const totalKcal = measures.reduce((s, m) => s + (m.kcal ?? 0), 0); const totalSteps = measures.reduce((s, m) => s + (m.steps ?? 0), 0); const totalDistance = measures.reduce((s, m) => s + (m.distance ?? 0), 0); const backLinkLabel = patient.id === user.id ? 'Dashboard' : `${patient.name} ${patient.surname}`; return (

Attività fisica

{period && ( )} {!period && (

{totalDistance > 0 && ( )}

)}

Monitorare l'attività fisica quotidiana aiuta a mantenere un buon stato di salute. Il grafico mostra le calorie bruciate ora per ora durante la giornata.

{!period && (

Attività rilevate

); })}

)}

); }