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

// -- 资源常量 --
const String assetMetricBlue = 'lib/assets/monitoring/box_bg_325x372.png';
const String assetMetricGreen =
    'lib/assets/monitoring/frame_card_green_325x372.png';
const String assetPanelWide = 'lib/assets/monitoring/frame_button_324x164.png';
const String assetPanelLarge = 'lib/assets/monitoring/frame_panel_674x509.png';
const String assetPanelTall = 'lib/assets/monitoring/box_bg_460x905.png';
const String assetButton = 'lib/assets/monitoring/frame_button_324x164.png';
const String assetArrowButton =
    'lib/assets/monitoring/frame_button_arrows_561x637.png';

/// 面板外框容器
class DeviceControlPanelFrame extends StatelessWidget {
  const DeviceControlPanelFrame({
    super.key,
    required this.child,
    required this.padding,
    this.active = false,
    this.backgroundAsset,
  });

  final Widget child;
  final EdgeInsetsGeometry padding;
  final bool active;
  final String? backgroundAsset;

  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      height: double.infinity,
      padding: padding,
      decoration: BoxDecoration(
        color: backgroundAsset == null
            ? active
                ? const Color(0xFF003F14).withValues(alpha: 0.92)
                : const Color(0xFF061C34).withValues(alpha: 0.92)
            : null,
        image: backgroundAsset == null
            ? null
            : DecorationImage(
                image: AssetImage(backgroundAsset!),
                fit: BoxFit.fill,
              ),
        border: backgroundAsset == null
            ? Border.all(
                color: active
                    ? const Color(0xFF3EFF5F)
                    : const Color(0xFF89DFFF),
                width: 3.w,
              )
            : null,
        borderRadius: BorderRadius.circular(8.r),
        boxShadow: [
          BoxShadow(
            color: (active
                        ? const Color(0xFF3EFF5F)
                        : const Color(0xFF4FC8FF))
                    .withValues(alpha: 0.32),
            blurRadius: 18.r,
            spreadRadius: 2.r,
          ),
        ],
      ),
      child: child,
    );
  }
}

/// 面板标题
class DeviceControlPanelTitle extends StatelessWidget {
  const DeviceControlPanelTitle(this.text, {super.key});

  final String text;

  @override
  Widget build(BuildContext context) {
    return Text(
      text,
      maxLines: 1,
      overflow: TextOverflow.ellipsis,
      style: TextStyle(
        color: Colors.white,
        fontSize: 28.sp,
        fontWeight: FontWeight.w700,
      ),
    );
  }
}

/// 圆角标签
class DeviceControlPill extends StatelessWidget {
  const DeviceControlPill({
    super.key,
    required this.text,
    this.active = false,
  });

  final String text;
  final bool active;

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 40.h,
      constraints: BoxConstraints(minWidth: 90.w),
      padding: EdgeInsets.symmetric(horizontal: 18.w),
      alignment: Alignment.center,
      decoration: BoxDecoration(
        color: Colors.white.withValues(alpha: active ? 0.14 : 0.06),
        border: Border.all(
          color: active ? const Color(0xFF52FFBB) : const Color(0xFF75C1DD),
          width: 1.w,
        ),
        borderRadius: BorderRadius.circular(20.r),
      ),
      child: Text(
        text,
        style: TextStyle(
          color: active ? const Color(0xFF52FFBB) : const Color(0xFF75C1DD),
          fontSize: 22.sp,
          fontWeight: FontWeight.w700,
        ),
      ),
    );
  }
}

/// 加减调节文字
class DeviceControlAdjustText extends StatelessWidget {
  const DeviceControlAdjustText(this.text, {super.key, this.active = false});

  final String text;
  final bool active;

  @override
  Widget build(BuildContext context) {
    return Text(
      text,
      style: TextStyle(
        color: active ? const Color(0xFF20E5FF) : const Color(0xFF4B7191),
        fontSize: 58.sp,
        height: 1,
        fontWeight: FontWeight.w700,
      ),
    );
  }
}

/// 大号操作按钮
class DeviceControlBigActionButton extends StatelessWidget {
  const DeviceControlBigActionButton({super.key, required this.text});

  final String text;

  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      height: 64.h,
      decoration: deviceControlButtonDecoration(backgroundAsset: assetButton),
      alignment: Alignment.center,
      child: Text(
        '《《  $text  》》',
        style: TextStyle(
          color: const Color(0xFFC9F8FF),
          fontSize: 28.sp,
          fontWeight: FontWeight.w700,
        ),
      ),
    );
  }
}

/// 数字值展示框
class DeviceControlDigitalValueBox extends StatelessWidget {
  const DeviceControlDigitalValueBox({
    super.key,
    required this.value,
    required this.unit,
    this.active = false,
  });

  final String value;
  final String unit;
  final bool active;

  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      decoration: deviceControlButtonDecoration(
        active: active,
        backgroundAsset: assetButton,
      ),
      alignment: Alignment.center,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text(
            value,
            style: TextStyle(
              color: active ? const Color(0xFFC8FFFF) : Colors.white,
              fontSize: 46.sp,
              letterSpacing: 2,
              fontWeight: FontWeight.w500,
            ),
          ),
          SizedBox(width: 28.w),
          Text(
            unit,
            style: TextStyle(
              color: Colors.white,
              fontSize: 30.sp,
              fontWeight: FontWeight.w600,
            ),
          ),
        ],
      ),
    );
  }
}

/// 按钮装饰（公共样式）
BoxDecoration deviceControlButtonDecoration({
  bool active = false,
  String? backgroundAsset,
}) {
  return BoxDecoration(
    color: backgroundAsset == null
        ? active
            ? const Color(0xFF063F1A).withValues(alpha: 0.96)
            : const Color(0xFF0A243F).withValues(alpha: 0.96)
        : null,
    image: backgroundAsset == null
        ? null
        : DecorationImage(
            image: AssetImage(backgroundAsset),
            fit: BoxFit.fill,
          ),
    border: backgroundAsset == null
        ? Border.all(
            color: active ? const Color(0xFF2DF765) : const Color(0xFF66BDE8),
            width: 2,
          )
        : null,
    borderRadius: BorderRadius.circular(6),
  );
}

/// 指标图标资源映射
String deviceControlIconAsset(String label) {
  if (label.contains('温度')) {
    return 'lib/assets/monitoring/cabin_temperature.png';
  }
  if (label.contains('湿度')) {
    return 'lib/assets/monitoring/cabin_humidity.png';
  }
  if (label.contains('氧气')) {
    return 'lib/assets/monitoring/oxygen_concentration.png';
  }
  return 'lib/assets/monitoring/carbon_dioxide_concentration.png';
}
