dellevin/MookNote
1
0
Fork 0
generated from dellevin/template
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化界面2

Browse Source
This commit is contained in:
DelLevin-Home
2026-05-22 18:23:40 +08:00
parent 79f813c463
commit 6c3e55fead
18 changed files with 2004 additions and 2695 deletions
Download Patch File Download Diff File Expand all files Collapse all files

391
lib/pages/sync/backup_page.dart
View File

@@ -50,11 +50,14 @@ class _BackupPageState extends State<BackupPage> {
: ListView(
padding: const EdgeInsets.all(24),
children: [
// 数据操作区域
// 自动备份开关 - 紧凑一行
_buildAutoBackupSection(),
const SizedBox(height: 24),
// 手动备份
_buildSectionTitle('手动备份'),
const SizedBox(height: 16),
// 导出数据
const SizedBox(height: 12),
_buildActionCard(
title: '导出数据',
description: '将所有数据导出为 zip 文件，可用于备份或迁移到其他设备',
@@ -63,10 +66,7 @@ class _BackupPageState extends State<BackupPage> {
isLoading: _isExporting,
onTap: _exportData,
),
const SizedBox(height: 16),
// 导入数据
const SizedBox(height: 12),
_buildActionCard(
title: '导入数据',
description: '从备份文件导入数据，将覆盖当前所有数据',
@@ -76,14 +76,9 @@ class _BackupPageState extends State<BackupPage> {
onTap: _importData,
isDestructive: true,
),
const SizedBox(height: 32),
// 自动备份开关
_buildAutoBackupSection(),
const SizedBox(height: 32),
// 使用说明
_buildInfoSection(),
],
@@ -144,8 +139,8 @@ class _BackupPageState extends State<BackupPage> {
color: Colors.white,
borderRadius: BorderRadius.circular(10),
border: Border.all(
color: isDestructive
? Colors.red.withOpacity(0.3)
color: isDestructive
? Colors.red.withOpacity(0.3)
: const Color(0xFFE8E8E8),
width: 0.5,
),
@@ -184,37 +179,34 @@ class _BackupPageState extends State<BackupPage> {
],
),
const SizedBox(height: 20),
SizedBox(
width: double.infinity,
child: ElevatedButton(
onPressed: isLoading ? null : onTap,
style: ElevatedButton.styleFrom(
backgroundColor: isDestructive
? Colors.red
: const Color(0xFF1A1A1A),
foregroundColor: Colors.white,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
padding: const EdgeInsets.symmetric(vertical: 14),
GestureDetector(
onTap: isLoading ? null : onTap,
child: Container(
width: double.infinity,
padding: const EdgeInsets.symmetric(vertical: 14),
decoration: BoxDecoration(
color: isLoading ? const Color(0xFFCCCCCC) : const Color(0xFF1A1A1A),
borderRadius: BorderRadius.circular(8),
),
child: isLoading
? const SizedBox(
width: 20,
height: 20,
child: CircularProgressIndicator(
strokeWidth: 2,
valueColor: AlwaysStoppedAnimation(Colors.white),
child: Center(
child: isLoading
? const SizedBox(
width: 20,
height: 20,
child: CircularProgressIndicator(
strokeWidth: 2,
valueColor: AlwaysStoppedAnimation(Colors.white),
),
)
: Text(
buttonText,
style: const TextStyle(
fontSize: 15,
fontWeight: FontWeight.w500,
color: Colors.white,
),
),
)
: Text(
buttonText,
style: const TextStyle(
fontSize: 15,
fontWeight: FontWeight.w500,
),
),
),
),
),
],
@@ -311,6 +303,78 @@ class _BackupPageState extends State<BackupPage> {
);
}
/// 显示成功弹窗
void _showSuccessDialog({
required String title,
required String content,
String? detail,
}) {
showDialog(
context: context,
builder: (ctx) => AlertDialog(
backgroundColor: Colors.white,
elevation: 0,
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
title: Column(
children: [
Container(
width: 48,
height: 48,
decoration: BoxDecoration(
color: const Color(0xFFF5F5F5),
borderRadius: BorderRadius.circular(12),
),
child: const Icon(Icons.check, color: Color(0xFF1A1A1A), size: 24),
),
const SizedBox(height: 16),
Text(title, style: const TextStyle(fontSize: 17, fontWeight: FontWeight.w600, color: Color(0xFF1A1A1A))),
],
),
titlePadding: const EdgeInsets.fromLTRB(24, 24, 24, 0),
content: Column(
mainAxisSize: MainAxisSize.min,
children: [
const SizedBox(height: 12),
Text(
content,
style: const TextStyle(fontSize: 14, color: Color(0xFF666666), height: 1.6),
textAlign: TextAlign.center,
),
if (detail != null && detail.isNotEmpty) ...[
const SizedBox(height: 12),
Container(
width: double.infinity,
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: const Color(0xFFF8F8F8),
borderRadius: BorderRadius.circular(8),
),
child: Text(
detail,
style: const TextStyle(fontSize: 11, color: Color(0xFF999999)),
maxLines: 3,
overflow: TextOverflow.ellipsis,
),
),
],
],
),
contentPadding: const EdgeInsets.fromLTRB(24, 0, 24, 0),
actionsPadding: const EdgeInsets.fromLTRB(16, 20, 16, 16),
actions: [
TextButton(
onPressed: () => Navigator.pop(ctx),
style: TextButton.styleFrom(
minimumSize: const Size(120, 40),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
),
child: const Text('确定', style: TextStyle(fontSize: 14, color: Color(0xFF1A1A1A))),
),
],
),
);
}
/// 导出数据
Future<void> _exportData() async {
setState(() => _isExporting = true);
@@ -323,29 +387,10 @@ class _BackupPageState extends State<BackupPage> {
if (result.cancelled) {
ToastUtil.show(context, '已取消导出');
} else if (result.success) {
// 显示导出成功信息
showDialog(
context: context,
builder: (context) => AlertDialog(
backgroundColor: Colors.white,
elevation: 0,
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
title: const Text('导出成功'),
content: Text(
'备份文件已保存到:\n${result.filePath}\n\n'
'包含数据:\n'
'• 影视: ${result.movieCount}\n'
'• 书籍: ${result.bookCount}\n'
'• 笔记: ${result.noteCount}\n'
'• 图片: ${result.imageCount}',
),
actions: [
TextButton(
onPressed: () => Navigator.pop(context),
child: const Text('确定'),
),
],
),
_showSuccessDialog(
title: '导出成功',
content: '备份文件已保存，包含:\n影视 ${result.movieCount} · 书籍 ${result.bookCount} · 笔记 ${result.noteCount} · 图片 ${result.imageCount}',
detail: result.filePath ?? '',
);
} else {
ToastUtil.show(context, result.errorMessage ?? '导出失败');
@@ -370,18 +415,47 @@ class _BackupPageState extends State<BackupPage> {
backgroundColor: Colors.white,
elevation: 0,
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
title: const Text('确认导入'),
content: const Text(
'导入数据将覆盖当前所有数据，此操作不可恢复。\n\n是否继续？',
title: Row(
children: [
Container(
width: 40,
height: 40,
decoration: BoxDecoration(
color: Colors.red.withOpacity(0.08),
borderRadius: BorderRadius.circular(10),
),
child: const Icon(Icons.warning_amber_rounded, color: Colors.red, size: 22),
),
const SizedBox(width: 12),
const Text('确认导入', style: TextStyle(fontSize: 17, fontWeight: FontWeight.w600, color: Color(0xFF1A1A1A))),
],
),
titlePadding: const EdgeInsets.fromLTRB(24, 24, 24, 0),
content: const Padding(
padding: EdgeInsets.only(top: 16),
child: Text(
'导入数据将覆盖当前所有数据，此操作不可恢复。',
style: TextStyle(fontSize: 14, color: Color(0xFF666666), height: 1.6),
),
),
contentPadding: const EdgeInsets.fromLTRB(24, 0, 24, 0),
actionsPadding: const EdgeInsets.fromLTRB(16, 20, 16, 16),
actions: [
TextButton(
onPressed: () => Navigator.pop(context, false),
child: const Text('取消', style: TextStyle(color: Color(0xFF666666))),
style: TextButton.styleFrom(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
),
child: const Text('取消', style: TextStyle(color: Color(0xFF666666), fontSize: 14)),
),
TextButton(
onPressed: () => Navigator.pop(context, true),
child: const Text('确认导入', style: TextStyle(color: Colors.red)),
style: TextButton.styleFrom(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
),
child: const Text('确认导入', style: TextStyle(color: Colors.red, fontSize: 14, fontWeight: FontWeight.w600)),
),
],
),
@@ -403,22 +477,12 @@ class _BackupPageState extends State<BackupPage> {
await context.read<AppProvider>().loadMovies();
await context.read<AppProvider>().loadBooks();
await context.read<AppProvider>().loadNotes();
showDialog(
context: context,
builder: (context) => AlertDialog(
backgroundColor: Colors.white,
elevation: 0,
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
title: const Text('导入成功'),
content: Text('成功导入数据：\n${result.statsText}'),
actions: [
TextButton(
onPressed: () => Navigator.pop(context),
child: const Text('确定'),
),
],
),
if (!mounted) return;
_showSuccessDialog(
title: '导入成功',
content: result.statsText,
);
} else {
ToastUtil.show(context, result.errorMessage ?? '导入失败');
@@ -434,109 +498,68 @@ class _BackupPageState extends State<BackupPage> {
}
}
/// 构建自动备份区域
/// 构建自动备份区域 - 紧凑一行
Widget _buildAutoBackupSection() {
return Container(
padding: const EdgeInsets.all(20),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
decoration: BoxDecoration(
color: const Color(0xFFFAFAFA),
borderRadius: BorderRadius.circular(12),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
child: Row(
children: [
Row(
children: [
Container(
width: 44,
height: 44,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(10),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: const Icon(
Icons.schedule,
size: 22,
color: Color(0xFF666666),
),
),
const SizedBox(width: 16),
const Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'自动本地备份',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
color: Color(0xFF1A1A1A),
),
),
SizedBox(height: 4),
Text(
'每2分钟自动备份，保留最近5个备份',
style: TextStyle(
fontSize: 13,
color: Color(0xFF666666),
),
),
],
),
),
Switch(
value: _autoBackupEnabled,
onChanged: (value) async {
setState(() => _autoBackupEnabled = value);
await AutoBackupService.instance.setEnabled(value);
if (value) {
ToastUtil.show(context, '自动备份已开启');
} else {
ToastUtil.show(context, '自动备份已关闭');
}
await _loadAutoBackupStatus();
},
activeColor: const Color(0xFF1A1A1A),
activeTrackColor: const Color(0xFF1A1A1A).withOpacity(0.3),
inactiveThumbColor: Colors.white,
inactiveTrackColor: const Color(0xFFE5E5E5),
),
],
),
if (_backupDirPath != null && _autoBackupEnabled) ...[
const SizedBox(height: 16),
Container(
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: Row(
children: [
const Icon(
Icons.folder_outlined,
size: 16,
color: Color(0xFF999999),
),
const SizedBox(width: 8),
Expanded(
child: Text(
_backupDirPath!,
style: const TextStyle(
fontSize: 12,
color: Color(0xFF666666),
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
),
],
),
Container(
width: 40,
height: 40,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(10),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
],
child: const Icon(Icons.schedule, size: 20, color: Color(0xFF666666)),
),
const SizedBox(width: 12),
Expanded(
child: _backupDirPath != null && _autoBackupEnabled
? Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'自动本地备份',
style: TextStyle(fontSize: 14, fontWeight: FontWeight.w600, color: Color(0xFF1A1A1A)),
),
const SizedBox(height: 2),
Text(
_backupDirPath!,
style: const TextStyle(fontSize: 11, color: Color(0xFF999999)),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
],
)
: const Text(
'自动本地备份',
style: TextStyle(fontSize: 14, fontWeight: FontWeight.w600, color: Color(0xFF1A1A1A)),
),
),
Switch(
value: _autoBackupEnabled,
onChanged: (value) async {
setState(() => _autoBackupEnabled = value);
await AutoBackupService.instance.setEnabled(value);
if (value) {
ToastUtil.show(context, '自动备份已开启');
} else {
ToastUtil.show(context, '自动备份已关闭');
}
await _loadAutoBackupStatus();
},
activeColor: const Color(0xFF1A1A1A),
activeTrackColor: const Color(0xFF1A1A1A).withOpacity(0.3),
inactiveThumbColor: Colors.white,
inactiveTrackColor: const Color(0xFFE5E5E5),
),
],
),
);