import 'package:flutter/material.dart'; import 'package:get/get.dart'; import '../controllers/details_controller.dart'; import '../widgets/detail_header.dart'; import '../widgets/detail_info_card.dart'; import '../widgets/progress_ring.dart'; import '../widgets/action_button.dart'; class DetailsPage extends GetView { static const String namedRoute = '/details-page'; const DetailsPage({super.key}); @override Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.grey.shade50, body: Obx(() { final filament = controller.filament.value; if (filament == null) { return Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Icon(Icons.error_outline, size: 64, color: Colors.grey), SizedBox(height: 16), Text( 'Filament nicht gefunden', style: TextStyle(fontSize: 18, color: Colors.grey.shade600), ), ], ), ); } return CustomScrollView( slivers: [ // App Bar SliverAppBar( expandedHeight: 0, floating: true, pinned: true, backgroundColor: Colors.white, elevation: 0, leading: IconButton( icon: Icon(Icons.arrow_back, color: Colors.grey.shade800), onPressed: () => Get.back(), ), actions: [ IconButton( icon: Icon(Icons.share, color: Colors.grey.shade800), onPressed: () { // Share functionality }, ), ], ), // Content SliverToBoxAdapter( child: Column( children: [ // Header with color and name DetailHeader( name: filament.name, type: filament.type, color: filament.color, ), SizedBox(height: 24), // Usage Progress Ring Container( margin: EdgeInsets.symmetric(horizontal: 16), padding: EdgeInsets.all(24), decoration: BoxDecoration( gradient: LinearGradient( colors: [Colors.white, Colors.blue.shade50], begin: Alignment.topLeft, end: Alignment.bottomRight, ), borderRadius: BorderRadius.circular(24), boxShadow: [ BoxShadow( color: Colors.black.withAlpha(5), blurRadius: 15, offset: Offset(0, 5), ), ], ), child: Column( children: [ Text( 'Verbrauch', style: TextStyle( fontSize: 18, fontWeight: FontWeight.w600, color: Colors.grey.shade700, ), ), SizedBox(height: 20), ProgressRing( progress: controller.usagePercentage / 100, size: 140, strokeWidth: 14, backgroundColor: Colors.grey.shade300, progressColor: Colors.blue, ), SizedBox(height: 20), Row( mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ _buildStatItem( 'Verwendet', '${filament.weightUsed.toStringAsFixed(0)}g', Colors.orange, ), Container( width: 1, height: 40, color: Colors.grey.shade300, ), _buildStatItem( 'Verbleibend', '${controller.remainingWeight.toStringAsFixed(0)}g', Colors.green, ), ], ), ], ), ), SizedBox(height: 24), // Info Grid Padding( padding: EdgeInsets.symmetric(horizontal: 16), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( 'Details', style: TextStyle( fontSize: 20, fontWeight: FontWeight.bold, color: Colors.grey.shade800, ), ), SizedBox(height: 16), GridView.count( crossAxisCount: 2, shrinkWrap: true, physics: NeverScrollableScrollPhysics(), mainAxisSpacing: 12, crossAxisSpacing: 12, childAspectRatio: 1.6, children: [ DetailInfoCard( icon: Icons.scale, label: 'Gesamtgewicht', value: '${filament.weight.toStringAsFixed(0)}g', color: Colors.blue, ), DetailInfoCard( icon: Icons.euro, label: 'Preis', value: '€${filament.price.toStringAsFixed(2)}', color: Colors.green, ), if (filament.printingTemp != null) DetailInfoCard( icon: Icons.thermostat, label: 'Drucktemperatur', value: '${filament.printingTemp}°C', color: Colors.orange, ), if (filament.bedTemp != null) DetailInfoCard( icon: Icons.heat_pump, label: 'Bett Temperatur', value: '${filament.bedTemp}°C', color: Colors.red, ), if (filament.pices != null) DetailInfoCard( icon: Icons.inventory_2, label: 'Anzahl Rollen', value: '${filament.pices}', color: Colors.purple, ), if (filament.manufacturer != null) DetailInfoCard( icon: Icons.business, label: 'Hersteller', value: filament.manufacturer!, color: Colors.indigo, ), ], ), // Purchase Date if (filament.purchaseDate != null) ...[ SizedBox(height: 12), Container( width: double.infinity, padding: EdgeInsets.all(16), decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.circular(16), boxShadow: [ BoxShadow( color: Colors.black.withAlpha(5), blurRadius: 10, offset: Offset(0, 4), ), ], ), child: Row( children: [ Container( padding: EdgeInsets.all(10), decoration: BoxDecoration( color: Colors.teal.withAlpha(10), borderRadius: BorderRadius.circular(12), ), child: Icon( Icons.calendar_today, color: Colors.teal, size: 24, ), ), SizedBox(width: 12), Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( 'Kaufdatum', style: TextStyle( fontSize: 12, color: Colors.grey.shade600, fontWeight: FontWeight.w500, ), ), SizedBox(height: 4), Text( filament.purchaseDate!, style: TextStyle( fontSize: 18, fontWeight: FontWeight.bold, color: Colors.grey.shade800, ), ), ], ), ], ), ), ], // Notes if (filament.notes != null && filament.notes!.isNotEmpty) ...[ SizedBox(height: 24), Text( 'Notizen', style: TextStyle( fontSize: 20, fontWeight: FontWeight.bold, color: Colors.grey.shade800, ), ), SizedBox(height: 12), Container( width: double.infinity, padding: EdgeInsets.all(20), decoration: BoxDecoration( color: Colors.amber.shade50, borderRadius: BorderRadius.circular(16), border: Border.all( color: Colors.amber.shade200, width: 1, ), ), child: Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ Icon( Icons.notes, color: Colors.amber.shade700, size: 24, ), SizedBox(width: 12), Expanded( child: Text( filament.notes!, style: TextStyle( fontSize: 15, color: Colors.grey.shade800, height: 1.5, ), ), ), ], ), ), ], ], ), ), SizedBox(height: 32), // Action Buttons Padding( padding: EdgeInsets.symmetric(horizontal: 16), child: Row( children: [ Expanded( child: ActionButton( icon: Icons.edit, label: 'Bearbeiten', color: Colors.blue, onPressed: () => controller.onEditPressed(), ), ), SizedBox(width: 12), Expanded( child: ActionButton( icon: Icons.delete, label: 'Löschen', color: Colors.red, isOutlined: true, onPressed: () { _showDeleteDialog(context); }, ), ), ], ), ), SizedBox(height: 32), ], ), ), ], ); }), ); } Widget _buildStatItem(String label, String value, Color color) { return Column( children: [ Text( label, style: TextStyle( fontSize: 13, color: Colors.grey.shade600, fontWeight: FontWeight.w500, ), ), SizedBox(height: 6), Text( value, style: TextStyle( fontSize: 20, fontWeight: FontWeight.bold, color: color, ), ), ], ); } void _showDeleteDialog(BuildContext context) { Get.dialog( AlertDialog( shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)), title: Row( children: [ Icon(Icons.warning_amber_rounded, color: Colors.orange, size: 28), SizedBox(width: 12), Text('Filament löschen?'), ], ), content: Text( 'Möchten Sie dieses Filament wirklich löschen? Diese Aktion kann nicht rückgängig gemacht werden.', style: TextStyle(fontSize: 15), ), actions: [ TextButton( onPressed: () => Get.back(), child: Text( 'Abbrechen', style: TextStyle(color: Colors.grey.shade600), ), ), ElevatedButton( onPressed: () { Get.back(); controller.deleteFilament(); }, style: ElevatedButton.styleFrom( backgroundColor: Colors.red, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(12), ), ), child: Text('Löschen'), ), ], ), ); } }