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

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

/// 资产卡片组件 - 用于显示资产总览
class AssetCard extends StatelessWidget {
  final String title;
  final String balance;
  final String? subtitle;
  final String? profit;
  final bool? isProfit;
  final List<AssetItem>? items;
  final Gradient? gradient;
  final VoidCallback? onTap;

  // 默认渐变色
  static const defaultGradient = LinearGradient(
    colors: [Color(0xFF00D4AA), Color(0xFF00B894)],
    begin: Alignment.topLeft,
    end: Alignment.bottomRight,
  );

  // 深色渐变
  static const darkGradient = LinearGradient(
    colors: [Color(0xFF1E3A5F), Color(0xFF0D253F)],
    begin: Alignment.topLeft,
    end: Alignment.bottomRight,
  );

  const AssetCard({
    super.key,
    this.title = '总资产',
    required this.balance,
    this.subtitle,
    this.profit,
    this.isProfit,
    this.items,
    this.gradient,
    this.onTap,
  });

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

    return GestureDetector(
      onTap: onTap,
      child: Container(
        width: double.infinity,
        padding: const EdgeInsets.all(24),
        decoration: BoxDecoration(
          gradient: cardGradient,
          borderRadius: BorderRadius.circular(20),
          boxShadow: [
            BoxShadow(
              color: Colors.black.withOpacity(0.1),
              blurRadius: 10,
              offset: const Offset(0, 4),
            ),
          ],
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // 标题行
            Row(
              children: [
                Text(
                  title,
                  style: theme.textTheme.small.copyWith(color: Colors.white70),
                ),
                const Spacer(),
                if (onTap != null)
                  Icon(
                    LucideIcons.chevronRight,
                    color: Colors.white70,
                    size: 18,
                  ),
              ],
            ),
            const SizedBox(height: 8),
            // 余额
            Text(
              balance,
              style: theme.textTheme.h1.copyWith(
                fontWeight: FontWeight.bold,
                color: Colors.white,
              ),
            ),
            // 盈亏信息
            if (profit != null) ...[
              const SizedBox(height: 12),
              Row(
                children: [
                  Icon(
                    isProfit == true ? LucideIcons.trendingUp : LucideIcons.trendingDown,
                    color: Colors.white70,
                    size: 16,
                  ),
                  const SizedBox(width: 6),
                  Text(
                    '盈亏: $profit',
                    style: theme.textTheme.small.copyWith(color: Colors.white70),
                  ),
                ],
              ),
            ],
            // 子项
            if (items != null && items!.isNotEmpty) ...[
              const SizedBox(height: 20),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: items!.map((item) => _buildItem(item)).toList(),
              ),
            ],
          ],
        ),
      ),
    ).animate().fadeIn(duration: 400.ms).slideY(begin: 0.1, end: 0);
  }

  Widget _buildItem(AssetItem item) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          item.label,
          style: const TextStyle(fontSize: 12, color: Colors.white70),
        ),
        const SizedBox(height: 4),
        Text(
          item.value,
          style: const TextStyle(
            fontSize: 18,
            fontWeight: FontWeight.w600,
            color: Colors.white,
          ),
        ),
      ],
    );
  }
}

/// 资产子项
class AssetItem {
  final String label;
  final String value;

  const AssetItem({
    required this.label,
    required this.value,
  });
}

/// 简洁资产卡片 - 用于列表中显示
class AssetCardCompact extends StatelessWidget {
  final String title;
  final String balance;
  final String? change;
  final bool? isUp;
  final VoidCallback? onTap;

  static const upColor = Color(0xFF00C853);
  static const downColor = Color(0xFFFF5252);

  const AssetCardCompact({
    super.key,
    required this.title,
    required this.balance,
    this.change,
    this.isUp,
    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: [
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    title,
                    style: theme.textTheme.muted,
                  ),
                  const SizedBox(height: 4),
                  Text(
                    balance,
                    style: theme.textTheme.h3.copyWith(
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ],
              ),
            ),
            if (change != null)
              Container(
                padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 6),
                decoration: BoxDecoration(
                  color: (isUp ?? true) ? upColor.withOpacity(0.2) : downColor.withOpacity(0.2),
                  borderRadius: BorderRadius.circular(6),
                ),
                child: Text(
                  change!,
                  style: TextStyle(
                    color: (isUp ?? true) ? upColor : downColor,
                    fontWeight: FontWeight.w600,
                  ),
                ),
              ),
          ],
        ),
      ),
    );
  }
}