feat:重构代办事项模块
This commit is contained in:
51
lib/widgets/common.dart
Normal file
51
lib/widgets/common.dart
Normal file
@@ -0,0 +1,51 @@
|
||||
import 'package:awesome_dialog/awesome_dialog.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
BoxDecoration buildBoxDecoration() {
|
||||
return BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(color: Colors.grey[200]!, width: 1),
|
||||
);
|
||||
}
|
||||
|
||||
Container buildBody({Widget? child}) {
|
||||
return Container(
|
||||
color: Colors.grey[50],
|
||||
padding: EdgeInsets.all(8),
|
||||
child: child,
|
||||
);
|
||||
}
|
||||
|
||||
Container buildCard({Widget? child}) {
|
||||
return Container(
|
||||
decoration: buildBoxDecoration(),
|
||||
padding: EdgeInsets.all(10),
|
||||
child: child,
|
||||
);
|
||||
}
|
||||
|
||||
void showAwesomeDialog({
|
||||
required BuildContext context,
|
||||
required Widget body,
|
||||
required VoidCallback onOk,
|
||||
required VoidCallback onCancel,
|
||||
}) {
|
||||
AwesomeDialog(
|
||||
context: context,
|
||||
dialogType: DialogType.noHeader,
|
||||
animType: AnimType.scale,
|
||||
body: body,
|
||||
dialogBackgroundColor: Colors.white,
|
||||
btnOkText: "确认",
|
||||
btnCancelText: "取消",
|
||||
btnOkColor: Colors.orange,
|
||||
btnCancelColor: Colors.grey,
|
||||
buttonsBorderRadius: BorderRadius.circular(10),
|
||||
headerAnimationLoop: false,
|
||||
dismissOnTouchOutside: false,
|
||||
dismissOnBackKeyPress: true,
|
||||
btnOkOnPress: onOk,
|
||||
btnCancelOnPress: onCancel,
|
||||
).show();
|
||||
}
|
||||
246
lib/widgets/todo_dialog.dart
Normal file
246
lib/widgets/todo_dialog.dart
Normal file
@@ -0,0 +1,246 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flisp_app/models/todo.dart';
|
||||
import 'package:flisp_app/utils/date_utils.dart';
|
||||
import 'package:flisp_app/widgets/common.dart';
|
||||
|
||||
class TodoDialogContent extends StatefulWidget {
|
||||
final bool isEditing;
|
||||
final TextEditingController titleController;
|
||||
final TextEditingController descriptionController;
|
||||
final DateTime? selectedDueDate;
|
||||
final TodoPriority selectedPriority;
|
||||
final String? selectedCategory;
|
||||
final Function(DateTime?) onDueDateChanged;
|
||||
final Function(TodoPriority) onPriorityChanged;
|
||||
final Function(String?) onCategoryChanged;
|
||||
final VoidCallback onClearDueDate;
|
||||
final VoidCallback onSelectDueDate;
|
||||
|
||||
const TodoDialogContent({
|
||||
super.key,
|
||||
required this.isEditing,
|
||||
required this.titleController,
|
||||
required this.descriptionController,
|
||||
required this.selectedDueDate,
|
||||
required this.selectedPriority,
|
||||
required this.selectedCategory,
|
||||
required this.onDueDateChanged,
|
||||
required this.onPriorityChanged,
|
||||
required this.onCategoryChanged,
|
||||
required this.onClearDueDate,
|
||||
required this.onSelectDueDate,
|
||||
});
|
||||
|
||||
@override
|
||||
State<TodoDialogContent> createState() => _TodoDialogContentState();
|
||||
}
|
||||
|
||||
class _TodoDialogContentState extends State<TodoDialogContent> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
// 标题
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.add_task, color: Colors.orange, size: 24),
|
||||
SizedBox(width: 8),
|
||||
Text(
|
||||
widget.isEditing ? '编辑待办事项' : '添加待办事项',
|
||||
style: TextStyle(
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.orange,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
SizedBox(height: 20),
|
||||
|
||||
// 标题输入框
|
||||
TextField(
|
||||
controller: widget.titleController,
|
||||
decoration: InputDecoration(
|
||||
labelText: '标题',
|
||||
hintText: '请输入待办事项标题...',
|
||||
counterText: '',
|
||||
suffixText: '${widget.titleController.text.length}/20',
|
||||
suffixStyle: TextStyle(
|
||||
color: widget.titleController.text.length > 20
|
||||
? Colors.red
|
||||
: Colors.grey,
|
||||
),
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: BorderSide(color: Colors.grey.shade200),
|
||||
),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: BorderSide(color: Colors.grey.shade200),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: BorderSide(color: Colors.orange, width: 1),
|
||||
),
|
||||
filled: true,
|
||||
fillColor: Colors.white,
|
||||
prefixIcon: Icon(Icons.title, color: Colors.black87),
|
||||
contentPadding: EdgeInsets.symmetric(
|
||||
horizontal: 16,
|
||||
vertical: 14,
|
||||
),
|
||||
),
|
||||
style: TextStyle(fontSize: 16),
|
||||
maxLength: 20,
|
||||
onChanged: (value) {
|
||||
if (mounted) setState(() {});
|
||||
},
|
||||
),
|
||||
|
||||
SizedBox(height: 12),
|
||||
|
||||
// 描述输入框
|
||||
TextField(
|
||||
controller: widget.descriptionController,
|
||||
decoration: InputDecoration(
|
||||
labelText: '内容',
|
||||
hintText: '请输入待办事项内容...',
|
||||
counterText: '',
|
||||
suffixText: '${widget.titleController.text.length}/50',
|
||||
suffixStyle: TextStyle(
|
||||
color: widget.titleController.text.length > 20
|
||||
? Colors.red
|
||||
: Colors.grey,
|
||||
),
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: BorderSide(color: Colors.grey.shade200),
|
||||
),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: BorderSide(color: Colors.grey.shade200),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: BorderSide(color: Colors.orange, width: 1),
|
||||
),
|
||||
filled: true,
|
||||
fillColor: Colors.white,
|
||||
prefixIcon: Icon(Icons.description, color: Colors.black87),
|
||||
contentPadding: EdgeInsets.symmetric(
|
||||
horizontal: 16,
|
||||
vertical: 14,
|
||||
),
|
||||
),
|
||||
style: TextStyle(fontSize: 16),
|
||||
maxLines: 2,
|
||||
maxLength: 50,
|
||||
),
|
||||
|
||||
SizedBox(height: 12),
|
||||
|
||||
// 截止日期选择
|
||||
Container(
|
||||
decoration: buildBoxDecoration(),
|
||||
child: ListTile(
|
||||
leading: Icon(Icons.calendar_today, color: Colors.blue),
|
||||
title: Text(
|
||||
widget.selectedDueDate == null
|
||||
? '选择截止日期'
|
||||
: '截止: ${formatDate(widget.selectedDueDate!)}',
|
||||
style: TextStyle(
|
||||
color: widget.selectedDueDate == null
|
||||
? Colors.grey
|
||||
: Colors.black87,
|
||||
),
|
||||
),
|
||||
trailing: widget.selectedDueDate != null
|
||||
? IconButton(
|
||||
icon: Icon(Icons.clear, size: 18),
|
||||
onPressed: widget.onClearDueDate,
|
||||
)
|
||||
: null,
|
||||
onTap: widget.onSelectDueDate,
|
||||
),
|
||||
),
|
||||
SizedBox(height: 12),
|
||||
|
||||
// 优先级选择
|
||||
Container(
|
||||
decoration: buildBoxDecoration(),
|
||||
child: ListTile(
|
||||
leading: Container(
|
||||
padding: EdgeInsets.all(6),
|
||||
decoration: BoxDecoration(
|
||||
color: widget.selectedPriority.color.withAlpha(10),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Icon(
|
||||
Icons.flag,
|
||||
color: widget.selectedPriority.color,
|
||||
size: 18,
|
||||
),
|
||||
),
|
||||
title: Text(
|
||||
'优先级',
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: Colors.grey.shade700,
|
||||
),
|
||||
),
|
||||
trailing: DropdownButton<TodoPriority>(
|
||||
value: widget.selectedPriority,
|
||||
underline: SizedBox(),
|
||||
icon: Icon(Icons.arrow_drop_down, color: Colors.grey.shade600),
|
||||
iconSize: 20,
|
||||
dropdownColor: Colors.white,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
onChanged: (value) {
|
||||
if (value != null) {
|
||||
widget.onPriorityChanged(value);
|
||||
if (mounted) setState(() {});
|
||||
}
|
||||
},
|
||||
items: TodoPriority.values.map((priority) {
|
||||
return DropdownMenuItem(
|
||||
value: priority,
|
||||
child: Container(
|
||||
padding: EdgeInsets.symmetric(vertical: 8),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: EdgeInsets.all(4),
|
||||
decoration: buildBoxDecoration(),
|
||||
child: Icon(
|
||||
priority.icon,
|
||||
color: priority.color,
|
||||
size: 14,
|
||||
),
|
||||
),
|
||||
SizedBox(width: 12),
|
||||
Text(
|
||||
priority.label,
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}).toList(),
|
||||
),
|
||||
contentPadding: EdgeInsets.symmetric(horizontal: 16),
|
||||
minLeadingWidth: 0,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
200
lib/widgets/todo_widget.dart
Normal file
200
lib/widgets/todo_widget.dart
Normal file
@@ -0,0 +1,200 @@
|
||||
import 'package:flisp_app/models/todo.dart';
|
||||
import 'package:flisp_app/utils/date_utils.dart';
|
||||
import 'package:flisp_app/widgets/common.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:toggle_switch/toggle_switch.dart';
|
||||
|
||||
// 统计卡片
|
||||
Widget buildStatsCard(List<TodoItem> todos) {
|
||||
int totalCount = todos.length;
|
||||
|
||||
int activeCount = todos.where((todo) => !todo.isCompleted).length;
|
||||
|
||||
int completedCount = todos.where((todo) => todo.isCompleted).length;
|
||||
|
||||
return buildCard(
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
||||
children: [
|
||||
_buildStatItem('总计', totalCount, Colors.blue),
|
||||
_buildStatItem('待完成', activeCount, Colors.orange),
|
||||
_buildStatItem('已完成', completedCount, Colors.green),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildStatItem(String label, int count, Color color) {
|
||||
return Column(
|
||||
children: [
|
||||
Text(
|
||||
count.toString(),
|
||||
style: TextStyle(
|
||||
fontSize: 24,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: color,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(label, style: const TextStyle(fontSize: 12, color: Colors.grey)),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
// Tab页
|
||||
Widget buildTabs({
|
||||
required TodoTab currentTab,
|
||||
required ValueChanged<TodoTab> onTabChanged,
|
||||
}) {
|
||||
return Container(
|
||||
padding: EdgeInsets.all(8),
|
||||
child: ToggleSwitch(
|
||||
minWidth: 90.0,
|
||||
minHeight: 40.0,
|
||||
initialLabelIndex: TodoTab.values.indexOf(currentTab),
|
||||
totalSwitches: TodoTab.values.length,
|
||||
labels: TodoTab.values.map((e) => e.label).toList(),
|
||||
activeBgColor: [Colors.orange.shade600],
|
||||
activeFgColor: Colors.white,
|
||||
inactiveBgColor: Colors.grey.shade200,
|
||||
inactiveFgColor: Colors.grey.shade700,
|
||||
cornerRadius: 12.0,
|
||||
customTextStyles: [TextStyle(fontSize: 12, fontWeight: FontWeight.w500)],
|
||||
onToggle: (index) {
|
||||
if (index != null) {
|
||||
onTabChanged(TodoTab.values[index]);
|
||||
}
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget buildTodoList({
|
||||
required List<TodoItem> todos,
|
||||
required ValueChanged<String> onToggleTodo,
|
||||
required ValueChanged<TodoItem> onEditTodo
|
||||
}) {
|
||||
return ListView.separated(
|
||||
itemCount: todos.length,
|
||||
separatorBuilder: (context, index) => SizedBox(height: 8),
|
||||
itemBuilder: (context, index) {
|
||||
final todo = todos[index];
|
||||
return _buildTodoItem(
|
||||
todo: todo,
|
||||
onToggle: onToggleTodo,
|
||||
onEdit: onEditTodo
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildTodoItem({
|
||||
required TodoItem todo,
|
||||
required ValueChanged<String> onToggle,
|
||||
required ValueChanged<TodoItem> onEdit
|
||||
}) {
|
||||
return buildCard(
|
||||
child: ListTile(
|
||||
leading: Checkbox(
|
||||
value: todo.isCompleted,
|
||||
onChanged: (value) => onToggle(todo.id),
|
||||
),
|
||||
title: _buildTodoTitle(todo),
|
||||
subtitle: _buildTodoSubtitle(todo),
|
||||
trailing: _buildPriorityBadge(todo.priority),
|
||||
onTap: () => onEdit(todo),
|
||||
// onLongPress: () => onShowOptions(todo),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildTodoTitle(TodoItem todo) {
|
||||
return Text(
|
||||
todo.title,
|
||||
style: TextStyle(
|
||||
decoration: todo.isCompleted ? TextDecoration.lineThrough : null,
|
||||
color: todo.isCompleted ? Colors.grey : null,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
// 构建待办事项副标题
|
||||
Widget? _buildTodoSubtitle(TodoItem todo) {
|
||||
final isOverdue =
|
||||
todo.dueDate != null &&
|
||||
todo.dueDate!.isBefore(DateTime.now()) &&
|
||||
!todo.isCompleted;
|
||||
|
||||
final hasContent =
|
||||
todo.description?.isNotEmpty == true || todo.dueDate != null;
|
||||
|
||||
if (!hasContent) return null;
|
||||
|
||||
return Wrap(
|
||||
direction: Axis.vertical,
|
||||
spacing: 5,
|
||||
children: [
|
||||
if (todo.description?.isNotEmpty == true)
|
||||
Text(
|
||||
todo.description!,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: TextStyle(fontSize: 12, color: Colors.grey.shade600),
|
||||
),
|
||||
if (todo.dueDate != null)
|
||||
Text(
|
||||
'截止: ${formatDate(todo.dueDate!)}',
|
||||
style: TextStyle(
|
||||
fontSize: 11,
|
||||
color: isOverdue ? Colors.red : Colors.grey,
|
||||
fontWeight: isOverdue ? FontWeight.bold : FontWeight.normal,
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
// 构建优先级徽章
|
||||
Widget _buildPriorityBadge(TodoPriority priority) {
|
||||
return Chip(
|
||||
label: Text(priority.label),
|
||||
backgroundColor: priority.color,
|
||||
labelStyle: TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
side: BorderSide(color: Colors.white),
|
||||
),
|
||||
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
|
||||
visualDensity: VisualDensity.compact,
|
||||
);
|
||||
}
|
||||
|
||||
// 空状态
|
||||
Widget buildEmptyState(TodoTab currentFilter) {
|
||||
final messages = {
|
||||
TodoTab.all: '📝 还没有待办事项\n点击➕号添加第一个任务吧～',
|
||||
TodoTab.active: '🎯 没有待完成的任务\n享受轻松时光吧！✨',
|
||||
TodoTab.completed: '🎉 还没有完成的任务\n加油哦！💪',
|
||||
TodoTab.today: '📅 今天没有安排任务\n好好放松一下吧～😊',
|
||||
};
|
||||
|
||||
return Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(Icons.checklist, size: 80, color: Colors.orange.shade600),
|
||||
const SizedBox(height: 20),
|
||||
Text(
|
||||
messages[currentFilter] ?? '暂无数据',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(fontSize: 16, color: Colors.orange.shade600),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user