feat(frontend): 添加全局深色模式支持
核心改动： 1. app_colors.dart - 添加浅色/深色两套色彩常量和动态颜色获取方法 - backgroundOf()、surfaceOf()、cardOf() 等方法根据主题返回对应颜色 - 浅色：#F3F4F6背景、#FFFFFF卡片、#1F2937文字 - 深色：#111827背景、#1F2937卡片、#E5E7EB文字 2. main.dart - 更新 ThemeData 配置 - 添加 scaffoldBackgroundColor、appBarTheme、cardTheme 等深色主题配置 3. main_shell.dart - 导航栏支持深色模式 - 使用 AppColors 动态方法替换硬编码颜色 4. trading_page.dart - 兑换页面支持深色模式 - 所有卡片、文字颜色使用动态颜色方法 - 划转弹窗也支持深色模式 5. contribution_page.dart - 贡献值页面开始支持（部分） 后续需要继续更新其他页面以完整支持深色模式切换 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
a47b935bce
commit
bbe1754309
|
|
@ -1,21 +1,82 @@
|
|||
import 'package:flutter/material.dart';
|
||||
|
||||
class AppColors {
|
||||
// ==================== 品牌色彩（不随主题变化） ====================
|
||||
static const Color primary = Color(0xFF22C55E);
|
||||
static const Color secondary = Color(0xFF3B82F6);
|
||||
static const Color background = Color(0xFFF8FAFC);
|
||||
static const Color surface = Color(0xFFFFFFFF);
|
||||
static const Color error = Color(0xFFEF4444);
|
||||
static const Color success = Color(0xFF22C55E);
|
||||
static const Color warning = Color(0xFFF59E0B);
|
||||
static const Color orange = Color(0xFFFF6B00);
|
||||
|
||||
static const Color textPrimary = Color(0xFF1E293B);
|
||||
static const Color textSecondary = Color(0xFF64748B);
|
||||
static const Color textMuted = Color(0xFF94A3B8);
|
||||
|
||||
static const Color up = Color(0xFF22C55E);
|
||||
// 行情色彩
|
||||
static const Color up = Color(0xFF10B981);
|
||||
static const Color down = Color(0xFFEF4444);
|
||||
|
||||
static const Color border = Color(0xFFE2E8F0);
|
||||
static const Color divider = Color(0xFFF1F5F9);
|
||||
// ==================== 浅色模式色彩 ====================
|
||||
static const Color _lightBackground = Color(0xFFF3F4F6);
|
||||
static const Color _lightSurface = Color(0xFFFFFFFF);
|
||||
static const Color _lightCard = Color(0xFFFFFFFF);
|
||||
static const Color _lightTextPrimary = Color(0xFF1F2937);
|
||||
static const Color _lightTextSecondary = Color(0xFF6B7280);
|
||||
static const Color _lightTextMuted = Color(0xFF9CA3AF);
|
||||
static const Color _lightBorder = Color(0xFFE5E7EB);
|
||||
static const Color _lightDivider = Color(0xFFF3F4F6);
|
||||
|
||||
// ==================== 深色模式色彩 ====================
|
||||
static const Color _darkBackground = Color(0xFF111827);
|
||||
static const Color _darkSurface = Color(0xFF1F2937);
|
||||
static const Color _darkCard = Color(0xFF1F2937);
|
||||
static const Color _darkTextPrimary = Color(0xFFE5E7EB);
|
||||
static const Color _darkTextSecondary = Color(0xFF9CA3AF);
|
||||
static const Color _darkTextMuted = Color(0xFF6B7280);
|
||||
static const Color _darkBorder = Color(0xFF374151);
|
||||
static const Color _darkDivider = Color(0xFF374151);
|
||||
|
||||
// ==================== 兼容旧代码的静态常量 ====================
|
||||
static const Color background = _lightBackground;
|
||||
static const Color surface = _lightSurface;
|
||||
static const Color textPrimary = _lightTextPrimary;
|
||||
static const Color textSecondary = _lightTextSecondary;
|
||||
static const Color textMuted = _lightTextMuted;
|
||||
static const Color border = _lightBorder;
|
||||
static const Color divider = _lightDivider;
|
||||
|
||||
// ==================== 动态颜色获取方法 ====================
|
||||
|
||||
/// 判断当前是否为深色模式
|
||||
static bool isDark(BuildContext context) =>
|
||||
Theme.of(context).brightness == Brightness.dark;
|
||||
|
||||
/// 背景色（页面背景）
|
||||
static Color backgroundOf(BuildContext context) =>
|
||||
isDark(context) ? _darkBackground : _lightBackground;
|
||||
|
||||
/// 表面色（AppBar、导航栏等）
|
||||
static Color surfaceOf(BuildContext context) =>
|
||||
isDark(context) ? _darkSurface : _lightSurface;
|
||||
|
||||
/// 卡片背景色
|
||||
static Color cardOf(BuildContext context) =>
|
||||
isDark(context) ? _darkCard : _lightCard;
|
||||
|
||||
/// 主要文字颜色
|
||||
static Color textPrimaryOf(BuildContext context) =>
|
||||
isDark(context) ? _darkTextPrimary : _lightTextPrimary;
|
||||
|
||||
/// 次要文字颜色
|
||||
static Color textSecondaryOf(BuildContext context) =>
|
||||
isDark(context) ? _darkTextSecondary : _lightTextSecondary;
|
||||
|
||||
/// 弱化文字颜色
|
||||
static Color textMutedOf(BuildContext context) =>
|
||||
isDark(context) ? _darkTextMuted : _lightTextMuted;
|
||||
|
||||
/// 边框颜色
|
||||
static Color borderOf(BuildContext context) =>
|
||||
isDark(context) ? _darkBorder : _lightBorder;
|
||||
|
||||
/// 分割线颜色
|
||||
static Color dividerOf(BuildContext context) =>
|
||||
isDark(context) ? _darkDivider : _lightDivider;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -58,34 +58,48 @@ class _MiningAppState extends ConsumerState<MiningApp> {
|
|||
seedColor: AppColors.primary,
|
||||
brightness: Brightness.light,
|
||||
),
|
||||
scaffoldBackgroundColor: AppColors.background,
|
||||
useMaterial3: true,
|
||||
appBarTheme: const AppBarTheme(
|
||||
centerTitle: true,
|
||||
elevation: 0,
|
||||
backgroundColor: AppColors.surface,
|
||||
foregroundColor: AppColors.textPrimary,
|
||||
),
|
||||
cardTheme: const CardThemeData(
|
||||
elevation: 2,
|
||||
color: AppColors.surface,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(12)),
|
||||
),
|
||||
),
|
||||
dividerTheme: const DividerThemeData(
|
||||
color: AppColors.divider,
|
||||
),
|
||||
),
|
||||
darkTheme: ThemeData(
|
||||
colorScheme: ColorScheme.fromSeed(
|
||||
seedColor: AppColors.primary,
|
||||
brightness: Brightness.dark,
|
||||
),
|
||||
scaffoldBackgroundColor: const Color(0xFF111827),
|
||||
useMaterial3: true,
|
||||
appBarTheme: const AppBarTheme(
|
||||
centerTitle: true,
|
||||
elevation: 0,
|
||||
backgroundColor: Color(0xFF1F2937),
|
||||
foregroundColor: Color(0xFFE5E7EB),
|
||||
),
|
||||
cardTheme: const CardThemeData(
|
||||
elevation: 2,
|
||||
color: Color(0xFF1F2937),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(12)),
|
||||
),
|
||||
),
|
||||
dividerTheme: const DividerThemeData(
|
||||
color: Color(0xFF374151),
|
||||
),
|
||||
),
|
||||
routerConfig: router,
|
||||
);
|
||||
|
|
|
|||
|
|
@ -12,13 +12,9 @@ import '../../widgets/shimmer_loading.dart';
|
|||
class ContributionPage extends ConsumerWidget {
|
||||
const ContributionPage({super.key});
|
||||
|
||||
// 设计色彩
|
||||
static const Color _orange = Color(0xFFFF6B00);
|
||||
static const Color _green = Color(0xFF22C55E);
|
||||
static const Color _grayText = Color(0xFF6B7280);
|
||||
static const Color _darkText = Color(0xFF1F2937);
|
||||
static const Color _bgGray = Color(0xFFF3F4F6);
|
||||
static const Color _lightGray = Color(0xFFF9FAFB);
|
||||
// 品牌色彩（不随主题变化）
|
||||
static const Color _orange = AppColors.orange;
|
||||
static const Color _green = AppColors.primary;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
|
|
@ -41,7 +37,7 @@ class ContributionPage extends ConsumerWidget {
|
|||
final sharePoolBalance = sharePoolAsync.valueOrNull;
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFFF5F5F5),
|
||||
backgroundColor: AppColors.backgroundOf(context),
|
||||
body: SafeArea(
|
||||
bottom: false,
|
||||
child: RefreshIndicator(
|
||||
|
|
|
|||
|
|
@ -24,15 +24,10 @@ class TradingPage extends ConsumerStatefulWidget {
|
|||
}
|
||||
|
||||
class _TradingPageState extends ConsumerState<TradingPage> {
|
||||
// 设计色彩
|
||||
static const Color _orange = Color(0xFFFF6B00);
|
||||
static const Color _green = Color(0xFF10B981);
|
||||
static const Color _red = Color(0xFFEF4444);
|
||||
static const Color _grayText = Color(0xFF6B7280);
|
||||
static const Color _darkText = Color(0xFF1F2937);
|
||||
static const Color _bgGray = Color(0xFFF3F4F6);
|
||||
static const Color _lightGray = Color(0xFFF9FAFB);
|
||||
static const Color _borderGray = Color(0xFFE5E7EB);
|
||||
// 品牌色彩（不随主题变化）
|
||||
static const Color _orange = AppColors.orange;
|
||||
static const Color _green = AppColors.up;
|
||||
static const Color _red = AppColors.down;
|
||||
|
||||
// 状态
|
||||
int _selectedTab = 1; // 0: 买入, 1: 卖出
|
||||
|
|
@ -76,7 +71,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
}
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFFF5F5F5),
|
||||
backgroundColor: AppColors.backgroundOf(context),
|
||||
body: SafeArea(
|
||||
bottom: false,
|
||||
child: RefreshIndicator(
|
||||
|
|
@ -112,15 +107,15 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
|
||||
Widget _buildAppBar() {
|
||||
return Container(
|
||||
color: _bgGray.withValues(alpha: 0.9),
|
||||
color: AppColors.surfaceOf(context),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 12),
|
||||
child: const Center(
|
||||
child: Center(
|
||||
child: Text(
|
||||
'积分股交易',
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Color(0xFF111827),
|
||||
color: AppColors.textPrimaryOf(context),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
@ -142,18 +137,18 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
margin: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
color: AppColors.cardOf(context),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const Text(
|
||||
Text(
|
||||
'当前积分股价格',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: _grayText,
|
||||
color: AppColors.textSecondaryOf(context),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
|
|
@ -210,7 +205,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
return Container(
|
||||
margin: const EdgeInsets.symmetric(horizontal: 16),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
color: AppColors.cardOf(context),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: klinesAsync.isLoading
|
||||
|
|
@ -242,11 +237,15 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
return _buildErrorCard('市场数据加载失败');
|
||||
}
|
||||
|
||||
final bgGray = AppColors.backgroundOf(context);
|
||||
final darkText = AppColors.textPrimaryOf(context);
|
||||
final grayText = AppColors.textSecondaryOf(context);
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
color: AppColors.cardOf(context),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: Column(
|
||||
|
|
@ -263,12 +262,12 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
const Text(
|
||||
Text(
|
||||
'市场数据',
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: _darkText,
|
||||
color: darkText,
|
||||
),
|
||||
),
|
||||
],
|
||||
|
|
@ -282,7 +281,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
_orange,
|
||||
isLoading,
|
||||
),
|
||||
Container(width: 1, height: 24, color: _bgGray),
|
||||
Container(width: 1, height: 24, color: bgGray),
|
||||
const SizedBox(width: 16),
|
||||
_buildMarketDataItem(
|
||||
'流通池',
|
||||
|
|
@ -293,7 +292,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
],
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
Container(height: 1, color: _bgGray),
|
||||
Container(height: 1, color: bgGray),
|
||||
const SizedBox(height: 24),
|
||||
Row(
|
||||
children: [
|
||||
|
|
@ -303,7 +302,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
_orange,
|
||||
isLoading,
|
||||
),
|
||||
Container(width: 1, height: 24, color: _bgGray),
|
||||
Container(width: 1, height: 24, color: bgGray),
|
||||
const SizedBox(width: 16),
|
||||
_buildMarketDataItem(
|
||||
'黑洞销毁量',
|
||||
|
|
@ -323,7 +322,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(label, style: const TextStyle(fontSize: 12, color: _grayText)),
|
||||
Text(label, style: TextStyle(fontSize: 12, color: AppColors.textSecondaryOf(context))),
|
||||
const SizedBox(height: 4),
|
||||
DataText(
|
||||
data: value,
|
||||
|
|
@ -377,18 +376,21 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
});
|
||||
}
|
||||
|
||||
final grayText = AppColors.textSecondaryOf(context);
|
||||
final bgGray = AppColors.backgroundOf(context);
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.symmetric(horizontal: 16),
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
color: AppColors.cardOf(context),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
Container(
|
||||
decoration: const BoxDecoration(
|
||||
border: Border(bottom: BorderSide(color: _bgGray)),
|
||||
decoration: BoxDecoration(
|
||||
border: Border(bottom: BorderSide(color: bgGray)),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
|
|
@ -415,8 +417,8 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
fontSize: 14,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: buyEnabled
|
||||
? (_selectedTab == 0 ? _orange : _grayText)
|
||||
: _grayText.withValues(alpha: 0.5),
|
||||
? (_selectedTab == 0 ? _orange : grayText)
|
||||
: grayText.withValues(alpha: 0.5),
|
||||
),
|
||||
),
|
||||
if (!buyEnabled) ...[
|
||||
|
|
@ -424,14 +426,14 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 4, vertical: 1),
|
||||
decoration: BoxDecoration(
|
||||
color: _grayText.withValues(alpha: 0.1),
|
||||
color: grayText.withValues(alpha: 0.1),
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
),
|
||||
child: Text(
|
||||
'待开启',
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
color: _grayText.withValues(alpha: 0.7),
|
||||
color: grayText.withValues(alpha: 0.7),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
@ -460,7 +462,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: _selectedTab == 1 ? _orange : _grayText,
|
||||
color: _selectedTab == 1 ? _orange : grayText,
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
@ -479,15 +481,15 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
Icon(
|
||||
Icons.lock_outline,
|
||||
size: 48,
|
||||
color: _grayText.withValues(alpha: 0.5),
|
||||
color: grayText.withValues(alpha: 0.5),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
const Text(
|
||||
Text(
|
||||
'买入功能待开启',
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: _grayText,
|
||||
color: grayText,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
|
|
@ -495,7 +497,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
'买入功能暂未开放，请耐心等待',
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
color: _grayText.withValues(alpha: 0.7),
|
||||
color: grayText.withValues(alpha: 0.7),
|
||||
),
|
||||
),
|
||||
],
|
||||
|
|
@ -514,9 +516,9 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
const Text(
|
||||
Text(
|
||||
'可用积分值',
|
||||
style: TextStyle(fontSize: 12, color: _grayText),
|
||||
style: TextStyle(fontSize: 12, color: grayText),
|
||||
),
|
||||
Text(
|
||||
formatAmount(availableCash),
|
||||
|
|
@ -540,9 +542,9 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
const Text(
|
||||
Text(
|
||||
'可用积分股',
|
||||
style: TextStyle(fontSize: 12, color: _grayText),
|
||||
style: TextStyle(fontSize: 12, color: grayText),
|
||||
),
|
||||
Text(
|
||||
formatAmount(tradingShareBalance),
|
||||
|
|
@ -592,7 +594,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: _bgGray,
|
||||
color: bgGray,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Row(
|
||||
|
|
@ -600,7 +602,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
children: [
|
||||
Text(
|
||||
_selectedTab == 0 ? '预计支出' : '预计获得',
|
||||
style: const TextStyle(fontSize: 12, color: _grayText),
|
||||
style: TextStyle(fontSize: 12, color: grayText),
|
||||
),
|
||||
Text(
|
||||
_calculateEstimate(),
|
||||
|
|
@ -620,12 +622,12 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
padding: const EdgeInsets.symmetric(horizontal: 4),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: const [
|
||||
children: [
|
||||
Text(
|
||||
'交易手续费',
|
||||
style: TextStyle(fontSize: 12, color: _grayText),
|
||||
style: TextStyle(fontSize: 12, color: grayText),
|
||||
),
|
||||
Text(
|
||||
const Text(
|
||||
'10% 进入积分股池',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
|
|
@ -649,9 +651,9 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
),
|
||||
child: Text(
|
||||
_selectedTab == 0 ? '买入积分股' : '卖出积分股',
|
||||
style: const TextStyle(
|
||||
child: const Text(
|
||||
'确认交易',
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
|
|
@ -674,22 +676,25 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
String? availableCashForBuy,
|
||||
String currentPrice,
|
||||
) {
|
||||
final grayText = AppColors.textSecondaryOf(context);
|
||||
final bgGray = AppColors.backgroundOf(context);
|
||||
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
label,
|
||||
style: const TextStyle(
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: _grayText,
|
||||
color: grayText,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Container(
|
||||
height: 44,
|
||||
decoration: BoxDecoration(
|
||||
color: _bgGray,
|
||||
color: bgGray,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Row(
|
||||
|
|
@ -700,9 +705,9 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
keyboardType: const TextInputType.numberWithOptions(decimal: true),
|
||||
decoration: InputDecoration(
|
||||
hintText: hint,
|
||||
hintStyle: const TextStyle(
|
||||
hintStyle: TextStyle(
|
||||
fontSize: 14,
|
||||
color: Color(0xFF9CA3AF),
|
||||
color: grayText,
|
||||
),
|
||||
border: InputBorder.none,
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
|
|
@ -744,7 +749,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
),
|
||||
),
|
||||
),
|
||||
Text(suffix, style: const TextStyle(fontSize: 12, color: _grayText)),
|
||||
Text(suffix, style: TextStyle(fontSize: 12, color: grayText)),
|
||||
const SizedBox(width: 12),
|
||||
],
|
||||
),
|
||||
|
|
@ -760,22 +765,26 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
String suffix, {
|
||||
bool readOnly = false,
|
||||
}) {
|
||||
final grayText = AppColors.textSecondaryOf(context);
|
||||
final darkText = AppColors.textPrimaryOf(context);
|
||||
final bgGray = AppColors.backgroundOf(context);
|
||||
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
label,
|
||||
style: const TextStyle(
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: _grayText,
|
||||
color: grayText,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Container(
|
||||
height: 44,
|
||||
decoration: BoxDecoration(
|
||||
color: readOnly ? _bgGray.withOpacity(0.7) : _bgGray,
|
||||
color: readOnly ? bgGray.withOpacity(0.7) : bgGray,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Row(
|
||||
|
|
@ -788,20 +797,20 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
keyboardType: const TextInputType.numberWithOptions(decimal: true),
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
color: readOnly ? _grayText : _darkText,
|
||||
color: readOnly ? grayText : darkText,
|
||||
),
|
||||
decoration: InputDecoration(
|
||||
hintText: hint,
|
||||
hintStyle: const TextStyle(
|
||||
hintStyle: TextStyle(
|
||||
fontSize: 14,
|
||||
color: Color(0xFF9CA3AF),
|
||||
color: grayText,
|
||||
),
|
||||
border: InputBorder.none,
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
),
|
||||
),
|
||||
),
|
||||
Text(suffix, style: const TextStyle(fontSize: 12, color: _grayText)),
|
||||
Text(suffix, style: TextStyle(fontSize: 12, color: grayText)),
|
||||
const SizedBox(width: 12),
|
||||
],
|
||||
),
|
||||
|
|
@ -843,12 +852,14 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
final isLoading = ordersAsync.isLoading;
|
||||
final ordersPage = ordersAsync.valueOrNull;
|
||||
final orders = ordersPage?.data ?? [];
|
||||
final darkText = AppColors.textPrimaryOf(context);
|
||||
final grayText = AppColors.textSecondaryOf(context);
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
color: AppColors.cardOf(context),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: Column(
|
||||
|
|
@ -856,12 +867,12 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
const Text(
|
||||
Text(
|
||||
'我的挂单',
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: _darkText,
|
||||
color: darkText,
|
||||
),
|
||||
),
|
||||
GestureDetector(
|
||||
|
|
@ -886,11 +897,11 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
),
|
||||
)
|
||||
else if (orders.isEmpty)
|
||||
const Padding(
|
||||
padding: EdgeInsets.symmetric(vertical: 20),
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 20),
|
||||
child: Text(
|
||||
'暂无挂单',
|
||||
style: TextStyle(fontSize: 14, color: _grayText),
|
||||
style: TextStyle(fontSize: 14, color: grayText),
|
||||
),
|
||||
)
|
||||
else
|
||||
|
|
@ -909,6 +920,10 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
final isSell = order.isSell;
|
||||
final dateFormat = DateFormat('MM/dd HH:mm');
|
||||
final formattedDate = dateFormat.format(order.createdAt);
|
||||
final darkText = AppColors.textPrimaryOf(context);
|
||||
final grayText = AppColors.textSecondaryOf(context);
|
||||
final bgGray = AppColors.backgroundOf(context);
|
||||
final cardBg = AppColors.cardOf(context);
|
||||
|
||||
String statusText;
|
||||
switch (order.status) {
|
||||
|
|
@ -929,9 +944,9 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
return Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: _lightGray,
|
||||
color: cardBg,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
border: Border.all(color: _bgGray),
|
||||
border: Border.all(color: bgGray),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
|
|
@ -959,10 +974,10 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
const SizedBox(width: 8),
|
||||
Text(
|
||||
formatPrice(order.price),
|
||||
style: const TextStyle(
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: _darkText,
|
||||
color: darkText,
|
||||
),
|
||||
),
|
||||
],
|
||||
|
|
@ -970,7 +985,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
const SizedBox(height: 4),
|
||||
Text(
|
||||
formattedDate,
|
||||
style: const TextStyle(fontSize: 12, color: _grayText),
|
||||
style: TextStyle(fontSize: 12, color: grayText),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
|
@ -979,10 +994,10 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
children: [
|
||||
Text(
|
||||
'${formatCompact(order.quantity)} 股',
|
||||
style: const TextStyle(
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: _darkText,
|
||||
color: darkText,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
|
|
@ -1009,7 +1024,7 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
margin: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(32),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
color: AppColors.cardOf(context),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: Center(
|
||||
|
|
@ -1091,11 +1106,11 @@ class _TradingPageState extends ConsumerState<TradingPage> {
|
|||
),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
const Text(
|
||||
Text(
|
||||
'注意: 卖出积分股将扣除10%进入积分股池，此操作不可撤销。',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
color: _grayText,
|
||||
color: AppColors.textSecondaryOf(context),
|
||||
),
|
||||
),
|
||||
],
|
||||
|
|
@ -1212,11 +1227,8 @@ class _TransferBottomSheet extends ConsumerStatefulWidget {
|
|||
}
|
||||
|
||||
class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
||||
static const Color _orange = Color(0xFFFF6B00);
|
||||
static const Color _grayText = Color(0xFF6B7280);
|
||||
static const Color _darkText = Color(0xFF1F2937);
|
||||
static const Color _bgGray = Color(0xFFF3F4F6);
|
||||
static const Color _green = Color(0xFF10B981);
|
||||
static const Color _orange = AppColors.orange;
|
||||
static const Color _green = AppColors.up;
|
||||
|
||||
// 0: 从挖矿划入交易, 1: 从交易划出到挖矿
|
||||
int _direction = 0;
|
||||
|
|
@ -1235,13 +1247,18 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final cardBg = AppColors.cardOf(context);
|
||||
final darkText = AppColors.textPrimaryOf(context);
|
||||
final grayText = AppColors.textSecondaryOf(context);
|
||||
final bgGray = AppColors.backgroundOf(context);
|
||||
|
||||
return Container(
|
||||
padding: EdgeInsets.only(
|
||||
bottom: MediaQuery.of(context).viewInsets.bottom,
|
||||
),
|
||||
decoration: const BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
|
||||
decoration: BoxDecoration(
|
||||
color: cardBg,
|
||||
borderRadius: const BorderRadius.vertical(top: Radius.circular(20)),
|
||||
),
|
||||
child: SafeArea(
|
||||
child: Padding(
|
||||
|
|
@ -1254,17 +1271,17 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
const Text(
|
||||
Text(
|
||||
'积分股划转',
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: _darkText,
|
||||
color: darkText,
|
||||
),
|
||||
),
|
||||
GestureDetector(
|
||||
onTap: () => Navigator.pop(context),
|
||||
child: const Icon(Icons.close, color: _grayText),
|
||||
child: Icon(Icons.close, color: grayText),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
|
@ -1274,7 +1291,7 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
Container(
|
||||
padding: const EdgeInsets.all(4),
|
||||
decoration: BoxDecoration(
|
||||
color: _bgGray,
|
||||
color: bgGray,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Row(
|
||||
|
|
@ -1288,7 +1305,7 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 10),
|
||||
decoration: BoxDecoration(
|
||||
color: _direction == 0 ? Colors.white : Colors.transparent,
|
||||
color: _direction == 0 ? AppColors.cardOf(context) : Colors.transparent,
|
||||
borderRadius: BorderRadius.circular(6),
|
||||
boxShadow: _direction == 0
|
||||
? [BoxShadow(color: Colors.black.withValues(alpha: 0.05), blurRadius: 4)]
|
||||
|
|
@ -1300,7 +1317,7 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
style: TextStyle(
|
||||
fontSize: 13,
|
||||
fontWeight: _direction == 0 ? FontWeight.bold : FontWeight.normal,
|
||||
color: _direction == 0 ? _orange : _grayText,
|
||||
color: _direction == 0 ? _orange : grayText,
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
@ -1315,7 +1332,7 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 10),
|
||||
decoration: BoxDecoration(
|
||||
color: _direction == 1 ? Colors.white : Colors.transparent,
|
||||
color: _direction == 1 ? AppColors.cardOf(context) : Colors.transparent,
|
||||
borderRadius: BorderRadius.circular(6),
|
||||
boxShadow: _direction == 1
|
||||
? [BoxShadow(color: Colors.black.withValues(alpha: 0.05), blurRadius: 4)]
|
||||
|
|
@ -1327,7 +1344,7 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
style: TextStyle(
|
||||
fontSize: 13,
|
||||
fontWeight: _direction == 1 ? FontWeight.bold : FontWeight.normal,
|
||||
color: _direction == 1 ? _orange : _grayText,
|
||||
color: _direction == 1 ? _orange : grayText,
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
@ -1342,7 +1359,7 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: _bgGray,
|
||||
color: bgGray,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Row(
|
||||
|
|
@ -1353,15 +1370,15 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
children: [
|
||||
Text(
|
||||
_direction == 0 ? '挖矿账户' : '交易账户',
|
||||
style: const TextStyle(fontSize: 12, color: _grayText),
|
||||
style: TextStyle(fontSize: 12, color: grayText),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
formatAmount(_direction == 0 ? widget.miningBalance : widget.tradingBalance),
|
||||
style: const TextStyle(
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: _darkText,
|
||||
color: darkText,
|
||||
),
|
||||
),
|
||||
],
|
||||
|
|
@ -1374,15 +1391,15 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
children: [
|
||||
Text(
|
||||
_direction == 0 ? '交易账户' : '挖矿账户',
|
||||
style: const TextStyle(fontSize: 12, color: _grayText),
|
||||
style: TextStyle(fontSize: 12, color: grayText),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
formatAmount(_direction == 0 ? widget.tradingBalance : widget.miningBalance),
|
||||
style: const TextStyle(
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: _darkText,
|
||||
color: darkText,
|
||||
),
|
||||
),
|
||||
],
|
||||
|
|
@ -1394,14 +1411,14 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
const SizedBox(height: 20),
|
||||
|
||||
// 数量输入
|
||||
const Text(
|
||||
Text(
|
||||
'划转数量',
|
||||
style: TextStyle(fontSize: 14, color: _darkText),
|
||||
style: TextStyle(fontSize: 14, color: darkText),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(color: _bgGray),
|
||||
border: Border.all(color: bgGray),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Row(
|
||||
|
|
@ -1410,11 +1427,11 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
child: TextField(
|
||||
controller: _amountController,
|
||||
keyboardType: const TextInputType.numberWithOptions(decimal: true),
|
||||
decoration: const InputDecoration(
|
||||
decoration: InputDecoration(
|
||||
hintText: '请输入划转数量',
|
||||
hintStyle: TextStyle(color: _grayText, fontSize: 14),
|
||||
hintStyle: TextStyle(color: grayText, fontSize: 14),
|
||||
border: InputBorder.none,
|
||||
contentPadding: EdgeInsets.symmetric(horizontal: 12, vertical: 14),
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 12, vertical: 14),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
@ -1445,15 +1462,15 @@ class _TransferBottomSheetState extends ConsumerState<_TransferBottomSheet> {
|
|||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'可用: ${formatAmount(_availableBalance)} 积分股',
|
||||
style: const TextStyle(fontSize: 12, color: _grayText),
|
||||
style: TextStyle(fontSize: 12, color: grayText),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
const Text(
|
||||
Text(
|
||||
'提示: 最低划转数量为 0.01 积分股',
|
||||
style: TextStyle(fontSize: 12, color: _grayText),
|
||||
style: TextStyle(fontSize: 12, color: grayText),
|
||||
),
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
|
|
|
|||
|
|
@ -1,26 +1,27 @@
|
|||
import 'package:flutter/material.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import '../../core/router/routes.dart';
|
||||
import '../../core/constants/app_colors.dart';
|
||||
|
||||
class MainShell extends StatelessWidget {
|
||||
final Widget child;
|
||||
|
||||
const MainShell({super.key, required this.child});
|
||||
|
||||
// 设计色彩
|
||||
static const Color _orange = Color(0xFFFF6B00);
|
||||
static const Color _grayText = Color(0xFF9CA3AF);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final isDark = AppColors.isDark(context);
|
||||
|
||||
return Scaffold(
|
||||
body: child,
|
||||
bottomNavigationBar: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
color: AppColors.cardOf(context),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.05),
|
||||
color: isDark
|
||||
? Colors.black.withOpacity(0.3)
|
||||
: Colors.black.withOpacity(0.05),
|
||||
blurRadius: 10,
|
||||
offset: const Offset(0, -2),
|
||||
),
|
||||
|
|
@ -79,6 +80,7 @@ class MainShell extends StatelessWidget {
|
|||
}) {
|
||||
final currentIndex = _calculateSelectedIndex(context);
|
||||
final isSelected = currentIndex == index;
|
||||
final inactiveColor = AppColors.textMutedOf(context);
|
||||
|
||||
return GestureDetector(
|
||||
onTap: () => _onItemTapped(index, context),
|
||||
|
|
@ -91,7 +93,7 @@ class MainShell extends StatelessWidget {
|
|||
Icon(
|
||||
isSelected ? activeIcon : icon,
|
||||
size: 24,
|
||||
color: isSelected ? _orange : _grayText,
|
||||
color: isSelected ? AppColors.orange : inactiveColor,
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
|
|
@ -99,7 +101,7 @@ class MainShell extends StatelessWidget {
|
|||
style: TextStyle(
|
||||
fontSize: 11,
|
||||
fontWeight: isSelected ? FontWeight.w600 : FontWeight.w400,
|
||||
color: isSelected ? _orange : _grayText,
|
||||
color: isSelected ? AppColors.orange : inactiveColor,
|
||||
),
|
||||
),
|
||||
],
|
||||
|
|
|
|||
Loading…
Reference in New Issue