feat:增加加载中组件

lib/widgets/recipe/calendar.dart

@@ -1,8 +1,6 @@
 import 'package:flutter/material.dart';
-import 'package:food_hub_app/apis/recipe.dart';
 import 'package:food_hub_app/models/recipe.dart';
 import 'package:food_hub_app/provider/food_provider.dart';
-import 'package:food_hub_app/utils/date_util.dart';
 import 'package:food_hub_app/utils/index.dart';
 import 'package:food_hub_app/widgets/common/index.dart';
 import 'package:table_calendar/table_calendar.dart';
@@ -16,46 +14,7 @@ class RecipeCalendar extends StatefulWidget {
 }
 
 class _RecipeCalendarState extends State<RecipeCalendar> {
-  DateTime _selectedDay = DateTime.now();
-  DateTime _focusedDay = DateTime.now();
-
-  List<FoodRecord> recordList = [];
-  List<FoodRecord> selectRecordList = [];
-
-  @override
-  void initState() {
-    super.initState();
-    _refreshRecord();
-  }
-
-  Future<void> _refreshRecord() async {
-    final result = await queryRecordApi(
-      getFirstDayOfMonth(_focusedDay),
-      getLastDayOfMonth(_focusedDay),
-    );
-    setState(() {
-      recordList = result;
-
-      if (recordList.isNotEmpty) {
-        _selectedDay = DateTime.parse(recordList.last.date);
-      } else {
-        _selectedDay = _focusedDay;
-      }
-
-      _refreshSelectRecord();
-    });
-  }
-
-  void _refreshSelectRecord() {
-    setState(() {
-      selectRecordList =
-          recordList
-              .where((record) => record.date == formatDateTime(_selectedDay))
-              .toList();
-    });
-  }
-
-  TableCalendar _recipeCalendar() {
+  TableCalendar _recipeCalendar(FoodProvider provider) {
     return TableCalendar(
       locale: 'zh_CN',
       headerStyle: const HeaderStyle(
@@ -64,47 +23,53 @@ class _RecipeCalendarState extends State<RecipeCalendar> {
       ),
       firstDay: DateTime.utc(2010, 1, 1),
       lastDay: DateTime.utc(2100, 12, 31),
-      focusedDay: _focusedDay,
-      selectedDayPredicate: (day) => isSameDay(_selectedDay, day),
+      focusedDay: provider.focusedDay,
+      selectedDayPredicate: (day) => isSameDay(provider.selectedDay, day),
       onDaySelected: (selectedDay, focusedDay) {
-        if (!isSameDay(_selectedDay, selectedDay)) {
+        if (!isSameDay(provider.selectedDay, selectedDay)) {
           setState(() {
-            _selectedDay = selectedDay;
-            _focusedDay = focusedDay;
-            _refreshSelectRecord();
+            provider.selectedDay = selectedDay;
+            provider.focusedDay = focusedDay;
+            provider.refreshSelectRecord();
           });
         }
       },
       onPageChanged: (focusedDay) {
-        _focusedDay = focusedDay;
-        _refreshRecord();
+        provider.focusedDay = focusedDay;
+        provider.refreshRecordList(null, null);
       },
       // 自定义日期单元格构建器
       calendarBuilders: CalendarBuilders(
         defaultBuilder:
-            (context, day, focusedDay) => _buildDateWidget(day, false, false),
+            (context, day, focusedDay) =>
+                _buildDateItem(day, false, false, provider),
         selectedBuilder:
-            (context, day, focusedDay) => _buildDateWidget(day, true, false),
+            (context, day, focusedDay) =>
+                _buildDateItem(day, true, false, provider),
         todayBuilder:
-            (context, day, focusedDay) => _buildDateWidget(day, false, true),
+            (context, day, focusedDay) =>
+                _buildDateItem(day, false, true, provider),
       ),
     );
   }
 
-  Widget _dailyItem(BuildContext context) {
+  Widget _dailyItem(BuildContext context, FoodProvider provider) {
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
-        Text(formatDateTime(_selectedDay, 'MM月dd日 EEEE')),
-        if (selectRecordList.isEmpty)
+        Text(formatDateTime(provider.selectedDay, 'MM月dd日 EEEE')),
+        if (provider.selectRecordList.isEmpty)
           buildEmptyData()
         else
           ListView.builder(
             shrinkWrap: true,
             physics: NeverScrollableScrollPhysics(),
-            itemCount: selectRecordList.length,
+            itemCount: provider.selectRecordList.length,
             itemBuilder: (context, index) {
-              return _buildRecordItem(context, selectRecordList[index]);
+              return _buildRecordItem(
+                context,
+                provider.selectRecordList[index],
+              );
             },
           ),
       ],
@@ -170,9 +135,14 @@ class _RecipeCalendarState extends State<RecipeCalendar> {
     );
   }
 
-  Widget _buildDateWidget(DateTime day, bool isSelected, bool isToday) {
+  Widget _buildDateItem(
+    DateTime day,
+    bool isSelected,
+    bool isToday,
+    FoodProvider provider,
+  ) {
     // 检查当前日期是否在需要显示红点的列表中
-    bool shouldShowRedDot = recordList.any(
+    bool shouldShowRedDot = provider.recordList.any(
       (item) => item.date == formatDateTime(day),
     );
 
@@ -214,15 +184,31 @@ class _RecipeCalendarState extends State<RecipeCalendar> {
     );
   }
 
-  @override
-  Widget build(BuildContext context) {
+  Widget _buildContent(FoodProvider provider) {
     return Column(
       children: [
-        buildCard(context: context, child: _recipeCalendar()),
+        buildCard(context: context, child: _recipeCalendar(provider)),
         Expanded(
-          child: buildCard(context: context, child: _dailyItem(context)),
+          child: buildCard(
+            context: context,
+            child: _dailyItem(context, provider),
+          ),
         ),
       ],
     );
   }
+
+  @override
+  Widget build(BuildContext context) {
+    final provider = context.watch<FoodProvider>();
+
+    return Stack(
+      children: [
+        if (provider.isLoading)
+          buildLoadingIndicator(context)
+        else
+          _buildContent(provider),
+      ],
+    );
+  }
 }