---

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(title: 'ДНС', home: HomeScreen());
  }
}

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

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  int _currentIndex = 0;

  // Данные для карточек
  final List<Map<String, String>> _articles = [
    {
      'title': 'Покрытие подошвы у углов: какие лучше\nи что выбрать',
      'image':
          'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSMV7UfryO9GVai3IiwwesC2TVD-fYzdhZ2YY0ts2Cmsw&s=10',
      'copyright': 'Автор изображения: ВИДЕОСТУДИЯ КЛУБА DNS. Источник: rutube.ru',
    },
    {
      'title': 'Паровой удар: зачем он нужен и как им\nпользоваться',
      'image':
          'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRJ6Hv6y0d8Ow5uR3Lu6j8YnWyEJi34glVFMkWTmp8ueA&s=10',
      'copyright': 'Автор изображения: ВИДЕОСТУДИЯ КЛУБА DNS. Источник: rutube.ru',
    },
    {
      'title': 'Как выбрать утюг для дома: советы экспертов',
      'image':
          'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTr-rugNtMMYOOo7eZMLdTSgZ0KlEfPixxitkNihSh65Q&s=10',
      'copyright': 'Автор изображения: ВИДЕОСТУДИЯ КЛУБА DNS. Источник: rutube.ru',
    },
    {
      'title': 'Рейтинг лучших утюгов 2024 года',
      'image':
          'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTpuqNL3qYJ9WopNK6nBBFtxw36wnAQif7Uym_DK81wYg&s=10',
      'copyright': 'Автор изображения: ВИДЕОСТУДИЯ КЛУБА DNS. Источник: rutube.ru',
    },
  ];
//Поиск по названию 
  String _query = '';

  List<Map<String, String>> get _filteredArticles {
    if (_query.trim().isEmpty) return [];
    return _articles
        .where((a) =>
            a['title']!.toLowerCase().contains(_query.trim().toLowerCase()))
        .toList();
  }

  // Поисковая строка 
  List<Widget> get _page => [
        _buildHomePage(),
        const Center(child: Text('Каталог')),
        _buildSearchPanel(),
        const Center(child: Text('Корзина')),
        const Center(child: Text('Профиль')),
      ];

  void _onTabTapped(int index) {
    setState(() {
      _currentIndex = index;
    });
  }

  Widget _buildSearchPanel() {
    final results = _filteredArticles;
    final bool isEmptyQuery = _query.trim().isEmpty;

    return Padding(
      padding: EdgeInsetsGeometry.all(12),

      child: Column(
        children: [
          TextField(
            autofocus: true,
            textInputAction: TextInputAction.search,
            onChanged: (value) {
              setState(() {
                _query = value;
              });
            },
            decoration: InputDecoration(
              hintText: "Поиск товаров",
              prefixIcon: Icon(Icons.search),
              border: OutlineInputBorder(
                borderRadius: BorderRadius.circular(12),
              ),
              focusedBorder: OutlineInputBorder(
                borderRadius: BorderRadius.circular(12),
                borderSide: const BorderSide(color: Colors.orange),
              )
            ),
          ),
          Expanded(
            child: isEmptyQuery
                ? const Center(
                    child: Text(
                      'Введите запрос для поиска',
                      style: TextStyle(color: Colors.grey),
                    ),
                  )
                : results.isEmpty
                    ? Center(                         
                        child: Column(                     
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            const Icon(Icons.search_off,   
                                size: 64, color: Colors.grey),
                            const SizedBox(height: 12),    
                            Text(
                              'Нет результатов по запросу ${_query}', 
                              style: const TextStyle(
                                fontSize: 18,
                                color: Colors.grey,
                                fontWeight: FontWeight.w500,
                              ),
                            ),
                          ],
                        ),
                      )
                    : ListView.builder(
                        itemCount: results.length,
                        itemBuilder: (context, index) {
                          final article = results[index];
                          return Padding(
                            padding: const EdgeInsets.only(bottom: 12.0),
                            child: Text(
                              article['title']!.replaceAll('\n', ' '),
                              style: const TextStyle(
                                fontSize: 14,
                                fontWeight: FontWeight.w500,
                              ),
                            ),
                          );
                        },
                      ),
          ),
        ],
      ),
    );
  }

  Widget _buildHomePage() {
    return ListView.builder(
      padding: const EdgeInsets.all(16.0),
      itemCount: _articles.length,
      itemBuilder: (context, index) {
        final article = _articles[index];
        return Padding(
          padding: const EdgeInsets.only(bottom: 24.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                article['title']!,
                style: const TextStyle(
                  fontSize: 18,
                  fontWeight: FontWeight.w500,
                  color: Color(0xFF333333),
                  height: 1.3,
                ),
              ),
              const SizedBox(height: 12),

             
              ClipRRect(
                borderRadius: BorderRadius.circular(16.0),
                child: Image.network(
                  article['image']!,
                  width: double.infinity,
                  height: 300,
                  fit: BoxFit.cover,
                  loadingBuilder: (context, child, loadingProgress) {
                    if (loadingProgress == null) return child;
                    return Container(
                      height: 200,
                      color: Colors.grey[200],
                      child: const Center(
                        child: CircularProgressIndicator(color: Colors.orange),
                      ),);
                  },
                  errorBuilder: (context, error, stackTrace) {
                    return Container(
                      width: double.infinity,
                      height: 200,
                      color: Colors.grey[300],
                      child: const Center(
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Icon(Icons.broken_image,
                                size: 50, color: Colors.grey),
                            SizedBox(height: 8),
                            Text('Ошибка загрузки фото',
                                style: TextStyle(color: Colors.grey)),
                          ],
                        ),
                      ),
                    );
                  },
                ),
              ),

              const SizedBox(height: 6),
              Text(
                article['copyright']!,
                style: const TextStyle(fontSize: 10, color: Colors.grey),
              ),
            ],
          ),
        );
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
       appBar: AppBar(
  backgroundColor: const Color.fromARGB(245, 247, 250, 255),
  title: const Text(
    'ДНС',
    style: TextStyle(fontWeight: FontWeight.bold, color: Colors.orange),
  ),
  actions: [
    Padding(
      padding: const EdgeInsets.only(right: 16.0),
      child: Row(
        children: const [
          Icon(Icons.location_on, color: Colors.grey, size: 18),
          SizedBox(width: 4),
          Text(
            'Волгоград',
            style: TextStyle(color: Colors.grey, fontSize: 14),
          ),
        ],
      ),
    ),
  ],
),
      body: _page[_currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        currentIndex: _currentIndex,
        onTap: _onTabTapped,
        items: const [
          BottomNavigationBarItem(icon: Icon(Icons.home), label: "Главная"),
          BottomNavigationBarItem(
            icon: Icon(Icons.grid_view),
            label: "Каталог",
          ),
          BottomNavigationBarItem(icon: Icon(Icons.search), label: "Поиск"),
          BottomNavigationBarItem(
            icon: Icon(Icons.shopping_cart_outlined),
            label: "Корзина",
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.account_circle_outlined),
            label: "Профиль",
          ),
        ],
        backgroundColor: const Color.fromARGB(245, 247, 250, 255),
        selectedItemColor: Colors.orange,
        unselectedItemColor: Colors.grey,
      ),
    );
  }
}