feat:增加博客分类模块

2025-11-15 13:03:10 +08:00
parent 3b167508dd
commit 2cfb2ce592
19 changed files with 901 additions and 201 deletions
--- a/lib/pages/blog_list_page.dart
+++ b/lib/pages/blog_list_page.dart
@@ -0,0 +1,139 @@
+import 'package:blog_app/apis/blog.dart';
+import 'package:blog_app/models/blog.dart';
+import 'package:blog_app/widget/blog.dart';
+import 'package:blog_app/widget/common.dart';
+import 'package:flutter/material.dart';
+
+class BlogListPage extends StatefulWidget {
+  final String category;
+
+  const BlogListPage({super.key, required this.category});
+
+  @override
+  State<BlogListPage> createState() => _BlogListPageState();
+}
+
+class _BlogListPageState extends State<BlogListPage> {
+  late List<Blog> blogs = [];
+
+  @override
+  void initState() {
+    super.initState();
+    _loadBlogList();
+  }
+
+  Future<void> _loadBlogList() async {
+    try {
+      final result = await queryBlogByConditionApi(widget.category, null, null);
+      setState(() {
+        blogs = result;
+      });
+    } catch (e) {
+      throw Exception('获取博客列表失败: $e');
+    }
+  }
+
+  Widget _buildTitle() {
+    return Row(
+      mainAxisAlignment: MainAxisAlignment.spaceBetween,
+      children: [
+        const Text(
+          '博客列表',
+          style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
+        ),
+        Text(
+          '共 ${blogs.length} 篇',
+          style: TextStyle(color: Colors.grey.shade600, fontSize: 14),
+        ),
+      ],
+    );
+  }
+
+  Widget _buildBlogItem(BuildContext context, Blog blog, int index) {
+    final colors = Theme.of(context).colorScheme;
+
+    return buildCard(
+      context: context,
+      child: Padding(
+        padding: EdgeInsets.all(10),
+        child: Row(
+          children: [
+            SizedBox(
+              width: 25,
+              child: Text(
+                index.toString(),
+                style: TextStyle(
+                  fontWeight: FontWeight.w500,
+                  color: colors.primary,
+                ),
+              ),
+            ),
+
+            // 发布时间
+            SizedBox(
+              width: 150,
+              child: Text(
+                blog.createTime,
+                style: TextStyle(fontSize: 14, color: Colors.grey.shade600),
+              ),
+            ),
+
+            // 标题
+            Expanded(
+              child: Text(
+                blog.title,
+                style: TextStyle(
+                  fontSize: 14,
+                  fontWeight: FontWeight.w500,
+                  color: colors.primary,
+                ),
+                maxLines: 1,
+                overflow: TextOverflow.ellipsis,
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget _buildBlogList() {
+    return ListView.builder(
+      itemCount: blogs.length,
+      itemBuilder: (context, index) {
+        final blog = blogs[index];
+        return InkWell(
+          onTap: () => navigatorToBlogDetail(context, blog.id),
+          child: _buildBlogItem(context, blog, index + 1),
+        );
+      },
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final colors = Theme.of(context).colorScheme;
+
+    return Scaffold(
+      appBar: AppBar(title: Text('博客详情')),
+      body: Padding(
+        padding: const EdgeInsets.all(16.0),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Center(
+              child: Text(
+                widget.category,
+                style: TextStyle(fontSize: 20, color: colors.primary),
+              ),
+            ),
+            const SizedBox(height: 8),
+            _buildTitle(),
+            const SizedBox(height: 8),
+            Expanded(child: blogs.isEmpty ? buildEmpty() : _buildBlogList()),
+          ],
+        ),
+      ),
+    );
+  }
+}