qzl/social-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(apps/todo): 新增 TodoEditScreen 编辑功能

Browse Source
This commit is contained in:
zl-q
2026-03-19 00:51:52 +08:00
parent 039e8b73d6
commit 82a7d594bd
3 changed files with 627 additions and 696 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/lib/features/todo/ui/screens/todo_detail_screen.dart
+39 -302
View File
@@ -2,15 +2,15 @@ import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:lucide_icons/lucide_icons.dart';
import '../../../../core/di/injection.dart';
import '../../../../core/router/app_routes.dart';
import '../../../../core/theme/design_tokens.dart';
import '../../../../shared/widgets/app_loading_indicator.dart';
import '../../../../shared/widgets/back_title_page_header.dart';
import '../../../../shared/widgets/detail_header_action_menu.dart';
import '../../../../shared/widgets/destructive_action_sheet.dart';
import '../../../../shared/widgets/app_button.dart';
import '../../../../shared/widgets/error_retry_surface.dart';
import '../../../../shared/widgets/full_screen_loading.dart';
import '../../../../shared/widgets/toast/toast.dart';
import '../../../../shared/widgets/toast/toast_type.dart';
import '../../../calendar/data/calendar_api.dart';
import '../../data/todo_api.dart';
enum _TodoHeaderAction { edit, delete }
@@ -38,6 +38,9 @@ class _TodoDetailScreenState extends State<TodoDetailScreen> {
}
Future<void> _loadTodo() async {
if (!mounted) {
return;
}
setState(() {
_isLoading = true;
_error = null;
@@ -45,11 +48,17 @@ class _TodoDetailScreenState extends State<TodoDetailScreen> {
try {
final todo = await _todoApi.getTodo(widget.todoId);
if (!mounted) {
return;
}
setState(() {
_todo = todo;
_isLoading = false;
});
} catch (e) {
if (!mounted) {
return;
}
setState(() {
_error = e.toString();
_isLoading = false;
@@ -90,12 +99,21 @@ class _TodoDetailScreenState extends State<TodoDetailScreen> {
return Scaffold(
backgroundColor: AppColors.todoBg,
body: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
_buildHeader(),
Expanded(child: _buildContent()),
],
child: Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [AppColors.homeBackgroundTop, AppColors.todoBg],
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
_buildHeader(),
Expanded(child: _buildContent()),
],
),
),
),
);
@@ -144,20 +162,11 @@ class _TodoDetailScreenState extends State<TodoDetailScreen> {
Widget _buildContent() {
if (_isLoading) {
return const Center(child: AppLoadingIndicator(size: 22));
return const FullScreenLoading();
}
if (_error != null) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('加载失败: $_error', style: const TextStyle(color: Colors.red)),
const SizedBox(height: 16),
AppButton(text: '重试', onPressed: _loadTodo),
],
),
);
return ErrorRetrySurface(message: '加载失败: $_error', onRetry: _loadTodo);
}
if (_todo == null) {
@@ -187,7 +196,8 @@ class _TodoDetailScreenState extends State<TodoDetailScreen> {
title: item.title,
time: _formatEventTime(item.startAt, item.endAt),
borderColor: AppColors.todoEventBorder1,
onTap: () => context.push('/calendar/events/${item.id}'),
onTap: () =>
context.push(AppRoutes.calendarEventDetail(item.id)),
),
),
],
@@ -369,27 +379,14 @@ class _TodoDetailScreenState extends State<TodoDetailScreen> {
}
void _editTodo() async {
final result = await showModalBottomSheet<Map<String, dynamic>>(
context: context,
isScrollControlled: true,
backgroundColor: Colors.transparent,
builder: (context) => _EditTodoSheet(todo: _todo!),
);
if (result != null) {
try {
await _todoApi.updateTodo(
_todo!.id,
title: result['title'] as String,
description: result['description'] as String?,
priority: result['priority'] as int,
scheduleItemIds: result['schedule_item_ids'] as List<String>?,
);
await _loadTodo();
} catch (e) {
if (mounted) {
Toast.show(context, '更新失败: $e', type: ToastType.error);
}
if (_todo == null) {
return;
}
final changed = await context.push<bool>(AppRoutes.todoEdit(_todo!.id));
if (changed == true) {
await _loadTodo();
if (mounted && _error != null) {
Toast.show(context, '刷新失败: $_error', type: ToastType.error);
}
}
}
@@ -416,263 +413,3 @@ class _TodoDetailScreenState extends State<TodoDetailScreen> {
}
}
}
class _EditTodoSheet extends StatefulWidget {
final TodoResponse todo;
const _EditTodoSheet({required this.todo});
@override
State<_EditTodoSheet> createState() => _EditTodoSheetState();
}
class _EditTodoSheetState extends State<_EditTodoSheet> {
late TextEditingController _titleController;
late TextEditingController _descriptionController;
late int _priority;
late Set<String> _selectedScheduleItems;
late final Future<List<_ScheduleItemSimple>> _scheduleItemsFuture;
@override
void initState() {
super.initState();
_titleController = TextEditingController(text: widget.todo.title);
_descriptionController = TextEditingController(
text: widget.todo.description ?? '',
);
_priority = widget.todo.priority;
_selectedScheduleItems = widget.todo.scheduleItems.map((e) => e.id).toSet();
_scheduleItemsFuture = _loadScheduleItems();
}
@override
void dispose() {
_titleController.dispose();
_descriptionController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Container(
height: MediaQuery.of(context).size.height * 0.85,
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
),
child: Column(
children: [
SingleChildScrollView(
padding: const EdgeInsets.all(24),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text(
'编辑待办',
style: TextStyle(
fontFamily: 'Inter',
fontSize: 20,
fontWeight: FontWeight.w700,
),
),
IconButton(
onPressed: () => Navigator.of(context).pop(),
icon: const Icon(LucideIcons.x),
),
],
),
const SizedBox(height: 20),
TextField(
controller: _titleController,
decoration: const InputDecoration(
labelText: '标题',
border: OutlineInputBorder(),
),
),
const SizedBox(height: 16),
TextField(
controller: _descriptionController,
decoration: const InputDecoration(
labelText: '描述（可选）',
border: OutlineInputBorder(),
),
maxLines: 2,
),
const SizedBox(height: 16),
const Text(
'优先级',
style: TextStyle(
fontFamily: 'Inter',
fontSize: 14,
fontWeight: FontWeight.w600,
),
),
const SizedBox(height: 8),
Row(
children: [
_PriorityChip(
label: '重要紧急',
selected: _priority == 1,
color: AppColors.g1Border,
onTap: () => setState(() => _priority = 1),
),
const SizedBox(width: 8),
_PriorityChip(
label: '紧急不重要',
selected: _priority == 3,
color: AppColors.g2Border,
onTap: () => setState(() => _priority = 3),
),
const SizedBox(width: 8),
_PriorityChip(
label: '重要不紧急',
selected: _priority == 2,
color: AppColors.g3Border,
onTap: () => setState(() => _priority = 2),
),
],
),
],
),
),
Expanded(
child: FutureBuilder<List<_ScheduleItemSimple>>(
future: _scheduleItemsFuture,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return const Center(child: AppLoadingIndicator(size: 22));
}
if (snapshot.hasError) {
return Center(child: Text('加载失败: ${snapshot.error}'));
}
final items = snapshot.data ?? [];
if (items.isEmpty) {
return const Center(child: Text('暂无日历事件'));
}
return ListView.builder(
padding: const EdgeInsets.symmetric(horizontal: 16),
itemCount: items.length,
itemBuilder: (context, index) {
final item = items[index];
final isSelected = _selectedScheduleItems.contains(item.id);
return CheckboxListTile(
title: Text(item.title),
subtitle: Text(_formatDate(item.startAt)),
value: isSelected,
onChanged: (value) {
setState(() {
if (value == true) {
_selectedScheduleItems.add(item.id);
} else {
_selectedScheduleItems.remove(item.id);
}
});
},
);
},
);
},
),
),
Padding(
padding: const EdgeInsets.all(16),
child: SizedBox(
width: double.infinity,
child: AppButton(
text: '保存',
onPressed: () {
if (_titleController.text.trim().isEmpty) {
Toast.show(context, '请输入标题', type: ToastType.warning);
return;
}
Navigator.of(context).pop({
'title': _titleController.text.trim(),
'description': _descriptionController.text.trim().isEmpty
? null
: _descriptionController.text.trim(),
'priority': _priority,
'schedule_item_ids': _selectedScheduleItems.toList(),
});
},
),
),
),
],
),
);
}
Future<List<_ScheduleItemSimple>> _loadScheduleItems() async {
final calendarApi = sl<CalendarApi>();
final now = DateTime.now();
final start = now.subtract(const Duration(days: 30));
final end = now.add(const Duration(days: 90));
final items = await calendarApi.listByRange(startAt: start, endAt: end);
return items
.map(
(e) =>
_ScheduleItemSimple(id: e.id, title: e.title, startAt: e.startAt),
)
.toList();
}
String _formatDate(DateTime dt) {
return '${dt.year}年${dt.month}月${dt.day}日 ${dt.hour.toString().padLeft(2, '0')}:${dt.minute.toString().padLeft(2, '0')}';
}
}
class _ScheduleItemSimple {
final String id;
final String title;
final DateTime startAt;
_ScheduleItemSimple({
required this.id,
required this.title,
required this.startAt,
});
}
class _PriorityChip extends StatelessWidget {
final String label;
final bool selected;
final Color color;
final VoidCallback onTap;
const _PriorityChip({
required this.label,
required this.selected,
required this.color,
required this.onTap,
});
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: onTap,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
decoration: BoxDecoration(
color: selected ? color.withValues(alpha: 0.2) : Colors.transparent,
border: Border.all(
color: selected ? color : AppColors.slate300,
width: selected ? 2 : 1,
),
borderRadius: BorderRadius.circular(20),
),
child: Text(
label,
style: TextStyle(
fontFamily: 'Inter',
fontSize: 12,
fontWeight: selected ? FontWeight.w600 : FontWeight.normal,
color: selected ? color : AppColors.slate600,
),
),
),
);
}
}
apps/lib/features/todo/ui/screens/todo_edit_screen.dart
+574
View File
@@ -0,0 +1,574 @@
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import '../../../../core/di/injection.dart';
import '../../../../core/theme/design_tokens.dart';
import '../../../../shared/widgets/app_button.dart';
import '../../../../shared/widgets/app_pressable.dart';
import '../../../../shared/widgets/app_sheet_input_field.dart';
import '../../../../shared/widgets/back_title_page_header.dart';
import '../../../../shared/widgets/error_retry_surface.dart';
import '../../../../shared/widgets/full_screen_loading.dart';
import '../../../../shared/widgets/toast/toast.dart';
import '../../../../shared/widgets/toast/toast_type.dart';
import '../../../calendar/data/calendar_api.dart';
import '../../data/todo_api.dart';
class TodoEditScreen extends StatefulWidget {
final String? todoId;
const TodoEditScreen({super.key, required this.todoId});
const TodoEditScreen.create({super.key}) : todoId = null;
bool get isCreateMode => todoId == null;
@override
State<TodoEditScreen> createState() => _TodoEditScreenState();
}
class _TodoEditScreenState extends State<TodoEditScreen> {
final TodoApi _todoApi = sl<TodoApi>();
final CalendarApi _calendarApi = sl<CalendarApi>();
final TextEditingController _titleController = TextEditingController();
final TextEditingController _descriptionController = TextEditingController();
TodoResponse? _todo;
bool _loading = true;
bool _saving = false;
String? _error;
int _priority = 1;
final Set<String> _selectedScheduleItemIds = <String>{};
List<_ScheduleItemSimple> _scheduleItems = const <_ScheduleItemSimple>[];
@override
void initState() {
super.initState();
_loadPage();
}
@override
void dispose() {
_titleController.dispose();
_descriptionController.dispose();
super.dispose();
}
Future<void> _loadPage() async {
setState(() {
_loading = true;
_error = null;
});
try {
final now = DateTime.now();
final start = now.subtract(const Duration(days: 30));
final end = now.add(const Duration(days: 90));
final scheduleItems = await _calendarApi.listByRange(
startAt: start,
endAt: end,
);
TodoResponse? todo;
if (!widget.isCreateMode) {
todo = await _todoApi.getTodo(widget.todoId!);
}
if (!mounted) {
return;
}
_todo = todo;
_titleController.text = todo?.title ?? '';
_descriptionController.text = todo?.description ?? '';
_priority = todo?.priority ?? 1;
_selectedScheduleItemIds
..clear()
..addAll(todo?.scheduleItems.map((item) => item.id) ?? const []);
_scheduleItems = scheduleItems
.map(
(item) => _ScheduleItemSimple(
id: item.id,
title: item.title,
startAt: item.startAt,
),
)
.toList();
setState(() {
_loading = false;
});
} catch (error) {
if (!mounted) {
return;
}
setState(() {
_loading = false;
_error = error.toString();
});
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: AppColors.todoBg,
body: SafeArea(
child: Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [AppColors.homeBackgroundTop, AppColors.todoBg],
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
BackTitlePageHeader(title: widget.isCreateMode ? '新建待办' : '编辑待办'),
Expanded(child: _buildBody()),
_buildBottomAction(),
],
),
),
),
);
}
Widget _buildBody() {
if (_loading) {
return const FullScreenLoading();
}
if (_error != null) {
return ErrorRetrySurface(message: '加载失败: $_error', onRetry: _loadPage);
}
if (!widget.isCreateMode && _todo == null) {
return const Center(child: Text('待办不存在'));
}
return ListView(
padding: const EdgeInsets.fromLTRB(
AppSpacing.lg,
AppSpacing.sm,
AppSpacing.lg,
AppSpacing.lg,
),
children: [
_buildHeaderCard(),
const SizedBox(height: AppSpacing.md),
_buildFormCard(),
const SizedBox(height: AppSpacing.md),
_buildScheduleCard(),
],
);
}
Widget _buildHeaderCard() {
return Container(
padding: const EdgeInsets.all(AppSpacing.lg),
decoration: BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.circular(AppRadius.xl),
border: Border.all(color: AppColors.borderTertiary),
boxShadow: [
BoxShadow(
color: AppColors.slate200.withValues(alpha: 0.34),
blurRadius: AppRadius.lg,
offset: const Offset(0, AppSpacing.xs),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'待办信息',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w700,
color: AppColors.slate900,
),
),
const SizedBox(height: AppSpacing.xs),
Text(
widget.isCreateMode
? '创建后可在四象限中查看并继续调整优先级与关联事件。'
: _todo?.status == 'done'
? '该待办已完成，你仍可调整内容并重新组织关联事件。'
: '调整标题、优先级和关联事件，保持任务结构清晰。',
style: const TextStyle(fontSize: 13, color: AppColors.slate500),
),
],
),
);
}
Widget _buildFormCard() {
return Container(
padding: const EdgeInsets.all(AppSpacing.lg),
decoration: BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.circular(AppRadius.xl),
border: Border.all(color: AppColors.borderSecondary),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
AppSheetInputField(
controller: _titleController,
label: '标题',
hint: '输入待办标题',
),
const SizedBox(height: AppSpacing.lg),
AppSheetInputField(
controller: _descriptionController,
label: '描述（可选）',
hint: '补充细节或备注',
maxLines: 2,
),
const SizedBox(height: AppSpacing.lg),
const Text(
'优先级',
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w600,
color: AppColors.slate700,
),
),
const SizedBox(height: AppSpacing.sm),
Wrap(
spacing: AppSpacing.sm,
runSpacing: AppSpacing.sm,
children: [
_PriorityPill(
label: '重要紧急',
selected: _priority == 1,
borderColor: AppColors.g1Border,
activeColor: AppColors.g1Text,
onTap: () => setState(() => _priority = 1),
),
_PriorityPill(
label: '紧急不重要',
selected: _priority == 3,
borderColor: AppColors.g2Border,
activeColor: AppColors.g2Text,
onTap: () => setState(() => _priority = 3),
),
_PriorityPill(
label: '重要不紧急',
selected: _priority == 2,
borderColor: AppColors.g3Border,
activeColor: AppColors.g3Text,
onTap: () => setState(() => _priority = 2),
),
],
),
],
),
);
}
Widget _buildScheduleCard() {
return Container(
padding: const EdgeInsets.all(AppSpacing.lg),
decoration: BoxDecoration(
color: AppColors.surfaceSecondary,
borderRadius: BorderRadius.circular(AppRadius.xl),
border: Border.all(color: AppColors.borderSecondary),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const Text(
'关联日历事件',
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w600,
color: AppColors.slate700,
),
),
const Spacer(),
Text(
'${_selectedScheduleItemIds.length}项',
style: const TextStyle(
fontSize: 12,
fontWeight: FontWeight.w600,
color: AppColors.slate500,
),
),
],
),
const SizedBox(height: AppSpacing.sm),
if (_scheduleItems.isEmpty)
const Padding(
padding: EdgeInsets.symmetric(vertical: AppSpacing.xl),
child: Center(
child: Text(
'暂无可关联的日历事件',
style: TextStyle(color: AppColors.slate500),
),
),
)
else
ConstrainedBox(
constraints: const BoxConstraints(maxHeight: 280),
child: ListView.separated(
shrinkWrap: true,
itemCount: _scheduleItems.length,
separatorBuilder: (context, index) =>
const SizedBox(height: AppSpacing.sm),
itemBuilder: (context, index) {
final item = _scheduleItems[index];
final selected = _selectedScheduleItemIds.contains(item.id);
return _ScheduleSelectableTile(
title: item.title,
subtitle: _formatDate(item.startAt),
selected: selected,
onTap: () {
setState(() {
if (selected) {
_selectedScheduleItemIds.remove(item.id);
} else {
_selectedScheduleItemIds.add(item.id);
}
});
},
);
},
),
),
],
),
);
}
Widget _buildBottomAction() {
final canSave = !_loading && !_saving;
return Container(
padding: const EdgeInsets.fromLTRB(
AppSpacing.lg,
AppSpacing.sm,
AppSpacing.lg,
AppSpacing.lg,
),
decoration: BoxDecoration(
color: AppColors.white.withValues(alpha: 0.9),
border: const Border(top: BorderSide(color: AppColors.borderSecondary)),
),
child: AppButton(
text: _saving ? '保存中...' : (widget.isCreateMode ? '创建待办' : '保存修改'),
onPressed: canSave ? _save : null,
),
);
}
Future<void> _save() async {
if (_saving) {
return;
}
final title = _titleController.text.trim();
if (title.isEmpty) {
Toast.show(context, '请输入标题', type: ToastType.warning);
return;
}
setState(() {
_saving = true;
});
try {
final description = _descriptionController.text.trim().isEmpty
? null
: _descriptionController.text.trim();
if (widget.isCreateMode) {
await _todoApi.createTodo(
title: title,
description: description,
priority: _priority,
scheduleItemIds: _selectedScheduleItemIds.toList(),
);
} else {
await _todoApi.updateTodo(
widget.todoId!,
title: title,
description: description,
priority: _priority,
scheduleItemIds: _selectedScheduleItemIds.toList(),
);
}
if (!mounted) {
return;
}
Toast.show(
context,
widget.isCreateMode ? '待办已创建' : '待办已更新',
type: ToastType.success,
);
context.pop(true);
} catch (error) {
if (!mounted) {
return;
}
Toast.show(context, '保存失败: $error', type: ToastType.error);
} finally {
if (mounted) {
setState(() {
_saving = false;
});
}
}
}
String _formatDate(DateTime dt) {
return '${dt.year}年${dt.month}月${dt.day}日 ${dt.hour.toString().padLeft(2, '0')}:${dt.minute.toString().padLeft(2, '0')}';
}
}
class _ScheduleItemSimple {
final String id;
final String title;
final DateTime startAt;
const _ScheduleItemSimple({
required this.id,
required this.title,
required this.startAt,
});
}
class _PriorityPill extends StatelessWidget {
final String label;
final bool selected;
final Color borderColor;
final Color activeColor;
final VoidCallback onTap;
const _PriorityPill({
required this.label,
required this.selected,
required this.borderColor,
required this.activeColor,
required this.onTap,
});
@override
Widget build(BuildContext context) {
return AppPressable(
onTap: onTap,
borderRadius: BorderRadius.circular(AppRadius.full),
child: AnimatedContainer(
duration: const Duration(milliseconds: 140),
curve: Curves.easeOut,
padding: const EdgeInsets.symmetric(
horizontal: AppSpacing.md,
vertical: AppSpacing.sm,
),
decoration: BoxDecoration(
color: selected
? borderColor.withValues(alpha: 0.28)
: AppColors.white,
borderRadius: BorderRadius.circular(AppRadius.full),
border: Border.all(
color: selected ? borderColor : AppColors.slate300,
width: selected ? 1.5 : 1,
),
),
child: Text(
label,
style: TextStyle(
fontSize: 12,
fontWeight: selected ? FontWeight.w600 : FontWeight.w500,
color: selected ? activeColor : AppColors.slate600,
),
),
),
);
}
}
class _ScheduleSelectableTile extends StatelessWidget {
final String title;
final String subtitle;
final bool selected;
final VoidCallback onTap;
const _ScheduleSelectableTile({
required this.title,
required this.subtitle,
required this.selected,
required this.onTap,
});
@override
Widget build(BuildContext context) {
return AppPressable(
onTap: onTap,
borderRadius: BorderRadius.circular(AppRadius.lg),
child: AnimatedContainer(
duration: const Duration(milliseconds: 120),
curve: Curves.easeOut,
padding: const EdgeInsets.all(AppSpacing.md),
decoration: BoxDecoration(
color: selected ? AppColors.surfaceInfoLight : AppColors.white,
borderRadius: BorderRadius.circular(AppRadius.lg),
border: Border.all(
color: selected ? AppColors.borderQuaternary : AppColors.border,
),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
fontSize: 13,
fontWeight: FontWeight.w600,
color: AppColors.slate800,
),
),
const SizedBox(height: AppSpacing.xs),
Text(
subtitle,
style: const TextStyle(
fontSize: 12,
color: AppColors.slate500,
),
),
],
),
),
const SizedBox(width: AppSpacing.md),
AnimatedContainer(
duration: const Duration(milliseconds: 120),
width: AppSpacing.lg,
height: AppSpacing.lg,
decoration: BoxDecoration(
color: selected ? AppColors.blue600 : AppColors.white,
borderRadius: BorderRadius.circular(AppRadius.full),
border: Border.all(
color: selected ? AppColors.blue600 : AppColors.slate300,
),
),
child: selected
? const Icon(Icons.check, size: 12, color: AppColors.white)
: null,
),
],
),
),
);
}
}
apps/lib/features/todo/ui/screens/todo_quadrants_screen.dart
+14 -394
View File
@@ -2,16 +2,16 @@ import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:lucide_icons/lucide_icons.dart';
import '../../../../core/di/injection.dart';
import '../../../../core/router/app_routes.dart';
import '../../../../core/theme/design_tokens.dart';
import '../../../../shared/widgets/app_button.dart';
import '../../../../shared/widgets/app_loading_indicator.dart';
import '../../../home/ui/navigation/home_return_policy.dart';
import '../../../../shared/widgets/app_pull_refresh_feedback.dart';
import '../../../../shared/widgets/app_pressable.dart';
import '../../../../shared/widgets/app_sheet_input_field.dart';
import '../../../../shared/widgets/back_title_page_header.dart';
import '../../../../shared/widgets/error_retry_surface.dart';
import '../../../../shared/widgets/full_screen_loading.dart';
import '../../../../shared/widgets/toast/toast.dart';
import '../../../../shared/widgets/toast/toast_type.dart';
import '../../../calendar/data/calendar_api.dart';
import '../../../calendar/ui/calendar_state_manager.dart';
import '../../../calendar/ui/widgets/bottom_dock.dart';
import '../../data/todo_api.dart';
@@ -115,31 +115,13 @@ class _TodoQuadrantsScreenState extends State<TodoQuadrantsScreen> {
}
void _navigateToDetail(TodoResponse todo) {
context.push('/todo/${todo.id}');
context.push(AppRoutes.todoDetail(todo.id));
}
Future<void> _addTodo() async {
final result = await showModalBottomSheet<Map<String, dynamic>>(
context: context,
isScrollControlled: true,
backgroundColor: Colors.transparent,
builder: (context) => const _AddTodoSheet(),
);
if (result != null) {
try {
await _todoApi.createTodo(
title: result['title'] as String,
description: result['description'] as String?,
priority: result['priority'] as int,
scheduleItemIds: (result['schedule_item_ids'] as List<String>?) ?? [],
);
await _loadTodos();
} catch (e) {
if (mounted) {
Toast.show(context, '创建失败: $e', type: ToastType.error);
}
}
final created = await context.push<bool>(AppRoutes.todoCreate);
if (created == true) {
await _loadTodos();
}
}
@@ -151,7 +133,7 @@ class _TodoQuadrantsScreenState extends State<TodoQuadrantsScreen> {
canPop: false,
onPopInvokedWithResult: (didPop, result) {
if (!didPop) {
context.go('/home');
returnToHomePreserveState(context);
}
},
child: SafeArea(
@@ -225,20 +207,11 @@ class _TodoQuadrantsScreenState extends State<TodoQuadrantsScreen> {
Widget _buildContent() {
if (_isLoading) {
return const Center(child: AppLoadingIndicator(size: 22));
return const FullScreenLoading();
}
if (_error != null) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('加载失败: $_error', style: const TextStyle(color: Colors.red)),
const SizedBox(height: 16),
AppButton(text: '重试', onPressed: _loadTodos),
],
),
);
return ErrorRetrySurface(message: '加载失败: $_error', onRetry: _loadTodos);
}
return Stack(
@@ -379,12 +352,12 @@ class _TodoQuadrantsScreenState extends State<TodoQuadrantsScreen> {
final dateStr =
'${date.year}-${date.month.toString().padLeft(2, '0')}-${date.day.toString().padLeft(2, '0')}';
if (viewType == CalendarViewType.month) {
context.go('/calendar/month');
context.push(AppRoutes.calendarMonth);
} else {
context.go('/calendar/dayweek?date=$dateStr');
context.push('${AppRoutes.calendarDayWeek}?date=$dateStr');
}
},
onHomeTap: () => context.go('/home'),
onHomeTap: () => returnToHomePreserveState(context),
);
}
}
@@ -499,356 +472,3 @@ class _TodoItemWidgetState extends State<_TodoItemWidget>
);
}
}
class _AddTodoSheet extends StatefulWidget {
const _AddTodoSheet();
@override
State<_AddTodoSheet> createState() => _AddTodoSheetState();
}
class _AddTodoSheetState extends State<_AddTodoSheet> {
final _titleController = TextEditingController();
final _descriptionController = TextEditingController();
int _priority = 1;
final Set<String> _selectedScheduleItems = {};
late final Future<List<_ScheduleItemSimple>> _scheduleItemsFuture;
@override
void initState() {
super.initState();
_scheduleItemsFuture = _loadScheduleItems();
}
@override
void dispose() {
_titleController.dispose();
_descriptionController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
final bottomInset = MediaQuery.of(context).viewInsets.bottom;
return AnimatedPadding(
duration: const Duration(milliseconds: 150),
curve: Curves.easeOut,
padding: EdgeInsets.only(bottom: bottomInset),
child: Container(
height: MediaQuery.of(context).size.height * 0.85,
decoration: const BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.vertical(
top: Radius.circular(AppRadius.xxl),
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
const SizedBox(height: AppSpacing.sm),
Center(
child: Container(
width: 36,
height: 4,
decoration: BoxDecoration(
color: AppColors.slate200,
borderRadius: BorderRadius.circular(AppRadius.full),
),
),
),
const SizedBox(height: AppSpacing.md),
const Padding(
padding: EdgeInsets.symmetric(horizontal: AppSpacing.xl),
child: Text(
'添加待办',
style: TextStyle(
fontFamily: 'Inter',
fontSize: 20,
fontWeight: FontWeight.w700,
color: AppColors.slate900,
),
),
),
const SizedBox(height: AppSpacing.lg),
Expanded(
child: SingleChildScrollView(
keyboardDismissBehavior:
ScrollViewKeyboardDismissBehavior.onDrag,
padding: const EdgeInsets.symmetric(horizontal: AppSpacing.xl),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildInputField(
controller: _titleController,
label: '标题',
hint: '输入待办标题',
autofocus: true,
),
const SizedBox(height: AppSpacing.lg),
_buildInputField(
controller: _descriptionController,
label: '描述（可选）',
hint: '补充细节或备注',
maxLines: 2,
),
const SizedBox(height: AppSpacing.lg),
const Text(
'优先级',
style: TextStyle(
fontFamily: 'Inter',
fontSize: 14,
fontWeight: FontWeight.w600,
color: AppColors.slate700,
),
),
const SizedBox(height: AppSpacing.sm),
Wrap(
spacing: AppSpacing.sm,
runSpacing: AppSpacing.sm,
children: [
_PriorityChip(
label: '重要紧急',
selected: _priority == 1,
color: AppColors.g1Border,
onTap: () => setState(() => _priority = 1),
),
_PriorityChip(
label: '紧急不重要',
selected: _priority == 3,
color: AppColors.g2Border,
onTap: () => setState(() => _priority = 3),
),
_PriorityChip(
label: '重要不紧急',
selected: _priority == 2,
color: AppColors.g3Border,
onTap: () => setState(() => _priority = 2),
),
],
),
const SizedBox(height: AppSpacing.lg),
const Text(
'关联日历事件',
style: TextStyle(
fontFamily: 'Inter',
fontSize: 14,
fontWeight: FontWeight.w600,
color: AppColors.slate700,
),
),
const SizedBox(height: AppSpacing.sm),
Container(
constraints: const BoxConstraints(maxHeight: 260),
decoration: BoxDecoration(
color: AppColors.slate50,
borderRadius: BorderRadius.circular(AppRadius.lg),
border: Border.all(color: AppColors.borderSecondary),
),
child: FutureBuilder<List<_ScheduleItemSimple>>(
future: _scheduleItemsFuture,
builder: (context, snapshot) {
if (snapshot.connectionState ==
ConnectionState.waiting) {
return _buildScheduleSkeleton();
}
if (snapshot.hasError) {
return Padding(
padding: const EdgeInsets.all(AppSpacing.lg),
child: Text(
'加载失败: ${snapshot.error}',
style: const TextStyle(color: AppColors.red500),
),
);
}
final items = snapshot.data ?? const [];
if (items.isEmpty) {
return const SizedBox(
height: 120,
child: Center(
child: Text(
'暂无日历事件',
style: TextStyle(color: AppColors.slate500),
),
),
);
}
return ListView.builder(
padding: const EdgeInsets.symmetric(
horizontal: AppSpacing.sm,
vertical: AppSpacing.xs,
),
itemCount: items.length,
itemBuilder: (context, index) {
final item = items[index];
final isSelected = _selectedScheduleItems
.contains(item.id);
return CheckboxListTile(
dense: true,
value: isSelected,
title: Text(item.title),
subtitle: Text(_formatDate(item.startAt)),
onChanged: (value) {
setState(() {
if (value == true) {
_selectedScheduleItems.add(item.id);
} else {
_selectedScheduleItems.remove(item.id);
}
});
},
);
},
);
},
),
),
const SizedBox(height: AppSpacing.xl),
],
),
),
),
Padding(
padding: const EdgeInsets.fromLTRB(
AppSpacing.lg,
AppSpacing.sm,
AppSpacing.lg,
AppSpacing.lg,
),
child: SizedBox(
width: double.infinity,
child: AppButton(
text: '添加',
onPressed: () {
if (_titleController.text.trim().isEmpty) {
Toast.show(context, '请输入标题', type: ToastType.warning);
return;
}
Navigator.of(context).pop({
'title': _titleController.text.trim(),
'description': _descriptionController.text.trim().isEmpty
? null
: _descriptionController.text.trim(),
'priority': _priority,
'schedule_item_ids': _selectedScheduleItems.toList(),
});
},
),
),
),
],
),
),
);
}
Widget _buildInputField({
required TextEditingController controller,
required String label,
required String hint,
int maxLines = 1,
bool autofocus = false,
}) {
return AppSheetInputField(
controller: controller,
label: label,
hint: hint,
maxLines: maxLines,
autofocus: autofocus,
);
}
Widget _buildScheduleSkeleton() {
return ListView.separated(
physics: const NeverScrollableScrollPhysics(),
padding: const EdgeInsets.symmetric(
horizontal: AppSpacing.md,
vertical: AppSpacing.md,
),
itemCount: 4,
separatorBuilder: (context, index) =>
const SizedBox(height: AppSpacing.sm),
itemBuilder: (context, index) {
return Container(
height: AppSpacing.xxl + AppSpacing.lg,
decoration: BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.circular(AppRadius.md),
border: Border.all(color: AppColors.borderSecondary),
),
);
},
);
}
Future<List<_ScheduleItemSimple>> _loadScheduleItems() async {
final calendarApi = sl<CalendarApi>();
final now = DateTime.now();
final start = now.subtract(const Duration(days: 30));
final end = now.add(const Duration(days: 90));
final items = await calendarApi.listByRange(startAt: start, endAt: end);
return items
.map(
(e) =>
_ScheduleItemSimple(id: e.id, title: e.title, startAt: e.startAt),
)
.toList();
}
String _formatDate(DateTime dt) {
return '${dt.year}年${dt.month}月${dt.day}日 ${dt.hour.toString().padLeft(2, '0')}:${dt.minute.toString().padLeft(2, '0')}';
}
}
class _ScheduleItemSimple {
final String id;
final String title;
final DateTime startAt;
_ScheduleItemSimple({
required this.id,
required this.title,
required this.startAt,
});
}
class _PriorityChip extends StatelessWidget {
final String label;
final bool selected;
final Color color;
final VoidCallback onTap;
const _PriorityChip({
required this.label,
required this.selected,
required this.color,
required this.onTap,
});
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: onTap,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
decoration: BoxDecoration(
color: selected ? color.withValues(alpha: 0.2) : Colors.transparent,
border: Border.all(
color: selected ? color : AppColors.slate300,
width: selected ? 2 : 1,
),
borderRadius: BorderRadius.circular(20),
),
child: Text(
label,
style: TextStyle(
fontFamily: 'Inter',
fontSize: 12,
fontWeight: selected ? FontWeight.w600 : FontWeight.normal,
color: selected ? color : AppColors.slate600,
),
),
),
);
}
}