monisuo/flutter_monisuo/lib/ui/components/coin_card.dart

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

/// 币种卡片组件 - 用于显示币种信息
class CoinCard extends StatelessWidget {
  final String code;
  final String name;
  final String price;
  final String change;
  final bool isUp;
  final String? icon;
  final VoidCallback? onTap;

  // 颜色常量
  static const upColor = Color(0xFF00C853);
  static const downColor = Color(0xFFFF5252);

  const CoinCard({
    super.key,
    required this.code,
    required this.name,
    required this.price,
    required this.change,
    this.isUp = true,
    this.icon,
    this.onTap,
  });

  @override
  Widget build(BuildContext context) {
    final theme = ShadTheme.of(context);

    return ShadCard(
      padding: const EdgeInsets.all(16),
      child: InkWell(
        onTap: onTap,
        child: Row(
          children: [
            // 图标
            Container(
              width: 44,
              height: 44,
              decoration: BoxDecoration(
                color: theme.colorScheme.primary.withOpacity(0.1),
                shape: BoxShape.circle,
              ),
              child: Center(
                child: Text(
                  icon ?? code.substring(0, 1),
                  style: TextStyle(
                    fontSize: 20,
                    color: theme.colorScheme.primary,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ),
            ),
            const SizedBox(width: 12),
            // 名称
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    '$code/USDT',
                    style: theme.textTheme.large.copyWith(
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                  Text(
                    name,
                    style: theme.textTheme.muted,
                  ),
                ],
              ),
            ),
            // 涨跌幅
            Container(
              padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 6),
              decoration: BoxDecoration(
                color: isUp ? upColor.withOpacity(0.2) : downColor.withOpacity(0.2),
                borderRadius: BorderRadius.circular(6),
              ),
              child: Text(
                change,
                style: TextStyle(
                  color: isUp ? upColor : downColor,
                  fontWeight: FontWeight.w600,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}