message_list_page.dart 8.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244
  1. import 'package:easy_refresh/easy_refresh.dart';
  2. import 'package:flutter/material.dart';
  3. import 'package:flutter_riverpod/flutter_riverpod.dart';
  4. import 'package:go_router/go_router.dart';
  5. import 'package:tdesign_flutter/tdesign_flutter.dart';
  6. import '../../shared/widgets/empty_state.dart';
  7. import '../shell/nav_bar_config.dart';
  8. import '../../core/i18n/app_localizations.dart';
  9. import '../../shared/widgets/loading_widget.dart';
  10. import '../../shared/widgets/message_item.dart';
  11. import 'message_controller.dart';
  12. import 'message_model.dart';
  13. import '../../core/theme/app_colors.dart';
  14. import '../../core/theme/app_colors_extension.dart';
  15. /// 消息通知聚合页
  16. ///
  17. /// 展示 5 种消息类型:
  18. /// - 审批待办(📋)→ 详情页 + 审批操作栏
  19. /// - 审批结果(✅/❌)→ 详情查看结果
  20. /// - 撤回通知(↩)→ 消息列表
  21. /// - 系统公告(📢)→ 公告详情
  22. /// - 过期提醒(⏰)→ 对应详情页
  23. ///
  24. /// 左滑操作:标记已读(蓝)+ 删除(红)。已读消息不可左滑。
  25. class MessageListPage extends ConsumerWidget {
  26. const MessageListPage({super.key});
  27. @override
  28. Widget build(BuildContext context, WidgetRef ref) {
  29. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  30. final messagesAsync = ref.watch(messageListProvider);
  31. final unreadCount = ref.watch(unreadCountProvider);
  32. final location = GoRouterState.of(context).uri.toString();
  33. final l10n = AppLocalizations.of(context);
  34. if (location.startsWith('/messages')) {
  35. ref
  36. .read(navBarConfigProvider.notifier)
  37. .update(
  38. NavBarConfig(
  39. title: l10n.get('messageNotifications'),
  40. showBack: true,
  41. leadingIcon: Icons.close,
  42. // 仅在有未读时显示"全部已读"按钮
  43. showRight: unreadCount > 0,
  44. rightWidget: unreadCount > 0
  45. ? GestureDetector(
  46. onTap: () {
  47. TDMessage.showMessage(
  48. context: context,
  49. content: l10n.get('markAllRead'),
  50. theme: MessageTheme.success,
  51. icon: true,
  52. duration: 2000,
  53. );
  54. },
  55. child: Padding(
  56. padding: const EdgeInsets.symmetric(
  57. horizontal: 12,
  58. vertical: 8,
  59. ),
  60. child: Text(
  61. l10n.get('markAllRead'),
  62. style: TextStyle(
  63. fontSize: AppFontSizes.body,
  64. color: colors.primary,
  65. ),
  66. ),
  67. ),
  68. )
  69. : null,
  70. ),
  71. );
  72. }
  73. return EasyRefresh(
  74. header: TDRefreshHeader(),
  75. onRefresh: () async {
  76. ref.invalidate(messageListProvider);
  77. await ref.read(messageListProvider.future);
  78. },
  79. child: messagesAsync.when(
  80. loading: () => const SingleChildScrollView(
  81. physics: AlwaysScrollableScrollPhysics(),
  82. child: LoadingWidget(),
  83. ),
  84. error: (_, _) => SingleChildScrollView(
  85. physics: const AlwaysScrollableScrollPhysics(),
  86. child: EmptyState(message: l10n.get('loadFailed')),
  87. ),
  88. data: (messages) => messages.isEmpty
  89. ? SingleChildScrollView(
  90. physics: const AlwaysScrollableScrollPhysics(),
  91. child: EmptyState(message: l10n.get('noMessages')),
  92. )
  93. : ListView.separated(
  94. padding: const EdgeInsets.fromLTRB(
  95. AppSpacing.md,
  96. AppSpacing.md,
  97. AppSpacing.md,
  98. AppSpacing.lg,
  99. ),
  100. itemCount: messages.length,
  101. separatorBuilder: (_, _) => const SizedBox(height: 12),
  102. itemBuilder: (_, i) =>
  103. _buildItem(context, ref, messages[i], l10n),
  104. ),
  105. ),
  106. );
  107. }
  108. Widget _buildItem(
  109. BuildContext context,
  110. WidgetRef ref,
  111. MessageModel msg,
  112. AppLocalizations l10n,
  113. ) {
  114. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  115. final (icon, iconColor, iconBg) = _messageIconProps(msg.msgType, colors);
  116. return MessageItem(
  117. icon: icon,
  118. iconColor: iconColor,
  119. iconBackground: iconBg,
  120. title: msg.title,
  121. time: _formatTime(msg.createTime),
  122. sender: _messageSender(msg.msgType, l10n),
  123. summary: msg.content,
  124. unread: !msg.isRead,
  125. onTap: () => _navigateToBiz(context, msg),
  126. // 仅未读消息展示左滑操作
  127. onToggleRead: msg.isRead
  128. ? null
  129. : () {
  130. TDMessage.showMessage(
  131. context: context,
  132. content: '${l10n.get("markRead")}:${msg.title}',
  133. theme: MessageTheme.success,
  134. icon: true,
  135. duration: 2000,
  136. );
  137. },
  138. onDelete: () {
  139. showDialog(
  140. context: context,
  141. builder: (ctx) => TDAlertDialog(
  142. title: l10n.get('confirm'),
  143. content: l10n.getString(
  144. 'confirmAction',
  145. args: {'action': l10n.get('delete')},
  146. ),
  147. leftBtn: TDDialogButtonOptions(
  148. title: l10n.get('cancel'),
  149. action: () => Navigator.of(ctx).pop(),
  150. ),
  151. rightBtn: TDDialogButtonOptions(
  152. title: l10n.get('confirm'),
  153. action: () {
  154. Navigator.of(ctx).pop();
  155. TDMessage.showMessage(
  156. context: context,
  157. content: '${l10n.get("deletedToast")}${msg.title}',
  158. theme: MessageTheme.warning,
  159. icon: true,
  160. duration: 2000,
  161. );
  162. },
  163. ),
  164. ),
  165. );
  166. },
  167. );
  168. }
  169. /// 按消息类型返回(图标, 图标色, 图标背景色)
  170. (IconData, Color, Color) _messageIconProps(
  171. String msgType,
  172. AppColorsExtension colors,
  173. ) {
  174. switch (msgType) {
  175. case 'announcement':
  176. return (Icons.campaign_outlined, colors.warning, colors.warningBg);
  177. case 'approval_result':
  178. return (Icons.check_circle_outlined, colors.success, colors.successBg);
  179. case 'withdraw_notice':
  180. return (Icons.undo_outlined, colors.statusGray, colors.swipeDeleteBg);
  181. case 'expiry_reminder':
  182. return (Icons.timer_off_outlined, colors.danger, colors.dangerBg);
  183. case 'approval_notice':
  184. default:
  185. return (Icons.assignment_outlined, colors.primary, colors.primaryLight);
  186. }
  187. }
  188. /// 按消息类型返回发送者标签
  189. String _messageSender(String msgType, AppLocalizations l10n) {
  190. switch (msgType) {
  191. case 'announcement':
  192. return l10n.get('systemNotice');
  193. case 'approval_notice':
  194. return l10n.get('approvalNotice');
  195. case 'approval_result':
  196. return l10n.get('systemMessage');
  197. case 'withdraw_notice':
  198. return l10n.get('systemMessage');
  199. case 'expiry_reminder':
  200. return l10n.get('systemMessage');
  201. default:
  202. return l10n.get('systemMessage');
  203. }
  204. }
  205. /// 格式化时间为 MM-DD HH:mm
  206. String _formatTime(DateTime time) {
  207. final month = time.month.toString().padLeft(2, '0');
  208. final day = time.day.toString().padLeft(2, '0');
  209. final hour = time.hour.toString().padLeft(2, '0');
  210. final minute = time.minute.toString().padLeft(2, '0');
  211. return '$month-$day $hour:$minute';
  212. }
  213. /// 按 BizType 路由跳转
  214. void _navigateToBiz(BuildContext context, MessageModel msg) {
  215. if (msg.bizType == null || msg.bizId == null) return;
  216. switch (msg.bizType) {
  217. case 'expense':
  218. context.push('/expense/detail/${msg.bizId}');
  219. break;
  220. case 'overtime':
  221. context.push('/overtime/detail/${msg.bizId}');
  222. break;
  223. case 'vehicle':
  224. context.push('/vehicle/detail/${msg.bizId}');
  225. break;
  226. case 'announcement':
  227. context.push('/announcement/detail/${msg.bizId}');
  228. break;
  229. case 'expense_application':
  230. context.push('/expense-apply/detail/${msg.bizId}');
  231. break;
  232. }
  233. }
  234. }