sion/monisuo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 优化

Browse Source
This commit is contained in:
sion
2026-03-23 00:43:19 +08:00
parent ae1aa21445
commit 7be22da0f0
15 changed files with 1369 additions and 1270 deletions
Download Patch File Download Diff File Expand all files Collapse all files

609
flutter_monisuo/lib/ui/pages/home/home_page.dart
View File

@@ -3,6 +3,7 @@ import 'package:shadcn_ui/shadcn_ui.dart';
import 'package:provider/provider.dart';
import '../../../providers/asset_provider.dart';
import '../../../providers/auth_provider.dart';
import '../../shared/ui_constants.dart';
/// 首页 - 使用 shadcn_ui 现代化设计
class HomePage extends StatefulWidget {
@@ -19,15 +20,13 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
@override
void initState() {
super.initState();
WidgetsBinding.instance.addPostFrameCallback((_) {
_loadData();
});
WidgetsBinding.instance.addPostFrameCallback((_) => _loadData());
}
void _loadData() {
final assetProvider = context.read<AssetProvider>();
assetProvider.loadOverview();
assetProvider.loadTradeAccount();
final provider = context.read<AssetProvider>();
provider.loadOverview();
provider.loadTradeAccount();
}
@override
@@ -40,7 +39,7 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
body: Consumer<AssetProvider>(
builder: (context, provider, _) {
return RefreshIndicator(
onRefresh: () => provider.refreshAll(),
onRefresh: () => provider.refreshAll(force: true),
color: theme.colorScheme.primary,
child: SingleChildScrollView(
physics: const AlwaysScrollableScrollPhysics(),
@@ -49,13 +48,18 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(height: 8),
_buildHeader(),
_Header(),
const SizedBox(height: 20),
_buildAssetCard(provider),
_AssetOverviewCard(overview: provider.overview),
const SizedBox(height: 16),
_buildQuickActions(),
_QuickActions(
onDeposit: _showDeposit,
onWithdraw: _showWithdraw,
onTransfer: _showTransfer,
onTrade: _navigateToTrade,
),
const SizedBox(height: 24),
_buildHoldings(provider),
_HoldingsList(holdings: provider.holdings),
],
),
),
@@ -65,7 +69,115 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
);
}
Widget _buildHeader() {
void _showDeposit() => _showAmountDialog('充值', (amount) {
context.read<AssetProvider>().deposit(amount: amount);
});
void _showWithdraw() {
final amountController = TextEditingController();
final addressController = TextEditingController();
final contactController = TextEditingController();
final formKey = GlobalKey<ShadFormState>();
showShadDialog(
context: context,
builder: (ctx) => ShadDialog(
title: const Text('提现'),
child: ShadForm(
key: formKey,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
ShadInputFormField(
id: 'amount',
placeholder: const Text('请输入提现金额(USDT)'),
controller: amountController,
keyboardType: const TextInputType.numberWithOptions(decimal: true),
validator: Validators.amount,
),
const SizedBox(height: 12),
ShadInputFormField(
id: 'address',
placeholder: const Text('请输入提现地址'),
controller: addressController,
validator: (v) => Validators.required(v, '提现地址'),
),
const SizedBox(height: 12),
ShadInputFormField(
id: 'contact',
placeholder: const Text('联系方式(可选)'),
controller: contactController,
),
],
),
),
actions: [
ShadButton.outline(child: const Text('取消'), onPressed: () => Navigator.of(ctx).pop()),
ShadButton(
child: const Text('确认'),
onPressed: () {
if (formKey.currentState!.saveAndValidate()) {
Navigator.of(ctx).pop();
context.read<AssetProvider>().withdraw(
amount: amountController.text.trim(),
withdrawAddress: addressController.text.trim(),
withdrawContact: contactController.text.trim().isEmpty ? null : contactController.text.trim(),
);
}
},
),
],
),
);
}
void _showTransfer() => _showAmountDialog('划转', (amount) {
context.read<AssetProvider>().transfer(direction: 1, amount: amount);
});
void _showAmountDialog(String title, Function(String) onSubmit) {
final controller = TextEditingController();
final formKey = GlobalKey<ShadFormState>();
showShadDialog(
context: context,
builder: (ctx) => ShadDialog(
title: Text(title),
child: ShadForm(
key: formKey,
child: ShadInputFormField(
id: 'amount',
placeholder: Text('请输入${title}金额(USDT)'),
controller: controller,
keyboardType: const TextInputType.numberWithOptions(decimal: true),
validator: Validators.amount,
),
),
actions: [
ShadButton.outline(child: const Text('取消'), onPressed: () => Navigator.of(ctx).pop()),
ShadButton(
child: const Text('确认'),
onPressed: () {
if (formKey.currentState!.saveAndValidate()) {
onSubmit(controller.text);
Navigator.of(ctx).pop();
}
},
),
],
),
);
}
void _navigateToTrade() {
// 切换到交易页 - 通过 MainController
}
}
/// 头部组件
class _Header extends StatelessWidget {
@override
Widget build(BuildContext context) {
final theme = ShadTheme.of(context);
return Consumer<AuthProvider>(
@@ -73,17 +185,7 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
final user = auth.user;
return Row(
children: [
CircleAvatar(
radius: 20,
backgroundColor: theme.colorScheme.primary.withValues(alpha: 0.2),
child: Text(
user?.avatarText ?? 'U',
style: TextStyle(
color: theme.colorScheme.primary,
fontWeight: FontWeight.bold,
),
),
),
_Avatar(text: user?.avatarText),
const SizedBox(width: 12),
Expanded(
child: Column(
@@ -91,15 +193,10 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
children: [
Text(
'你好，${user?.username ?? '用户'}',
style: theme.textTheme.large.copyWith(
fontWeight: FontWeight.bold,
),
style: theme.textTheme.large.copyWith(fontWeight: FontWeight.bold),
),
const SizedBox(height: 2),
Text(
'欢迎来到模拟所',
style: theme.textTheme.muted,
),
Text('欢迎来到模拟所', style: theme.textTheme.muted),
],
),
),
@@ -108,23 +205,45 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
},
);
}
}
Widget _buildAssetCard(AssetProvider provider) {
/// 头像组件
class _Avatar extends StatelessWidget {
final String? text;
const _Avatar({this.text});
@override
Widget build(BuildContext context) {
final theme = ShadTheme.of(context);
final overview = provider.overview;
// 自定义渐变色
const gradientColors = [
Color(0xFF00D4AA),
Color(0xFF00B894),
];
return CircleAvatar(
radius: 20,
backgroundColor: theme.colorScheme.primary.withValues(alpha: 0.2),
child: Text(
text ?? 'U',
style: TextStyle(color: theme.colorScheme.primary, fontWeight: FontWeight.bold),
),
);
}
}
/// 资产总览卡片
class _AssetOverviewCard extends StatelessWidget {
final dynamic overview;
const _AssetOverviewCard({required this.overview});
@override
Widget build(BuildContext context) {
final theme = ShadTheme.of(context);
return Container(
width: double.infinity,
padding: const EdgeInsets.all(20),
decoration: BoxDecoration(
gradient: const LinearGradient(
colors: gradientColors,
colors: AppColors.gradientColors,
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
@@ -133,95 +252,95 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'总资产(USDT)',
style: theme.textTheme.small.copyWith(color: Colors.white70),
),
Text('总资产(USDT)', style: theme.textTheme.small.copyWith(color: Colors.white70)),
const SizedBox(height: 8),
Text(
overview?.totalAsset ?? '0.00',
style: theme.textTheme.h2.copyWith(
color: Colors.white,
fontWeight: FontWeight.bold,
),
style: theme.textTheme.h2.copyWith(color: Colors.white, fontWeight: FontWeight.bold),
),
const SizedBox(height: 20),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
_buildAssetItem('资金账户', overview?.fundBalance ?? '0.00'),
_buildAssetItem('交易账户', overview?.tradeBalance ?? '0.00'),
_AssetItem(label: '资金账户', value: overview?.fundBalance ?? '0.00'),
_AssetItem(label: '交易账户', value: overview?.tradeBalance ?? '0.00'),
],
),
],
),
).animate().fadeIn(duration: 400.ms).slideY(begin: 0.1, end: 0);
}
}
Widget _buildAssetItem(String label, String value) {
/// 资产项
class _AssetItem extends StatelessWidget {
final String label;
final String value;
const _AssetItem({required this.label, required this.value});
@override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
label,
style: const TextStyle(fontSize: 12, color: Colors.white70),
),
Text(label, style: const TextStyle(fontSize: 12, color: Colors.white70)),
const SizedBox(height: 4),
Text(
value,
style: const TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
color: Colors.white,
),
),
Text(value, style: const TextStyle(fontSize: 18, fontWeight: FontWeight.w600, color: Colors.white)),
],
);
}
}
Widget _buildQuickActions() {
final theme = ShadTheme.of(context);
/// 快捷操作
class _QuickActions extends StatelessWidget {
final VoidCallback onDeposit;
final VoidCallback onWithdraw;
final VoidCallback onTransfer;
final VoidCallback onTrade;
const _QuickActions({
required this.onDeposit,
required this.onWithdraw,
required this.onTransfer,
required this.onTrade,
});
@override
Widget build(BuildContext context) {
return ShadCard(
padding: const EdgeInsets.all(16),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
_buildActionItem(
icon: LucideIcons.arrowDownToLine,
text: '充值',
color: const Color(0xFF00C853),
onTap: () => _showDeposit(),
),
_buildActionItem(
icon: LucideIcons.arrowUpFromLine,
text: '提现',
color: const Color(0xFFFF9800),
onTap: () => _showWithdraw(),
),
_buildActionItem(
icon: LucideIcons.arrowRightLeft,
text: '划转',
color: theme.colorScheme.primary,
onTap: () => _showTransfer(),
),
_buildActionItem(
icon: LucideIcons.trendingUp,
text: '交易',
color: const Color(0xFF2196F3),
onTap: () => _navigateToTrade(),
),
_ActionButton(icon: LucideIcons.arrowDownToLine, text: '充值', color: AppColors.deposit, onTap: onDeposit),
_ActionButton(icon: LucideIcons.arrowUpFromLine, text: '提现', color: AppColors.withdraw, onTap: onWithdraw),
_ActionButton(icon: LucideIcons.arrowRightLeft, text: '划转', color: AppColors.trade, onTap: onTransfer),
_ActionButton(icon: LucideIcons.trendingUp, text: '交易', color: AppColors.trade, onTap: onTrade),
],
),
).animate().fadeIn(duration: 500.ms, delay: 100.ms);
}
}
/// 操作按钮
class _ActionButton extends StatelessWidget {
final IconData icon;
final String text;
final Color color;
final VoidCallback onTap;
const _ActionButton({
required this.icon,
required this.text,
required this.color,
required this.onTap,
});
@override
Widget build(BuildContext context) {
final theme = ShadTheme.of(context);
Widget _buildActionItem({
required IconData icon,
required String text,
required Color color,
required VoidCallback onTap,
}) {
return GestureDetector(
onTap: onTap,
child: Column(
@@ -229,28 +348,26 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
Container(
width: 48,
height: 48,
decoration: BoxDecoration(
color: color.withOpacity(0.15),
shape: BoxShape.circle,
),
decoration: BoxDecoration(color: color.withOpacity(0.15), shape: BoxShape.circle),
child: Icon(icon, color: color, size: 22),
),
const SizedBox(height: 8),
Text(
text,
style: TextStyle(
fontSize: 12,
color: ShadTheme.of(context).colorScheme.foreground,
),
),
Text(text, style: TextStyle(fontSize: 12, color: theme.colorScheme.foreground)),
],
),
);
}
}
Widget _buildHoldings(AssetProvider provider) {
/// 持仓列表
class _HoldingsList extends StatelessWidget {
final List<dynamic> holdings;
const _HoldingsList({required this.holdings});
@override
Widget build(BuildContext context) {
final theme = ShadTheme.of(context);
final holdings = provider.holdings;
return ShadCard(
padding: const EdgeInsets.all(16),
@@ -260,70 +377,78 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'我的持仓',
style: theme.textTheme.large.copyWith(
fontWeight: FontWeight.bold,
),
),
Icon(
LucideIcons.chevronRight,
color: theme.colorScheme.mutedForeground,
size: 20,
),
Text('我的持仓', style: theme.textTheme.large.copyWith(fontWeight: FontWeight.bold)),
Icon(LucideIcons.chevronRight, color: theme.colorScheme.mutedForeground, size: 20),
],
),
const SizedBox(height: 16),
if (holdings.isEmpty)
Center(
child: Padding(
padding: const EdgeInsets.all(32),
child: Column(
children: [
Icon(
LucideIcons.wallet,
size: 48,
color: theme.colorScheme.mutedForeground,
),
const SizedBox(height: 12),
Text(
'暂无持仓',
style: theme.textTheme.muted,
),
const SizedBox(height: 4),
Text(
'快去交易吧~',
style: theme.textTheme.muted.copyWith(fontSize: 12),
),
],
),
),
)
_EmptyHoldings()
else
ListView.separated(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
itemCount: holdings.length > 5 ? 5 : holdings.length,
separatorBuilder: (_, __) => Divider(
color: theme.colorScheme.border,
height: 1,
),
itemBuilder: (context, index) {
final holding = holdings[index];
return _buildHoldingItem(holding)
.animate()
.fadeIn(delay: Duration(milliseconds: 50 * index));
},
),
_HoldingsListView(holdings: holdings),
],
),
).animate().fadeIn(duration: 500.ms, delay: 200.ms);
}
}
Widget _buildHoldingItem(holding) {
/// 空持仓提示
class _EmptyHoldings extends StatelessWidget {
@override
Widget build(BuildContext context) {
final theme = ShadTheme.of(context);
return Center(
child: Padding(
padding: const EdgeInsets.all(32),
child: Column(
children: [
Icon(LucideIcons.wallet, size: 48, color: theme.colorScheme.mutedForeground),
const SizedBox(height: 12),
Text('暂无持仓', style: theme.textTheme.muted),
const SizedBox(height: 4),
Text('快去交易吧~', style: theme.textTheme.muted.copyWith(fontSize: 12)),
],
),
),
);
}
}
/// 持仓列表视图
class _HoldingsListView extends StatelessWidget {
final List<dynamic> holdings;
const _HoldingsListView({required this.holdings});
@override
Widget build(BuildContext context) {
final theme = ShadTheme.of(context);
final displayHoldings = holdings.length > 5 ? holdings.sublist(0, 5) : holdings;
return ListView.separated(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
itemCount: displayHoldings.length,
separatorBuilder: (_, __) => Divider(color: theme.colorScheme.border, height: 1),
itemBuilder: (context, index) {
return _HoldingItem(holding: displayHoldings[index])
.animate()
.fadeIn(delay: Duration(milliseconds: 50 * index));
},
);
}
}
/// 持仓项
class _HoldingItem extends StatelessWidget {
final dynamic holding;
const _HoldingItem({required this.holding});
@override
Widget build(BuildContext context) {
final theme = ShadTheme.of(context);
final upColor = const Color(0xFF00C853);
final downColor = const Color(0xFFFF5252);
return Padding(
padding: const EdgeInsets.symmetric(vertical: 8),
@@ -337,26 +462,15 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
backgroundColor: theme.colorScheme.primary.withValues(alpha: 0.1),
child: Text(
holding.coinCode.substring(0, 1),
style: TextStyle(
color: theme.colorScheme.primary,
fontWeight: FontWeight.bold,
),
style: TextStyle(color: theme.colorScheme.primary, fontWeight: FontWeight.bold),
),
),
const SizedBox(width: 12),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
holding.coinCode,
style: theme.textTheme.large.copyWith(
fontWeight: FontWeight.bold,
),
),
Text(
holding.quantity,
style: theme.textTheme.muted,
),
Text(holding.coinCode, style: theme.textTheme.large.copyWith(fontWeight: FontWeight.bold)),
Text(holding.quantity, style: theme.textTheme.muted),
],
),
],
@@ -364,16 +478,11 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
Column(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Text(
'${holding.currentValue} USDT',
style: theme.textTheme.small.copyWith(
fontWeight: FontWeight.w500,
),
),
Text('${holding.currentValue} USDT', style: theme.textTheme.small.copyWith(fontWeight: FontWeight.w500)),
Text(
holding.formattedProfitRate,
style: TextStyle(
color: holding.isProfit ? upColor : downColor,
color: holding.isProfit ? AppColors.up : AppColors.down,
fontSize: 12,
),
),
@@ -383,144 +492,4 @@ class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin
),
);
}
void _showDeposit() {
_showActionDialog('充值', '请输入充值金额(USDT)', (amount) {
context.read<AssetProvider>().deposit(amount: amount);
});
}
void _showWithdraw() {
final amountController = TextEditingController();
final addressController = TextEditingController();
final contactController = TextEditingController();
final formKey = GlobalKey<ShadFormState>();
showShadDialog(
context: context,
builder: (context) => ShadDialog(
title: const Text('提现'),
child: ShadForm(
key: formKey,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
ShadInputFormField(
id: 'amount',
placeholder: const Text('请输入提现金额(USDT)'),
controller: amountController,
keyboardType: const TextInputType.numberWithOptions(decimal: true),
validator: (value) {
if (value == null || value.isEmpty) {
return '请输入金额';
}
final amount = double.tryParse(value);
if (amount == null || amount <= 0) {
return '请输入有效金额';
}
return null;
},
),
const SizedBox(height: 12),
ShadInputFormField(
id: 'address',
placeholder: const Text('请输入提现地址'),
controller: addressController,
validator: (value) {
if (value == null || value.isEmpty) {
return '请输入提现地址';
}
return null;
},
),
const SizedBox(height: 12),
ShadInputFormField(
id: 'contact',
placeholder: const Text('联系方式(可选)'),
controller: contactController,
),
],
),
),
actions: [
ShadButton.outline(
child: const Text('取消'),
onPressed: () => Navigator.of(context).pop(),
),
ShadButton(
child: const Text('确认'),
onPressed: () {
if (formKey.currentState!.saveAndValidate()) {
final amount = amountController.text.trim();
final address = addressController.text.trim();
final contact = contactController.text.trim();
Navigator.of(context).pop();
context.read<AssetProvider>().withdraw(
amount: amount,
withdrawAddress: address,
withdrawContact: contact.isEmpty ? null : contact,
);
}
},
),
],
),
);
}
void _showTransfer() {
_showActionDialog('划转', '请输入划转金额(USDT)', (amount) {
context.read<AssetProvider>().transfer(direction: 1, amount: amount);
});
}
void _showActionDialog(String title, String hint, Function(String) onSubmit) {
final controller = TextEditingController();
final formKey = GlobalKey<ShadFormState>();
showShadDialog(
context: context,
builder: (context) => ShadDialog(
title: Text(title),
child: ShadForm(
key: formKey,
child: ShadInputFormField(
id: 'amount',
placeholder: Text(hint),
controller: controller,
keyboardType: const TextInputType.numberWithOptions(decimal: true),
validator: (value) {
if (value == null || value.isEmpty) {
return '请输入金额';
}
final amount = double.tryParse(value);
if (amount == null || amount <= 0) {
return '请输入有效金额';
}
return null;
},
),
),
actions: [
ShadButton.outline(
child: const Text('取消'),
onPressed: () => Navigator.of(context).pop(),
),
ShadButton(
child: const Text('确认'),
onPressed: () {
if (formKey.currentState!.saveAndValidate()) {
onSubmit(controller.text);
Navigator.of(context).pop();
}
},
),
],
),
);
}
void _navigateToTrade() {
// 切换到交易页 - 通过 MainController
}
}