import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import '../models/data_abnormal_type.dart';
import '../theme/app_colors.dart';

class BatteryInfoPanel extends StatelessWidget {
  final double batteryVolt;
  final double batteryTemp;
  final double maxVolt;
  final double minVolt;
  final double maxTemp;
  final double minTemp;
  final double tempAvg;
  final DataAbnormalType abnormalType;

  const BatteryInfoPanel({
    super.key,
    required this.batteryVolt,
    required this.batteryTemp,
    required this.maxVolt,
    required this.minVolt,
    required this.maxTemp,
    required this.minTemp,
    this.tempAvg = 0,
    this.abnormalType = DataAbnormalType.none,
  });

  @override
  Widget build(BuildContext context) {
    final c = context.colors;
    final bool isVoltageAbnormal =
        abnormalType == DataAbnormalType.voltageAbnormal;
    final Color voltColor = isVoltageAbnormal ? c.healthRed : c.textPrimary;

    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        // ---------- 电压列 ----------
        Expanded(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _buildInfoItem(
                context,
                _buildIcon(context, 'voltage'),
                '电压',
                '${batteryVolt.toStringAsFixed(3)}V',
                textColor: voltColor,
              ),
              const SizedBox(height: 8),
              Row(
                children: [
                  RichText(
                    text: TextSpan(
                      style: TextStyle(
                        fontFamily: 'Flyme',
                        fontSize: 14,
                        fontWeight: FontWeight.w500,
                        color: c.voltUp,
                      ),
                      children: [
                        TextSpan(
                          text: '↑ ',
                          style: TextStyle(
                            fontFamily: 'HarmonyOS_Sans_SC',
                            color: c.voltUp,
                          ),
                        ),
                        TextSpan(text: '${maxVolt.toStringAsFixed(3)}V'),
                      ],
                    ),
                  ),
                  const SizedBox(width: 12),
                  RichText(
                    text: TextSpan(
                      style: TextStyle(
                        fontFamily: 'Flyme',
                        fontSize: 14,
                        fontWeight: FontWeight.w500,
                        color: c.voltDown,
                      ),
                      children: [
                        TextSpan(
                          text: '↓ ',
                          style: TextStyle(
                            fontFamily: 'HarmonyOS_Sans_SC',
                            color: c.voltDown,
                          ),
                        ),
                        TextSpan(text: '${minVolt.toStringAsFixed(3)}V'),
                      ],
                    ),
                  ),
                ],
              ),
            ],
          ),
        ),
        // ---------- 温度列 ----------
        Expanded(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _buildInfoItem(
                context,
                _buildIcon(context, 'temperature'),
                '温度',
                '${batteryTemp.toStringAsFixed(0)}℃',
              ),
              const SizedBox(height: 8),
              Row(
                children: [
                  RichText(
                    text: TextSpan(
                      style: TextStyle(
                        fontFamily: 'Flyme',
                        fontSize: 12,
                        fontWeight: FontWeight.w500,
                        color: c.tempUp,
                      ),
                      children: [
                        TextSpan(
                          text: '↑ ',
                          style: TextStyle(
                            fontFamily: 'HarmonyOS_Sans_SC',
                            color: c.tempUp,
                          ),
                        ),
                        TextSpan(text: '${maxTemp.toStringAsFixed(1)}℃'),
                      ],
                    ),
                  ),
                  const SizedBox(width: 6),
                  RichText(
                    text: TextSpan(
                      style: TextStyle(
                        fontFamily: 'Flyme',
                        fontSize: 12,
                        fontWeight: FontWeight.w500,
                        color: c.tempDown,
                      ),
                      children: [
                        TextSpan(
                          text: '↓ ',
                          style: TextStyle(
                            fontFamily: 'HarmonyOS_Sans_SC',
                            color: c.tempDown,
                          ),
                        ),
                        TextSpan(text: '${minTemp.toStringAsFixed(1)}℃'),
                      ],
                    ),
                  ),
                  const SizedBox(width: 6),
                  _buildIcon(context, 'avg', size: 14),
                  const SizedBox(width: 2),
                  Text(
                    '${tempAvg.toStringAsFixed(1)}℃',
                    style: TextStyle(
                      fontFamily: 'Flyme',
                      fontSize: 12,
                      fontWeight: FontWeight.w500,
                      color: c.textTertiary,
                    ),
                  ),
                ],
              ),
            ],
          ),
        ),
      ],
    );
  }

  Widget _buildIcon(BuildContext context, String type, {double size = 18}) {
    final c = context.colors;
    final filter = ColorFilter.mode(c.textTertiary, BlendMode.srcIn);
    switch (type) {
      case 'voltage':
        return SvgPicture.asset(
          'assets/icons/si--lightning-fill.svg',
          width: size,
          height: size,
          colorFilter: filter,
        );
      case 'temperature':
        return SvgPicture.asset(
          'assets/icons/mdi--temperature.svg',
          width: size,
          height: size,
          colorFilter: filter,
        );
      case 'avg':
        return SvgPicture.asset(
          'assets/icons/avg.svg',
          width: size,
          height: size,
          colorFilter: filter,
        );
      default:
        return Icon(Icons.help_outline, size: size, color: c.textTertiary);
    }
  }

  Widget _buildInfoItem(
    BuildContext context,
    Widget icon,
    String label,
    String value, {
    Color? textColor,
  }) {
    final c = context.colors;
    return Row(
      children: [
        icon,
        const SizedBox(width: 6),
        Text(
          label,
          style: TextStyle(
            fontFamily: 'HarmonyOS_Sans_SC',
            fontSize: 14,
            color: c.textTertiary,
          ),
        ),
        const SizedBox(width: 6),
        Text(
          value,
          style: TextStyle(
            fontFamily: 'Flyme',
            fontSize: 16,
            fontWeight: FontWeight.w500,
            color: textColor ?? c.textPrimary,
          ),
        ),
      ],
    );
  }
}