expense_application_apply_page.dart 44 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379
  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 '../../shared/widgets/action_bar.dart';
  7. import '../../shared/widgets/form_section.dart';
  8. import '../../shared/widgets/form_field_row.dart';
  9. import '../../shared/widgets/nav_bar_config.dart';
  10. import '../../core/theme/app_colors.dart';
  11. import '../../core/theme/app_colors_extension.dart';
  12. import '../../core/constants/enums.dart';
  13. import '../../core/data/mock_api_data.dart';
  14. class ExpenseApplicationApplyPage extends ConsumerStatefulWidget {
  15. final String? id;
  16. const ExpenseApplicationApplyPage({super.key, this.id});
  17. @override
  18. ConsumerState<ExpenseApplicationApplyPage> createState() =>
  19. _ExpenseApplicationApplyPageState();
  20. }
  21. class _ExpenseApplicationApplyPageState
  22. extends ConsumerState<ExpenseApplicationApplyPage> {
  23. // ── 基本信息 ──
  24. String _urgency = Urgency.normal.value;
  25. final Set<String> _expenseTypes = {};
  26. bool _isTaxIncluded = false;
  27. final _purposeController = TextEditingController();
  28. String _validUntil = '';
  29. // ── 关联管控 ──
  30. String? _selectedProjectName;
  31. int? _selectedProjectId;
  32. String? _selectedSubjectName;
  33. int? _selectedSubjectId;
  34. double _availableBudget = 0;
  35. final _referenceNoController = TextEditingController();
  36. // ── 费用明细 ──
  37. final List<_DetailItem> _details = [];
  38. int _detailIdCounter = 1;
  39. // ── 附件 ──
  40. final List<String> _attachments = [];
  41. // ── 专用字段 ──
  42. String _estimatedStartDate = '';
  43. String _estimatedEndDate = '';
  44. bool _isOvernight = false;
  45. String? _transportType;
  46. String? _entertainmentTarget;
  47. String? _entertainmentLevel;
  48. int _guestCount = 1;
  49. int _companionCount = 0;
  50. String _entertainmentVenue = '';
  51. String _meetingStartDate = '';
  52. String _meetingEndDate = '';
  53. String _meetingVenue = '';
  54. @override
  55. void dispose() {
  56. _purposeController.dispose();
  57. _referenceNoController.dispose();
  58. super.dispose();
  59. }
  60. @override
  61. Widget build(BuildContext context) {
  62. final l10n = AppLocalizations.of(context);
  63. ref
  64. .read(navBarConfigProvider.notifier)
  65. .update(
  66. NavBarConfig(
  67. title: l10n.get('expenseApplyRequest'),
  68. showBack: true,
  69. onBack: () {
  70. if (_hasUnsaved()) {
  71. _showConfirmDialog(
  72. l10n.get('confirmExit'),
  73. l10n.get('unsavedContentWarning'),
  74. l10n.get('continueEditing'),
  75. l10n.get('discardAndExit'),
  76. () => context.pop(),
  77. );
  78. } else {
  79. context.pop();
  80. }
  81. },
  82. ),
  83. );
  84. return PopScope(
  85. canPop: false,
  86. onPopInvokedWithResult: (didPop, _) {
  87. if (!didPop) {
  88. if (_hasUnsaved()) {
  89. _showConfirmDialog(
  90. l10n.get('confirmExit'),
  91. l10n.get('unsavedContentWarning'),
  92. l10n.get('continueEditing'),
  93. l10n.get('discardAndExit'),
  94. () => context.pop(),
  95. );
  96. } else {
  97. context.pop();
  98. }
  99. }
  100. },
  101. child: Column(
  102. children: [
  103. Expanded(
  104. child: GestureDetector(
  105. onTap: () => FocusScope.of(context).unfocus(),
  106. child: SingleChildScrollView(
  107. padding: const EdgeInsets.all(16),
  108. child: Column(
  109. children: [
  110. _buildBasicInfo(l10n),
  111. _buildTypeSpecificFields(l10n),
  112. _buildControlSection(l10n),
  113. const SizedBox(height: 16),
  114. _buildDetailsSection(l10n),
  115. const SizedBox(height: 16),
  116. _buildAttachmentSection(l10n),
  117. const SizedBox(height: 80),
  118. ],
  119. ),
  120. ),
  121. ),
  122. ),
  123. _buildBottomBar(l10n),
  124. ],
  125. ),
  126. );
  127. }
  128. // ═══ 1. 基本信息 ═══
  129. Widget _buildBasicInfo(AppLocalizations l10n) {
  130. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  131. return FormSection(
  132. title: l10n.get('basicInfo'),
  133. leadingIcon: Icons.info_outline,
  134. children: [
  135. FormFieldRow(
  136. label: l10n.get('applicant'),
  137. value: '张三',
  138. readOnly: true,
  139. showArrow: false,
  140. ),
  141. const SizedBox(height: 16),
  142. FormFieldRow(
  143. label: l10n.get('department'),
  144. value: '技术部',
  145. readOnly: true,
  146. showArrow: false,
  147. ),
  148. const SizedBox(height: 16),
  149. FormFieldRow(
  150. label: l10n.get('date'),
  151. value: _today(),
  152. readOnly: true,
  153. showArrow: false,
  154. ),
  155. const SizedBox(height: 16),
  156. _label(l10n.get('emergencyLevel'), required: true),
  157. const SizedBox(height: 8),
  158. _buildUrgencyRadio(l10n),
  159. const SizedBox(height: 16),
  160. _label(l10n.get('expenseType'), required: true),
  161. const SizedBox(height: 8),
  162. Wrap(
  163. spacing: 8,
  164. runSpacing: 8,
  165. children: ExpenseType.values.map((opt) {
  166. final sel = _expenseTypes.contains(opt.value);
  167. return GestureDetector(
  168. onTap: () => setState(() {
  169. if (sel) {
  170. _expenseTypes.remove(opt.value);
  171. } else {
  172. _expenseTypes.add(opt.value);
  173. final hints = {
  174. 'travel': 'hintTravelFields',
  175. 'entertainment': 'hintEntertainmentFields',
  176. 'meeting': 'hintMeetingFields',
  177. };
  178. final hintKey = hints[opt.value];
  179. if (hintKey != null) {
  180. TDMessage.showMessage(
  181. context: context,
  182. content: l10n.get(hintKey),
  183. theme: MessageTheme.info,
  184. icon: true,
  185. marquee: MessageMarquee(speed: 3000, loop: 1, delay: 300),
  186. duration: 3000,
  187. );
  188. }
  189. }
  190. }),
  191. child: TDTag(
  192. l10n.get(opt.labelKey),
  193. size: TDTagSize.large,
  194. theme: sel ? TDTagTheme.primary : TDTagTheme.defaultTheme,
  195. isOutline: !sel,
  196. ),
  197. );
  198. }).toList(),
  199. ),
  200. const SizedBox(height: 16),
  201. _label(l10n.get('feeReason'), required: true),
  202. const SizedBox(height: 8),
  203. TDTextarea(
  204. controller: _purposeController,
  205. hintText: l10n.get('enterFeeReason'),
  206. maxLines: 4,
  207. minLines: 1,
  208. maxLength: 500,
  209. indicator: true,
  210. padding: EdgeInsets.zero,
  211. bordered: true,
  212. backgroundColor: colors.bgPage,
  213. ),
  214. const SizedBox(height: 16),
  215. FormFieldRow(
  216. label: l10n.get('validUntil'),
  217. value: _validUntil,
  218. hint: l10n.get('pleaseSelect'),
  219. onTap: () => _pickDate((d) => setState(() => _validUntil = d)),
  220. ),
  221. ],
  222. );
  223. }
  224. Widget _buildUrgencyRadio(AppLocalizations l10n) {
  225. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  226. return Row(
  227. children: Urgency.values.asMap().entries.map((e) {
  228. final sel = _urgency == e.value.value;
  229. final isCritical = e.value.value == Urgency.critical.value;
  230. final activeColor = isCritical ? colors.danger : colors.primary;
  231. return Padding(
  232. padding: EdgeInsets.only(right: e.key < 2 ? 24 : 0),
  233. child: GestureDetector(
  234. behavior: HitTestBehavior.opaque,
  235. onTap: () => setState(() => _urgency = e.value.value),
  236. child: Row(
  237. mainAxisSize: MainAxisSize.min,
  238. children: [
  239. Container(
  240. width: 18,
  241. height: 18,
  242. decoration: BoxDecoration(
  243. shape: BoxShape.circle,
  244. border: Border.all(
  245. color: sel ? activeColor : colors.textPlaceholder,
  246. width: 2,
  247. ),
  248. ),
  249. child: sel
  250. ? Center(
  251. child: Container(
  252. width: 8,
  253. height: 8,
  254. decoration: BoxDecoration(
  255. shape: BoxShape.circle,
  256. color: activeColor,
  257. ),
  258. ),
  259. )
  260. : null,
  261. ),
  262. const SizedBox(width: 6),
  263. Text(
  264. l10n.get(e.value.labelKey),
  265. style: TextStyle(
  266. fontSize: AppFontSizes.subtitle,
  267. color: sel ? activeColor : colors.textPrimary,
  268. ),
  269. ),
  270. ],
  271. ),
  272. ),
  273. );
  274. }).toList(),
  275. );
  276. }
  277. // ═══ 2. 类型专用字段 ═══
  278. Widget _buildTypeSpecificFields(AppLocalizations l10n) {
  279. final ws = <Widget>[];
  280. if (_expenseTypes.contains('travel')) ws.add(_buildTravelFields(l10n));
  281. if (_expenseTypes.contains('entertainment')) {
  282. if (ws.isNotEmpty) ws.add(const SizedBox(height: 16));
  283. ws.add(_buildEntertainmentFields(l10n));
  284. }
  285. if (_expenseTypes.contains('meeting')) {
  286. if (ws.isNotEmpty) ws.add(const SizedBox(height: 16));
  287. ws.add(_buildMeetingFields(l10n));
  288. }
  289. if (ws.isEmpty) return const SizedBox(height: 16);
  290. return Column(
  291. children: [const SizedBox(height: 16), ...ws, const SizedBox(height: 16)],
  292. );
  293. }
  294. Widget _buildTravelFields(AppLocalizations l10n) {
  295. return FormSection(
  296. title: l10n.get('travelExpense'),
  297. leadingIcon: Icons.flight_outlined,
  298. children: [
  299. FormFieldRow(
  300. label: l10n.get('estimatedStartDate'),
  301. value: _estimatedStartDate,
  302. hint: l10n.get('pleaseSelect'),
  303. required: true,
  304. onTap: () =>
  305. _pickDate((d) => setState(() => _estimatedStartDate = d)),
  306. ),
  307. const SizedBox(height: 16),
  308. FormFieldRow(
  309. label: l10n.get('estimatedEndDate'),
  310. value: _estimatedEndDate,
  311. hint: l10n.get('pleaseSelect'),
  312. required: true,
  313. onTap: () => _pickDate((d) => setState(() => _estimatedEndDate = d)),
  314. ),
  315. const SizedBox(height: 16),
  316. Row(
  317. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  318. children: [
  319. _label(l10n.get('isOvernight')),
  320. TDSwitch(
  321. isOn: _isOvernight,
  322. onChanged: (v) {
  323. setState(() => _isOvernight = v);
  324. return true;
  325. },
  326. ),
  327. ],
  328. ),
  329. const SizedBox(height: 16),
  330. FormFieldRow(
  331. label: l10n.get('transportType'),
  332. value: _transportType != null
  333. ? l10n.get(
  334. TransportType.values
  335. .firstWhere((t) => t.value == _transportType)
  336. .labelKey,
  337. )
  338. : null,
  339. hint: l10n.get('pleaseSelect'),
  340. onTap: () => _showEnumPicker(
  341. l10n.get('selectTransport'),
  342. TransportType.values,
  343. (v) => setState(() => _transportType = v),
  344. ),
  345. ),
  346. ],
  347. );
  348. }
  349. Widget _buildEntertainmentFields(AppLocalizations l10n) {
  350. return FormSection(
  351. title: l10n.get('entertainmentExpense'),
  352. leadingIcon: Icons.people_outline,
  353. children: [
  354. FormFieldRow(
  355. label: l10n.get('entertainmentTargetUnit'),
  356. value: _entertainmentTarget,
  357. hint: l10n.get('pleaseEnter'),
  358. required: true,
  359. onTap: () => _showTextInput(
  360. l10n.get('entertainmentTargetUnit'),
  361. (v) => setState(() => _entertainmentTarget = v),
  362. initialText: _entertainmentTarget ?? '',
  363. ),
  364. ),
  365. const SizedBox(height: 16),
  366. FormFieldRow(
  367. label: l10n.get('entertainmentLevel'),
  368. value: _entertainmentLevel != null
  369. ? l10n.get(
  370. EntertainmentLevel.values
  371. .firstWhere((e) => e.value == _entertainmentLevel)
  372. .labelKey,
  373. )
  374. : null,
  375. hint: l10n.get('pleaseSelect'),
  376. onTap: () => _showEnumPicker(
  377. l10n.get('selectEntertainmentLevel'),
  378. EntertainmentLevel.values,
  379. (v) => setState(() => _entertainmentLevel = v),
  380. ),
  381. ),
  382. const SizedBox(height: 16),
  383. FormFieldRow(
  384. label: l10n.get('externalCount'),
  385. value: '$_guestCount',
  386. onTap: () => _showNumberInput(
  387. l10n.get('externalCount'),
  388. (v) => setState(() => _guestCount = v),
  389. initialValue: _guestCount,
  390. ),
  391. ),
  392. const SizedBox(height: 16),
  393. FormFieldRow(
  394. label: l10n.get('internalCount'),
  395. value: '$_companionCount',
  396. onTap: () => _showNumberInput(
  397. l10n.get('internalCount'),
  398. (v) => setState(() => _companionCount = v),
  399. initialValue: _companionCount,
  400. ),
  401. ),
  402. const SizedBox(height: 16),
  403. FormFieldRow(
  404. label: l10n.get('venue'),
  405. value: _entertainmentVenue,
  406. hint: l10n.get('pleaseEnterLocation'),
  407. onTap: () => _showTextInput(
  408. l10n.get('venue'),
  409. (v) => setState(() => _entertainmentVenue = v),
  410. initialText: _entertainmentVenue,
  411. ),
  412. ),
  413. ],
  414. );
  415. }
  416. Widget _buildMeetingFields(AppLocalizations l10n) {
  417. return FormSection(
  418. title: l10n.get('meetingExpense'),
  419. leadingIcon: Icons.meeting_room_outlined,
  420. children: [
  421. FormFieldRow(
  422. label: l10n.get('estimatedStartDate'),
  423. value: _meetingStartDate,
  424. hint: l10n.get('pleaseSelect'),
  425. required: true,
  426. onTap: () => _pickDate((d) => setState(() => _meetingStartDate = d)),
  427. ),
  428. const SizedBox(height: 16),
  429. FormFieldRow(
  430. label: l10n.get('estimatedEndDate'),
  431. value: _meetingEndDate,
  432. hint: l10n.get('pleaseSelect'),
  433. required: true,
  434. onTap: () => _pickDate((d) => setState(() => _meetingEndDate = d)),
  435. ),
  436. const SizedBox(height: 16),
  437. FormFieldRow(
  438. label: l10n.get('venue'),
  439. value: _meetingVenue,
  440. hint: l10n.get('pleaseEnterMeetingLocation'),
  441. onTap: () => _showTextInput(
  442. l10n.get('meetingLocation'),
  443. (v) => setState(() => _meetingVenue = v),
  444. initialText: _meetingVenue,
  445. ),
  446. ),
  447. ],
  448. );
  449. }
  450. // ═══ 3. 关联管控 ═══
  451. Widget _buildControlSection(AppLocalizations l10n) {
  452. return FormSection(
  453. title: l10n.get('relatedControl'),
  454. leadingIcon: Icons.link_outlined,
  455. children: [
  456. FormFieldRow(
  457. label: l10n.get('relatedProject'),
  458. value: _selectedProjectName,
  459. hint: l10n.get('selectProject'),
  460. required: true,
  461. onTap: () {
  462. _showListPicker(
  463. l10n.get('selectProject'),
  464. mockProjects.map((p) => p.name).toList(),
  465. (v) {
  466. final p = mockProjects.firstWhere((x) => x.name == v);
  467. setState(() {
  468. _selectedProjectId = p.id;
  469. _selectedProjectName = p.name;
  470. _selectedSubjectName = null;
  471. _selectedSubjectId = null;
  472. _availableBudget = 0;
  473. });
  474. },
  475. );
  476. },
  477. ),
  478. const SizedBox(height: 16),
  479. FormFieldRow(
  480. label: l10n.get('budgetSubject'),
  481. value: _selectedSubjectName,
  482. hint: l10n.get('selectSubject'),
  483. required: true,
  484. onTap: _selectedProjectId != null
  485. ? () {
  486. _showListPicker(
  487. l10n.get('selectSubject'),
  488. mockBudgetSubjects.map((s) => s.name).toList(),
  489. (v) {
  490. final s = mockBudgetSubjects.firstWhere(
  491. (x) => x.name == v,
  492. );
  493. setState(() {
  494. _selectedSubjectId = s.id;
  495. _selectedSubjectName = s.name;
  496. _availableBudget = getMockBudget(
  497. _selectedProjectId!,
  498. s.id,
  499. );
  500. });
  501. },
  502. );
  503. }
  504. : null,
  505. ),
  506. const SizedBox(height: 16),
  507. _buildBudgetRow(l10n),
  508. const SizedBox(height: 16),
  509. FormFieldRow(
  510. label: l10n.get('relatedContractNo'),
  511. value: _referenceNoController.text,
  512. hint: l10n.get('optional'),
  513. onTap: () => _showTextInput(
  514. l10n.get('relatedContractNo'),
  515. (v) => setState(() {
  516. _referenceNoController.text = v;
  517. _referenceNoController.selection = TextSelection.fromPosition(
  518. TextPosition(offset: v.length),
  519. );
  520. }),
  521. initialText: _referenceNoController.text,
  522. ),
  523. ),
  524. ],
  525. );
  526. }
  527. Widget _buildBudgetRow(AppLocalizations l10n) {
  528. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  529. final over = _availableBudget <= 0;
  530. return Row(
  531. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  532. children: [
  533. Text(
  534. l10n.get('availableBudget'),
  535. style: TextStyle(
  536. fontSize: AppFontSizes.subtitle,
  537. color: colors.textSecondary,
  538. ),
  539. ),
  540. Text(
  541. '¥${_availableBudget.toStringAsFixed(2)}',
  542. style: TextStyle(
  543. fontSize: AppFontSizes.subtitle,
  544. fontWeight: FontWeight.w700,
  545. color: over ? colors.danger : colors.amountPrimary,
  546. ),
  547. ),
  548. ],
  549. );
  550. }
  551. // ═══ 4. 费用明细 ═══
  552. Widget _buildDetailsSection(AppLocalizations l10n) {
  553. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  554. return FormSection(
  555. title: l10n.get('expenseDetails'),
  556. leadingIcon: Icons.receipt_long_outlined,
  557. showAction: true,
  558. actionText: l10n.get('add'),
  559. onActionTap: _showDetailDialog,
  560. children: [
  561. Padding(
  562. padding: const EdgeInsets.only(bottom: 12),
  563. child: Row(
  564. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  565. children: [
  566. _label(l10n.get('isTaxIncluded')),
  567. TDSwitch(
  568. isOn: _isTaxIncluded,
  569. onChanged: (v) {
  570. setState(() => _isTaxIncluded = v);
  571. return true;
  572. },
  573. ),
  574. ],
  575. ),
  576. ),
  577. if (_details.isEmpty)
  578. Padding(
  579. padding: const EdgeInsets.symmetric(vertical: 8),
  580. child: Text(
  581. l10n.get('noDetailHint'),
  582. style: TextStyle(
  583. fontSize: AppFontSizes.subtitle,
  584. color: colors.textPlaceholder,
  585. ),
  586. ),
  587. )
  588. else
  589. ..._details.asMap().entries.map((e) {
  590. final d = e.value;
  591. return Container(
  592. margin: const EdgeInsets.symmetric(vertical: 8),
  593. padding: const EdgeInsets.all(12),
  594. decoration: BoxDecoration(
  595. color: colors.bgPage,
  596. borderRadius: BorderRadius.circular(8),
  597. ),
  598. child: Row(
  599. children: [
  600. Expanded(
  601. flex: 3,
  602. child: Column(
  603. crossAxisAlignment: CrossAxisAlignment.start,
  604. children: [
  605. Text(
  606. d.categoryName,
  607. style: TextStyle(
  608. fontSize: AppFontSizes.subtitle,
  609. color: colors.textPrimary,
  610. ),
  611. ),
  612. if (d.remark.isNotEmpty)
  613. Text(
  614. d.remark,
  615. maxLines: 2,
  616. overflow: TextOverflow.ellipsis,
  617. style: TextStyle(
  618. fontSize: AppFontSizes.caption,
  619. color: colors.textSecondary,
  620. ),
  621. ),
  622. ],
  623. ),
  624. ),
  625. Text(
  626. '${d.quantity}×¥${d.unitPrice.toStringAsFixed(2)}',
  627. style: TextStyle(
  628. fontSize: AppFontSizes.body,
  629. color: colors.textSecondary,
  630. ),
  631. ),
  632. const SizedBox(width: 8),
  633. Text(
  634. '¥${d.amount.toStringAsFixed(2)}',
  635. style: TextStyle(
  636. fontSize: AppFontSizes.subtitle,
  637. fontWeight: FontWeight.w600,
  638. color: colors.amountPrimary,
  639. ),
  640. ),
  641. const SizedBox(width: 8),
  642. GestureDetector(
  643. onTap: () => setState(() => _details.removeAt(e.key)),
  644. child: Container(
  645. width: 24,
  646. height: 24,
  647. decoration: BoxDecoration(
  648. color: colors.primaryLight,
  649. shape: BoxShape.circle,
  650. ),
  651. child: Icon(
  652. Icons.close,
  653. size: 14,
  654. color: colors.primary700,
  655. ),
  656. ),
  657. ),
  658. ],
  659. ),
  660. );
  661. }),
  662. const SizedBox(height: 8),
  663. Container(
  664. height: 36,
  665. padding: const EdgeInsets.symmetric(vertical: 8),
  666. child: Row(
  667. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  668. children: [
  669. Text(
  670. l10n.get('total'),
  671. style: TextStyle(
  672. fontSize: AppFontSizes.body,
  673. fontWeight: FontWeight.w600,
  674. color: colors.textPrimary,
  675. ),
  676. ),
  677. Text(
  678. '¥${_totalAmount().toStringAsFixed(2)}',
  679. style: TextStyle(
  680. fontSize: AppFontSizes.subtitle,
  681. fontWeight: FontWeight.w700,
  682. color: colors.amountPrimary,
  683. ),
  684. ),
  685. ],
  686. ),
  687. ),
  688. if (_totalAmount() > _availableBudget)
  689. Padding(
  690. padding: const EdgeInsets.only(top: 8),
  691. child: Row(
  692. children: [
  693. Icon(Icons.warning_amber, size: 14, color: colors.danger),
  694. const SizedBox(width: 6),
  695. Expanded(
  696. child: Text(
  697. l10n.get('overBudgetTriggerApproval'),
  698. style: TextStyle(
  699. fontSize: AppFontSizes.caption,
  700. color: colors.danger,
  701. ),
  702. ),
  703. ),
  704. ],
  705. ),
  706. ),
  707. ],
  708. );
  709. }
  710. double _totalAmount() => _details.fold(0, (s, d) => s + d.amount);
  711. List<CostCategory> get _availableDetailCategories {
  712. if (_expenseTypes.isEmpty) return mockCostCategories;
  713. final codes = _expenseTypes
  714. .expand((et) => expenseTypeCategories[et] ?? <String>[])
  715. .toSet();
  716. return mockCostCategories.where((c) => codes.contains(c.code)).toList();
  717. }
  718. void _showDetailDialog() {
  719. _unfocus();
  720. final l10n = AppLocalizations.of(context);
  721. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  722. final cats = _availableDetailCategories;
  723. String cat = cats.isNotEmpty ? cats.first.code : 'other';
  724. String unit = l10n.get('unitPiece');
  725. final qtyCtrl = TextEditingController(text: '1');
  726. final priceCtrl = TextEditingController();
  727. final remarkCtrl = TextEditingController();
  728. showModalBottomSheet(
  729. context: context,
  730. isScrollControlled: true,
  731. backgroundColor: colors.bgCard,
  732. shape: const RoundedRectangleBorder(
  733. borderRadius: BorderRadius.vertical(top: Radius.circular(12)),
  734. ),
  735. builder: (ctx) => StatefulBuilder(
  736. builder: (ctx, setDlg) => Padding(
  737. padding: EdgeInsets.only(
  738. left: 16,
  739. right: 16,
  740. top: 16,
  741. bottom: 16 + MediaQuery.of(ctx).viewInsets.bottom,
  742. ),
  743. child: Column(
  744. mainAxisSize: MainAxisSize.min,
  745. crossAxisAlignment: CrossAxisAlignment.stretch,
  746. children: [
  747. Center(
  748. child: Text(
  749. l10n.get('addExpenseDetail'),
  750. style: TextStyle(
  751. fontSize: 18,
  752. fontWeight: FontWeight.w600,
  753. color: colors.textPrimary,
  754. ),
  755. ),
  756. ),
  757. const SizedBox(height: 16),
  758. // 费用类别 — 左右布局,必填
  759. Row(
  760. children: [
  761. SizedBox(
  762. width: 80,
  763. child: _label(l10n.get('expenseCategory'), required: true),
  764. ),
  765. const SizedBox(width: 8),
  766. Expanded(
  767. child: TDDropdownMenu(
  768. items: [
  769. TDDropdownItem(
  770. label: l10n.get(
  771. cats.firstWhere((c) => c.code == cat).nameKey,
  772. ),
  773. options: cats
  774. .map(
  775. (c) => TDDropdownItemOption(
  776. value: c.code,
  777. label: l10n.get(c.nameKey),
  778. ),
  779. )
  780. .toList(),
  781. ),
  782. ],
  783. closeOnClickOverlay: true,
  784. onMenuClosed: (index) {
  785. if (index >= 0 && index < cats.length) {
  786. cat = cats[index].code;
  787. setDlg(() {});
  788. }
  789. },
  790. ),
  791. ),
  792. ],
  793. ),
  794. const SizedBox(height: 12),
  795. // 数量 — 左右布局,必填
  796. Row(
  797. children: [
  798. SizedBox(
  799. width: 80,
  800. child: _label(l10n.get('quantity'), required: true),
  801. ),
  802. const SizedBox(width: 8),
  803. Expanded(
  804. child: TDInput(controller: qtyCtrl, hintText: '>0'),
  805. ),
  806. ],
  807. ),
  808. const SizedBox(height: 12),
  809. // 单位 — 左右布局
  810. Row(
  811. children: [
  812. SizedBox(width: 80, child: _label(l10n.get('unit'))),
  813. const SizedBox(width: 8),
  814. Expanded(
  815. child: TDDropdownMenu(
  816. items: [
  817. TDDropdownItem(
  818. label: unit,
  819. options: unitOptions
  820. .map(
  821. (u) => TDDropdownItemOption(
  822. value: u,
  823. label: l10n.get(u),
  824. ),
  825. )
  826. .toList(),
  827. ),
  828. ],
  829. closeOnClickOverlay: true,
  830. onMenuClosed: (index) {
  831. if (index >= 0 && index < unitOptions.length) {
  832. unit = l10n.get(unitOptions[index]);
  833. setDlg(() {});
  834. }
  835. },
  836. ),
  837. ),
  838. ],
  839. ),
  840. const SizedBox(height: 12),
  841. // 单价 — 左右布局,必填
  842. Row(
  843. children: [
  844. SizedBox(
  845. width: 80,
  846. child: _label(l10n.get('unitPrice'), required: true),
  847. ),
  848. const SizedBox(width: 8),
  849. Expanded(
  850. child: TDInput(controller: priceCtrl, hintText: '>0'),
  851. ),
  852. ],
  853. ),
  854. const SizedBox(height: 12),
  855. _label(l10n.get('detailRemark')),
  856. const SizedBox(height: 8),
  857. TDTextarea(
  858. controller: remarkCtrl,
  859. hintText: l10n.get('optional'),
  860. maxLines: 3,
  861. minLines: 1,
  862. maxLength: 200,
  863. indicator: true,
  864. padding: EdgeInsets.zero,
  865. bordered: true,
  866. backgroundColor: colors.bgPage,
  867. ),
  868. const SizedBox(height: 16),
  869. Row(
  870. children: [
  871. Expanded(
  872. child: TDButton(
  873. text: l10n.get('cancel'),
  874. size: TDButtonSize.medium,
  875. type: TDButtonType.outline,
  876. shape: TDButtonShape.rectangle,
  877. theme: TDButtonTheme.defaultTheme,
  878. onTap: () => Navigator.pop(ctx),
  879. ),
  880. ),
  881. const SizedBox(width: 12),
  882. Expanded(
  883. child: TDButton(
  884. text: l10n.get('confirm'),
  885. size: TDButtonSize.medium,
  886. type: TDButtonType.fill,
  887. shape: TDButtonShape.rectangle,
  888. theme: TDButtonTheme.primary,
  889. onTap: () {
  890. final q = int.tryParse(qtyCtrl.text) ?? 0;
  891. final p = double.tryParse(priceCtrl.text) ?? 0;
  892. if (q <= 0 || p <= 0) {
  893. TDToast.showText(
  894. l10n.get('quantityPricePositive'),
  895. context: context,
  896. );
  897. return;
  898. }
  899. setState(
  900. () => _details.add(
  901. _DetailItem(
  902. id: _detailIdCounter++,
  903. category: cat,
  904. categoryName: l10n.get(
  905. cats.firstWhere((c) => c.code == cat).nameKey,
  906. ),
  907. quantity: q,
  908. unit: unit,
  909. unitPrice: p,
  910. amount: q * p.toDouble(),
  911. remark: remarkCtrl.text,
  912. ),
  913. ),
  914. );
  915. Navigator.pop(ctx);
  916. },
  917. ),
  918. ),
  919. ],
  920. ),
  921. ],
  922. ),
  923. ),
  924. ),
  925. );
  926. }
  927. // ═══ 5. 附件上传 ═══
  928. Widget _buildAttachmentSection(AppLocalizations l10n) {
  929. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  930. return FormSection(
  931. title: l10n.get('attachmentUpload'),
  932. leadingIcon: Icons.attach_file_outlined,
  933. children: [
  934. Text(
  935. l10n.get('maxAttachment'),
  936. style: TextStyle(
  937. fontSize: AppFontSizes.caption,
  938. color: colors.textPlaceholder,
  939. ),
  940. ),
  941. const SizedBox(height: 8),
  942. Wrap(
  943. spacing: 8,
  944. runSpacing: 8,
  945. children: [
  946. ..._attachments.asMap().entries.map(
  947. (e) => Stack(
  948. clipBehavior: Clip.none,
  949. children: [
  950. Container(
  951. width: 80,
  952. height: 80,
  953. decoration: BoxDecoration(
  954. color: colors.primaryLight,
  955. borderRadius: BorderRadius.circular(4),
  956. ),
  957. child: Center(
  958. child: Icon(Icons.image, color: colors.primary, size: 32),
  959. ),
  960. ),
  961. Positioned(
  962. right: -4,
  963. top: -4,
  964. child: GestureDetector(
  965. onTap: () => setState(() => _attachments.removeAt(e.key)),
  966. child: Container(
  967. width: 20,
  968. height: 20,
  969. decoration: BoxDecoration(
  970. color: colors.danger,
  971. shape: BoxShape.circle,
  972. ),
  973. child: const Icon(
  974. Icons.close,
  975. size: 12,
  976. color: Colors.white,
  977. ),
  978. ),
  979. ),
  980. ),
  981. ],
  982. ),
  983. ),
  984. if (_attachments.length < 9)
  985. GestureDetector(
  986. onTap: () {
  987. // Mock: add attachment (支持图片/PDF/Word/Excel)
  988. final exts = ['.jpg', '.png', '.pdf', '.docx', '.xlsx'];
  989. setState(
  990. () => _attachments.add(
  991. '附件_${DateTime.now().millisecondsSinceEpoch}${exts[_attachments.length % exts.length]}',
  992. ),
  993. );
  994. TDToast.showText(
  995. l10n.get('mockAttachmentAdded'),
  996. context: context,
  997. );
  998. },
  999. child: Container(
  1000. width: 80,
  1001. height: 80,
  1002. decoration: BoxDecoration(
  1003. color: colors.bgPage,
  1004. borderRadius: BorderRadius.circular(4),
  1005. border: Border.all(color: colors.border),
  1006. ),
  1007. child: Center(
  1008. child: Icon(
  1009. Icons.add,
  1010. size: 24,
  1011. color: colors.textPlaceholder,
  1012. ),
  1013. ),
  1014. ),
  1015. ),
  1016. ],
  1017. ),
  1018. ],
  1019. );
  1020. }
  1021. // ═══ 6. 底部操作栏 ═══
  1022. Widget _buildBottomBar(AppLocalizations l10n) {
  1023. final isDraft = widget.id != null;
  1024. return ActionBar(
  1025. leftLabel: isDraft ? l10n.get('reset') : null,
  1026. centerLabel: l10n.get('saveDraft'),
  1027. rightLabel: l10n.get('submitApproval'),
  1028. showLeft: isDraft,
  1029. onLeftTap: isDraft
  1030. ? () => _showConfirmDialog(
  1031. l10n.get('confirmReset'),
  1032. l10n.get('resetWarning'),
  1033. l10n.get('cancel'),
  1034. l10n.get('confirmReset'),
  1035. _resetAll,
  1036. )
  1037. : null,
  1038. onCenterTap: () {
  1039. TDToast.showSuccess(l10n.get('draftSavedToast'), context: context);
  1040. context.pop();
  1041. },
  1042. onRightTap: () {
  1043. final err = _validate(l10n);
  1044. if (err.isNotEmpty) {
  1045. TDToast.showText(err.first, context: context);
  1046. return;
  1047. }
  1048. TDToast.showSuccess(
  1049. l10n.get('submittedAwaitingApproval'),
  1050. context: context,
  1051. );
  1052. context.pop();
  1053. },
  1054. );
  1055. }
  1056. List<String> _validate(AppLocalizations l10n) {
  1057. final e = <String>[];
  1058. if (_expenseTypes.isEmpty) e.add(l10n.get('selectAtLeastOneExpenseType'));
  1059. if (_purposeController.text.trim().isEmpty) {
  1060. e.add(l10n.get('enterFeeReason'));
  1061. }
  1062. if (_selectedProjectId == null) e.add(l10n.get('selectProject'));
  1063. if (_selectedSubjectId == null) e.add(l10n.get('selectSubject'));
  1064. if (_details.isEmpty) e.add(l10n.get('addAtLeastOneDetail'));
  1065. if (_expenseTypes.contains('travel')) {
  1066. if (_estimatedStartDate.isEmpty) {
  1067. e.add(l10n.get('selectEstimatedStartDate'));
  1068. }
  1069. if (_estimatedEndDate.isEmpty) e.add(l10n.get('selectEstimatedEndDate'));
  1070. }
  1071. if (_expenseTypes.contains('entertainment')) {
  1072. if (_entertainmentTarget == null || _entertainmentTarget!.isEmpty) {
  1073. e.add(l10n.get('entertainmentTargetUnit'));
  1074. }
  1075. if (_companionCount > _guestCount) {
  1076. e.add(l10n.get('companionNotExceedGuest'));
  1077. }
  1078. }
  1079. if (_expenseTypes.contains('meeting')) {
  1080. if (_meetingStartDate.isEmpty) {
  1081. e.add(l10n.get('selectEstimatedStartDate'));
  1082. }
  1083. if (_meetingEndDate.isEmpty) e.add(l10n.get('selectEstimatedEndDate'));
  1084. }
  1085. return e;
  1086. }
  1087. void _resetAll() => setState(() {
  1088. _purposeController.clear();
  1089. _expenseTypes.clear();
  1090. _urgency = Urgency.normal.value;
  1091. _isTaxIncluded = false;
  1092. _validUntil = '';
  1093. _selectedProjectId = null;
  1094. _selectedProjectName = null;
  1095. _selectedSubjectId = null;
  1096. _selectedSubjectName = null;
  1097. _availableBudget = 0;
  1098. _referenceNoController.clear();
  1099. _details.clear();
  1100. _attachments.clear();
  1101. _estimatedStartDate = '';
  1102. _estimatedEndDate = '';
  1103. _isOvernight = false;
  1104. _transportType = null;
  1105. _entertainmentTarget = null;
  1106. _entertainmentLevel = null;
  1107. _guestCount = 1;
  1108. _companionCount = 0;
  1109. _entertainmentVenue = '';
  1110. _meetingStartDate = '';
  1111. _meetingEndDate = '';
  1112. _meetingVenue = '';
  1113. });
  1114. bool _hasUnsaved() =>
  1115. _purposeController.text.isNotEmpty ||
  1116. _expenseTypes.isNotEmpty ||
  1117. _details.isNotEmpty ||
  1118. _attachments.isNotEmpty ||
  1119. _selectedProjectId != null ||
  1120. _estimatedStartDate.isNotEmpty ||
  1121. _estimatedEndDate.isNotEmpty ||
  1122. _entertainmentTarget != null ||
  1123. _meetingStartDate.isNotEmpty;
  1124. void _unfocus() => FocusScope.of(context).unfocus();
  1125. // ═══ 通用弹窗方法 ═══
  1126. void _showConfirmDialog(
  1127. String title,
  1128. String content,
  1129. String leftText,
  1130. String rightText,
  1131. VoidCallback onConfirm,
  1132. ) {
  1133. _unfocus();
  1134. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  1135. showDialog(
  1136. context: context,
  1137. builder: (ctx) => TDAlertDialog(
  1138. title: title,
  1139. content: content,
  1140. leftBtn: TDDialogButtonOptions(
  1141. title: leftText,
  1142. titleColor: colors.primary,
  1143. action: () => Navigator.pop(ctx),
  1144. ),
  1145. rightBtn: TDDialogButtonOptions(
  1146. title: rightText,
  1147. titleColor: colors.danger,
  1148. action: () {
  1149. Navigator.pop(ctx);
  1150. onConfirm();
  1151. },
  1152. ),
  1153. ),
  1154. );
  1155. }
  1156. void _showEnumPicker(
  1157. String title,
  1158. List<EnumEntry> entries,
  1159. Function(String) onPick,
  1160. ) {
  1161. _showListPicker(
  1162. title,
  1163. entries.map((e) => AppLocalizations.of(context).get(e.labelKey)).toList(),
  1164. (label) {
  1165. final entry = entries.firstWhere(
  1166. (e) => AppLocalizations.of(context).get(e.labelKey) == label,
  1167. );
  1168. onPick(entry.value);
  1169. },
  1170. );
  1171. }
  1172. void _showListPicker(
  1173. String title,
  1174. List<String> items,
  1175. Function(String) onPick,
  1176. ) {
  1177. _unfocus();
  1178. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  1179. TDPicker.showMultiPicker(
  1180. context,
  1181. title: title,
  1182. backgroundColor: colors.bgCard,
  1183. data: [items],
  1184. onConfirm: (selected) {
  1185. if (selected.isNotEmpty && selected[0] is int) {
  1186. final idx = selected[0] as int;
  1187. if (idx >= 0 && idx < items.length) {
  1188. Navigator.of(context).pop();
  1189. onPick(items[idx]);
  1190. }
  1191. }
  1192. },
  1193. );
  1194. }
  1195. void _showTextInput(
  1196. String title,
  1197. Function(String) onConfirm, {
  1198. String initialText = '',
  1199. }) {
  1200. _unfocus();
  1201. final l10n = AppLocalizations.of(context);
  1202. final c = TextEditingController(text: initialText);
  1203. showGeneralDialog(
  1204. context: context,
  1205. pageBuilder: (ctx, animation, secondaryAnimation) => TDInputDialog(
  1206. textEditingController: c,
  1207. title: title,
  1208. hintText: l10n.get('pleaseEnter'),
  1209. leftBtn: TDDialogButtonOptions(
  1210. title: l10n.get('cancel'),
  1211. action: () => Navigator.pop(ctx),
  1212. ),
  1213. rightBtn: TDDialogButtonOptions(
  1214. title: l10n.get('confirm'),
  1215. action: () {
  1216. onConfirm(c.text);
  1217. Navigator.pop(ctx);
  1218. },
  1219. ),
  1220. ),
  1221. );
  1222. }
  1223. void _showNumberInput(
  1224. String title,
  1225. Function(int) onConfirm, {
  1226. int initialValue = 0,
  1227. }) {
  1228. _unfocus();
  1229. final l10n = AppLocalizations.of(context);
  1230. final c = TextEditingController(
  1231. text: initialValue > 0 ? '$initialValue' : '',
  1232. );
  1233. showGeneralDialog(
  1234. context: context,
  1235. pageBuilder: (ctx, animation, secondaryAnimation) => TDInputDialog(
  1236. textEditingController: c,
  1237. title: title,
  1238. hintText: l10n.get('enterNumber'),
  1239. leftBtn: TDDialogButtonOptions(
  1240. title: l10n.get('cancel'),
  1241. action: () => Navigator.pop(ctx),
  1242. ),
  1243. rightBtn: TDDialogButtonOptions(
  1244. title: l10n.get('confirm'),
  1245. action: () {
  1246. onConfirm(int.tryParse(c.text) ?? 0);
  1247. Navigator.pop(ctx);
  1248. },
  1249. ),
  1250. ),
  1251. );
  1252. }
  1253. void _pickDate(Function(String) onPick) {
  1254. _unfocus();
  1255. final l10n = AppLocalizations.of(context);
  1256. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  1257. final theme = Theme.of(context);
  1258. final now = DateTime.now();
  1259. showModalBottomSheet(
  1260. context: context,
  1261. backgroundColor: Colors.transparent,
  1262. builder: (ctx) => Theme(
  1263. data: theme,
  1264. child: TDDatePicker(
  1265. title: l10n.get('selectDate'),
  1266. backgroundColor: colors.bgCard,
  1267. model: DatePickerModel(
  1268. useYear: true,
  1269. useMonth: true,
  1270. useDay: true,
  1271. useHour: false,
  1272. useMinute: false,
  1273. useSecond: false,
  1274. useWeekDay: false,
  1275. dateStart: [2020, 1, 1],
  1276. dateEnd: [now.year + 1, 12, 31],
  1277. dateInitial: [now.year, now.month, now.day],
  1278. ),
  1279. onConfirm: (selected) {
  1280. onPick(
  1281. '${selected['year']}-${selected['month']!.toString().padLeft(2, '0')}-${selected['day']!.toString().padLeft(2, '0')}',
  1282. );
  1283. Navigator.of(ctx).pop();
  1284. },
  1285. onCancel: (_) => Navigator.of(ctx).pop(),
  1286. ),
  1287. ),
  1288. );
  1289. }
  1290. Widget _label(String t, {bool required = false}) {
  1291. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  1292. return Text.rich(
  1293. TextSpan(
  1294. children: [
  1295. TextSpan(
  1296. text: t,
  1297. style: TextStyle(
  1298. fontSize: AppFontSizes.subtitle,
  1299. color: colors.textSecondary,
  1300. ),
  1301. ),
  1302. if (required)
  1303. TextSpan(
  1304. text: ' *',
  1305. style: TextStyle(
  1306. fontSize: AppFontSizes.subtitle,
  1307. color: colors.danger,
  1308. ),
  1309. ),
  1310. ],
  1311. ),
  1312. );
  1313. }
  1314. String _today() {
  1315. final n = DateTime.now();
  1316. return '${n.year}-${n.month.toString().padLeft(2, '0')}-${n.day.toString().padLeft(2, '0')}';
  1317. }
  1318. }
  1319. class _DetailItem {
  1320. final int id;
  1321. final String category;
  1322. final String categoryName;
  1323. final int quantity;
  1324. final String unit;
  1325. final double unitPrice;
  1326. final double amount;
  1327. final String remark;
  1328. const _DetailItem({
  1329. required this.id,
  1330. required this.category,
  1331. required this.categoryName,
  1332. required this.quantity,
  1333. required this.unit,
  1334. required this.unitPrice,
  1335. required this.amount,
  1336. required this.remark,
  1337. });
  1338. }