diff --git a/apps/lib/features/calendar/ui/screens/calendar_event_detail_screen.dart b/apps/lib/features/calendar/ui/screens/calendar_event_detail_screen.dart new file mode 100644 index 0000000..fc12651 --- /dev/null +++ b/apps/lib/features/calendar/ui/screens/calendar_event_detail_screen.dart @@ -0,0 +1,312 @@ +import 'package:flutter/material.dart'; +import 'package:lucide_icons/lucide_icons.dart'; +import '../../../../core/theme/design_tokens.dart'; + +class CalendarEventDetailScreen extends StatelessWidget { + const CalendarEventDetailScreen({super.key}); + + @override + Widget build(BuildContext context) { + return Scaffold( + backgroundColor: const Color(0xFFF8FAFC), + body: SafeArea( + child: Column( + children: [ + _buildHeader(context), + Expanded(child: _buildDetailOverlay()), + _buildInputContainer(), + ], + ), + ), + ); + } + + Widget _buildHeader(BuildContext context) { + return SizedBox( + height: 64, + child: Padding( + padding: const EdgeInsets.only(left: 16, right: 16, top: 12, bottom: 8), + child: Row( + children: [ + GestureDetector( + onTap: () => Navigator.of(context).pop(), + child: Container( + width: 36, + height: 36, + decoration: BoxDecoration( + color: const Color(0xFFF8FAFF), + borderRadius: BorderRadius.circular(18), + border: Border.all(color: const Color(0xFFDEE7F6)), + ), + child: const Icon( + LucideIcons.chevronLeft, + size: 16, + color: AppColors.slate700, + ), + ), + ), + ], + ), + ), + ); + } + + Widget _buildDetailOverlay() { + return Padding( + padding: const EdgeInsets.only(left: 16, right: 16, top: 8, bottom: 12), + child: Container( + padding: const EdgeInsets.all(16), + decoration: BoxDecoration( + color: Colors.white, + borderRadius: BorderRadius.circular(24), + border: Border.all(color: const Color(0xFFD8E3F5)), + ), + child: SingleChildScrollView( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + _buildTitleRow(), + const SizedBox(height: 14), + Container(height: 1, color: const Color(0xFFE5E7EB)), + const SizedBox(height: 14), + _buildDetailField('日期', '2026年2月9日 周一'), + const SizedBox(height: 14), + _buildDetailField('时间范围', '16:00 - 17:30'), + const SizedBox(height: 14), + _buildDetailField('提醒时间', '开始前30分钟'), + const SizedBox(height: 14), + _buildColorField(), + const SizedBox(height: 14), + _buildDetailField('邀请人', 'Qiuzh'), + const SizedBox(height: 14), + _buildNotesField(), + ], + ), + ), + ), + ); + } + + Widget _buildTitleRow() { + return Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + children: [ + const Icon( + LucideIcons.calendarCheck2, + size: 18, + color: AppColors.blue600, + ), + const SizedBox(width: 10), + const Text( + '购票提醒', + style: TextStyle( + fontSize: 18, + fontWeight: FontWeight.w700, + color: AppColors.slate900, + ), + ), + ], + ), + Row( + children: [ + Container( + width: 36, + height: 36, + decoration: BoxDecoration( + color: const Color(0xFFF8FAFF), + borderRadius: BorderRadius.circular(12), + border: Border.all(color: const Color(0xFFDCE5F4)), + ), + child: const Icon( + LucideIcons.pencil, + size: 18, + color: AppColors.slate600, + ), + ), + const SizedBox(width: 8), + Container( + width: 36, + height: 36, + decoration: BoxDecoration( + color: const Color(0xFFFFF1F2), + borderRadius: BorderRadius.circular(12), + border: Border.all(color: const Color(0xFFFECACA)), + ), + child: const Icon( + LucideIcons.trash2, + size: 18, + color: AppColors.red500, + ), + ), + ], + ), + ], + ); + } + + Widget _buildDetailField(String label, String value) { + return Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + label, + style: const TextStyle( + fontSize: 12, + fontWeight: FontWeight.w600, + color: AppColors.slate400, + ), + ), + const SizedBox(height: 4), + Text( + value, + style: const TextStyle( + fontSize: 15, + fontWeight: FontWeight.w600, + color: AppColors.slate900, + ), + ), + ], + ); + } + + Widget _buildColorField() { + return Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + const Text( + '日程颜色', + style: TextStyle( + fontSize: 12, + fontWeight: FontWeight.w600, + color: AppColors.slate400, + ), + ), + const SizedBox(height: 6), + Row( + children: [ + _buildColorOption(const Color(0xFF3B82F6), isSelected: true), + const SizedBox(width: 10), + _buildColorOption(const Color(0xFF8B5CF6)), + const SizedBox(width: 10), + _buildColorOption(const Color(0xFF10B981)), + const SizedBox(width: 10), + _buildColorOption(const Color(0xFFF59E0B)), + const SizedBox(width: 10), + _buildColorOption(const Color(0xFFEF4444)), + ], + ), + ], + ); + } + + Widget _buildColorOption(Color color, {bool isSelected = false}) { + return Container( + width: 28, + height: 28, + decoration: BoxDecoration( + color: color, + shape: BoxShape.circle, + border: isSelected + ? Border.all(color: AppColors.slate900, width: 2) + : null, + ), + child: isSelected + ? const Icon(Icons.check, size: 16, color: Colors.white) + : null, + ); + } + + Widget _buildNotesField() { + return Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + const Text( + '备注', + style: TextStyle( + fontSize: 12, + fontWeight: FontWeight.w600, + color: AppColors.slate400, + ), + ), + const SizedBox(height: 6), + Container( + width: double.infinity, + padding: const EdgeInsets.all(12), + decoration: BoxDecoration( + color: const Color(0xFFFDFEFF), + borderRadius: BorderRadius.circular(12), + border: Border.all(color: const Color(0xFFDCE5F4)), + ), + child: const Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + '记得提前准备好身份证', + style: TextStyle(fontSize: 14, color: AppColors.slate700), + ), + SizedBox(height: 8), + Text( + '出发前检查车票信息', + style: TextStyle(fontSize: 14, color: AppColors.slate700), + ), + ], + ), + ), + ], + ); + } + + Widget _buildInputContainer() { + return Container( + height: 80, + padding: const EdgeInsets.all(16), + color: const Color(0xFFF8FAFC), + child: Row( + children: [ + Container( + width: 36, + height: 36, + decoration: BoxDecoration( + color: Colors.white, + borderRadius: BorderRadius.circular(18), + border: Border.all(color: const Color(0xFFE2E8F0)), + ), + child: const Icon( + LucideIcons.plus, + size: 20, + color: AppColors.slate500, + ), + ), + const SizedBox(width: 8), + Expanded( + child: Container( + height: 48, + padding: const EdgeInsets.symmetric(horizontal: 16), + decoration: BoxDecoration( + color: Colors.white, + borderRadius: BorderRadius.circular(24), + ), + child: Row( + children: [ + const Expanded( + child: Text( + '输入消息...', + style: TextStyle(fontSize: 14, color: AppColors.slate400), + ), + ), + const Icon( + LucideIcons.mic, + size: 20, + color: AppColors.slate500, + ), + ], + ), + ), + ), + ], + ), + ); + } +} diff --git a/apps/lib/features/calendar/ui/screens/calendar_month_screen.dart b/apps/lib/features/calendar/ui/screens/calendar_month_screen.dart index 5dbc3db..aa2267d 100644 --- a/apps/lib/features/calendar/ui/screens/calendar_month_screen.dart +++ b/apps/lib/features/calendar/ui/screens/calendar_month_screen.dart @@ -1,4 +1,5 @@ import 'package:flutter/material.dart'; +import 'package:flutter/cupertino.dart'; import 'package:lucide_icons/lucide_icons.dart'; import '../../../../core/theme/design_tokens.dart'; import '../widgets/bottom_dock.dart'; diff --git a/apps/lib/features/calendar/ui/widgets/bottom_dock.dart b/apps/lib/features/calendar/ui/widgets/bottom_dock.dart index 3844a8f..57c25ad 100644 --- a/apps/lib/features/calendar/ui/widgets/bottom_dock.dart +++ b/apps/lib/features/calendar/ui/widgets/bottom_dock.dart @@ -1,6 +1,5 @@ import 'package:flutter/material.dart'; import 'package:lucide_icons/lucide_icons.dart'; -import '../../../../core/theme/design_tokens.dart'; enum DockTab { todo, calendar } @@ -94,11 +93,7 @@ class BottomDock extends StatelessWidget { borderRadius: BorderRadius.circular(18), border: Border.all(color: const Color(0xFFC9D8EE)), ), - child: const Icon( - LucideIcons.house, - size: 20, - color: Color(0xFF1E3A8A), - ), + child: const Icon(LucideIcons.home, size: 20, color: Color(0xFF1E3A8A)), ), ); }