import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:primer_practica/src/providers/carrito_providers.dart';
import 'package:primer_practica/src/models/carrito_model.dart';

class CarritoPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var carritoProvider = Provider.of<CarritoProvider>(context);

    return Scaffold(
      appBar: AppBar(
        title: Text('Carrito'),
      ),
      body: Column(
        children: [
          Expanded(
            child: ListView.builder(
              itemCount: carritoProvider.carrito.length, // Número de elementos en el carrito
              itemBuilder: (context, index) {
                final item = carritoProvider.carrito[index];
                return CarritoItemWidget(item: item); // Construte los elementos
              },
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(20.0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text(
                  '\$ ${carritoProvider.totalPrecio.toStringAsFixed(2)}', // Total de todos los articulos
                  style: TextStyle(fontSize: 24, fontWeight: FontWeight.w700),
                ),
                ElevatedButton(
                  onPressed: () {

                  },
                  child: Text('COMPRAR'),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

class CarritoItemWidget extends StatelessWidget {
  final CarritoModel item;

  const CarritoItemWidget({Key? key, required this.item}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var carritoProvider = Provider.of<CarritoProvider>(context, listen: false);

    return Card(
      margin: const EdgeInsets.symmetric(vertical: 8, horizontal: 16),
      child: Padding(
        padding: const EdgeInsets.all(30.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              item.articulo.nombre, // Muestra el nombre del artículo
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
            ),
            SizedBox(height: 15),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text('Precio: \$${item.precio.toStringAsFixed(2)}'), // Muestra el precio del artículo
                Row(
                  children: [
                    IconButton(
                      icon: Icon(Icons.remove),
                      onPressed: () {
                        if (item.cantidad > 1) {
                          carritoProvider.actualizarArticulo(item, item.cantidad - 1); // Disminuye la cantidad del artículo
                        }
                      },
                    ),
                    Text('${item.cantidad}'),
                    IconButton(
                      icon: Icon(Icons.add),
                      onPressed: () {
                        carritoProvider.actualizarArticulo(item, item.cantidad + 1); // Aumenta la cantidad del artículo
                      },
                    ),
                  ],
                ),
                Text('Total: \$${(item.precio * item.cantidad).toStringAsFixed(2)}'), // Muestra el total por artículo
              ],
            ),
            IconButton(
              icon: Icon(Icons.delete, color: Colors.red),
              onPressed: () {
                carritoProvider.eliminarDelCarrito(item);
              },
            ),
          ],
        ),
      ),
    );
  }
}