fix: 修复UI样式问题

- 首页:移除盈亏日历,福利中心卡片改为白色背景,查看按钮改为黄色
- 资产页面:余额卡片撑满宽度
- 底部导航栏:移除背景高亮,只保留图标和文字变化
- 行情页面:调整卡片文字大小和柱形图样式
- 交易页面:买入按钮白色文字,卖出按钮红色文字,优化输入框和百分比卡片样式,添加顶部间距
- 全局:移除渐变色,统一使用纯色背景
This commit is contained in:
2026-04-06 11:21:10 +08:00
parent 951d597057
commit 2bc6ff66e1
8 changed files with 65 additions and 353 deletions

View File

@@ -2,7 +2,6 @@ import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:shadcn_ui/shadcn_ui.dart';
import 'package:bot_toast/bot_toast.dart';
import 'package:provider/provider.dart';
import '../../../core/theme/app_theme.dart';
import '../../../core/theme/app_color_scheme.dart';
@@ -11,7 +10,6 @@ import '../../../core/theme/app_theme_extension.dart';
import '../../../core/utils/toast_utils.dart';
import '../../../core/event/app_event_bus.dart';
import '../../../data/models/account_models.dart';
import '../../../data/services/asset_service.dart';
import '../../../data/services/bonus_service.dart';
import '../../../providers/asset_provider.dart';
import '../../components/glass_panel.dart';
@@ -421,106 +419,27 @@ class _HomePageState extends State<HomePage>
}
/// Header 栏:品牌名 + 搜索/通知/头像
/// 资产卡片(含总盈利 + 可折叠盈亏日历
class _AssetCard extends StatefulWidget {
/// 资产卡片(含总盈利)
class _AssetCard extends StatelessWidget {
final AssetOverview? overview;
final VoidCallback onDeposit;
const _AssetCard({required this.overview, required this.onDeposit});
@override
State<_AssetCard> createState() => _AssetCardState();
}
class _AssetCardState extends State<_AssetCard> {
late DateTime _currentMonth;
Map<String, dynamic>? _profitData;
bool _isLoadingCalendar = false;
@override
void initState() {
super.initState();
_currentMonth = DateTime.now();
WidgetsBinding.instance.addPostFrameCallback((_) => _loadProfit());
}
double get _totalProfit {
final v = widget.overview?.totalProfit;
final v = overview?.totalProfit;
if (v == null) return 0;
return double.tryParse(v) ?? 0;
}
Future<void> _loadProfit() async {
setState(() => _isLoadingCalendar = true);
try {
final assetService = context.read<AssetService>();
final response = await assetService.getDailyProfit(
year: _currentMonth.year,
month: _currentMonth.month,
);
if (mounted) {
setState(() {
_profitData = response.data;
_isLoadingCalendar = false;
});
}
} catch (_) {
if (mounted) setState(() => _isLoadingCalendar = false);
}
}
void _previousMonth() {
setState(() {
_currentMonth = DateTime(_currentMonth.year, _currentMonth.month - 1);
});
_loadProfit();
}
void _nextMonth() {
setState(() {
_currentMonth = DateTime(_currentMonth.year, _currentMonth.month + 1);
});
_loadProfit();
}
double? _getDayProfit(int day) {
if (_profitData == null) return null;
final daily = _profitData!['daily'] as Map<String, dynamic>?;
if (daily == null) return null;
final dateStr = '${_currentMonth.year}-${_currentMonth.month.toString().padLeft(2, '0')}-${day.toString().padLeft(2, '0')}';
final value = daily[dateStr];
if (value == null) return null;
return (value is num) ? value.toDouble() : double.tryParse(value.toString());
}
double get _monthProfit {
if (_profitData == null) return 0;
final value = _profitData!['totalProfit'];
if (value == null) return 0;
return (value is num) ? value.toDouble() : double.tryParse(value.toString()) ?? 0;
}
double? get _todayProfit {
if (_profitData == null) return null;
final daily = _profitData!['daily'] as Map<String, dynamic>?;
if (daily == null) return null;
final now = DateTime.now();
final todayKey = '${now.year}-${now.month.toString().padLeft(2, '0')}-${now.day.toString().padLeft(2, '0')}';
final value = daily[todayKey];
if (value == null) return null;
return (value is num) ? value.toDouble() : double.tryParse(value.toString());
}
@override
Widget build(BuildContext context) {
final upColor = context.appColors.up;
final downColor = context.appColors.down;
final isProfit = _totalProfit >= 0;
final todayProfit = _todayProfit;
final isTodayProfit = (todayProfit ?? 0) >= 0;
// 总资产
final totalAsset = widget.overview?.totalAsset ?? '0.00';
final totalAsset = overview?.totalAsset ?? '0.00';
final displayAsset = _formatAsset(totalAsset);
return GlassPanel(
@@ -538,7 +457,7 @@ class _AssetCardState extends State<_AssetCard> {
style: AppTextStyles.bodyLarge(context), // 13px
),
GestureDetector(
onTap: widget.onDeposit,
onTap: onDeposit,
child: Container(
padding: EdgeInsets.symmetric(
horizontal: 10,
@@ -584,7 +503,7 @@ class _AssetCardState extends State<_AssetCard> {
Expanded(
child: _ProfitStatCard(
label: '今日盈亏',
value: _todayProfit,
value: null, // 移除日历后不显示今日盈亏
upColor: upColor,
downColor: downColor,
onTap: () => Navigator.push(
@@ -609,216 +528,11 @@ class _AssetCardState extends State<_AssetCard> {
),
],
),
// 盈利日历
_buildCalendarSection(context),
],
),
);
}
Widget _buildCalendarSection(BuildContext context) {
final now = DateTime.now();
final isCurrentMonth = _currentMonth.year == now.year && _currentMonth.month == now.month;
final firstDayOfMonth = DateTime(_currentMonth.year, _currentMonth.month, 1);
final daysInMonth = DateTime(_currentMonth.year, _currentMonth.month + 1, 0).day;
final startWeekday = firstDayOfMonth.weekday;
final upColor = context.appColors.up;
final downColor = context.appColors.down;
return Column(
mainAxisSize: MainAxisSize.min,
children: [
// 分隔线
Padding(
padding: EdgeInsets.symmetric(vertical: AppSpacing.md),
child: Divider(color: context.appColors.ghostBorder, height: 1),
),
// 月份导航行
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GestureDetector(
onTap: _previousMonth,
child: Container(
padding: EdgeInsets.all(AppSpacing.xs + 1),
decoration: BoxDecoration(
color: context.colors.surfaceContainerHigh,
borderRadius: BorderRadius.circular(AppRadius.sm),
),
child: Icon(LucideIcons.chevronLeft, size: 16, color: context.colors.onSurfaceVariant),
),
),
Column(
children: [
Text(
'${_currentMonth.year}${_currentMonth.month}',
style: AppTextStyles.headlineMedium(context).copyWith(
fontWeight: FontWeight.bold,
),
),
SizedBox(height: 2),
if (!_isLoadingCalendar && _profitData != null)
Text(
'月度盈亏: ${_monthProfit >= 0 ? '+' : ''}${_monthProfit.toStringAsFixed(2)}',
style: AppTextStyles.bodySmall(context).copyWith(
fontWeight: FontWeight.w600,
color: _monthProfit >= 0 ? upColor : downColor,
),
),
],
),
GestureDetector(
onTap: isCurrentMonth ? null : _nextMonth,
child: Container(
padding: EdgeInsets.all(AppSpacing.xs + 1),
decoration: BoxDecoration(
color: isCurrentMonth
? context.colors.surfaceContainerHigh.withValues(alpha: 0.5)
: context.colors.surfaceContainerHigh,
borderRadius: BorderRadius.circular(AppRadius.sm),
),
child: Icon(
LucideIcons.chevronRight,
size: 16,
color: isCurrentMonth
? context.colors.onSurfaceVariant.withValues(alpha: 0.4)
: context.colors.onSurfaceVariant,
),
),
),
],
),
SizedBox(height: AppSpacing.sm),
// 星期标题
Row(
children: ['', '', '', '', '', '', ''].map((d) {
return Expanded(
child: Center(
child: Text(
d,
style: AppTextStyles.bodySmall(context).copyWith(
fontWeight: FontWeight.w500,
color: context.colors.onSurfaceVariant.withValues(alpha: 0.6),
),
),
),
);
}).toList(),
),
SizedBox(height: AppSpacing.xs),
// 日历网格
if (_isLoadingCalendar)
Padding(
padding: EdgeInsets.symmetric(vertical: AppSpacing.lg),
child: SizedBox(
width: 18,
height: 18,
child: CircularProgressIndicator(
strokeWidth: 2,
color: context.colors.primary,
),
),
)
else
..._buildCalendarGrid(
startWeekday, daysInMonth, now, isCurrentMonth,
),
],
);
}
List<Widget> _buildCalendarGrid(
int startWeekday,
int daysInMonth,
DateTime now,
bool isCurrentMonth,
) {
final upColor = context.appColors.up;
final downColor = context.appColors.down;
final List<Widget> rows = [];
List<Widget> cells = [];
for (int i = 1; i < startWeekday; i++) {
cells.add(const Expanded(child: SizedBox.shrink()));
}
for (int day = 1; day <= daysInMonth; day++) {
final profit = _getDayProfit(day);
final isToday = isCurrentMonth && day == now.day;
final hasProfit = profit != null && profit != 0;
cells.add(
Expanded(
child: AspectRatio(
aspectRatio: 1,
child: Container(
margin: EdgeInsets.all(1),
decoration: BoxDecoration(
color: isToday
? context.colors.primary.withValues(alpha: 0.12)
: hasProfit
? (profit! > 0
? upColor.withValues(alpha: 0.08)
: downColor.withValues(alpha: 0.08))
: Colors.transparent,
borderRadius: BorderRadius.circular(AppRadius.sm),
border: isToday
? Border.all(color: context.colors.primary.withValues(alpha: 0.4), width: 1)
: null,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'$day',
style: AppTextStyles.bodySmall(context).copyWith(
fontSize: 10,
fontWeight: isToday ? FontWeight.bold : FontWeight.w400,
color: isToday
? context.colors.primary
: context.colors.onSurface,
),
),
if (hasProfit) ...[
SizedBox(height: 1),
Text(
'${profit! > 0 ? '+' : ''}${profit.abs() < 10 ? profit.toStringAsFixed(2) : profit.toStringAsFixed(1)}',
style: TextStyle(
fontSize: 7,
fontWeight: FontWeight.w600,
color: profit > 0 ? upColor : downColor,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
],
],
),
),
),
),
);
if (cells.length == 7) {
rows.add(Row(children: cells));
cells = [];
}
}
if (cells.isNotEmpty) {
while (cells.length < 7) {
cells.add(const Expanded(child: SizedBox.shrink()));
}
rows.add(Row(children: cells));
}
return rows;
}
String _formatAsset(String value) {
final d = double.tryParse(value) ?? 0.0;
return d.toStringAsFixed(2);
@@ -840,16 +554,9 @@ class _WelfareCard extends StatelessWidget {
width: double.infinity,
padding: EdgeInsets.all(AppSpacing.lg),
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
context.colors.primary.withValues(alpha: 0.15),
context.colors.secondary.withValues(alpha: 0.1),
],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
color: context.colors.surface, // 白色背景(跟随主题)
borderRadius: BorderRadius.circular(AppRadius.xl),
border: Border.all(color: context.colors.primary.withValues(alpha: 0.2)),
border: Border.all(color: context.colors.outlineVariant.withValues(alpha: 0.2)),
),
child: Row(
children: [
@@ -889,14 +596,14 @@ class _WelfareCard extends StatelessWidget {
],
),
),
// 右侧按钮
// 右侧按钮 - 黄色背景
Container(
padding: EdgeInsets.symmetric(
horizontal: AppSpacing.md,
vertical: AppSpacing.sm,
),
decoration: BoxDecoration(
gradient: context.appColors.ctaGradient,
color: const Color(0xFFF59E0B), // 黄色背景
borderRadius: BorderRadius.circular(AppRadius.full),
),
child: Row(
@@ -923,7 +630,7 @@ class _WelfareCard extends StatelessWidget {
'查看',
style: AppTextStyles.headlineSmall(context).copyWith(
fontWeight: FontWeight.w700,
color: context.colors.onPrimary,
color: Colors.white, // 白色文字
),
),
],