overtime_detail_page.dart 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282
  1. import 'package:flutter/material.dart';
  2. import 'package:go_router/go_router.dart';
  3. import 'package:flutter_riverpod/flutter_riverpod.dart';
  4. import '../shell/nav_bar_config.dart';
  5. import '../../core/utils/date_utils.dart' as du;
  6. import '../../shared/widgets/status_banner.dart';
  7. import '../../shared/widgets/approval_timeline.dart';
  8. import 'overtime_model.dart';
  9. import '../../core/i18n/app_localizations.dart';
  10. import 'overtime_list_controller.dart';
  11. import '../../core/theme/app_colors.dart';
  12. import '../../core/theme/app_colors_extension.dart';
  13. class OvertimeDetailPage extends ConsumerWidget {
  14. final String id;
  15. const OvertimeDetailPage({super.key, required this.id});
  16. @override
  17. Widget build(BuildContext context, WidgetRef ref) {
  18. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  19. final overtime = mockOvertimes.firstWhere(
  20. (e) => e.id == id,
  21. orElse: () => mockOvertimes.first,
  22. );
  23. final l10n = AppLocalizations.of(context);
  24. final (icon, color, statusText) = _statusProps(
  25. overtime.status,
  26. l10n,
  27. colors,
  28. );
  29. ref
  30. .read(navBarConfigProvider.notifier)
  31. .update(
  32. NavBarConfig(
  33. title: l10n.get('overtimeDetail'),
  34. showBack: true,
  35. onBack: () => context.pop(),
  36. ),
  37. );
  38. return Column(
  39. children: [
  40. Expanded(
  41. child: SingleChildScrollView(
  42. padding: const EdgeInsets.fromLTRB(16, 16, 16, 32),
  43. child: Column(
  44. crossAxisAlignment: CrossAxisAlignment.start,
  45. children: [
  46. StatusBanner(
  47. icon: icon,
  48. statusText: statusText,
  49. subText: _statusSubText(overtime, l10n),
  50. color: color,
  51. ),
  52. const SizedBox(height: 8),
  53. Text(
  54. '${l10n.get('submitTimeText')}:${du.DateUtils.formatDateTime(overtime.createTime)}',
  55. style: TextStyle(
  56. fontSize: AppFontSizes.caption,
  57. color: colors.textPlaceholder,
  58. ),
  59. ),
  60. const SizedBox(height: 16),
  61. _buildInfoSection(overtime, l10n, colors),
  62. const SizedBox(height: 16),
  63. _buildReasonSection(overtime, l10n, colors),
  64. const SizedBox(height: 16),
  65. if (overtime.approvalRecords.isNotEmpty ||
  66. overtime.approvalChain.isNotEmpty)
  67. Container(
  68. padding: const EdgeInsets.all(16),
  69. decoration: BoxDecoration(
  70. color: colors.bgCard,
  71. borderRadius: BorderRadius.circular(8),
  72. ),
  73. child: ApprovalTimeline(
  74. records: overtime.approvalRecords,
  75. chain: overtime.approvalChain,
  76. currentApproverId: overtime.currentApproverId,
  77. ),
  78. ),
  79. ],
  80. ),
  81. ),
  82. ),
  83. _buildActionBar(context, overtime),
  84. ],
  85. );
  86. }
  87. Widget _buildInfoSection(
  88. OvertimeModel overtime,
  89. AppLocalizations l10n,
  90. AppColorsExtension colors,
  91. ) {
  92. return Container(
  93. padding: const EdgeInsets.fromLTRB(16, 8, 16, 8),
  94. decoration: BoxDecoration(
  95. color: colors.bgCard,
  96. borderRadius: BorderRadius.circular(8),
  97. ),
  98. child: Column(
  99. children: [
  100. _infoRow(l10n.get('applicant'), overtime.applicantName, colors),
  101. _infoRow(l10n.get('department'), overtime.deptName, colors),
  102. _infoRow(l10n.get('overtimeType'), overtime.otType, colors),
  103. _infoRow(
  104. l10n.get('compensationMethod'),
  105. overtime.compensationType,
  106. colors,
  107. ),
  108. _infoRow(
  109. l10n.get('netOvertimeHours'),
  110. '${overtime.otHours.toStringAsFixed(1)}${l10n.get('hours')}',
  111. colors,
  112. ),
  113. _infoRow(
  114. l10n.get('startTime'),
  115. du.DateUtils.formatDateTime(overtime.startTime),
  116. colors,
  117. ),
  118. _infoRow(
  119. l10n.get('endTime'),
  120. du.DateUtils.formatDateTime(overtime.endTime),
  121. colors,
  122. ),
  123. ],
  124. ),
  125. );
  126. }
  127. Widget _infoRow(String label, String value, AppColorsExtension colors) {
  128. return Container(
  129. height: 44,
  130. padding: const EdgeInsets.symmetric(vertical: 0),
  131. child: Row(
  132. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  133. children: [
  134. Text(
  135. label,
  136. style: TextStyle(
  137. fontSize: AppFontSizes.body,
  138. color: colors.textSecondary,
  139. ),
  140. ),
  141. Text(
  142. value,
  143. style: TextStyle(
  144. fontSize: AppFontSizes.body,
  145. color: colors.textPrimary,
  146. ),
  147. ),
  148. ],
  149. ),
  150. );
  151. }
  152. Widget _buildReasonSection(
  153. OvertimeModel overtime,
  154. AppLocalizations l10n,
  155. AppColorsExtension colors,
  156. ) {
  157. return Container(
  158. padding: const EdgeInsets.all(16),
  159. decoration: BoxDecoration(
  160. color: colors.bgCard,
  161. borderRadius: BorderRadius.circular(8),
  162. ),
  163. child: Column(
  164. crossAxisAlignment: CrossAxisAlignment.start,
  165. children: [
  166. Text(
  167. l10n.get('overtimeReason'),
  168. style: TextStyle(
  169. fontSize: AppFontSizes.subtitle,
  170. fontWeight: FontWeight.w600,
  171. color: colors.textPrimary,
  172. ),
  173. ),
  174. const SizedBox(height: 8),
  175. Text(
  176. overtime.reason.isEmpty ? l10n.get('no') : overtime.reason,
  177. style: TextStyle(
  178. fontSize: AppFontSizes.body,
  179. color: colors.textPrimary,
  180. ),
  181. ),
  182. ],
  183. ),
  184. );
  185. }
  186. Widget _buildActionBar(BuildContext context, OvertimeModel overtime) {
  187. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  188. final l10n = AppLocalizations.of(context);
  189. final showWithdraw =
  190. overtime.status == 'pending' || overtime.status == 'draft';
  191. if (!showWithdraw) return const SizedBox.shrink();
  192. return Container(
  193. height: 72,
  194. padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
  195. decoration: BoxDecoration(color: colors.bgCard),
  196. child: Row(
  197. children: [
  198. const Spacer(),
  199. SizedBox(
  200. height: 40,
  201. child: Material(
  202. color: colors.primary,
  203. borderRadius: BorderRadius.circular(22),
  204. child: InkWell(
  205. onTap: () {
  206. // 撤回逻辑,保留接口
  207. },
  208. borderRadius: BorderRadius.circular(22),
  209. child: Center(
  210. child: Padding(
  211. padding: const EdgeInsets.symmetric(horizontal: 32),
  212. child: Text(
  213. l10n.get('withdrawApplication'),
  214. style: TextStyle(
  215. fontSize: AppFontSizes.body,
  216. fontWeight: FontWeight.w500,
  217. color: Colors.white,
  218. ),
  219. ),
  220. ),
  221. ),
  222. ),
  223. ),
  224. ),
  225. const Spacer(),
  226. ],
  227. ),
  228. );
  229. }
  230. (IconData, Color, String) _statusProps(
  231. String status,
  232. AppLocalizations l10n,
  233. AppColorsExtension colors,
  234. ) {
  235. switch (status) {
  236. case 'approved':
  237. return (Icons.check_circle, colors.success, l10n.get('approved'));
  238. case 'rejected':
  239. return (Icons.cancel, colors.danger, l10n.get('rejected'));
  240. case 'draft':
  241. return (Icons.edit_note, colors.statusGray, l10n.get('draft'));
  242. case 'revoked':
  243. return (Icons.cancel_outlined, colors.revokedText, l10n.get('revoked'));
  244. default:
  245. return (Icons.access_time, colors.warning, l10n.get('pending'));
  246. }
  247. }
  248. String _statusSubText(OvertimeModel overtime, AppLocalizations l10n) {
  249. switch (overtime.status) {
  250. case 'pending':
  251. return overtime.currentApproverId.isNotEmpty
  252. ? '${l10n.get('currentApprover')}:${overtime.currentApproverId}'
  253. : l10n.get('waitHandle');
  254. case 'approved':
  255. final last = overtime.approvalRecords.isNotEmpty
  256. ? overtime.approvalRecords.last.approverName
  257. : '';
  258. return last.isNotEmpty
  259. ? '${l10n.get('approver')}:$last'
  260. : l10n.get('approved');
  261. case 'rejected':
  262. final last = overtime.approvalRecords.isNotEmpty
  263. ? overtime.approvalRecords.last.approverName
  264. : '';
  265. return last.isNotEmpty
  266. ? '${l10n.get('rejecter')}:$last'
  267. : l10n.get('rejected');
  268. default:
  269. return '';
  270. }
  271. }
  272. }