273 lines
8.3 KiB
Dart
273 lines
8.3 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_bloc/flutter_bloc.dart';
|
|
import 'package:go_router/go_router.dart';
|
|
import '../../../../core/theme/design_tokens.dart';
|
|
import '../../../auth/presentation/bloc/auth_bloc.dart';
|
|
import '../../../auth/presentation/bloc/auth_event.dart';
|
|
import '../../../auth/presentation/bloc/auth_state.dart';
|
|
import '../widgets/account_section_card.dart';
|
|
import '../widgets/account_surface_scaffold.dart';
|
|
|
|
class AccountScreen extends StatelessWidget {
|
|
const AccountScreen({super.key});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return AccountSurfaceScaffold(
|
|
title: '我的账户',
|
|
subtitle: '管理资料信息与账户安全',
|
|
onBack: () => context.pop(),
|
|
body: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
|
children: [
|
|
_buildProfileHero(context),
|
|
const SizedBox(height: AppSpacing.lg),
|
|
_buildMenuCard(context),
|
|
const SizedBox(height: AppSpacing.lg),
|
|
_buildSecurityCard(context),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildProfileHero(BuildContext context) {
|
|
final authState = context.watch<AuthBloc>().state;
|
|
final email = authState is AuthAuthenticated ? authState.user.email : '';
|
|
final identity = email.isEmpty ? '当前登录账户' : email;
|
|
final badge = email.isEmpty ? 'A' : email.characters.first.toUpperCase();
|
|
|
|
return AccountSectionCard(
|
|
title: '账户概览',
|
|
description: '查看当前账户状态与基础身份信息',
|
|
backgroundColor: AppColors.surfaceInfoLight,
|
|
borderColor: AppColors.borderQuaternary,
|
|
child: Row(
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
Container(
|
|
width: 56,
|
|
height: 56,
|
|
decoration: BoxDecoration(
|
|
color: AppColors.white,
|
|
borderRadius: BorderRadius.circular(AppRadius.full),
|
|
border: Border.all(color: AppColors.borderQuaternary),
|
|
),
|
|
child: Center(
|
|
child: Text(
|
|
badge,
|
|
style: const TextStyle(
|
|
fontSize: 22,
|
|
fontWeight: FontWeight.w700,
|
|
color: AppColors.blue600,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(width: AppSpacing.md),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
identity,
|
|
style: const TextStyle(
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.w700,
|
|
color: AppColors.slate900,
|
|
),
|
|
overflow: TextOverflow.ellipsis,
|
|
),
|
|
const SizedBox(height: AppSpacing.xs),
|
|
const Text(
|
|
'账户状态正常,可安全管理资料与密码',
|
|
style: TextStyle(
|
|
fontSize: 13,
|
|
fontWeight: FontWeight.w500,
|
|
color: AppColors.slate500,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildMenuCard(BuildContext context) {
|
|
return AccountSectionCard(
|
|
title: '账户信息',
|
|
description: '编辑公开资料和登录信息',
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
|
children: [
|
|
_buildMenuItem(
|
|
icon: Icons.edit,
|
|
title: '编辑资料',
|
|
onTap: () => context.push('/edit-profile'),
|
|
),
|
|
_buildDivider(),
|
|
_buildMenuItem(
|
|
icon: Icons.lock,
|
|
title: '修改密码',
|
|
onTap: () => context.push('/change-password'),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildSecurityCard(BuildContext context) {
|
|
return AccountSectionCard(
|
|
title: '安全与会话',
|
|
description: '若为公共设备,请及时退出登录',
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
|
children: [
|
|
Container(
|
|
padding: const EdgeInsets.symmetric(
|
|
horizontal: AppSpacing.md,
|
|
vertical: AppSpacing.sm,
|
|
),
|
|
decoration: BoxDecoration(
|
|
color: AppColors.surfaceSecondary,
|
|
borderRadius: BorderRadius.circular(AppRadius.md),
|
|
border: Border.all(color: AppColors.borderSecondary),
|
|
),
|
|
child: const Row(
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
Icon(
|
|
Icons.shield_outlined,
|
|
size: 16,
|
|
color: AppColors.slate500,
|
|
),
|
|
SizedBox(width: AppSpacing.xs),
|
|
Expanded(
|
|
child: Text(
|
|
'退出后需要重新登录才能继续使用。',
|
|
style: TextStyle(
|
|
fontSize: 12,
|
|
color: AppColors.slate500,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(height: AppSpacing.md),
|
|
_buildLogoutButton(context),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildMenuItem({
|
|
required IconData icon,
|
|
required String title,
|
|
required VoidCallback onTap,
|
|
}) {
|
|
return GestureDetector(
|
|
onTap: onTap,
|
|
behavior: HitTestBehavior.opaque,
|
|
child: Container(
|
|
height: AppSpacing.xxl,
|
|
padding: const EdgeInsets.symmetric(horizontal: AppSpacing.md),
|
|
child: Row(
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Row(
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
Icon(icon, size: 20, color: AppColors.slate500),
|
|
const SizedBox(width: AppSpacing.md),
|
|
Text(
|
|
title,
|
|
style: const TextStyle(
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.w500,
|
|
color: AppColors.slate900,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
const Icon(
|
|
Icons.chevron_right,
|
|
size: 18,
|
|
color: AppColors.slate400,
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildDivider() {
|
|
return Container(
|
|
height: 1,
|
|
margin: const EdgeInsets.symmetric(horizontal: AppSpacing.md),
|
|
color: AppColors.borderTertiary,
|
|
);
|
|
}
|
|
|
|
Widget _buildLogoutButton(BuildContext context) {
|
|
return GestureDetector(
|
|
onTap: () => _showLogoutDialog(context),
|
|
child: Container(
|
|
width: double.infinity,
|
|
height: 52,
|
|
decoration: BoxDecoration(
|
|
color: AppColors.white,
|
|
borderRadius: BorderRadius.circular(AppRadius.lg),
|
|
border: Border.all(color: AppColors.feedbackErrorBorder),
|
|
),
|
|
child: const Center(
|
|
child: Text(
|
|
'退出登录',
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.w600,
|
|
color: AppColors.feedbackErrorText,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
void _showLogoutDialog(BuildContext context) {
|
|
showDialog(
|
|
context: context,
|
|
builder: (dialogContext) => AlertDialog(
|
|
title: const Text('退出登录'),
|
|
content: const Text('确定要退出当前账户吗?'),
|
|
actions: [
|
|
TextButton(
|
|
onPressed: () => Navigator.of(dialogContext).pop(),
|
|
child: const Text('取消'),
|
|
),
|
|
TextButton(
|
|
onPressed: () async {
|
|
Navigator.of(dialogContext).pop();
|
|
final authBloc = context.read<AuthBloc>();
|
|
authBloc.add(AuthLoggedOut());
|
|
await authBloc.stream.firstWhere(
|
|
(state) => state is AuthUnauthenticated,
|
|
);
|
|
if (context.mounted) {
|
|
context.go('/');
|
|
}
|
|
},
|
|
child: const Text(
|
|
'退出',
|
|
style: TextStyle(color: AppColors.feedbackErrorText),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|