import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:fl_chart/fl_chart.dart';

class HourlyChartBlock extends StatelessWidget {
  final List<double> hourlyData;
  final double maxValue;

  const HourlyChartBlock({
    super.key,
    required this.hourlyData,
    required this.maxValue,
  });

  double get _chartMaxY {
    final dataMaxValue = maxValue > 0 ? maxValue : 0.0;
    final listMaxValue =
        hourlyData.isEmpty ? 0.0 : hourlyData.reduce((a, b) => a > b ? a : b);
    final chartMaxValue =
        dataMaxValue > listMaxValue ? dataMaxValue : listMaxValue;
    if (chartMaxValue <= 0) {
      return 100;
    }
    return chartMaxValue * 1.2;
  }

  double get _chartInterval => _chartMaxY / 5;

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.symmetric(horizontal: 16.w),
      padding: EdgeInsets.all(24.w),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(20.r),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '今日逐时用电',
            style: TextStyle(
              color: Colors.black87,
              fontSize: 24.sp,
              fontWeight: FontWeight.w500,
            ),
          ),
          SizedBox(height: 100.h),
          SizedBox(
            height: 200.h,
            child: BarChart(
              BarChartData(
                alignment: BarChartAlignment.spaceAround,
                maxY: _chartMaxY,
                barTouchData: BarTouchData(enabled: false),
                titlesData: FlTitlesData(
                  show: true,
                  rightTitles: const AxisTitles(
                    sideTitles: SideTitles(showTitles: false),
                  ),
                  topTitles: const AxisTitles(
                    sideTitles: SideTitles(showTitles: false),
                  ),
                  bottomTitles: AxisTitles(
                    sideTitles: SideTitles(
                      showTitles: true,
                      reservedSize: 30,
                      getTitlesWidget: _getBottomTitleWidget,
                    ),
                  ),
                  leftTitles: AxisTitles(
                    sideTitles: SideTitles(
                      showTitles: true,
                      reservedSize: 40,
                      getTitlesWidget: _getLeftTitleWidget,
                    ),
                  ),
                ),
                borderData: FlBorderData(show: false),
                gridData: FlGridData(
                  show: true,
                  drawVerticalLine: false,
                  horizontalInterval: _chartInterval,
                  getDrawingHorizontalLine: (value) {
                    return const FlLine(
                      color: Color.fromRGBO(200, 200, 200, 1),
                      strokeWidth: 1,
                      dashArray: [5, 5],
                    );
                  },
                ),
                barGroups: _buildBarGroups(),
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _getBottomTitleWidget(double value, TitleMeta meta) {
    const style = TextStyle(
      color: Colors.black54,
      fontSize: 14,
    );
    String text;
    final index = value.toInt();
    if (index % 4 == 0) {
      if (index == 0) {
        text = '00:00';
      } else if (index == 24) {
        text = '24:00';
      } else {
        text = '${index.toString().padLeft(2, '0')}:00';
      }
    } else {
      text = '';
    }
    return SideTitleWidget(
      meta: meta,
      child: Text(text, style: style),
    );
  }

  Widget _getLeftTitleWidget(double value, TitleMeta meta) {
    const style = TextStyle(
      color: Colors.black54,
      fontSize: 14,
    );
    final text = value % _chartInterval == 0
        ? value.toStringAsFixed(value.truncateToDouble() == value ? 0 : 1)
        : '';
    return SideTitleWidget(
      meta: meta,
      child: Text(text, style: style),
    );
  }

  List<BarChartGroupData> _buildBarGroups() {
    return hourlyData.asMap().entries.map((entry) {
      final index = entry.key;
      final value = entry.value;
      return BarChartGroupData(
        x: index,
        barRods: [
          BarChartRodData(
            toY: value,
            color: const Color.fromRGBO(59, 130, 246, 1),
            width: 12.w,
            borderRadius: const BorderRadius.only(
              topLeft: Radius.circular(4),
              topRight: Radius.circular(4),
            ),
          ),
        ],
      );
    }).toList();
  }
}
