staking_team_screen.dart 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379
  1. import 'package:flutter/material.dart';
  2. import 'package:flutter_riverpod/flutter_riverpod.dart';
  3. import 'package:go_router/go_router.dart';
  4. import 'package:intl/intl.dart';
  5. import '../../../core/l10n/app_localizations.dart';
  6. import '../../../core/theme/app_colors.dart';
  7. import '../../../core/utils/staking_node_level.dart';
  8. import '../../../data/models/finance/staking_team_overview.dart';
  9. import '../../../providers/auth_provider.dart';
  10. import '../../../providers/staking_team_provider.dart';
  11. bool _isDark(BuildContext context) =>
  12. Theme.of(context).brightness == Brightness.dark;
  13. Color _pageBg(BuildContext context) =>
  14. _isDark(context) ? AppColors.darkBg : Theme.of(context).colorScheme.surface;
  15. Color _primaryText(BuildContext context) =>
  16. _isDark(context) ? Colors.white : Theme.of(context).colorScheme.onSurface;
  17. Color _secondaryText(BuildContext context) => _primaryText(context).withAlpha(160);
  18. String _fmtNum(num value, {int maxFrac = 2}) {
  19. if (!value.isFinite) {
  20. return '0';
  21. }
  22. return NumberFormat('#,##0.${'#' * maxFrac}', 'en_US').format(value);
  23. }
  24. /// 我的团队页(对齐 Web `StakingTeamView.vue`)
  25. class StakingTeamScreen extends ConsumerStatefulWidget {
  26. const StakingTeamScreen({super.key});
  27. @override
  28. ConsumerState<StakingTeamScreen> createState() => _StakingTeamScreenState();
  29. }
  30. class _StakingTeamScreenState extends ConsumerState<StakingTeamScreen> {
  31. @override
  32. void initState() {
  33. super.initState();
  34. Future.microtask(() {
  35. if (!ref.read(isLoggedInProvider)) {
  36. return;
  37. }
  38. ref.read(stakingTeamProvider.notifier).init();
  39. });
  40. }
  41. @override
  42. Widget build(BuildContext context) {
  43. final l10n = AppLocalizations.of(context)!;
  44. final isLoggedIn = ref.watch(isLoggedInProvider);
  45. final state = ref.watch(stakingTeamProvider);
  46. if (!isLoggedIn) {
  47. return Scaffold(
  48. backgroundColor: _pageBg(context),
  49. appBar: _buildAppBar(context, l10n),
  50. body: Center(
  51. child: TextButton(
  52. onPressed: () => context.push(
  53. '/login?redirect=${Uri.encodeComponent('/finance/team')}',
  54. ),
  55. child: Text(l10n.login),
  56. ),
  57. ),
  58. );
  59. }
  60. return Scaffold(
  61. backgroundColor: _pageBg(context),
  62. appBar: _buildAppBar(context, l10n),
  63. body: state.isLoading
  64. ? const Center(child: CircularProgressIndicator())
  65. : state.errorMessage != null && state.overview == null
  66. ? _ErrorBody(
  67. message: state.errorMessage!,
  68. onRetry: () =>
  69. ref.read(stakingTeamProvider.notifier).init(),
  70. )
  71. : _TeamBody(state: state),
  72. );
  73. }
  74. PreferredSizeWidget _buildAppBar(
  75. BuildContext context,
  76. AppLocalizations l10n,
  77. ) {
  78. return AppBar(
  79. backgroundColor: Colors.transparent,
  80. foregroundColor: _primaryText(context),
  81. elevation: 0,
  82. centerTitle: true,
  83. leading: IconButton(
  84. icon: const Icon(Icons.arrow_back_ios_new, size: 20),
  85. onPressed: () {
  86. if (context.canPop()) {
  87. context.pop();
  88. } else {
  89. context.go('/finance/ido');
  90. }
  91. },
  92. ),
  93. title: Text(
  94. l10n.financeMyTeam,
  95. style: TextStyle(
  96. color: _primaryText(context),
  97. fontSize: 18,
  98. fontWeight: FontWeight.w600,
  99. ),
  100. ),
  101. );
  102. }
  103. }
  104. class _ErrorBody extends StatelessWidget {
  105. const _ErrorBody({required this.message, required this.onRetry});
  106. final String message;
  107. final VoidCallback onRetry;
  108. @override
  109. Widget build(BuildContext context) {
  110. final l10n = AppLocalizations.of(context)!;
  111. return Center(
  112. child: Padding(
  113. padding: const EdgeInsets.all(24),
  114. child: Column(
  115. mainAxisSize: MainAxisSize.min,
  116. children: [
  117. Text(
  118. message,
  119. textAlign: TextAlign.center,
  120. style: TextStyle(color: _secondaryText(context)),
  121. ),
  122. const SizedBox(height: 16),
  123. OutlinedButton(
  124. onPressed: onRetry,
  125. style: OutlinedButton.styleFrom(
  126. foregroundColor: AppColors.brand,
  127. side: const BorderSide(color: AppColors.brand),
  128. ),
  129. child: Text(l10n.retry),
  130. ),
  131. ],
  132. ),
  133. ),
  134. );
  135. }
  136. }
  137. class _TeamBody extends ConsumerWidget {
  138. const _TeamBody({required this.state});
  139. final StakingTeamState state;
  140. @override
  141. Widget build(BuildContext context, WidgetRef ref) {
  142. final l10n = AppLocalizations.of(context)!;
  143. final overview = state.overview ?? const StakingTeamOverview();
  144. final statCards = [
  145. (l10n.financeDirectNumLabel, _fmtNum(overview.directNum, maxFrac: 0)),
  146. (l10n.financeTeamNumLabel, _fmtNum(overview.teamNum, maxFrac: 0)),
  147. (l10n.financeTeamPerformanceLabel, _fmtNum(overview.teamPerformance)),
  148. (l10n.financeTotalRevenueLabel, _fmtNum(overview.totalRevenue)),
  149. ];
  150. return ListView(
  151. padding: const EdgeInsets.fromLTRB(16, 8, 16, 32),
  152. children: [
  153. _NodeBanner(
  154. label: l10n.financeCurrentNodeLevel,
  155. value: stakingNodeLevelLabel(l10n, overview.nodeLevel),
  156. ),
  157. const SizedBox(height: 12),
  158. GridView.count(
  159. crossAxisCount: 2,
  160. shrinkWrap: true,
  161. physics: const NeverScrollableScrollPhysics(),
  162. mainAxisSpacing: 12,
  163. crossAxisSpacing: 12,
  164. childAspectRatio: 1.35,
  165. children: [
  166. for (final card in statCards)
  167. _StatCard(label: card.$1, value: card.$2),
  168. ],
  169. ),
  170. const SizedBox(height: 24),
  171. Text(
  172. l10n.financeDirectListTitle,
  173. style: TextStyle(
  174. color: _primaryText(context),
  175. fontSize: 18,
  176. fontWeight: FontWeight.w600,
  177. ),
  178. ),
  179. const SizedBox(height: 12),
  180. if (state.directList.isEmpty && !state.isLoadingMore)
  181. Padding(
  182. padding: const EdgeInsets.symmetric(vertical: 32),
  183. child: Center(
  184. child: Text(
  185. l10n.noData,
  186. style: TextStyle(
  187. color: _secondaryText(context),
  188. fontSize: 14,
  189. ),
  190. ),
  191. ),
  192. )
  193. else
  194. _DirectTable(members: state.directList),
  195. if (state.hasMore) ...[
  196. const SizedBox(height: 16),
  197. Center(
  198. child: OutlinedButton(
  199. onPressed: state.isLoadingMore
  200. ? null
  201. : () => ref.read(stakingTeamProvider.notifier).loadMore(),
  202. style: OutlinedButton.styleFrom(
  203. foregroundColor: _secondaryText(context),
  204. side: BorderSide(color: _primaryText(context).withAlpha(40)),
  205. shape: const StadiumBorder(),
  206. ),
  207. child: state.isLoadingMore
  208. ? const SizedBox(
  209. width: 18,
  210. height: 18,
  211. child: CircularProgressIndicator(strokeWidth: 2),
  212. )
  213. : Text(l10n.financeTeamLoadMore),
  214. ),
  215. ),
  216. ],
  217. ],
  218. );
  219. }
  220. }
  221. class _NodeBanner extends StatelessWidget {
  222. const _NodeBanner({required this.label, required this.value});
  223. final String label;
  224. final String value;
  225. @override
  226. Widget build(BuildContext context) {
  227. return Container(
  228. width: double.infinity,
  229. padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 18),
  230. decoration: BoxDecoration(
  231. borderRadius: BorderRadius.circular(12),
  232. gradient: const LinearGradient(
  233. colors: [Color(0xFFC9A227), Color(0xFFE8C547), Color(0xFFC9A227)],
  234. ),
  235. ),
  236. child: Row(
  237. children: [
  238. Expanded(
  239. child: Text(
  240. label,
  241. style: const TextStyle(
  242. color: Color(0xFF1A1408),
  243. fontSize: 15,
  244. fontWeight: FontWeight.w500,
  245. ),
  246. ),
  247. ),
  248. Text(
  249. value,
  250. style: const TextStyle(
  251. color: Color(0xFF1A1408),
  252. fontSize: 16,
  253. fontWeight: FontWeight.w700,
  254. ),
  255. ),
  256. ],
  257. ),
  258. );
  259. }
  260. }
  261. class _StatCard extends StatelessWidget {
  262. const _StatCard({required this.label, required this.value});
  263. final String label;
  264. final String value;
  265. @override
  266. Widget build(BuildContext context) {
  267. final bg = _isDark(context)
  268. ? AppColors.darkBgSecondary
  269. : Theme.of(context).colorScheme.surfaceContainerHighest;
  270. return Container(
  271. padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 16),
  272. decoration: BoxDecoration(
  273. color: bg,
  274. borderRadius: BorderRadius.circular(12),
  275. ),
  276. child: Column(
  277. mainAxisAlignment: MainAxisAlignment.center,
  278. children: [
  279. Text(
  280. value,
  281. style: const TextStyle(
  282. color: AppColors.brand,
  283. fontSize: 22,
  284. fontWeight: FontWeight.w700,
  285. fontFeatures: [FontFeature.tabularFigures()],
  286. ),
  287. ),
  288. const SizedBox(height: 8),
  289. Text(
  290. label,
  291. textAlign: TextAlign.center,
  292. style: TextStyle(
  293. color: _secondaryText(context),
  294. fontSize: 13,
  295. height: 1.35,
  296. ),
  297. ),
  298. ],
  299. ),
  300. );
  301. }
  302. }
  303. class _DirectTable extends StatelessWidget {
  304. const _DirectTable({required this.members});
  305. final List<StakingDirectMember> members;
  306. @override
  307. Widget build(BuildContext context) {
  308. final l10n = AppLocalizations.of(context)!;
  309. return SingleChildScrollView(
  310. scrollDirection: Axis.horizontal,
  311. child: DataTable(
  312. headingTextStyle: TextStyle(
  313. color: _secondaryText(context),
  314. fontSize: 12,
  315. fontWeight: FontWeight.w400,
  316. ),
  317. dataTextStyle: TextStyle(
  318. color: _primaryText(context),
  319. fontSize: 13,
  320. ),
  321. columns: [
  322. DataColumn(label: Text(l10n.financeDirectAddress)),
  323. DataColumn(label: Text(l10n.financeLevelCol)),
  324. DataColumn(label: Text(l10n.financeBuyAmountCol)),
  325. DataColumn(label: Text(l10n.financeMyRewardCol)),
  326. ],
  327. rows: [
  328. for (final row in members)
  329. DataRow(
  330. cells: [
  331. DataCell(
  332. SizedBox(
  333. width: 120,
  334. child: Text(
  335. row.directAddress.isEmpty ? '—' : row.directAddress,
  336. maxLines: 1,
  337. overflow: TextOverflow.ellipsis,
  338. ),
  339. ),
  340. ),
  341. DataCell(Text(stakingNodeLevelLabel(l10n, row.level))),
  342. DataCell(Text(_fmtNum(row.buyAmount))),
  343. DataCell(Text(_fmtNum(row.reward))),
  344. ],
  345. ),
  346. ],
  347. ),
  348. );
  349. }
  350. }