import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';
import 'package:food_hub_app/config/app_config.dart';

import 'package:food_hub_app/models/recipe.dart';
import 'package:food_hub_app/widgets/common/index.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart';

class RecipeCard extends StatelessWidget {
  final Recipe recipe;

  const RecipeCard({super.key, required this.recipe});

  @override
  Widget build(BuildContext context) {
    return Card(
      elevation: 0,
      color: Colors.white,
      clipBehavior: Clip.antiAlias,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Image.network(
            '${AppConfig.baseApiUrl}/${recipe.recordList[0].imageUrl}',
            height: 200,
            width: double.infinity,
            fit: BoxFit.contain,
            errorBuilder: (context, error, stackTrace) => errorImageContainer(200),
          ),
          Divider(
            height: 1,
            thickness: 1,
            color: Theme.of(context).primaryColor,
            indent: 0,
            endIndent: 0,
          ),
          Padding(
            padding: const EdgeInsets.all(10),
            child: _buildRecipeContent(context),
          ),
        ],
      ),
    );
  }

  Widget _buildRecipeContent(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Expanded(
              child: Text(
                recipe.name,
                style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
                maxLines: 1, // 限制单行，避免挤压按钮
                overflow: TextOverflow.ellipsis,
              ),
            ),
            Row(
              children: [
                TDButton(
                  icon: Icons.edit,
                  size: TDButtonSize.small,
                  type: TDButtonType.fill,
                  shape: TDButtonShape.circle,
                  theme: TDButtonTheme.primary,
                  onTap: () => {},
                ),
                SizedBox(width: 10),
                TDButton(
                  icon: Icons.book,
                  size: TDButtonSize.small,
                  type: TDButtonType.fill,
                  shape: TDButtonShape.circle,
                  theme: TDButtonTheme.primary,
                  onTap: () => {},
                ),
              ],
            ),
          ],
        ),
        const SizedBox(height: 5),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Row(
              children: [
                _buildIconText(
                  icon: Icons.food_bank,
                  text: recipe.category,
                  color: Theme.of(context).primaryColor,
                ),
                const SizedBox(width: 12),
                _buildIconText(
                  icon: Icons.thumb_up_alt_outlined,
                  text: recipe.likeCount.toString(),
                  color: Colors.red,
                ),
                const SizedBox(width: 12),
                _buildIconText(
                  icon: Icons.star_outline,
                  text: recipe.favouriteCount.toString(),
                  color: Colors.blue,
                ),
                const SizedBox(width: 12),
                _buildIconText(
                  icon: Icons.comment_outlined,
                  text: recipe.commentCount.toString(),
                  color: Colors.deepOrange,
                ),
              ],
            ),
            Row(
              children: [
                _buildIconText(
                  icon: Icons.date_range,
                  text: recipe.recordList[0].date,
                  color: Colors.red,
                ),
              ],
            ),
          ],
        ),
      ],
    );
  }

  // 通用图标文本组件
  Widget _buildIconText({
    required IconData icon,
    required String text,
    Color color = Colors.grey, // 默认灰色
    double iconSize = 16,
    double textSize = 16,
    double spacing = 2, // 图标与文本间距
  }) {
    return Row(
      children: [
        Icon(icon, size: iconSize, color: color),
        SizedBox(width: spacing),
        Text(text, style: TextStyle(fontSize: textSize, color: color)),
      ],
    );
  }
}