import 'package:flutter/material.dart';
import '../../navigation/bottom_nav_bar.dart';
import '../../widgets/common/app_search_bar.dart';

class NewsScreen extends StatelessWidget {
  const NewsScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('推荐'),
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(20),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // 使用 StatefulWidget 搜索框
            SearchBarCustom(
              hintText: '搜索...',
              onSearch: (query) {
                // 处理搜索逻辑
                // print('搜索: $query');
              },
              onChanged: (query) {
                // 实时搜索
                // print('输入变化: $query');
              },
              onClear: () {
                // print('清除搜索');
              },
            ),
            const SizedBox(height: 24),

            // 推荐列表
            ListView.builder(
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
              itemCount: 10,
              itemBuilder: (context, index) {
                return _buildNewsCard(index);
              },
            ),
          ],
        ),
      ),
      bottomNavigationBar: const BottomNavBar(initialIndex: 1),
    );
  }
  
  Widget _buildNewsCard(int index) {
    final titles = [
      '体彩 大乐透 20260001期',
      '福彩 双色球 20260002期',
      '福彩 双色球 20260003期',
      '体彩 大乐透 20260004期',
      '福彩 双色球 20260005期',
      '福彩 双色球 20260007期',
      '体彩 大乐透 20260006期',
      '福彩 双色球 20260008期',
      '福彩 双色球 20260009期',
      '福彩 快乐八 20260010期',
    ];
    
    final subtitles = [
      '预测号码：4 5 8 6 25 8 9 6',
      '预测号码：4 5 8 6 25 8 9 6',
      '预测号码：4 5 8 6 25 8 9 6',
      '预测号码：4 5 8 6 25 8 9 6',
      '预测号码：4 5 8 6 25 8 9 6',
      '预测号码：4 5 8 6 25 8 9 6',
      '预测号码：4 5 8 6 25 8 9 6',
      '预测号码：4 5 8 6 25 8 9 6',
      '预测号码：4 5 8 6 25 8 9 6',
      '预测号码：4 5 8 6 25 8 9 6',
    ];
    
    final times = [
      '2小时前 ：aaa',
      '5小时前 ：aaa',
      '昨天 ：aaa',
      '2天前 ：aaa',
      '3天前 ：aaa',
      '1周前 ：aaa',
      '1周前 ：aaa',
      '2周前 ：aaa',
      '2周前 ：aaa',
      '1个月前 ：aaa',
    ];
    
    return Card(
      margin: const EdgeInsets.only(bottom: 16),
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(12),
      ),
      child: InkWell(
        onTap: () {
          print(index);
        },
        borderRadius: BorderRadius.circular(12),
        child: Padding(
          padding: const EdgeInsets.all(16),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  Container(
                    width: 60,
                    height: 60,
                    decoration: BoxDecoration(
                      color: Colors.primaries[index % Colors.primaries.length],
                      borderRadius: BorderRadius.circular(8),
                    ),
                    child: Center(
                      child: Text(
                        '推号',
                        style: TextStyle(
                          color: Colors.white,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                  ),
                  const SizedBox(width: 16),
                  Expanded(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          titles[index],
                          style: const TextStyle(
                            fontSize: 18,
                            fontWeight: FontWeight.bold,
                          ),
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                        ),
                        const SizedBox(height: 4),
                        Text(
                          subtitles[index],
                          style: TextStyle(
                            fontSize: 16,
                            color: Colors.grey[600],
                          ),
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                        ),
                      ],
                    ),
                  ),
                ],
              ),
              const SizedBox(height: 4),
              Row(
                children: [
                  Icon(
                    Icons.schedule,
                    size: 16,
                    color: Colors.grey[500],
                  ),
                  const SizedBox(width: 4),
                  Text(
                    times[index],
                    style: TextStyle(
                      fontSize: 14,
                      color: Colors.grey[500],
                    ),
                  ),
                  const Spacer(),
                  IconButton(
                    icon: Icon(
                      Icons.bookmark_border,
                      color: Colors.grey[500],
                    ),
                    onPressed: () {
                      // 添加书签
                    },
                    iconSize: 20,
                  ),
                  IconButton(
                    icon: Icon(
                      Icons.share,
                      color: Colors.grey[500],
                    ),
                    onPressed: () {
                      // 分享
                    },
                    iconSize: 20,
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}