Files
jinzhi/lib/features/assets/presentation/holding_detail_page.dart
T
2026-06-23 14:42:13 +08:00

604 lines
20 KiB
Dart

import 'dart:io';
import 'package:flutter/material.dart' hide AssetImage;
import 'package:go_router/go_router.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:shadcn_ui/shadcn_ui.dart';
import '../../../common/domain/money.dart';
import '../../../common/router/app_router.dart';
import '../../../common/widgets/prototype_ui.dart';
import '../../profile/application/price_color_theme.dart';
import '../../profile/application/profile_settings_controller.dart';
import '../application/asset_portfolio_controller.dart';
import '../data/asset_models.dart';
import 'asset_image_preview_page.dart';
class HoldingDetailPage extends ConsumerWidget {
const HoldingDetailPage({super.key, this.id});
final String? id;
@override
Widget build(BuildContext context, WidgetRef ref) {
final summary = ref.watch(assetPortfolioControllerProvider);
final holding = summary.holdings
.map((item) => item.holding)
.firstWhere(
(item) => id == null || item.id == id,
orElse: () => summary.holdings.first.holding,
);
final valuation = summary.holdings.firstWhere(
(item) => item.holding.id == holding.id,
);
final cs = ShadTheme.of(context).colorScheme;
final palette = priceColorPalette(
ref.watch(profileSettingsControllerProvider).priceColorMode,
);
final changeUp = valuation.todayChange >= 0;
return Scaffold(
backgroundColor: const Color(0xFFFBFAF7),
appBar: AppBar(
backgroundColor: const Color(0xFFFBFAF7),
surfaceTintColor: Colors.transparent,
elevation: 0,
scrolledUnderElevation: 0,
centerTitle: true,
leading: IconButton(
onPressed: () => Navigator.of(context).pop(),
icon: const Icon(Icons.chevron_left, size: 20),
),
title: Text(
holding.name,
style: const TextStyle(fontSize: 17, fontWeight: FontWeight.w600),
),
actions: [
IconButton(
onPressed: () => _showActionsSheet(context, ref, holding),
icon: const Icon(Icons.more_horiz, size: 22),
color: const Color(0xFF8A8780),
),
],
),
body: SafeArea(
child: ListView(
padding: const EdgeInsets.fromLTRB(0, 8, 0, 28),
children: [
PrototypeFrame(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
const SizedBox(height: 4),
PrototypeCard(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Container(
width: 36,
height: 36,
decoration: BoxDecoration(
color: holding.metal.color.withValues(
alpha: 0.15,
),
borderRadius: BorderRadius.circular(10),
),
child: Icon(
Icons.circle_outlined,
color: holding.metal.color,
size: 18,
),
),
const SizedBox(width: 10),
Text(
'${holding.purityLabel} · ${holding.weightGram.toStringAsFixed(1)}g',
style: TextStyle(
fontSize: 12,
color: cs.mutedForeground,
),
),
],
),
const SizedBox(height: 12),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'¥',
style: TextStyle(
fontSize: 22,
fontWeight: FontWeight.w600,
),
),
const SizedBox(width: 2),
Text(
formatCny(
valuation.materialValue,
).replaceFirst('¥', ''),
style: const TextStyle(
fontSize: 42,
fontWeight: FontWeight.w600,
letterSpacing: -1,
height: 1,
),
),
],
),
const SizedBox(height: 10),
Row(
children: [
_ChangeChip(
amount: valuation.todayChange,
positive: changeUp,
upColor: Color(palette.up),
downColor: Color(palette.down),
upBackground: Color(palette.upBackground),
downBackground: Color(palette.downBackground),
),
const SizedBox(width: 8),
Text(
'今日',
style: TextStyle(
fontSize: 12,
color: cs.mutedForeground,
),
),
],
),
],
),
),
const SizedBox(height: 12),
GestureDetector(
onTap: () => context.push(
'${AppRoutes.marketKline}?metal=${holding.metal.id}&period=24h',
),
child: PrototypeCard(
padding: const EdgeInsets.fromLTRB(14, 12, 14, 12),
child: SizedBox(
height: 92,
child: ClipRRect(
borderRadius: BorderRadius.circular(10),
child: PrototypeLineChart(
values: const [
18,
20,
21,
23,
22,
25,
29,
31,
30,
33,
35,
37,
],
),
),
),
),
),
const SizedBox(height: 12),
PrototypeCard(
padding: EdgeInsets.zero,
child: Column(
children: [
_InfoRow(
label: '材料价值(现货)',
value: formatCny(valuation.materialValue),
),
const PrototypeDivider(margin: EdgeInsets.zero),
_InfoRow(
label: '回收参考价',
value: formatCny(valuation.materialValue * 0.97),
),
if (holding.costAmount != null) ...[
const PrototypeDivider(margin: EdgeInsets.zero),
_InfoRow(
label: '买入成本',
value: formatCny(holding.costAmount!),
),
const PrototypeDivider(margin: EdgeInsets.zero),
_InfoRow(
label: '盈亏',
value: _signedCny(
valuation.materialValue - holding.costAmount!,
),
valueColor:
valuation.materialValue - holding.costAmount! >=
0
? Color(palette.up)
: Color(palette.down),
),
],
],
),
),
const SizedBox(height: 12),
PrototypeCard(
padding: EdgeInsets.zero,
child: Column(
children: [
_InfoRow(
label: '金属 / 纯度',
value:
'${holding.metal.label} · ${holding.purityLabel}',
),
const PrototypeDivider(margin: EdgeInsets.zero),
_InfoRow(
label: '克重',
value: '${holding.weightGram.toStringAsFixed(1)} g',
),
const PrototypeDivider(margin: EdgeInsets.zero),
_InfoRow(
label: '购买日期',
value: _dateLabel(holding.purchaseDate),
),
const PrototypeDivider(margin: EdgeInsets.zero),
_InfoRow(label: '购买渠道', value: holding.channel ?? '未填'),
const PrototypeDivider(margin: EdgeInsets.zero),
_InfoRow(
label: '备注',
value: holding.note == null ||
holding.note!.trim().isEmpty
? '未填'
: holding.note!.trim(),
),
],
),
),
const SizedBox(height: 12),
_buildImageSection(context, holding),
const SizedBox(height: 12),
Row(
children: [
Expanded(
child: OutlinedButton(
onPressed: () => context.push(
'${AppRoutes.assetEdit}?id=${holding.id}',
),
style: OutlinedButton.styleFrom(
side: const BorderSide(color: Color(0xFFE3D6B4)),
padding: const EdgeInsets.symmetric(vertical: 12),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(14),
),
foregroundColor: const Color(0xFF9A7A2A),
),
child: const Text('编辑'),
),
),
const SizedBox(width: 10),
Expanded(
child: OutlinedButton(
onPressed: () => _markSold(context, ref, holding.id),
style: OutlinedButton.styleFrom(
side: const BorderSide(color: Color(0xFFE6E1D8)),
foregroundColor: const Color(0xFF8A8780),
padding: const EdgeInsets.symmetric(vertical: 12),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(14),
),
),
child: const Text('标记卖出 / 转赠'),
),
),
],
),
],
),
),
],
),
),
);
}
void _showActionsSheet(
BuildContext context,
WidgetRef ref,
GoldAssetHolding holding,
) {
showModalBottomSheet<void>(
context: context,
backgroundColor: Colors.white,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(top: Radius.circular(22)),
),
builder: (ctx) => SafeArea(
child: Padding(
padding: const EdgeInsets.fromLTRB(20, 8, 20, 20),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Center(
child: Container(
width: 38,
height: 4,
margin: const EdgeInsets.only(bottom: 16),
decoration: BoxDecoration(
color: const Color(0xFFE3DFD4),
borderRadius: BorderRadius.circular(999),
),
),
),
_ActionMenuTile(
icon: Icons.edit_outlined,
label: '编辑持仓',
onTap: () {
Navigator.of(ctx).pop();
context.push('${AppRoutes.assetEdit}?id=${holding.id}');
},
),
const PrototypeDivider(margin: EdgeInsets.zero),
_ActionMenuTile(
icon: Icons.share_outlined,
label: '分享这张的估值卡',
onTap: () {
Navigator.of(ctx).pop();
context.push(AppRoutes.profileShare);
},
),
const PrototypeDivider(margin: EdgeInsets.zero),
_ActionMenuTile(
icon: Icons.sell_outlined,
label: '标记卖出 / 转赠',
labelColor: const Color(0xFFC0392B),
iconColor: const Color(0xFFC0392B),
onTap: () {
Navigator.of(ctx).pop();
_markSold(context, ref, holding.id);
},
),
const SizedBox(height: 12),
SizedBox(
width: double.infinity,
child: OutlinedButton(
onPressed: () => Navigator.of(ctx).pop(),
child: const Text('取消'),
),
),
],
),
),
),
);
}
void _markSold(BuildContext context, WidgetRef ref, String id) {
ref.read(assetPortfolioControllerProvider.notifier).markHoldingSold(id);
ScaffoldMessenger.of(
context,
).showSnackBar(const SnackBar(content: Text('已标记卖出 / 转赠')));
Navigator.of(context).pop();
}
Widget _buildImageSection(
BuildContext context,
GoldAssetHolding holding,
) {
final images = holding.images;
return PrototypeCard(
padding: const EdgeInsets.fromLTRB(16, 16, 16, 16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'凭证照片',
style: TextStyle(fontSize: 13, color: Color(0xFF8A8780)),
),
const SizedBox(height: 12),
if (images.isEmpty)
const Text(
'暂无凭证照片,可在添加资产时上传发票、证书或实物照片。',
style: TextStyle(fontSize: 12, color: Color(0xFFB3AFA5)),
)
else
Wrap(
spacing: 8,
runSpacing: 8,
children: [
for (var index = 0; index < images.length; index++)
_buildDetailImageTile(
context,
holding,
images[index],
index,
),
],
),
],
),
);
}
Widget _buildDetailImageTile(
BuildContext context,
GoldAssetHolding holding,
AssetImage image,
int index,
) {
return GestureDetector(
onTap: () => _openImagePreview(context, holding.images, index),
child: ClipRRect(
borderRadius: BorderRadius.circular(12),
child: Image.file(
File(image.localPath),
width: 84,
height: 84,
fit: BoxFit.cover,
),
),
);
}
void _openImagePreview(
BuildContext context,
List<AssetImage> images,
int initialIndex,
) {
Navigator.of(context).push(
MaterialPageRoute<void>(
builder: (_) => AssetImagePreviewPage(
images: images,
initialIndex: initialIndex,
),
),
);
}
}
class _ActionMenuTile extends StatelessWidget {
const _ActionMenuTile({
required this.icon,
required this.label,
required this.onTap,
this.iconColor,
this.labelColor,
});
final IconData icon;
final String label;
final VoidCallback onTap;
final Color? iconColor;
final Color? labelColor;
@override
Widget build(BuildContext context) {
final cs = ShadTheme.of(context).colorScheme;
return InkWell(
onTap: onTap,
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 16),
child: Row(
children: [
Icon(icon, size: 20, color: iconColor ?? const Color(0xFF8A8780)),
const SizedBox(width: 12),
Text(
label,
style: TextStyle(
fontSize: 15,
fontWeight: FontWeight.w600,
color: labelColor ?? cs.foreground,
),
),
],
),
),
);
}
}
class _InfoRow extends StatelessWidget {
const _InfoRow({required this.label, required this.value, this.valueColor});
final String label;
final String value;
final Color? valueColor;
@override
Widget build(BuildContext context) {
final cs = ShadTheme.of(context).colorScheme;
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 11),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
label,
style: TextStyle(fontSize: 13, color: cs.mutedForeground),
),
Text(
value,
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w600,
color: valueColor ?? cs.foreground,
),
),
],
),
);
}
}
class _ChangeChip extends StatelessWidget {
const _ChangeChip({
required this.amount,
required this.positive,
required this.upColor,
required this.downColor,
required this.upBackground,
required this.downBackground,
});
final double amount;
final bool positive;
final Color upColor;
final Color downColor;
final Color upBackground;
final Color downBackground;
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
decoration: BoxDecoration(
color: positive ? upBackground : downBackground,
borderRadius: BorderRadius.circular(999),
),
child: Text(
'${positive ? '↑' : '↓'}${formatCny(amount.abs())} · ${positive ? '+' : '-'}${amount.abs().toStringAsFixed(2)}',
style: TextStyle(
fontSize: 13,
fontWeight: FontWeight.w600,
color: positive ? upColor : downColor,
),
),
);
}
}
class _FieldRow extends StatelessWidget {
const _FieldRow({required this.label, required this.child});
final String label;
final Widget child;
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.fromLTRB(14, 12, 14, 12),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
border: Border.all(color: const Color(0xFFECEAE3), width: 0.5),
),
child: Row(
children: [
Text(
label,
style: const TextStyle(fontSize: 13, color: Color(0xFF8A8780)),
),
const SizedBox(width: 10),
Expanded(child: child),
],
),
);
}
}
String _dateLabel(DateTime? value) {
if (value == null) return '未填';
return '${value.year}-${value.month.toString().padLeft(2, '0')}-${value.day.toString().padLeft(2, '0')}';
}
String _signedCny(double value) {
final sign = value >= 0 ? '+' : '-';
return '$sign${formatCny(value.abs())}';
}