import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:smart_hotel_app/views/service/room/cubit/service_room_state.dart';

class RoomDeviceStatusCard extends StatelessWidget {
  final List<RoomDevice> devices;

  const RoomDeviceStatusCard({
    super.key,
    required this.devices,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(24.r),
      ),
      padding: EdgeInsets.symmetric(horizontal: 24.w, vertical: 24.h),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '房间设备状态',
            style: TextStyle(
              fontSize: 32.sp,
              fontWeight: FontWeight.bold,
              color: const Color.fromRGBO(10, 13, 20, 1.0),
            ),
          ),
          SizedBox(height: 20.h),
          GridView.builder(
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 2,
              crossAxisSpacing: 16.w,
              mainAxisSpacing: 16.h,
              childAspectRatio: 2,
            ),
            itemCount: devices.length,
            itemBuilder: (context, index) {
              final device = devices[index];
              return Container(
                decoration: BoxDecoration(
                  color: const Color.fromRGBO(235, 244, 255, 1.0),
                  borderRadius: BorderRadius.circular(28.r),
                ),
                padding: EdgeInsets.symmetric(horizontal: 20.w, vertical: 16.h),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Row(
                      children: [
                        Icon(
                          device.icon,
                          color: const Color.fromRGBO(66, 165, 245, 1.0),
                          size: 36.sp,
                        ),
                        SizedBox(width: 8.w),
                        Text(
                          device.name,
                          style: TextStyle(
                            fontSize: 28.sp,
                            color: const Color.fromRGBO(66, 165, 245, 1.0),
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ],
                    ),
                    SizedBox(height: 12.h),
                    if (device.statusText != null)
                      Text(
                        device.statusText!,
                        style: TextStyle(
                          fontSize: 26.sp,
                          color: device.isOn
                              ? const Color.fromRGBO(26, 188, 156, 1.0)
                              : const Color.fromRGBO(100, 116, 139, 1.0),
                        ),
                      ),
                  ],
                ),
              );
            },
          ),
        ],
      ),
    );
  }
}
