food_hub_app/lib/record.dart

import 'package:flutter/material.dart';

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

  @override
  State<StatefulWidget> createState() => _RecordPageState();
}

enum ViewType { recipe, daily, timeline }

class _RecordPageState extends State<RecordPage> {
  ViewType _selectedViewType = ViewType.recipe;

  final List<Recipe> recipeList = [
    Recipe("韭菜炒鸡蛋", "2025-05-04", "https://cdn.seovx.com/?mom=302"),
    Recipe("红烧肉", "2025-05-05", "https://cdn.seovx.com/?mom=302"),
  ];

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Card(
          color: Colors.white,
          margin: const EdgeInsets.all(10),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(10), // 卡片圆角
          ),
          shadowColor: Colors.black.withValues(alpha: 0.1),
          child: Container(
            padding: const EdgeInsets.all(10), // 内部内容边距
            child: Row(
              children: [
                const Text("查看类型：", style: TextStyle(fontWeight: FontWeight.bold)),
                const SizedBox(width: 8),
                SegmentedButton<ViewType>(
                  segments: [
                    ButtonSegment(value: ViewType.recipe, label: Text("菜谱")),
                    ButtonSegment(value: ViewType.daily, label: Text("日历")),
                    ButtonSegment(value: ViewType.timeline, label: Text("时间轴")),
                  ],
                  selected: {_selectedViewType},
                  onSelectionChanged: (newSelection) {
                    setState(() {
                      _selectedViewType = newSelection.first;
                    });
                  },
                  style: ButtonStyle(
                    shape: WidgetStateProperty.all<RoundedRectangleBorder>(
                      RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(8), // 分段按钮圆角
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ),

        // 分隔线
        const Divider(height: 1),

        // 内容区域
        Expanded(
          child: _buildContent(),
        ),
      ],
    );
  }

  Widget _buildContent() {
    switch (_selectedViewType) {
      case ViewType.recipe:
        return ListView.builder(
            itemCount: recipeList.length,
            itemBuilder: (context, index) {
              return RecipeCard(recipe: recipeList[index]);
            }
        );
      case ViewType.daily:
        return const Center(child: Text("日历视图"));
      case ViewType.timeline:
        return const Center(child: Text("时间轴视图"));
    }
  }
}

class Recipe {
  final String name;
  final String date;
  final String imagePath;

  Recipe(this.name, this.date, this.imagePath);
}

class RecipeCard extends StatelessWidget {
  final Recipe recipe;

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

  @override
  Widget build(BuildContext context) {
    return Card(
      margin: const EdgeInsets.all(10),
      color: Colors.white,
      child: Column(
        children: [
          Image.network(
            recipe.imagePath,
            height: 200,
            fit: BoxFit.contain,
          ),
          const Divider(
            height: 1,
            // 分隔线本身的高度
            thickness: 1,
            // 线条粗细
            color: Colors.green,
            // 线条颜色
            indent: 0,
            // 左侧缩进
            endIndent: 0, // 右侧缩进
          ),
          Padding(
            padding: EdgeInsets.symmetric(vertical: 5, horizontal: 10),
            child: Column(
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      recipe.name,
                      style: TextStyle(
                        fontSize: 16,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    Row(
                      children: [
                        IconButton(
                          icon: Icon(Icons.edit),
                          onPressed: () {},
                        ),
                        IconButton(
                          icon: Icon(Icons.book),
                          onPressed: () {},
                        ),
                        IconButton(
                          icon: Icon(Icons.delete),
                          onPressed: () {},
                        ),
                      ],
                    ),
                  ],
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Row(
                      children: [
                        Icon(Icons.food_bank, color: Colors.grey),
                        SizedBox(width: 4),
                        Text("家常菜", style: TextStyle(color: Colors.grey)),
                      ],
                    ),
                    Row(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        Icon(Icons.date_range, color: Colors.red[700]),
                        SizedBox(width: 4),
                        Text(recipe.date, style: TextStyle(color: Colors.grey)),
                      ],
                    ),
                  ],
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}