406 lines
11 KiB
Dart
406 lines
11 KiB
Dart
|
import 'package:flutter/material.dart';
|
|||
|
|
import 'package:provider/provider.dart';
|
|||
|
|
import 'package:sales_chat/providers/stats_provider.dart';
|
|||
|
|
import 'package:sales_chat/widgets/user_avatar.dart';
|
|||
|
|
import 'package:sales_chat/theme/app_theme.dart';
|
|||
|
|
|
|||
|
|
/// 看板页面 —— Twitter 风格
|
|||
|
|
class DashboardPage extends StatefulWidget {
|
|||
|
|
const DashboardPage({super.key});
|
|||
|
|
|
|||
|
|
@override
|
|||
|
|
State<DashboardPage> createState() => _DashboardPageState();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
class _DashboardPageState extends State<DashboardPage> {
|
|||
|
|
@override
|
|||
|
|
void initState() {
|
|||
|
|
super.initState();
|
|||
|
|
WidgetsBinding.instance.addPostFrameCallback((_) => _loadData());
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
Future<void> _loadData() async {
|
|||
|
|
final statsProvider = context.read<StatsProvider>();
|
|||
|
|
await statsProvider.loadMyStats();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
@override
|
|||
|
|
Widget build(BuildContext context) {
|
|||
|
|
return Scaffold(
|
|||
|
|
appBar: AppBar(
|
|||
|
|
title: const Text('看板'),
|
|||
|
|
actions: [
|
|||
|
|
IconButton(
|
|||
|
|
icon: const Icon(Icons.refresh),
|
|||
|
|
onPressed: _loadData,
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
body: Consumer<StatsProvider>(
|
|||
|
|
builder: (context, statsProvider, _) {
|
|||
|
|
if (statsProvider.isLoading && statsProvider.myStats == null) {
|
|||
|
|
return const Center(child: CircularProgressIndicator());
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
final stats = statsProvider.myStats;
|
|||
|
|
|
|||
|
|
return RefreshIndicator(
|
|||
|
|
onRefresh: _loadData,
|
|||
|
|
child: SingleChildScrollView(
|
|||
|
|
physics: const AlwaysScrollableScrollPhysics(),
|
|||
|
|
child: Column(
|
|||
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|||
|
|
children: [
|
|||
|
|
if (stats != null) _buildStatsOverview(context, stats),
|
|||
|
|
const SizedBox(height: 8),
|
|||
|
|
_buildTodayStats(context, stats),
|
|||
|
|
const SizedBox(height: 8),
|
|||
|
|
_buildRankingSection(context, statsProvider),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
);
|
|||
|
|
},
|
|||
|
|
),
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/// 统计概览 —— 卡片区块，2x2 网格
|
|||
|
|
Widget _buildStatsOverview(BuildContext context, dynamic myStats) {
|
|||
|
|
final total = myStats.total;
|
|||
|
|
|
|||
|
|
return Container(
|
|||
|
|
width: double.infinity,
|
|||
|
|
color: AppTheme.cardBackground,
|
|||
|
|
padding: const EdgeInsets.all(16),
|
|||
|
|
child: Column(
|
|||
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|||
|
|
children: [
|
|||
|
|
const Text(
|
|||
|
|
'我的统计',
|
|||
|
|
style: TextStyle(
|
|||
|
|
fontSize: 15,
|
|||
|
|
fontWeight: FontWeight.w600,
|
|||
|
|
color: AppTheme.textPrimary,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
const SizedBox(height: 16),
|
|||
|
|
GridView.count(
|
|||
|
|
shrinkWrap: true,
|
|||
|
|
physics: const NeverScrollableScrollPhysics(),
|
|||
|
|
crossAxisCount: 2,
|
|||
|
|
mainAxisSpacing: 16,
|
|||
|
|
crossAxisSpacing: 16,
|
|||
|
|
childAspectRatio: 2.0,
|
|||
|
|
children: [
|
|||
|
|
_StatGridItem(
|
|||
|
|
value: _formatNumber(total.totalInvites),
|
|||
|
|
label: '总邀请数',
|
|||
|
|
icon: Icons.card_giftcard_outlined,
|
|||
|
|
color: AppTheme.primaryColor,
|
|||
|
|
),
|
|||
|
|
_StatGridItem(
|
|||
|
|
value: _formatNumber(total.totalJoins),
|
|||
|
|
label: '总加入数',
|
|||
|
|
icon: Icons.person_add_outlined,
|
|||
|
|
color: AppTheme.successColor,
|
|||
|
|
),
|
|||
|
|
_StatGridItem(
|
|||
|
|
value: '+${myStats.today.invitesCreated}',
|
|||
|
|
label: '今日邀请',
|
|||
|
|
icon: Icons.add_circle_outline,
|
|||
|
|
color: AppTheme.warningColor,
|
|||
|
|
),
|
|||
|
|
_StatGridItem(
|
|||
|
|
value: '+${myStats.today.joins}',
|
|||
|
|
label: '今日加入',
|
|||
|
|
icon: Icons.people,
|
|||
|
|
color: AppTheme.infoColor,
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/// 今日统计 —— 独立卡片区块
|
|||
|
|
Widget _buildTodayStats(BuildContext context, dynamic myStats) {
|
|||
|
|
if (myStats == null) return const SizedBox.shrink();
|
|||
|
|
final today = myStats.today;
|
|||
|
|
|
|||
|
|
return Container(
|
|||
|
|
width: double.infinity,
|
|||
|
|
color: AppTheme.cardBackground,
|
|||
|
|
padding: const EdgeInsets.all(16),
|
|||
|
|
child: Column(
|
|||
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|||
|
|
children: [
|
|||
|
|
const Text(
|
|||
|
|
'今日数据',
|
|||
|
|
style: TextStyle(
|
|||
|
|
fontSize: 15,
|
|||
|
|
fontWeight: FontWeight.w600,
|
|||
|
|
color: AppTheme.textPrimary,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
const SizedBox(height: 16),
|
|||
|
|
Row(
|
|||
|
|
children: [
|
|||
|
|
Expanded(
|
|||
|
|
child: _TodayStatItem(
|
|||
|
|
value: '${today.invitesCreated}',
|
|||
|
|
label: '新建邀请',
|
|||
|
|
icon: Icons.add_circle_outline,
|
|||
|
|
color: AppTheme.primaryColor,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
Container(
|
|||
|
|
width: 0.5,
|
|||
|
|
height: 40,
|
|||
|
|
color: AppTheme.dividerColor,
|
|||
|
|
),
|
|||
|
|
Expanded(
|
|||
|
|
child: _TodayStatItem(
|
|||
|
|
value: '${today.joins}',
|
|||
|
|
label: '新加入',
|
|||
|
|
icon: Icons.person_add,
|
|||
|
|
color: AppTheme.successColor,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/// 排行榜区块
|
|||
|
|
Widget _buildRankingSection(BuildContext context, StatsProvider provider) {
|
|||
|
|
return Container(
|
|||
|
|
color: AppTheme.cardBackground,
|
|||
|
|
child: Column(
|
|||
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|||
|
|
children: [
|
|||
|
|
// 标题行
|
|||
|
|
Padding(
|
|||
|
|
padding: const EdgeInsets.fromLTRB(16, 16, 16, 0),
|
|||
|
|
child: Row(
|
|||
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|||
|
|
children: [
|
|||
|
|
const Text(
|
|||
|
|
'排行榜',
|
|||
|
|
style: TextStyle(
|
|||
|
|
fontSize: 15,
|
|||
|
|
fontWeight: FontWeight.w600,
|
|||
|
|
color: AppTheme.textPrimary,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
GestureDetector(
|
|||
|
|
onTap: () => provider.loadRanking(),
|
|||
|
|
child: const Text(
|
|||
|
|
'加载排行',
|
|||
|
|
style: TextStyle(
|
|||
|
|
fontSize: 13,
|
|||
|
|
color: AppTheme.primaryColor,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
|
|||
|
|
if (provider.ranking.isEmpty)
|
|||
|
|
Padding(
|
|||
|
|
padding: const EdgeInsets.all(24),
|
|||
|
|
child: Center(
|
|||
|
|
child: Text(
|
|||
|
|
'暂无排行数据',
|
|||
|
|
style: TextStyle(color: AppTheme.textSecondary, fontSize: 14),
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
)
|
|||
|
|
else
|
|||
|
|
..._buildRankingItems(provider),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/// 构建排行列表项（带分隔线）
|
|||
|
|
List<Widget> _buildRankingItems(StatsProvider provider) {
|
|||
|
|
final rankings = provider.ranking.take(10).toList();
|
|||
|
|
final items = <Widget>[];
|
|||
|
|
|
|||
|
|
for (int i = 0; i < rankings.length; i++) {
|
|||
|
|
final entry = rankings[i];
|
|||
|
|
items.add(Padding(
|
|||
|
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
|||
|
|
child: Row(
|
|||
|
|
children: [
|
|||
|
|
// 排名序号
|
|||
|
|
SizedBox(
|
|||
|
|
width: 28,
|
|||
|
|
child: Text(
|
|||
|
|
'${entry.rank}',
|
|||
|
|
style: TextStyle(
|
|||
|
|
fontSize: 16,
|
|||
|
|
fontWeight: i < 3 ? FontWeight.bold : FontWeight.w500,
|
|||
|
|
color: i < 3
|
|||
|
|
? [const Color(0xFFFFC300), const Color(0xFFC0C0C0), const Color(0xFFCD7F32)][i]
|
|||
|
|
: AppTheme.textHint,
|
|||
|
|
),
|
|||
|
|
textAlign: TextAlign.center,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
const SizedBox(width: 12),
|
|||
|
|
// 头像
|
|||
|
|
UserAvatar(
|
|||
|
|
displayName: entry.displayName,
|
|||
|
|
radius: 16,
|
|||
|
|
),
|
|||
|
|
const SizedBox(width: 12),
|
|||
|
|
// 名字
|
|||
|
|
Expanded(
|
|||
|
|
child: Text(
|
|||
|
|
entry.displayName,
|
|||
|
|
style: const TextStyle(
|
|||
|
|
fontSize: 15,
|
|||
|
|
color: AppTheme.textPrimary,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
// 加入数
|
|||
|
|
Text(
|
|||
|
|
'${entry.totalJoins} 加入',
|
|||
|
|
style: const TextStyle(
|
|||
|
|
fontSize: 13,
|
|||
|
|
color: AppTheme.textSecondary,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
));
|
|||
|
|
|
|||
|
|
if (i < rankings.length - 1) {
|
|||
|
|
items.add(const Padding(
|
|||
|
|
padding: EdgeInsets.only(left: 56),
|
|||
|
|
child: Divider(height: 0.5, thickness: 0.5),
|
|||
|
|
));
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return items;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/// 格式化数字
|
|||
|
|
String _formatNumber(int number) {
|
|||
|
|
if (number >= 10000) {
|
|||
|
|
return '${(number / 10000).toStringAsFixed(1)}w';
|
|||
|
|
} else if (number >= 1000) {
|
|||
|
|
return '${(number / 1000).toStringAsFixed(1)}k';
|
|||
|
|
}
|
|||
|
|
return number.toString();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/// 统计网格项 —— 大数字 + 小标签 + 图标
|
|||
|
|
class _StatGridItem extends StatelessWidget {
|
|||
|
|
final String value;
|
|||
|
|
final String label;
|
|||
|
|
final IconData icon;
|
|||
|
|
final Color color;
|
|||
|
|
|
|||
|
|
const _StatGridItem({
|
|||
|
|
required this.value,
|
|||
|
|
required this.label,
|
|||
|
|
required this.icon,
|
|||
|
|
required this.color,
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
@override
|
|||
|
|
Widget build(BuildContext context) {
|
|||
|
|
return Container(
|
|||
|
|
padding: const EdgeInsets.all(12),
|
|||
|
|
decoration: BoxDecoration(
|
|||
|
|
color: color.withValues(alpha: 0.06),
|
|||
|
|
borderRadius: BorderRadius.circular(8),
|
|||
|
|
),
|
|||
|
|
child: Column(
|
|||
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|||
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|||
|
|
children: [
|
|||
|
|
Row(
|
|||
|
|
children: [
|
|||
|
|
Icon(icon, color: color, size: 18),
|
|||
|
|
const SizedBox(width: 6),
|
|||
|
|
Text(
|
|||
|
|
value,
|
|||
|
|
style: TextStyle(
|
|||
|
|
fontSize: 22,
|
|||
|
|
fontWeight: FontWeight.bold,
|
|||
|
|
color: AppTheme.textPrimary,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
const SizedBox(height: 4),
|
|||
|
|
Text(
|
|||
|
|
label,
|
|||
|
|
style: const TextStyle(
|
|||
|
|
fontSize: 12,
|
|||
|
|
color: AppTheme.textSecondary,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/// 今日统计项
|
|||
|
|
class _TodayStatItem extends StatelessWidget {
|
|||
|
|
final String value;
|
|||
|
|
final String label;
|
|||
|
|
final IconData icon;
|
|||
|
|
final Color color;
|
|||
|
|
|
|||
|
|
const _TodayStatItem({
|
|||
|
|
required this.value,
|
|||
|
|
required this.label,
|
|||
|
|
required this.icon,
|
|||
|
|
required this.color,
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
@override
|
|||
|
|
Widget build(BuildContext context) {
|
|||
|
|
return Column(
|
|||
|
|
children: [
|
|||
|
|
Row(
|
|||
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|||
|
|
children: [
|
|||
|
|
Icon(icon, color: color, size: 18),
|
|||
|
|
const SizedBox(width: 6),
|
|||
|
|
Text(
|
|||
|
|
value,
|
|||
|
|
style: const TextStyle(
|
|||
|
|
fontSize: 24,
|
|||
|
|
fontWeight: FontWeight.bold,
|
|||
|
|
color: AppTheme.textPrimary,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
const SizedBox(height: 4),
|
|||
|
|
Text(
|
|||
|
|
label,
|
|||
|
|
style: const TextStyle(
|
|||
|
|
fontSize: 12,
|
|||
|
|
color: AppTheme.textSecondary,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
}
|