import 'package:flutter/material.dart';
import 'package:food_hub_app/provider/food_provider.dart';
import 'package:food_hub_app/widgets/common/index.dart';
import 'package:food_hub_app/widgets/recipe/card.dart';
import 'package:provider/provider.dart';

class RecipeList extends StatefulWidget {
  const RecipeList({super.key});

  @override
  State<RecipeList> createState() => _RecipeListState();
}

class _RecipeListState extends State<RecipeList> {
  @override
  void initState() {
    super.initState();

    // 初始化加载数据
    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 Column(
        children: [
          _buildSelectCategory(provider),
          SizedBox(height: 5),
          Expanded(
            child: ListView.builder(
              itemCount: provider.recipeSummaryList.length,
              itemBuilder: (context, index) {
                return RecipeCard(recipe: provider.recipeSummaryList[index]);
              },
            ),
          ),
        ],
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    final provider = context.watch<FoodProvider>();

    return Stack(
      children: [
        if (provider.isLoading)
          buildLoadingIndicator(context)
        else
          _buildContent(provider),
      ],
    );
  }
}