overtime_apply_page.dart 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215
  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 '../shell/nav_bar_config.dart';
  6. import '../../core/utils/date_utils.dart' as du;
  7. import '../../shared/widgets/action_bar.dart';
  8. import '../../shared/widgets/form_section.dart';
  9. import '../../shared/widgets/form_field_row.dart';
  10. import '../../core/i18n/app_localizations.dart';
  11. import 'overtime_apply_controller.dart';
  12. import '../../core/theme/app_colors.dart';
  13. import '../../core/theme/app_colors_extension.dart';
  14. class OvertimeApplyPage extends ConsumerStatefulWidget {
  15. final String? editId;
  16. const OvertimeApplyPage({super.key, this.editId});
  17. @override
  18. ConsumerState<OvertimeApplyPage> createState() => _OvertimeApplyPageState();
  19. }
  20. class _OvertimeApplyPageState extends ConsumerState<OvertimeApplyPage> {
  21. final _reasonController = TextEditingController();
  22. static const _types = ['工作日加班', '休息日加班', '节假日加班'];
  23. static const _compensations = ['加班费', '调休'];
  24. @override
  25. void initState() {
  26. super.initState();
  27. final state = ref.read(overtimeApplyProvider(widget.editId));
  28. _reasonController.text = state.overtime.reason;
  29. }
  30. @override
  31. void dispose() {
  32. _reasonController.dispose();
  33. super.dispose();
  34. }
  35. @override
  36. Widget build(BuildContext context) {
  37. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  38. final ctrl = ref.watch(overtimeApplyProvider(widget.editId).notifier);
  39. final state = ref.watch(overtimeApplyProvider(widget.editId));
  40. final l10n = AppLocalizations.of(context);
  41. ref
  42. .read(navBarConfigProvider.notifier)
  43. .update(
  44. NavBarConfig(
  45. title: l10n.get('overtimeApply'),
  46. showBack: true,
  47. onBack: () => context.pop(),
  48. ),
  49. );
  50. return Column(
  51. children: [
  52. Expanded(
  53. child: SingleChildScrollView(
  54. padding: const EdgeInsets.all(16),
  55. child: FormSection(
  56. title: l10n.get('overtimeInfo'),
  57. children: [
  58. FormFieldRow(
  59. label: l10n.get('overtimeType'),
  60. value: state.overtime.otType,
  61. onTap: () => _showPicker(
  62. _types,
  63. ctrl.updateType,
  64. title: l10n.get('selectOvertimeType'),
  65. ),
  66. ),
  67. FormFieldRow(
  68. label: l10n.get('compensationMethod'),
  69. value: state.overtime.compensationType,
  70. onTap: () => _showPicker(
  71. _compensations,
  72. ctrl.updateCompensation,
  73. title: l10n.get('selectCompensationMethod'),
  74. ),
  75. ),
  76. FormFieldRow(
  77. label: l10n.get('startTime'),
  78. value: du.DateUtils.formatDateTime(state.overtime.startTime),
  79. onTap: () => _pickDateTime(
  80. ctrl.updateStartTime,
  81. state.overtime.startTime,
  82. ),
  83. ),
  84. FormFieldRow(
  85. label: l10n.get('endTime'),
  86. value: du.DateUtils.formatDateTime(state.overtime.endTime),
  87. onTap: () =>
  88. _pickDateTime(ctrl.updateEndTime, state.overtime.endTime),
  89. ),
  90. const SizedBox(height: 12),
  91. Text(
  92. l10n.get('netOvertimeHours'),
  93. style: TextStyle(
  94. fontSize: AppFontSizes.body,
  95. color: colors.textSecondary,
  96. ),
  97. ),
  98. const SizedBox(height: 8),
  99. Container(
  100. height: 80,
  101. width: double.infinity,
  102. decoration: BoxDecoration(
  103. color: colors.primaryLight,
  104. borderRadius: BorderRadius.circular(8),
  105. ),
  106. child: Center(
  107. child: Text(
  108. '${state.overtime.otHours.toStringAsFixed(1)} ${l10n.get('hours')}',
  109. style: TextStyle(
  110. fontSize: 28,
  111. fontWeight: FontWeight.w700,
  112. color: colors.primary,
  113. ),
  114. ),
  115. ),
  116. ),
  117. const SizedBox(height: 12),
  118. Text(
  119. l10n.get('overtimeReason'),
  120. style: TextStyle(
  121. fontSize: AppFontSizes.body,
  122. color: colors.textSecondary,
  123. ),
  124. ),
  125. const SizedBox(height: 8),
  126. Container(
  127. height: 88,
  128. decoration: BoxDecoration(
  129. color: colors.bgPage,
  130. borderRadius: BorderRadius.circular(4),
  131. ),
  132. padding: const EdgeInsets.all(12),
  133. child: TDInput(
  134. controller: _reasonController,
  135. maxLines: null,
  136. hintText: l10n.get('enterOvertimeReason'),
  137. onChanged: ctrl.updateReason,
  138. ),
  139. ),
  140. ],
  141. ),
  142. ),
  143. ),
  144. ActionBar(
  145. showLeft: false,
  146. centerLabel: l10n.get('saveDraftShort'),
  147. rightLabel: l10n.get('submitApproval'),
  148. onCenterTap: state.isSubmitting
  149. ? null
  150. : () async {
  151. await ctrl.saveDraft();
  152. if (context.mounted) context.pop();
  153. },
  154. onRightTap: state.isSubmitting
  155. ? null
  156. : () async {
  157. final ok = await ctrl.submit();
  158. if (context.mounted && ok) context.pop();
  159. },
  160. ),
  161. ],
  162. );
  163. }
  164. void _showPicker(
  165. List<String> options,
  166. void Function(String) onPick, {
  167. String title = '',
  168. }) {
  169. if (title.isEmpty) title = AppLocalizations.of(context).get('pleaseSelect');
  170. TDPicker.showMultiPicker(
  171. context,
  172. title: title,
  173. data: [options],
  174. onConfirm: (selected) => onPick(selected.first),
  175. );
  176. }
  177. void _pickDateTime(void Function(DateTime) onPicked, DateTime initial) {
  178. final l10n = AppLocalizations.of(context);
  179. TDPicker.showDatePicker(
  180. context,
  181. title: l10n.get('selectDateTime'),
  182. useYear: true,
  183. useMonth: true,
  184. useDay: true,
  185. useHour: true,
  186. useMinute: true,
  187. initialDate: [
  188. initial.year,
  189. initial.month,
  190. initial.day,
  191. initial.hour,
  192. initial.minute,
  193. ],
  194. onConfirm: (selected) {
  195. onPicked(
  196. DateTime(
  197. selected['year']!,
  198. selected['month']!,
  199. selected['day']!,
  200. selected['hour']!,
  201. selected['minute']!,
  202. ),
  203. );
  204. },
  205. );
  206. }
  207. }