import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:smart_hotel_app/views/report/device/cubit/device_list_state.dart';

class DeviceFilterTab extends StatelessWidget {
  final DeviceTypeEnum selectedType;
  final Function(DeviceTypeEnum) onSelect;
  final int tabAirSwitch;
  final int tabGuestControl;
  final int tabNetwork;

  const DeviceFilterTab({
    super.key,
    required this.selectedType,
    required this.onSelect,
    required this.tabAirSwitch,
    required this.tabGuestControl,
    required this.tabNetwork,
  });

  @override
  Widget build(BuildContext context) {
    final tabs = [
      {'type': DeviceTypeEnum.all, 'label': '全部'},
      {'type': DeviceTypeEnum.smartBreaker, 'label': '空开($tabAirSwitch)'},
      {'type': DeviceTypeEnum.guestControl, 'label': '客控($tabGuestControl)'},
      {'type': DeviceTypeEnum.network, 'label': '网络($tabNetwork)'},
    ];

    return Container(
      width: double.infinity,
      padding: EdgeInsets.all(20.w),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(24.r),
        color: Colors.white,
      ),
      child: Row(
        // mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: tabs.map((tab) {
          final isSelected = selectedType == tab['type'];
          return GestureDetector(
            onTap: () => onSelect(tab['type'] as DeviceTypeEnum),
            child: Container(
              margin: EdgeInsets.only(right: 16.w),
              padding: EdgeInsets.symmetric(horizontal: 20.w, vertical: 8.h),
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(8.r),
                color: isSelected
                    ? const Color.fromRGBO(73, 149, 234, 0.2)
                    : const Color.fromRGBO(243, 244, 246, 1),
                border: isSelected ? Border.all(
                  width: 1.w,
                  color: const Color.fromRGBO(73, 149, 234, 0.5),
                ) : null,
              ),
              child: Text(
                tab['label'] as String ,
                style: TextStyle(
                  fontSize: 24.sp,
                  color: isSelected ? const Color.fromRGBO(73, 149, 234, 1) :
                  const Color.fromRGBO(107, 114, 128, 1),
                  fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
                ),
              ),
            ),
          );
        }).toList(),
      ),
    );
  }
}
