profile_page.dart 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335
  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:tdesign_flutter/tdesign_flutter.dart';
  5. import '../../core/i18n/app_localizations.dart';
  6. import '../../core/i18n/locale_provider.dart';
  7. import '../../core/theme/theme_mode_provider.dart';
  8. import '../../core/auth/role_provider.dart';
  9. import '../../shared/widgets/profile_menu_item.dart';
  10. import '../../shared/widgets/nav_bar_config.dart';
  11. import '../../core/theme/app_colors.dart';
  12. import '../../core/theme/app_colors_extension.dart';
  13. class ProfilePage extends ConsumerWidget {
  14. const ProfilePage({super.key});
  15. @override
  16. Widget build(BuildContext context, WidgetRef ref) {
  17. final l10n = AppLocalizations.of(context);
  18. final location = GoRouterState.of(context).uri.toString();
  19. final currentLocale = ref.watch(localeProvider);
  20. final themeMode = ref.watch(themeModeProvider);
  21. final isDark = themeMode == ThemeMode.dark;
  22. final currentRole = ref.watch(currentRoleProvider);
  23. final isAdmin = currentRole == 'admin';
  24. if (location.startsWith('/profile')) {
  25. setNavBarTitle(context, ref, NavBarConfig(
  26. title: l10n.get('tabProfile'),
  27. showBack: true,
  28. leadingIcon: Icons.close,
  29. ));
  30. }
  31. return SingleChildScrollView(
  32. physics: const AlwaysScrollableScrollPhysics(),
  33. child: Column(
  34. children: [
  35. const SizedBox(height: 16),
  36. _buildUserInfoCard(context, l10n),
  37. const SizedBox(height: 16),
  38. // 功能列表
  39. Padding(
  40. padding: const EdgeInsets.symmetric(horizontal: 16),
  41. child: Column(
  42. children: [
  43. // ── 角色切换(测试用)──
  44. ProfileMenuItem(
  45. icon: Icons.people,
  46. label: '角色切换',
  47. trailing: _roleName(currentRole),
  48. onTap: () => _showRoleSheet(context, ref, currentRole),
  49. ),
  50. const SizedBox(height: 8),
  51. // ── 语言设置 ──
  52. ProfileMenuItem(
  53. icon: Icons.language,
  54. label: l10n.get('language'),
  55. trailing: _localeName(currentLocale),
  56. onTap: () => _showLanguageSheet(context, ref, currentLocale),
  57. ),
  58. const SizedBox(height: 8),
  59. // ── 深色模式 ──
  60. ProfileMenuItem(
  61. icon: Icons.dark_mode,
  62. label: l10n.get('darkMode'),
  63. trailingWidget: TDSwitch(
  64. isOn: isDark,
  65. onChanged: (v) {
  66. ref.read(themeModeProvider.notifier).toggle();
  67. return v;
  68. },
  69. ),
  70. ),
  71. const SizedBox(height: 8),
  72. if (isAdmin) ...[
  73. ProfileMenuItem(
  74. icon: Icons.admin_panel_settings,
  75. label: '权限管理',
  76. onTap: () => context.push('/admin/permissions'),
  77. ),
  78. const SizedBox(height: 8),
  79. ],
  80. // ── 关于 ──
  81. ProfileMenuItem(
  82. icon: Icons.info_outline,
  83. label: l10n.get('about'),
  84. onTap: () => _showAboutDialog(context, l10n),
  85. ),
  86. ],
  87. ),
  88. ),
  89. const SizedBox(height: 8),
  90. TDFooter(TDFooterType.text, text: l10n.get('version')),
  91. ],
  92. ),
  93. );
  94. }
  95. Widget _buildUserInfoCard(BuildContext context, AppLocalizations l10n) {
  96. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  97. return Container(
  98. margin: const EdgeInsets.symmetric(horizontal: 16),
  99. padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 24),
  100. decoration: BoxDecoration(
  101. color: colors.bgCard,
  102. borderRadius: BorderRadius.circular(12),
  103. ),
  104. child: Row(
  105. children: [
  106. // 头像 - 点击更换占位
  107. GestureDetector(
  108. onTap: () {
  109. TDToast.showText(
  110. '头像更换功能(占位)',
  111. context: context,
  112. duration: Duration(seconds: 2),
  113. );
  114. },
  115. child: Container(
  116. width: 64,
  117. height: 64,
  118. decoration: BoxDecoration(
  119. color: colors.primaryLight,
  120. shape: BoxShape.circle,
  121. ),
  122. child: Center(
  123. child: Text(
  124. '张',
  125. style: TextStyle(
  126. fontSize: 28,
  127. fontWeight: FontWeight.w700,
  128. color: colors.primary,
  129. ),
  130. ),
  131. ),
  132. ),
  133. ),
  134. const SizedBox(width: 16),
  135. // 用户信息
  136. Expanded(
  137. child: Column(
  138. crossAxisAlignment: CrossAxisAlignment.start,
  139. children: [
  140. Text(
  141. l10n.get('userName'),
  142. style: TextStyle(
  143. fontSize: AppFontSizes.title,
  144. fontWeight: FontWeight.w600,
  145. color: colors.textPrimary,
  146. ),
  147. ),
  148. const SizedBox(height: AppSpacing.xs),
  149. Text(
  150. l10n.get('salesDepartment'),
  151. style: TextStyle(
  152. fontSize: AppFontSizes.body,
  153. color: colors.textSecondary,
  154. ),
  155. ),
  156. const SizedBox(height: 2),
  157. Text(
  158. '销售经理',
  159. style: TextStyle(fontSize: 12, color: colors.textPlaceholder),
  160. ),
  161. ],
  162. ),
  163. ),
  164. // 箭头
  165. Icon(Icons.chevron_right, size: 16, color: colors.textPlaceholder),
  166. ],
  167. ),
  168. );
  169. }
  170. String _localeName(Locale locale) {
  171. if (locale.languageCode == 'zh' && locale.countryCode == 'TW') {
  172. return '繁體中文';
  173. }
  174. if (locale.languageCode == 'en') {
  175. return 'English';
  176. }
  177. return '简体中文';
  178. }
  179. String _roleName(String role) {
  180. for (final (value, label) in roleOptions) {
  181. if (value == role) return label;
  182. }
  183. return role;
  184. }
  185. void _showRoleSheet(
  186. BuildContext context,
  187. WidgetRef ref,
  188. String currentRole,
  189. ) {
  190. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  191. TDActionSheet.showListActionSheet(
  192. context,
  193. showCancel: false,
  194. useSafeArea: false,
  195. items: roleOptions.map((r) {
  196. final isSelected = r.$1 == currentRole;
  197. return TDActionSheetItem(
  198. label: isSelected ? '${r.$2} ✓' : r.$2,
  199. textStyle: TextStyle(
  200. color: isSelected ? colors.primary : colors.textPrimary,
  201. fontWeight: isSelected ? FontWeight.w600 : FontWeight.normal,
  202. ),
  203. );
  204. }).toList(),
  205. onSelected: (item, index) {
  206. ref.read(currentRoleProvider.notifier).state = roleOptions[index].$1;
  207. },
  208. );
  209. }
  210. void _showLanguageSheet(
  211. BuildContext context,
  212. WidgetRef ref,
  213. Locale currentLocale,
  214. ) {
  215. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  216. final languages = [
  217. (label: '简体中文', locale: const Locale('zh', 'CN')),
  218. (label: 'English', locale: const Locale('en')),
  219. (label: '繁體中文', locale: const Locale('zh', 'TW')),
  220. ];
  221. TDActionSheet.showListActionSheet(
  222. context,
  223. showCancel: false,
  224. useSafeArea: false,
  225. items: languages.map((lang) {
  226. final isSelected =
  227. lang.locale.languageCode == currentLocale.languageCode &&
  228. lang.locale.countryCode == currentLocale.countryCode;
  229. return TDActionSheetItem(
  230. label: isSelected ? '${lang.label} ✓' : lang.label,
  231. textStyle: TextStyle(
  232. color: isSelected ? colors.primary : colors.textPrimary,
  233. fontWeight: isSelected ? FontWeight.w600 : FontWeight.normal,
  234. ),
  235. );
  236. }).toList(),
  237. onSelected: (item, index) {
  238. ref.read(localeProvider.notifier).setLocale(languages[index].locale);
  239. },
  240. );
  241. }
  242. void _showAboutDialog(BuildContext context, AppLocalizations l10n) {
  243. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  244. showGeneralDialog(
  245. context: context,
  246. pageBuilder:
  247. (
  248. BuildContext buildContext,
  249. Animation<double> animation,
  250. Animation<double> secondaryAnimation,
  251. ) {
  252. return TDConfirmDialog(
  253. title: l10n.get('about'),
  254. titleColor: colors.textPrimary,
  255. contentWidget: Column(
  256. mainAxisSize: MainAxisSize.min,
  257. crossAxisAlignment: CrossAxisAlignment.start,
  258. children: [
  259. _aboutRow(
  260. l10n.get('version'),
  261. 'v1.0.0 (Build 20260601)',
  262. colors,
  263. ),
  264. const Divider(height: 24),
  265. GestureDetector(
  266. onTap: () {
  267. Navigator.of(buildContext).pop();
  268. TDToast.showText(
  269. '用户协议(占位)',
  270. context: context,
  271. duration: Duration(seconds: 2),
  272. );
  273. },
  274. child: Text(
  275. '用户协议',
  276. style: TextStyle(fontSize: 14, color: colors.primary),
  277. ),
  278. ),
  279. const SizedBox(height: 12),
  280. GestureDetector(
  281. onTap: () {
  282. Navigator.of(buildContext).pop();
  283. TDToast.showText(
  284. '隐私政策(占位)',
  285. context: context,
  286. duration: Duration(seconds: 2),
  287. );
  288. },
  289. child: Text(
  290. '隐私政策',
  291. style: TextStyle(fontSize: 14, color: colors.primary),
  292. ),
  293. ),
  294. ],
  295. ),
  296. buttonStyle: TDDialogButtonStyle.text,
  297. buttonText: l10n.get('close'),
  298. buttonTextColor: colors.primary,
  299. action: () => Navigator.of(buildContext).pop(),
  300. );
  301. },
  302. );
  303. }
  304. Widget _aboutRow(String label, String value, AppColorsExtension colors) {
  305. return Row(
  306. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  307. children: [
  308. Text(
  309. label,
  310. style: TextStyle(fontSize: 14, color: colors.textSecondary),
  311. ),
  312. Flexible(
  313. child: Text(
  314. value,
  315. textAlign: TextAlign.right,
  316. softWrap: true,
  317. style: TextStyle(fontSize: 14, color: colors.textPrimary),
  318. ),
  319. ),
  320. ],
  321. );
  322. }
  323. }