outing_log_create_page.dart 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639
  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/responsive.dart';
  7. import '../../shared/widgets/form_section.dart';
  8. import '../../shared/widgets/action_bar.dart';
  9. import '../../core/i18n/app_localizations.dart';
  10. import '../../core/theme/app_colors_extension.dart';
  11. class OutingLogCreatePage extends ConsumerStatefulWidget {
  12. const OutingLogCreatePage({super.key});
  13. @override
  14. ConsumerState<OutingLogCreatePage> createState() =>
  15. _OutingLogCreatePageState();
  16. }
  17. class _OutingLogCreatePageState extends ConsumerState<OutingLogCreatePage> {
  18. final _customerCtrl = TextEditingController();
  19. final _summaryCtrl = TextEditingController();
  20. final _planCtrl = TextEditingController();
  21. // GPS 模拟
  22. String _gpsAddress = '深圳市南山区科技园南路88号';
  23. final double _gpsLat = 22.5431;
  24. final double _gpsLng = 113.9532;
  25. double _gpsAccuracy = 15.0;
  26. bool _gpsFailed = false;
  27. // 客户联想
  28. final List<String> _mockCustomers = [
  29. '华软科技',
  30. '云创数据',
  31. '数据引力',
  32. '天诚科技',
  33. '博思软件',
  34. '智云科技',
  35. '恒通信息',
  36. '创新无限',
  37. ];
  38. List<String> _customerSuggestions = [];
  39. bool _showCustomerSuggestions = false;
  40. String? _selectedCustomer;
  41. // 客户联系人
  42. final Map<String, List<Map<String, String>>> _mockContacts = {
  43. '华软科技': [
  44. {'name': '赵经理', 'phone': '13800138001', 'position': 'IT经理'},
  45. {'name': '李主管', 'phone': '13800138002', 'position': '采购主管'},
  46. ],
  47. '云创数据': [
  48. {'name': '陈经理', 'phone': '13800138003', 'position': '技术总监'},
  49. ],
  50. '数据引力': [
  51. {'name': '孙总', 'phone': '13800138004', 'position': '总经理'},
  52. ],
  53. '天诚科技': [
  54. {'name': '周主任', 'phone': '13800138005', 'position': '办公室主任'},
  55. ],
  56. };
  57. Map<String, String>? _selectedContact;
  58. // 照片
  59. final List<String> _photos = [];
  60. static const int _maxPhotos = 9;
  61. @override
  62. void dispose() {
  63. _customerCtrl.dispose();
  64. _summaryCtrl.dispose();
  65. _planCtrl.dispose();
  66. super.dispose();
  67. }
  68. void _onCustomerChanged(String value) {
  69. setState(() {
  70. _selectedCustomer = null;
  71. _selectedContact = null;
  72. if (value.isEmpty) {
  73. _customerSuggestions = [];
  74. _showCustomerSuggestions = false;
  75. } else {
  76. _customerSuggestions = _mockCustomers
  77. .where((c) => c.contains(value))
  78. .toList();
  79. _showCustomerSuggestions = _customerSuggestions.isNotEmpty;
  80. }
  81. });
  82. }
  83. void _selectCustomer(String customer) {
  84. setState(() {
  85. _selectedCustomer = customer;
  86. _customerCtrl.text = customer;
  87. _showCustomerSuggestions = false;
  88. _selectedContact = null;
  89. });
  90. }
  91. Future<void> _pickContact() async {
  92. final l10n = AppLocalizations.of(context);
  93. if (_selectedCustomer == null) {
  94. TDToast.showText(l10n.get('selectCustomerFirst'), context: context);
  95. return;
  96. }
  97. final contacts = _mockContacts[_selectedCustomer];
  98. if (contacts == null || contacts.isEmpty) {
  99. TDToast.showText(l10n.get('noContact'), context: context);
  100. return;
  101. }
  102. final result = await showDialog<Map<String, String>>(
  103. context: context,
  104. builder: (ctx) => TDAlertDialog.vertical(
  105. title: l10n.get('selectContact'),
  106. buttons: contacts
  107. .map(
  108. (c) => TDDialogButtonOptions(
  109. title: '${c['name']} ${c['position']} ${c['phone']}',
  110. action: () => Navigator.pop(ctx, c),
  111. ),
  112. )
  113. .toList(),
  114. ),
  115. );
  116. if (result != null) {
  117. setState(() => _selectedContact = result);
  118. }
  119. }
  120. Future<void> _takePhoto() async {
  121. final l10n = AppLocalizations.of(context);
  122. if (_photos.length >= _maxPhotos) {
  123. TDToast.showText(l10n.get('maxPhotoCount'), context: context);
  124. return;
  125. }
  126. final idx = _photos.length + 1;
  127. setState(() {
  128. _photos.add('photo_placeholder_$idx');
  129. });
  130. if (context.mounted) {
  131. TDToast.showText(
  132. l10n.getString(
  133. 'mockPhotoTaken',
  134. args: {
  135. 'idx': '$idx',
  136. 'time': DateTime.now().toString().substring(0, 19),
  137. 'lat': '$_gpsLat°N',
  138. 'lng': '$_gpsLng°E',
  139. },
  140. ),
  141. context: context,
  142. );
  143. }
  144. }
  145. void _removePhoto(int index) {
  146. setState(() => _photos.removeAt(index));
  147. }
  148. Future<void> _simulateGps() async {
  149. final l10n = AppLocalizations.of(context);
  150. setState(() {
  151. _gpsFailed = false;
  152. _gpsAddress = '深圳市南山区科技园南路88号';
  153. _gpsAccuracy = 15.0;
  154. });
  155. TDToast.showText(l10n.get('gpsSuccess'), context: context);
  156. }
  157. Future<void> _saveDraft() async {
  158. final l10n = AppLocalizations.of(context);
  159. if (context.mounted) {
  160. TDToast.showText(l10n.get('draftSavedToast'), context: context);
  161. }
  162. }
  163. Future<void> _submit() async {
  164. final l10n = AppLocalizations.of(context);
  165. if (_gpsFailed) {
  166. TDToast.showText(l10n.get('gpsPermission'), context: context);
  167. return;
  168. }
  169. if (_gpsAddress.isEmpty) {
  170. TDToast.showText(l10n.get('gpsLocatingWait'), context: context);
  171. return;
  172. }
  173. if (_photos.isEmpty) {
  174. TDToast.showText(l10n.get('requiredPhotos'), context: context);
  175. return;
  176. }
  177. if (_summaryCtrl.text.trim().isEmpty) {
  178. TDToast.showText(l10n.get('requiredSummary'), context: context);
  179. return;
  180. }
  181. if (context.mounted) {
  182. TDToast.showText(l10n.get('outingLogSubmitted'), context: context);
  183. context.pop();
  184. }
  185. }
  186. @override
  187. Widget build(BuildContext context) {
  188. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  189. final r = ResponsiveHelper.of(context);
  190. final l10n = AppLocalizations.of(context);
  191. ref
  192. .read(navBarConfigProvider.notifier)
  193. .update(
  194. NavBarConfig(
  195. title: l10n.get('outingLogCreate'),
  196. showBack: true,
  197. onBack: () => context.pop(),
  198. ),
  199. );
  200. return Column(
  201. children: [
  202. Expanded(
  203. child: Align(
  204. alignment: Alignment.topCenter,
  205. child: ConstrainedBox(
  206. constraints: BoxConstraints(maxWidth: r.formMaxWidth),
  207. child: SingleChildScrollView(
  208. padding: const EdgeInsets.symmetric(vertical: 8),
  209. child: Column(
  210. children: [
  211. _buildGpsSection(),
  212. const SizedBox(height: 8),
  213. FormSection(
  214. title: l10n.get('customerInfo'),
  215. children: [
  216. Container(
  217. padding: const EdgeInsets.symmetric(
  218. horizontal: 10,
  219. vertical: 4,
  220. ),
  221. decoration: BoxDecoration(
  222. color: colors.bgPage,
  223. borderRadius: BorderRadius.circular(4),
  224. ),
  225. child: Column(
  226. crossAxisAlignment: CrossAxisAlignment.start,
  227. children: [
  228. TDInput(
  229. controller: _customerCtrl,
  230. hintText: l10n.get('searchCustomer'),
  231. onChanged: _onCustomerChanged,
  232. ),
  233. if (_showCustomerSuggestions)
  234. ..._customerSuggestions.map(
  235. (s) => GestureDetector(
  236. onTap: () => _selectCustomer(s),
  237. child: Container(
  238. padding: const EdgeInsets.symmetric(
  239. vertical: 8,
  240. horizontal: 4,
  241. ),
  242. decoration: BoxDecoration(
  243. border: Border(
  244. top: BorderSide(color: colors.border),
  245. ),
  246. ),
  247. child: Text(
  248. s,
  249. style: TextStyle(
  250. fontSize: 14,
  251. color: colors.textPrimary,
  252. ),
  253. ),
  254. ),
  255. ),
  256. ),
  257. ],
  258. ),
  259. ),
  260. const SizedBox(height: 12),
  261. GestureDetector(
  262. onTap: _pickContact,
  263. child: Container(
  264. padding: const EdgeInsets.symmetric(
  265. horizontal: 10,
  266. vertical: 12,
  267. ),
  268. decoration: BoxDecoration(
  269. color: colors.bgPage,
  270. borderRadius: BorderRadius.circular(4),
  271. ),
  272. child: Row(
  273. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  274. children: [
  275. Text(
  276. _selectedContact != null
  277. ? '${_selectedContact!['name']} ${_selectedContact!['phone']}'
  278. : l10n.get('selectContactHint'),
  279. style: TextStyle(
  280. fontSize: 14,
  281. color: _selectedContact != null
  282. ? colors.textPrimary
  283. : colors.textPlaceholder,
  284. ),
  285. ),
  286. Icon(
  287. Icons.chevron_right,
  288. size: 14,
  289. color: colors.textPlaceholder,
  290. ),
  291. ],
  292. ),
  293. ),
  294. ),
  295. ],
  296. ),
  297. const SizedBox(height: 8),
  298. FormSection(
  299. title: l10n.get('workSummary'),
  300. children: [
  301. Container(
  302. padding: const EdgeInsets.all(12),
  303. decoration: BoxDecoration(
  304. color: colors.bgPage,
  305. borderRadius: BorderRadius.circular(4),
  306. ),
  307. child: TDInput(
  308. controller: _summaryCtrl,
  309. maxLines: 5,
  310. hintText: l10n.get('workSummaryRequiredHint'),
  311. ),
  312. ),
  313. ],
  314. ),
  315. const SizedBox(height: 8),
  316. FormSection(
  317. title: l10n.get('followUp'),
  318. children: [
  319. Container(
  320. padding: const EdgeInsets.symmetric(
  321. horizontal: 10,
  322. vertical: 4,
  323. ),
  324. decoration: BoxDecoration(
  325. color: colors.bgPage,
  326. borderRadius: BorderRadius.circular(4),
  327. ),
  328. child: TDInput(
  329. controller: _planCtrl,
  330. hintText: l10n.get('followUpOptional'),
  331. ),
  332. ),
  333. ],
  334. ),
  335. const SizedBox(height: 8),
  336. FormSection(
  337. title: l10n.get('sitePhotos'),
  338. actionText: _photos.length >= _maxPhotos
  339. ? l10n.get('limitReached')
  340. : l10n.get('takePhoto'),
  341. showAction: _photos.length < _maxPhotos,
  342. actionIcon: Icons.camera_alt_outlined,
  343. onActionTap: _photos.length >= _maxPhotos
  344. ? null
  345. : _takePhoto,
  346. children: [
  347. if (_photos.isEmpty)
  348. GestureDetector(
  349. onTap: _takePhoto,
  350. child: Container(
  351. height: 100,
  352. decoration: BoxDecoration(
  353. color: colors.bgPage,
  354. borderRadius: BorderRadius.circular(4),
  355. border: Border.all(
  356. color: colors.border,
  357. width: 1,
  358. ),
  359. ),
  360. child: Center(
  361. child: Column(
  362. mainAxisAlignment: MainAxisAlignment.center,
  363. children: [
  364. Icon(
  365. Icons.camera_alt_outlined,
  366. size: 32,
  367. color: colors.primary,
  368. ),
  369. SizedBox(height: 4),
  370. Text(
  371. l10n.get('tapToTakePhoto'),
  372. style: TextStyle(
  373. fontSize: 12,
  374. color: colors.textPlaceholder,
  375. ),
  376. ),
  377. ],
  378. ),
  379. ),
  380. ),
  381. )
  382. else
  383. Wrap(
  384. spacing: 8,
  385. runSpacing: 8,
  386. children: [
  387. ..._photos.asMap().entries.map(
  388. (entry) => _buildPhotoThumbnail(
  389. entry.key,
  390. entry.value,
  391. ),
  392. ),
  393. if (_photos.length < _maxPhotos)
  394. GestureDetector(
  395. onTap: _takePhoto,
  396. child: Container(
  397. width: 80,
  398. height: 80,
  399. decoration: BoxDecoration(
  400. color: colors.bgPage,
  401. borderRadius: BorderRadius.circular(4),
  402. border: Border.all(color: colors.border),
  403. ),
  404. child: Icon(
  405. Icons.add,
  406. size: 28,
  407. color: colors.primary,
  408. ),
  409. ),
  410. ),
  411. ],
  412. ),
  413. const SizedBox(height: 8),
  414. Container(
  415. padding: const EdgeInsets.all(8),
  416. decoration: BoxDecoration(
  417. color: colors.primaryLight,
  418. borderRadius: BorderRadius.circular(4),
  419. ),
  420. child: Row(
  421. children: [
  422. Icon(
  423. Icons.info_outline,
  424. size: 14,
  425. color: colors.primary,
  426. ),
  427. const SizedBox(width: 6),
  428. Expanded(
  429. child: Text(
  430. l10n.getString(
  431. 'watermarkHintDynamic',
  432. args: {
  433. 'lat': _gpsLat.toStringAsFixed(4),
  434. 'lng': _gpsLng.toStringAsFixed(4),
  435. },
  436. ),
  437. style: TextStyle(
  438. fontSize: 11,
  439. color: colors.textSecondary,
  440. ),
  441. ),
  442. ),
  443. ],
  444. ),
  445. ),
  446. ],
  447. ),
  448. const SizedBox(height: 80),
  449. ],
  450. ),
  451. ),
  452. ),
  453. ),
  454. ),
  455. ActionBar(
  456. centerLabel: l10n.get('saveDraft'),
  457. rightLabel: l10n.get('submit'),
  458. showLeft: false,
  459. onCenterTap: _saveDraft,
  460. onRightTap: _submit,
  461. ),
  462. ],
  463. );
  464. }
  465. Widget _buildGpsSection() {
  466. final l10n = AppLocalizations.of(context);
  467. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  468. if (_gpsFailed) {
  469. return Container(
  470. margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
  471. padding: const EdgeInsets.all(12),
  472. decoration: BoxDecoration(
  473. color: colors.bgCard,
  474. borderRadius: BorderRadius.circular(8),
  475. ),
  476. child: Row(
  477. children: [
  478. Icon(Icons.location_off, size: 22, color: colors.statusGray),
  479. const SizedBox(width: 10),
  480. Expanded(
  481. child: Column(
  482. crossAxisAlignment: CrossAxisAlignment.start,
  483. children: [
  484. Text(
  485. l10n.get('gpsFailed'),
  486. style: TextStyle(fontSize: 14, color: colors.textPrimary),
  487. ),
  488. SizedBox(height: 4),
  489. Text(
  490. l10n.get('gpsFailedHint'),
  491. style: TextStyle(fontSize: 12, color: colors.textSecondary),
  492. ),
  493. ],
  494. ),
  495. ),
  496. GestureDetector(
  497. onTap: _simulateGps,
  498. child: Container(
  499. padding: const EdgeInsets.symmetric(
  500. horizontal: 12,
  501. vertical: 6,
  502. ),
  503. decoration: BoxDecoration(
  504. color: colors.primaryLight,
  505. borderRadius: BorderRadius.circular(4),
  506. ),
  507. child: Text(
  508. l10n.get('retry'),
  509. style: TextStyle(fontSize: 12, color: colors.primary),
  510. ),
  511. ),
  512. ),
  513. ],
  514. ),
  515. );
  516. }
  517. final isWarning = _gpsAccuracy > 100;
  518. return Container(
  519. margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
  520. padding: const EdgeInsets.all(12),
  521. decoration: BoxDecoration(
  522. color: colors.bgCard,
  523. borderRadius: BorderRadius.circular(8),
  524. ),
  525. child: Row(
  526. crossAxisAlignment: CrossAxisAlignment.start,
  527. children: [
  528. Icon(
  529. Icons.shield_outlined,
  530. size: 22,
  531. color: isWarning ? colors.warning : colors.success,
  532. ),
  533. const SizedBox(width: 10),
  534. Expanded(
  535. child: Column(
  536. crossAxisAlignment: CrossAxisAlignment.start,
  537. children: [
  538. Text(
  539. _gpsAddress,
  540. style: TextStyle(fontSize: 14, color: colors.textPrimary),
  541. ),
  542. const SizedBox(height: 4),
  543. Row(
  544. children: [
  545. Text(
  546. '${_gpsLat.toStringAsFixed(4)}°N, ${_gpsLng.toStringAsFixed(4)}°E · 精度 ${_gpsAccuracy.toStringAsFixed(0)}m',
  547. style: TextStyle(
  548. fontSize: 12,
  549. color: isWarning
  550. ? colors.warning
  551. : colors.textSecondary,
  552. ),
  553. ),
  554. if (isWarning) ...[
  555. const SizedBox(width: 6),
  556. Icon(
  557. Icons.warning_amber_rounded,
  558. size: 14,
  559. color: colors.warning,
  560. ),
  561. ],
  562. ],
  563. ),
  564. ],
  565. ),
  566. ),
  567. ],
  568. ),
  569. );
  570. }
  571. Widget _buildPhotoThumbnail(int index, String photo) {
  572. final colors = Theme.of(context).extension<AppColorsExtension>()!;
  573. return Stack(
  574. children: [
  575. Container(
  576. width: 80,
  577. height: 80,
  578. decoration: BoxDecoration(
  579. color: colors.infoBorder,
  580. borderRadius: BorderRadius.circular(4),
  581. ),
  582. child: Center(
  583. child: Icon(Icons.image_outlined, size: 32, color: colors.primary),
  584. ),
  585. ),
  586. Positioned(
  587. top: -4,
  588. right: -4,
  589. child: GestureDetector(
  590. onTap: () => _removePhoto(index),
  591. child: Container(
  592. padding: const EdgeInsets.all(2),
  593. decoration: BoxDecoration(
  594. color: colors.danger,
  595. shape: BoxShape.circle,
  596. ),
  597. child: const Icon(Icons.close, size: 14, color: Colors.white),
  598. ),
  599. ),
  600. ),
  601. Positioned(
  602. bottom: 2,
  603. left: 2,
  604. right: 2,
  605. child: Container(
  606. padding: const EdgeInsets.symmetric(horizontal: 2),
  607. color: Colors.black54,
  608. child: Text(
  609. '${DateTime.now().hour.toString().padLeft(2, '0')}:${DateTime.now().minute.toString().padLeft(2, '0')} ${_gpsLat.toStringAsFixed(2)},${_gpsLng.toStringAsFixed(2)}',
  610. style: const TextStyle(fontSize: 8, color: Colors.white),
  611. maxLines: 1,
  612. overflow: TextOverflow.ellipsis,
  613. ),
  614. ),
  615. ),
  616. ],
  617. );
  618. }
  619. }