import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../controller/graph_controller.dart';
import '../models/chart_model.dart';
import '../widgets/detail_info_card_widget.dart';
import '../widgets/detail_stat_widget.dart';
import '../widgets/chart_line_widget.dart';

class GraphPage extends GetView<GraphController> {
  static const String namedRoute = '/graph-page';

  const GraphPage({super.key});

  @override
  Widget build(BuildContext context) {
    var displayWidth = MediaQuery.of(context).size.width;
    var displayHeight = MediaQuery.of(context).size.height;
    var graphCtrl = controller;
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.blueGrey,
        foregroundColor: Colors.white,
        title: const Text('Graph Page'),
        centerTitle: true,
      ),
      body: Container(
        width: displayWidth,
        height: displayHeight,
        padding: EdgeInsets.all(16.0),
        decoration: BoxDecoration(
          gradient: LinearGradient(
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
            colors: [
              Colors.blueGrey[800]!,
              Colors.blueGrey[600]!,
              Colors.blueGrey[300]!,
              Colors.blue[100]!,
            ],
          ),
        ),
        child: Center(
          child: SingleChildScrollView(
            child: Column(
              children: [
                const SizedBox(height: 16),

                // Fahrzeugdaten
                DetailInfoCardWidget(
                  title: 'Jahresstatistik',
                  children: [
                    DetailStatWidget(
                      icon: Icons.speed,
                      label: 'Tachostand',
                      value: '${graphCtrl.szTachostand.value} KM',
                      iconColor: Colors.orange.shade900,
                      valueSize: 24,
                      valueWeight: FontWeight.bold,
                    ),
                    DetailStatWidget(
                      icon: Icons.directions_car,
                      label: 'Jahreskilometerverbrauch',
                      value: '${graphCtrl.sumYearKm.value} KM',
                      iconColor: Colors.blue,
                      valueSize: 24,
                      valueWeight: FontWeight.bold,
                    ),
                    DetailStatWidget(
                      icon: Icons.gas_meter,
                      label: 'Jahresliterverbrauch',
                      value:
                          '${graphCtrl.sumYearLiters.value.toStringAsFixed(2)} L',
                      iconColor: Colors.blue,
                      valueSize: 24,
                      valueWeight: FontWeight.bold,
                    ),
                    DetailStatWidget(
                      icon: Icons.euro,
                      label: 'Jahreskostenverbrauch',
                      value:
                          '${graphCtrl.sumYearPrice.value.toStringAsFixed(2)} €',
                      iconColor: Colors.blue,
                      valueSize: 24,
                      valueWeight: FontWeight.bold,
                    ),
                    DetailStatWidget(
                      icon: Icons.euro,
                      label: 'Jahresdurchschnittspreis pro Liter',
                      value:
                          '${graphCtrl.averagePricePerLiter.value.toStringAsFixed(2)} €',
                      iconColor: Colors.blue,
                      valueSize: 24,
                      valueWeight: FontWeight.bold,
                    ),
                  ],
                ),

                const SizedBox(height: 24),

                // Liniendiagramm
                ChartLineWidget(
                  chartData: ChartData.fromTankList(graphCtrl.listTankModel),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}