feat:更新组件UI

lib/widgets/recipe/calendar.dart

@@ -116,7 +116,7 @@ class _RecipeCalendarState extends State<RecipeCalendar> {
 
     return Card(
       elevation: 0,
-      color: colors.onSecondary,
+      color: colors.primary.withAlpha(50),
       child: Padding(
         padding: EdgeInsets.all(10),
         child: Row(

lib/widgets/recipe/card.dart

@@ -14,7 +14,8 @@ class RecipeCard extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final String firstImageUrl = recipe.recordList.first.imageUrl;
+    final List<String> imageUrls =
+        recipe.recordList.reversed.map((record) => record.imageUrl).toList();
 
     Widget buildRecipeContent(BuildContext context) {
       return Column(
@@ -33,6 +34,7 @@ class RecipeCard extends StatelessWidget {
               ),
             ],
           ),
+          SizedBox(height: 5),
           Row(
             mainAxisAlignment: MainAxisAlignment.spaceBetween,
             crossAxisAlignment: CrossAxisAlignment.center,
@@ -84,7 +86,7 @@ class RecipeCard extends StatelessWidget {
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
-          buildNetworkImage(context, firstImageUrl),
+          buildNetworkImage(context, imageUrls, 0),
           SizedBox(height: 8),
           GestureDetector(
             onTap: () => navigatorToRecipeDetail(context),

lib/widgets/recipe/list.dart

@@ -19,18 +19,82 @@ class _RecipeListState extends State<RecipeList> {
     // 初始化加载数据
     WidgetsBinding.instance.addPostFrameCallback((_) {
       context.read<FoodProvider>().refreshRecipeList();
+      context.read<FoodProvider>().queryCategoryList();
     });
   }
 
+  Widget _buildSelectCategory(FoodProvider provider) {
+    final colors = Theme.of(context).colorScheme;
+
+    return Container(
+      width: 150,
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.circular(12),
+        border: Border.all(color: Colors.grey[200]!),
+      ),
+      padding: EdgeInsets.symmetric(horizontal: 16),
+      child: DropdownButton<String>(
+        value: provider.queryCategory,
+        hint: Text(
+          '请选择菜谱类别',
+          style: TextStyle(color: Colors.grey[500]),
+        ),
+        isExpanded: true,
+        borderRadius: BorderRadius.circular(12),
+        dropdownColor: Colors.white,
+        elevation: 6,
+        underline: Container(),
+        items: provider.categoryList.map((String value) {
+          return DropdownMenuItem<String>(
+            value: value,
+            child: Row(
+              children: [
+                Container(
+                  width: 8,
+                  height: 8,
+                  decoration: BoxDecoration(
+                    color: colors.primary,
+                    shape: BoxShape.circle,
+                  ),
+                ),
+                SizedBox(width: 8),
+                Expanded(
+                  child: Text(
+                    value,
+                    style: TextStyle(fontSize: 14),
+                  ),
+                )
+              ],
+            ),
+          );
+        }).toList(),
+        onChanged: (value) {
+          setState(() {
+            provider.queryCategory = value!;
+            provider.refreshRecipeList();
+          });
+        },
+      ),
+    );
+  }
+
   Widget _buildContent(FoodProvider provider) {
     if (provider.recipeSummaryList.isEmpty) {
       return buildEmptyData();
     } else {
-      return ListView.builder(
-        itemCount: provider.recipeSummaryList.length,
-        itemBuilder: (context, index) {
-          return RecipeCard(recipe: provider.recipeSummaryList[index]);
-        },
+      return Column(
+        children: [
+          _buildSelectCategory(provider),
+          Expanded(
+            child: ListView.builder(
+              itemCount: provider.recipeSummaryList.length,
+              itemBuilder: (context, index) {
+                return RecipeCard(recipe: provider.recipeSummaryList[index]);
+              },
+            ),
+          ),
+        ],
       );
     }
   }

lib/widgets/recipe/timeline.dart

@@ -41,7 +41,7 @@ class _RecipeTimeline extends State<RecipeTimeline> {
                 style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
               ),
               const SizedBox(height: 5),
-              buildNetworkImage(context, record.imageUrl),
+              buildNetworkImage(context, [record.imageUrl], 0),
             ],
           ),
         ],
@@ -88,7 +88,12 @@ class _RecipeTimeline extends State<RecipeTimeline> {
               (year) =>
                   provider.refreshRecordList("$year-01-01", "$year-12-31"),
         ),
-        Expanded(child: buildTimeline(context, provider.recordList)),
+        Expanded(
+          child: Padding(
+            padding: EdgeInsets.symmetric(vertical: 0, horizontal: 10),
+            child: buildTimeline(context, provider.recordList),
+          ),
+        ),
       ],
     );
   }