Files
flisp_app/lib/widgets/todo_dialog.dart

271 lines
9.1 KiB
Dart

import 'package:flisp_app/store/todo_dialog_store.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:flisp_app/models/todo.dart';
import 'package:flisp_app/utils/date_utils.dart';
import 'package:flisp_app/widgets/common.dart';
class TodoDialog extends StatefulWidget {
final bool isEditing;
final TodoItem? initialTodo;
const TodoDialog({
super.key,
required this.isEditing,
this.initialTodo,
});
@override
State<TodoDialog> createState() => _TodoDialogState();
}
class _TodoDialogState extends State<TodoDialog> {
late TextEditingController _titleController;
late TextEditingController _descriptionController;
@override
void initState() {
super.initState();
_titleController = TextEditingController();
_descriptionController = TextEditingController();
// 如果是编辑模式,初始化数据
if (widget.isEditing && widget.initialTodo != null) {
WidgetsBinding.instance.addPostFrameCallback((_) {
final store = Provider.of<TodoDialogStore>(context, listen: false);
store.initEditData(widget.initialTodo!);
});
}
}
@override
void dispose() {
_titleController.dispose();
_descriptionController.dispose();
super.dispose();
}
Future<void> _selectDueDate(BuildContext context) async {
final DateTime? picked = await showDatePicker(
context: context,
initialDate: DateTime.now(),
firstDate: DateTime.now(),
lastDate: DateTime(2100),
);
if (picked != null) {
final store = Provider.of<TodoDialogStore>(context, listen: false);
store.dueDate = picked;
}
}
@override
Widget build(BuildContext context) {
final store = Provider.of<TodoDialogStore>(context);
// 同步控制器文本
if (_titleController.text != store.title) {
_titleController.text = store.title;
_titleController.selection = TextSelection.collapsed(offset: store.title.length);
}
if (_descriptionController.text != store.description) {
_descriptionController.text = store.description;
_descriptionController.selection = TextSelection.collapsed(offset: store.description.length);
}
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: _titleController,
onChanged: (value) => store.title = value,
decoration: InputDecoration(
labelText: '标题',
hintText: '请输入待办事项标题...',
counterText: '',
suffixText: '${store.title.length}/20',
suffixStyle: TextStyle(
color: store.title.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,
),
SizedBox(height: 12),
// 描述输入框
TextField(
controller: _descriptionController,
onChanged: (value) => store.description = value,
decoration: InputDecoration(
labelText: '内容',
hintText: '请输入待办事项内容...',
counterText: '',
suffixText: '${store.description.length}/50',
suffixStyle: TextStyle(
color: store.description.length > 50 ? 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(
store.dueDate == null
? '选择截止日期'
: '截止: ${formatDate(store.dueDate!)}',
style: TextStyle(
color: store.dueDate == null ? Colors.grey : Colors.black87,
),
),
trailing: store.dueDate != null
? IconButton(
icon: Icon(Icons.clear, size: 18),
onPressed: () {
store.dueDate = null;
},
)
: null,
onTap: () => _selectDueDate(context),
),
),
SizedBox(height: 12),
// 优先级选择
Container(
decoration: buildBoxDecoration(),
child: ListTile(
leading: Container(
padding: EdgeInsets.all(6),
decoration: BoxDecoration(
color: store.priority.color.withAlpha(10),
shape: BoxShape.circle,
),
child: Icon(
Icons.flag,
color: store.priority.color,
size: 18,
),
),
title: Text(
'优先级',
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
color: Colors.grey.shade700,
),
),
trailing: DropdownButton<TodoPriority>(
value: store.priority,
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) {
store.priority = value;
}
},
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,
),
),
],
),
);
}
}