feat: 优化交易账户和币种选择功能

- 交易账户卡片添加总市值显示和持仓列表
- 持仓列表USDT自动排在最上面
- 交易页面添加币种选择弹窗功能
- 行情页面点击币种跳转到交易页面
- 支持从外部传入选中币种参数

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
sion
2026-03-25 23:59:50 +08:00
parent 56142ed5f2
commit 396b81d6d9
4 changed files with 434 additions and 144 deletions

View File

@@ -7,6 +7,7 @@ import '../../../core/theme/app_spacing.dart';
import '../../../data/models/coin.dart';
import '../../../providers/market_provider.dart';
import '../../components/glass_panel.dart';
import '../main/main_page.dart';
/// 行情页面 - Material Design 3 风格
class MarketPage extends StatefulWidget {
@@ -254,107 +255,118 @@ class _MarketPageState extends State<MarketPage> with AutomaticKeepAliveClientMi
? AppColorScheme.up.withOpacity(0.1)
: colorScheme.error.withOpacity(0.1);
return GlassCard(
margin: EdgeInsets.only(bottom: AppSpacing.sm),
child: Row(
children: [
// 图标容器
Container(
width: 48,
height: 48,
decoration: BoxDecoration(
color: colorScheme.surfaceContainerHighest,
borderRadius: BorderRadius.circular(AppRadius.xl),
border: Border.all(
color: colorScheme.outlineVariant.withOpacity(0.2),
),
),
child: Center(
child: Text(
coin.displayIcon,
style: TextStyle(
fontSize: 20,
color: coin.isUp ? colorScheme.primary : colorScheme.secondary,
fontWeight: FontWeight.bold,
return GestureDetector(
onTap: () => _navigateToTrade(coin),
child: GlassCard(
margin: EdgeInsets.only(bottom: AppSpacing.sm),
child: Row(
children: [
// 图标容器
Container(
width: 48,
height: 48,
decoration: BoxDecoration(
color: colorScheme.surfaceContainerHighest,
borderRadius: BorderRadius.circular(AppRadius.xl),
border: Border.all(
color: colorScheme.outlineVariant.withOpacity(0.2),
),
),
),
),
SizedBox(width: AppSpacing.sm + AppSpacing.xs),
// 币种信息
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
coin.code,
style: GoogleFonts.spaceGrotesk(
fontSize: 16,
fontWeight: FontWeight.bold,
color: colorScheme.onSurface,
),
),
SizedBox(width: AppSpacing.xs),
Text(
'/USDT',
style: TextStyle(
fontSize: 12,
color: colorScheme.onSurfaceVariant,
),
),
],
),
SizedBox(height: AppSpacing.xs / 2),
Text(
coin.name,
child: Center(
child: Text(
coin.displayIcon,
style: TextStyle(
fontSize: 12,
color: colorScheme.onSurfaceVariant,
fontSize: 20,
color: coin.isUp ? colorScheme.primary : colorScheme.secondary,
fontWeight: FontWeight.bold,
),
),
),
),
SizedBox(width: AppSpacing.sm + AppSpacing.xs),
// 币种信息
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
coin.code,
style: GoogleFonts.spaceGrotesk(
fontSize: 16,
fontWeight: FontWeight.bold,
color: colorScheme.onSurface,
),
),
SizedBox(width: AppSpacing.xs),
Text(
'/USDT',
style: TextStyle(
fontSize: 12,
color: colorScheme.onSurfaceVariant,
),
),
],
),
SizedBox(height: AppSpacing.xs / 2),
Text(
coin.name,
style: TextStyle(
fontSize: 12,
color: colorScheme.onSurfaceVariant,
),
),
],
),
),
// 价格和涨跌幅
Column(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Text(
'\$${coin.formattedPrice}',
style: GoogleFonts.spaceGrotesk(
fontSize: 14,
fontWeight: FontWeight.bold,
color: colorScheme.onSurface,
),
),
SizedBox(height: AppSpacing.xs),
Container(
padding: EdgeInsets.symmetric(
horizontal: AppSpacing.sm,
vertical: AppSpacing.xs,
),
decoration: BoxDecoration(
color: changeBgColor,
borderRadius: BorderRadius.circular(AppRadius.sm),
border: Border.all(
color: changeColor.withOpacity(0.2),
),
),
child: Text(
coin.formattedChange,
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w700,
color: changeColor,
),
),
),
],
),
),
// 价格和涨跌幅
Column(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Text(
'\$${coin.formattedPrice}',
style: GoogleFonts.spaceGrotesk(
fontSize: 14,
fontWeight: FontWeight.bold,
color: colorScheme.onSurface,
),
),
SizedBox(height: AppSpacing.xs),
Container(
padding: EdgeInsets.symmetric(
horizontal: AppSpacing.sm,
vertical: AppSpacing.xs,
),
decoration: BoxDecoration(
color: changeBgColor,
borderRadius: BorderRadius.circular(AppRadius.sm),
border: Border.all(
color: changeColor.withOpacity(0.2),
),
),
child: Text(
coin.formattedChange,
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w700,
color: changeColor,
),
),
),
],
),
],
],
),
),
);
}
void _navigateToTrade(Coin coin) {
// 切换到交易页面并选中该币种
MainPageState? mainPageState = context.findAncestorStateOfType<MainPageState>();
if (mainPageState != null) {
mainPageState.switchToTrade(coin.code);
}
}
}