353 lines
12 KiB
Dart
353 lines
12 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
|
import '../../database/database.dart';
|
|
import '../../services/export_service.dart';
|
|
import '../replay/replay_screen.dart';
|
|
import '../map/map_screen.dart';
|
|
import 'package:go_router/go_router.dart';
|
|
|
|
class RideDetailScreen extends ConsumerStatefulWidget {
|
|
final Ride ride;
|
|
|
|
const RideDetailScreen({super.key, required this.ride});
|
|
|
|
@override
|
|
ConsumerState<RideDetailScreen> createState() => _RideDetailScreenState();
|
|
}
|
|
|
|
class _RideDetailScreenState extends ConsumerState<RideDetailScreen> {
|
|
List<RideEvent> _events = [];
|
|
bool _isLoadingEvents = true;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_loadEvents();
|
|
}
|
|
|
|
Future<void> _loadEvents() async {
|
|
final db = ref.read(databaseProvider);
|
|
final events = await (db.select(
|
|
db.rideEvents,
|
|
)..where((e) => e.rideId.equals(widget.ride.id))).get();
|
|
if (mounted) {
|
|
setState(() {
|
|
_events = events;
|
|
_isLoadingEvents = false;
|
|
});
|
|
}
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final r = widget.ride;
|
|
return Scaffold(
|
|
appBar: AppBar(title: Text('Ride ${r.id} Details')),
|
|
body: ListView(
|
|
padding: const EdgeInsets.all(16),
|
|
children: [
|
|
if (r.motorcycleMake != null && r.motorcycleModel != null) ...[
|
|
Container(
|
|
padding: const EdgeInsets.all(16),
|
|
margin: const EdgeInsets.only(bottom: 16),
|
|
decoration: BoxDecoration(
|
|
color: Colors.cyanAccent.withValues(alpha: 0.1),
|
|
borderRadius: BorderRadius.circular(12),
|
|
border: Border.all(
|
|
color: Colors.cyanAccent.withValues(alpha: 0.5),
|
|
),
|
|
),
|
|
child: Row(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Icon(
|
|
Icons.two_wheeler,
|
|
color: Colors.cyanAccent,
|
|
size: 32,
|
|
),
|
|
const SizedBox(width: 12),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
'${r.motorcycleYear ?? ""} ${r.motorcycleMake} ${r.motorcycleModel}',
|
|
style: const TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
softWrap: true,
|
|
),
|
|
if (r.motorcycleVariant != null &&
|
|
r.motorcycleVariant!.isNotEmpty)
|
|
Text(
|
|
r.motorcycleVariant!,
|
|
style: const TextStyle(
|
|
color: Colors.white70,
|
|
fontSize: 12,
|
|
),
|
|
softWrap: true,
|
|
),
|
|
if (r.motorcycleId != null) ...[
|
|
const SizedBox(height: 8),
|
|
Align(
|
|
alignment: Alignment.centerLeft,
|
|
child: OutlinedButton(
|
|
style: OutlinedButton.styleFrom(
|
|
foregroundColor: Colors.cyanAccent,
|
|
side: const BorderSide(
|
|
color: Colors.cyanAccent,
|
|
),
|
|
),
|
|
onPressed: () =>
|
|
context.push('/garage/${r.motorcycleId}'),
|
|
child: const Text('View Specs'),
|
|
),
|
|
),
|
|
],
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
|
|
// Map Preview Card
|
|
Card(
|
|
clipBehavior: Clip.antiAlias,
|
|
margin: const EdgeInsets.only(bottom: 16),
|
|
child: Container(
|
|
padding: const EdgeInsets.all(16),
|
|
decoration: BoxDecoration(
|
|
color: Colors.black45,
|
|
border: Border.all(color: Colors.white12),
|
|
),
|
|
child: Row(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Icon(Icons.map, color: Colors.cyanAccent, size: 36),
|
|
const SizedBox(width: 16),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text(
|
|
'ROUTE PREVIEW',
|
|
style: TextStyle(
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 14,
|
|
letterSpacing: 1.5,
|
|
color: Colors.cyanAccent,
|
|
),
|
|
softWrap: true,
|
|
),
|
|
const SizedBox(height: 4),
|
|
const Text(
|
|
'View ride path and telemetry events on interactive map',
|
|
style: TextStyle(fontSize: 12, color: Colors.white70),
|
|
softWrap: true,
|
|
),
|
|
const SizedBox(height: 12),
|
|
Align(
|
|
alignment: Alignment.centerLeft,
|
|
child: ElevatedButton(
|
|
onPressed: () {
|
|
Navigator.of(context).push(
|
|
MaterialPageRoute(
|
|
builder: (_) => MapScreen(rideId: r.id),
|
|
),
|
|
);
|
|
},
|
|
child: const Text('VIEW ROUTE'),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
|
|
_buildSectionHeader('SUMMARY'),
|
|
_buildStatRow('Distance', '${r.distanceMiles.toStringAsFixed(2)} mi'),
|
|
_buildStatRow(
|
|
'Duration',
|
|
'${r.endTime?.difference(r.startTime).inMinutes ?? 0} min',
|
|
),
|
|
_buildStatRow(
|
|
'Moving Time',
|
|
'${(r.movingTime / 60).toStringAsFixed(1)} min',
|
|
),
|
|
_buildStatRow(
|
|
'Avg Speed',
|
|
'${r.averageSpeed.toStringAsFixed(1)} mph',
|
|
),
|
|
_buildStatRow('Top Speed', '${r.topSpeedMph.toStringAsFixed(1)} mph'),
|
|
const Divider(),
|
|
|
|
_buildSectionHeader('HANDLING'),
|
|
_buildStatRow(
|
|
'Max Lean (Left)',
|
|
'${r.maxLeanLeft.toStringAsFixed(1)}°',
|
|
),
|
|
_buildStatRow(
|
|
'Max Lean (Right)',
|
|
'${r.maxLeanRight.toStringAsFixed(1)}°',
|
|
),
|
|
_buildStatRow(
|
|
'Max Acceleration',
|
|
'${r.maxAccelG.toStringAsFixed(2)} G',
|
|
),
|
|
_buildStatRow('Max Braking', '${r.maxBrakingG.toStringAsFixed(2)} G'),
|
|
const Divider(),
|
|
|
|
_buildSectionHeader('ELEVATION'),
|
|
_buildStatRow('Gain', '${r.elevationGain.toStringAsFixed(0)} m'),
|
|
_buildStatRow('Loss', '${r.elevationLoss.toStringAsFixed(0)} m'),
|
|
const Divider(),
|
|
|
|
_buildSectionHeader('EVENTS'),
|
|
if (_isLoadingEvents)
|
|
const Center(child: CircularProgressIndicator())
|
|
else if (_events.isEmpty)
|
|
const Padding(
|
|
padding: EdgeInsets.all(8.0),
|
|
child: Text('No events recorded.'),
|
|
)
|
|
else
|
|
..._events.map(
|
|
(e) => ListTile(
|
|
dense: true,
|
|
leading: const Icon(
|
|
Icons.warning_amber,
|
|
color: Colors.amberAccent,
|
|
),
|
|
title: Text(e.eventType),
|
|
subtitle: Text(e.timestamp.toLocal().toString().split('.')[0]),
|
|
trailing: Text(
|
|
e.value.toStringAsFixed(1),
|
|
style: const TextStyle(fontWeight: FontWeight.bold),
|
|
),
|
|
),
|
|
),
|
|
const Divider(),
|
|
|
|
_buildSectionHeader('ACTIONS'),
|
|
ElevatedButton.icon(
|
|
onPressed: () {
|
|
Navigator.of(context).push(
|
|
MaterialPageRoute(builder: (_) => ReplayScreen(rideId: r.id)),
|
|
);
|
|
},
|
|
icon: const Icon(Icons.play_arrow),
|
|
label: const Text('Replay Ride'),
|
|
),
|
|
const SizedBox(height: 8),
|
|
OutlinedButton.icon(
|
|
onPressed: () {
|
|
ref.read(exportServiceProvider).exportRide(r.id, asGpx: true);
|
|
},
|
|
icon: const Icon(Icons.share),
|
|
label: const Text('Export GPX'),
|
|
),
|
|
const SizedBox(height: 8),
|
|
OutlinedButton.icon(
|
|
onPressed: () {
|
|
ref.read(exportServiceProvider).exportRide(r.id, asGpx: false);
|
|
},
|
|
icon: const Icon(Icons.table_chart),
|
|
label: const Text('Export CSV'),
|
|
),
|
|
const SizedBox(height: 8),
|
|
TextButton.icon(
|
|
onPressed: () async {
|
|
final confirm = await showDialog<bool>(
|
|
context: context,
|
|
builder: (c) => AlertDialog(
|
|
title: const Text('Delete Ride?'),
|
|
content: const Text('This cannot be undone.'),
|
|
actions: [
|
|
TextButton(
|
|
onPressed: () => Navigator.pop(c, false),
|
|
child: const Text('CANCEL'),
|
|
),
|
|
TextButton(
|
|
onPressed: () => Navigator.pop(c, true),
|
|
child: const Text(
|
|
'DELETE',
|
|
style: TextStyle(color: Colors.redAccent),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
|
|
if (confirm == true && mounted) {
|
|
final db = ref.read(databaseProvider);
|
|
await (db.delete(
|
|
db.telemetrySamples,
|
|
)..where((t) => t.rideId.equals(r.id))).go();
|
|
await (db.delete(
|
|
db.rideEvents,
|
|
)..where((e) => e.rideId.equals(r.id))).go();
|
|
await (db.delete(
|
|
db.rides,
|
|
)..where((ride) => ride.id.equals(r.id))).go();
|
|
if (context.mounted) {
|
|
Navigator.of(context).pop();
|
|
}
|
|
}
|
|
},
|
|
icon: const Icon(Icons.delete, color: Colors.redAccent),
|
|
label: const Text(
|
|
'Delete Ride',
|
|
style: TextStyle(color: Colors.redAccent),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildSectionHeader(String title) {
|
|
return Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 8),
|
|
child: Text(
|
|
title,
|
|
style: const TextStyle(
|
|
color: Colors.cyanAccent,
|
|
fontSize: 14,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: 2,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildStatRow(String label, String value) {
|
|
return Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 4),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Expanded(
|
|
child: Text(label, style: const TextStyle(color: Colors.white70)),
|
|
),
|
|
const SizedBox(width: 12),
|
|
Flexible(
|
|
child: Text(
|
|
value,
|
|
style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
|
|
textAlign: TextAlign.right,
|
|
softWrap: true,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|