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

class MonitoringTopStatusBar extends StatelessWidget {
  const MonitoringTopStatusBar({
    super.key,
    this.isBluetoothBound = false,
    this.onBluetoothTap,
  });

  final bool isBluetoothBound;
  final VoidCallback? onBluetoothTap;

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: const BoxDecoration(
        image: DecorationImage(
          image: AssetImage('lib/assets/monitoring/top_status_bg.png'),
          fit: BoxFit.fill,
        ),
      ),
      padding: EdgeInsets.only(left: 20.w, right: 20.w, bottom: 22.h),
      child: Row(
        children: [
          // SizedBox(width: 18.w),
          Text(
            '总运行时长:9999h',
            style: TextStyle(
              color: Colors.white,
              fontSize: 16.sp,
            ),
          ),
          SizedBox(width: 8.w),
          Text(
            '环境温度:30.68',
            style: TextStyle(
              color: Colors.white,
              fontSize: 16.sp,
            ),
          ),
          SizedBox(width: 8.w),
          Text(
            '总制氧时长:500h',
            style: TextStyle(
              color: Colors.white,
              fontSize: 16.sp,
            ),
          ),
          const Spacer(),
          _BluetoothStatusButton(
            isActive: isBluetoothBound,
            onTap: onBluetoothTap,
          ),
        ],
      ),
    );
  }
}

class _BluetoothStatusButton extends StatelessWidget {
  const _BluetoothStatusButton({
    required this.isActive,
    required this.onTap,
  });

  final bool isActive;
  final VoidCallback? onTap;

  @override
  Widget build(BuildContext context) {
    final foregroundColor = isActive ? const Color(0xFF003A8C) : Colors.white;
    final backgroundColor = isActive
        ? const Color(0xFF00F6FF)
        : Colors.white.withValues(alpha: 0.08);
    final borderColor = isActive ? const Color(0xFFB8FFFF) : Colors.white24;

    return InkWell(
      onTap: onTap,
      borderRadius: BorderRadius.circular(18.r),
      child: Container(
        height: 34.h,
        padding: EdgeInsets.symmetric(horizontal: 12.w),
        decoration: BoxDecoration(
          color: backgroundColor,
          border: Border.all(color: borderColor, width: 1),
          borderRadius: BorderRadius.circular(18.r),
        ),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            Icon(Icons.bluetooth, color: foregroundColor, size: 18.w),
            SizedBox(width: 6.w),
            Text(
              'TSAAS',
              style: TextStyle(
                color: foregroundColor,
                fontSize: 14.sp,
                fontWeight: isActive ? FontWeight.w700 : FontWeight.w400,
              ),
            ),
          ],
        ),
      ),
    );
  }
}
