epub阅读+关联书籍

lib/pages/epub_reader/epub_library_page.dart

@@ -1,9 +1,10 @@
-import 'dart:io';
 import 'package:flutter/material.dart';
 import 'package:file_picker/file_picker.dart';
 import '../../utils/epub/reader_dao.dart';
 import '../../utils/epub/epub_service.dart';
-import 'reader_screen.dart';
+import '../../utils/user_prefs.dart';
+import 'epub_detail_page.dart';
+import 'widgets/book_grid_item.dart';
 
 /// EPUB 书架页面
 class EpubLibraryPage extends StatefulWidget {
@@ -18,6 +19,9 @@ class _EpubLibraryPageState extends State<EpubLibraryPage> {
   final EpubService _service = EpubService();
   List<Map<String, dynamic>> _books = [];
   bool _isLoading = true;
+  ViewMode _viewMode = UserPrefs().epubViewMode == 1
+      ? ViewMode.compact
+      : ViewMode.relaxed;
 
   @override
   void initState() {
@@ -26,7 +30,7 @@ class _EpubLibraryPageState extends State<EpubLibraryPage> {
   }
 
   Future<void> _loadBooks() async {
-    setState(() => _isLoading = true);
+    if (mounted) setState(() => _isLoading = true);
     final books = await _dao.getAllReaderBooks();
     if (mounted) {
       setState(() {
@@ -54,7 +58,7 @@ class _EpubLibraryPageState extends State<EpubLibraryPage> {
 
     final imported = await _service.importBook(path);
 
-    if (mounted) Navigator.pop(context); // 关闭 loading
+    if (mounted) Navigator.pop(context);
 
     if (imported != null) {
       await _loadBooks();
@@ -70,16 +74,33 @@ class _EpubLibraryPageState extends State<EpubLibraryPage> {
     final confirm = await showDialog<bool>(
       context: context,
       builder: (ctx) => AlertDialog(
-        title: const Text('删除书籍', style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600)),
-        content: Text('确定删除《${book['title']}》？', style: TextStyle(fontSize: 14, color: colors.onSurface.withValues(alpha: 0.6))),
+        backgroundColor: colors.surface,
+        elevation: 0,
+        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
+        title: Text('删除书籍',
+            style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600, color: colors.onSurface)),
+        content: Text('确定删除《${book['title']}》？',
+            style: TextStyle(fontSize: 14, color: colors.onSurface.withValues(alpha: 0.6), height: 1.5)),
+        actionsPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
         actions: [
           TextButton(
+            style: TextButton.styleFrom(
+              foregroundColor: colors.onSurface.withValues(alpha: 0.6),
+              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
+            ),
             onPressed: () => Navigator.pop(ctx, false),
-            child: Text('取消', style: TextStyle(color: colors.onSurface.withValues(alpha: 0.4))),
+            child: const Text('取消'),
           ),
-          TextButton(
+          ElevatedButton(
+            style: ElevatedButton.styleFrom(
+              backgroundColor: colors.error,
+              foregroundColor: colors.onError,
+              elevation: 0,
+              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
+              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
+            ),
             onPressed: () => Navigator.pop(ctx, true),
-            child: Text('删除', style: TextStyle(color: colors.error)),
+            child: const Text('删除'),
           ),
         ],
       ),
@@ -94,14 +115,17 @@ class _EpubLibraryPageState extends State<EpubLibraryPage> {
     Navigator.push(
       context,
       MaterialPageRoute(
-        builder: (_) => ReaderScreen(
-          bookId: book['id'],
-          filePath: book['file_path'],
-          title: book['title'],
-          coverPath: book['cover_path'],
-        ),
+        builder: (_) => EpubDetailPage(bookId: book['id'], book: book),
       ),
-    ).then((_) => _loadBooks()); // 返回时刷新进度
+    ).then((_) => _loadBooks());
+  }
+
+  void _toggleViewMode() {
+    setState(() {
+      _viewMode =
+          _viewMode == ViewMode.relaxed ? ViewMode.compact : ViewMode.relaxed;
+    });
+    UserPrefs().setEpubViewMode(_viewMode == ViewMode.compact ? 1 : 0);
   }
 
   @override
@@ -115,12 +139,22 @@ class _EpubLibraryPageState extends State<EpubLibraryPage> {
         title: Text('EPUB 阅读',
             style: TextStyle(fontSize: 17, fontWeight: FontWeight.w600, color: colors.onSurface)),
         leading: IconButton(
-          icon: Icon(Icons.arrow_back, color: colors.onSurface),
+          icon: const Icon(Icons.arrow_back, size: 20),
           onPressed: () => Navigator.pop(context),
         ),
         actions: [
           IconButton(
-            icon: Icon(Icons.add_outlined, color: colors.onSurface.withValues(alpha: 0.7)),
+            icon: Icon(
+              _viewMode == ViewMode.relaxed
+                  ? Icons.view_compact_outlined
+                  : Icons.view_agenda_outlined,
+              size: 20,
+              color: colors.onSurface.withValues(alpha: 0.6),
+            ),
+            onPressed: _toggleViewMode,
+          ),
+          IconButton(
+            icon: Icon(Icons.add_outlined, size: 20, color: colors.onSurface.withValues(alpha: 0.6)),
             onPressed: _pickAndImport,
           ),
           const SizedBox(width: 4),
@@ -147,19 +181,26 @@ class _EpubLibraryPageState extends State<EpubLibraryPage> {
                 color: colors.surfaceContainerHighest,
                 borderRadius: BorderRadius.circular(20),
               ),
-              child: Icon(Icons.auto_stories_outlined, size: 40, color: colors.onSurface.withValues(alpha: 0.25)),
+              child: Icon(Icons.auto_stories_outlined,
+                  size: 40, color: colors.onSurface.withValues(alpha: 0.25)),
             ),
             const SizedBox(height: 24),
-            Text('EPUB 阅读', style: TextStyle(fontSize: 20, fontWeight: FontWeight.w600, color: colors.onSurface)),
+            Text('EPUB 阅读',
+                style: TextStyle(fontSize: 20, fontWeight: FontWeight.w600, color: colors.onSurface)),
             const SizedBox(height: 8),
-            Text('点击右上角导入 .epub 文件', style: TextStyle(fontSize: 14, color: colors.onSurface.withValues(alpha: 0.4))),
+            Text('点击右上角导入 .epub 文件',
+                style: TextStyle(fontSize: 14, color: colors.onSurface.withValues(alpha: 0.4))),
             const SizedBox(height: 32),
             GestureDetector(
               onTap: _pickAndImport,
               child: Container(
                 padding: const EdgeInsets.symmetric(horizontal: 32, vertical: 14),
-                decoration: BoxDecoration(color: colors.primary, borderRadius: BorderRadius.circular(24)),
-                child: Text('导入 EPUB', style: TextStyle(fontSize: 15, color: colors.onPrimary, fontWeight: FontWeight.w500)),
+                decoration: BoxDecoration(
+                  color: colors.primary,
+                  borderRadius: BorderRadius.circular(24),
+                ),
+                child: Text('导入 EPUB',
+                    style: TextStyle(fontSize: 15, color: colors.onPrimary, fontWeight: FontWeight.w500)),
               ),
             ),
           ],
@@ -169,77 +210,29 @@ class _EpubLibraryPageState extends State<EpubLibraryPage> {
   }
 
   Widget _buildGrid(ColorScheme colors) {
+    final bool isRelaxed = _viewMode == ViewMode.relaxed;
+    final maxExtent = isRelaxed ? 180.0 : 120.0;
+    final aspectRatio = isRelaxed ? 0.55 : 0.68;
+    final spacing = isRelaxed ? 16.0 : 8.0;
+
     return GridView.builder(
-      padding: const EdgeInsets.all(16),
-      gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
-        crossAxisCount: 3,
-        childAspectRatio: 0.55,
-        crossAxisSpacing: 12,
-        mainAxisSpacing: 16,
+      padding: const EdgeInsets.fromLTRB(16, 16, 16, 100),
+      gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
+        maxCrossAxisExtent: maxExtent,
+        childAspectRatio: aspectRatio,
+        crossAxisSpacing: spacing,
+        mainAxisSpacing: spacing,
       ),
       itemCount: _books.length,
       itemBuilder: (context, index) {
         final book = _books[index];
-        return _buildBookItem(book, colors);
+        return BookGridItem(
+          book: book,
+          viewMode: _viewMode,
+          onTap: () => _openBook(book),
+          onLongPress: () => _deleteBook(book),
+        );
       },
     );
   }
-
-  Widget _buildBookItem(Map<String, dynamic> book, ColorScheme colors) {
-    final coverPath = book['cover_path'] as String?;
-    final title = book['title'] as String? ?? '';
-    final author = book['author'] as String? ?? '';
-    final progress = (book['reading_percentage'] as num?)?.toDouble() ?? 0.0;
-
-    return GestureDetector(
-      onTap: () => _openBook(book),
-      onLongPress: () => _deleteBook(book),
-      child: Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          // 封面
-          Expanded(
-            child: Container(
-              width: double.infinity,
-              decoration: BoxDecoration(
-                color: colors.surfaceContainerHighest,
-                borderRadius: BorderRadius.circular(8),
-                boxShadow: [
-                  BoxShadow(
-                    color: colors.shadow.withValues(alpha: 0.1),
-                    blurRadius: 8,
-                    offset: const Offset(0, 2),
-                  ),
-                ],
-              ),
-              clipBehavior: Clip.antiAlias,
-              child: coverPath != null && coverPath.isNotEmpty && File(coverPath).existsSync()
-                  ? Image.file(File(coverPath), fit: BoxFit.cover)
-                  : Icon(Icons.auto_stories_outlined, size: 36, color: colors.onSurface.withValues(alpha: 0.2)),
-            ),
-          ),
-          const SizedBox(height: 8),
-          // 标题
-          Text(title, maxLines: 2, overflow: TextOverflow.ellipsis,
-              style: TextStyle(fontSize: 12, fontWeight: FontWeight.w500, color: colors.onSurface)),
-          if (author.isNotEmpty) ...[
-            const SizedBox(height: 2),
-            Text(author, maxLines: 1, overflow: TextOverflow.ellipsis,
-                style: TextStyle(fontSize: 10, color: colors.onSurface.withValues(alpha: 0.4))),
-          ],
-          const SizedBox(height: 4),
-          // 进度条
-          ClipRRect(
-            borderRadius: BorderRadius.circular(2),
-            child: LinearProgressIndicator(
-              value: progress,
-              minHeight: 2,
-              backgroundColor: colors.surfaceContainerHighest,
-              valueColor: AlwaysStoppedAnimation(colors.primary.withValues(alpha: 0.5)),
-            ),
-          ),
-        ],
-      ),
-    );
-  }
 }