import 'package:flutter/material.dart';

class DeviceStatusCard extends StatelessWidget {
  const DeviceStatusCard({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
      padding: const EdgeInsets.all(20),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(28),
      ),
      child: Row(
        children: [
          // 设备图片/占位
          ClipRRect(
            borderRadius: BorderRadius.circular(16), // 保持和原代码一致的圆角
            child: Transform.translate(
              offset: const Offset(10, 0), // 向左偏移10像素，Y轴不变
              child: Image.asset(
                'assets/images/car.png',
                width: 120,
                height: 80,
                fit: BoxFit.cover, // 确保图片填满80x80的区域
              ),
            ),
          ),
          const SizedBox(width: 16),
          // 信息区
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    const Text(
                      '未知设备',
                      style: TextStyle(
                        fontSize: 20,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    Icon(Icons.swap_horiz, color: Colors.grey[400]),
                  ],
                ),
                const SizedBox(height: 8),
                Row(
                  children: [
                    _buildTag('离线', Colors.grey[400]!),
                    const Spacer(),
                    const Icon(Icons.battery_3_bar_rounded, size: 18),
                    const Text(
                      ' 0%',
                      style: TextStyle(fontWeight: FontWeight.w500),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildTag(String text, Color color) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
      decoration: BoxDecoration(
        color: color.withOpacity(0.2),
        borderRadius: BorderRadius.circular(20),
      ),
      child: Text(
        text,
        style: TextStyle(
          color: color,
          fontSize: 12,
          fontWeight: FontWeight.bold,
        ),
      ),
    );
  }
}