import 'package:flutter/material.dart';
import 'package:primer_practica/src/controllers/articles_controller.dart';
import 'package:primer_practica/src/models/articles_model.dart';

class ArticlePage extends StatefulWidget {

  final int categoryId;

  // creamos un constructor de ArticlePage que recibe categoryId como parámetro.
  const ArticlePage({Key? key, required this.categoryId}) : super(key: key);
  @override
  _ArticlePageState createState() => _ArticlePageState();
}

class _ArticlePageState extends State<ArticlePage> {
  final ArticleController _articleController = ArticleController();

  late Future<Map<String, dynamic>> _articlesFuture;

  @override
  void initState() {
    super.initState();
    // Inicializa _articlesFuture llamando al método getArticles del controlador de
    // artículos con el categoryId.
    _articlesFuture = _articleController.getArticles(widget.categoryId);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Artículos'),
        backgroundColor: Colors.indigoAccent,
        foregroundColor: Colors.white,
      ),

      body: FutureBuilder<Map<String, dynamic>>(
        future: _articlesFuture,
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            if (snapshot.data!['ok']) {
              if (snapshot.data!['data'] != null && (snapshot.data!['data'] as List).isNotEmpty) {
                List<ArticlesModel> articles = snapshot.data!['data'] as List<ArticlesModel>;
                //Lista de articulos
                return ListView.builder(
                  // Definimos el número de elementos en la lista.
                  itemCount: articles.length,
                  itemBuilder: (context, index) {
                    final article = articles[index];
                    return Card(
                      child: ListTile(
                        title: Text(article.nombre),
                        subtitle: Text('id :${article.categoriaId}'),
                        //subtitle: Text('Clave: ${article.clave}'),
                        trailing: Text('\$${article.precios.isNotEmpty ? article.precios.first.precio.toStringAsFixed(2) : 'N/A'}'),
                      ),
                    );
                  },
                );
              } else {
                return Center(child: Text('No se encontraron artículos.'));
              }
            } else {
              return Center(child: Text('Error: ${snapshot.data!['message']}'));
            }
          } else if (snapshot.hasError) {
            return Center(child: Text('Error: ${snapshot.error}'));
          } else {
            return const Center(child: CircularProgressIndicator());
          }
        },
      ),
    );
  }
}