// ignore_for_file: use_build_context_synchronously

import 'package:camera/camera.dart';
import 'package:file_picker/file_picker.dart';
import 'package:flutter/material.dart';
import 'package:yoshi_papas_app/views/home/home_screen.dart';
import 'package:yoshi_papas_app/widgets/widgets.dart';
import 'package:provider/provider.dart';

import '../../models/models.dart';
import '../../viewmodels/viewmodels.dart';

class TopingForm extends StatefulWidget {
  const TopingForm({Key? key}) : super(key: key);

  @override
  State<TopingForm> createState() => Formulario();
}

class Formulario extends State<TopingForm> {
  final _clave = TextEditingController();
  final _nombre = TextEditingController();
  final _descripcion = TextEditingController();
  final _costo = TextEditingController();
  final _categoria = TextEditingController();
  final _imagen = TextEditingController();

  @override
  void initState() {
    super.initState();
    Future(() async {
      Provider.of<TopingViewModel>(context, listen: false).setIsLoading(true);
      final mvm = Provider.of<TopingViewModel>(context, listen: false);
      Toping? modelo = mvm.selectedToping;
      if (modelo != null && modelo.id > 0) {
        setState(() {
          _clave.text = modelo.clave.toString();
          _nombre.text = modelo.nombre.toString();
          _descripcion.text = modelo.descripcion.toString();
          _costo.text = modelo.costo.toString();
          _categoria.text = modelo.idCategoria.toString();
        });
      }
      Provider.of<TopingViewModel>(context, listen: false).setIsLoading(false);
    });
  }

  @override
  void dispose() {
    super.dispose();
    _descripcion.dispose();
    _nombre.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final mvm = Provider.of<TopingViewModel>(context);
    final modelo = mvm.selectedToping;
    final mediavm = Provider.of<MediaViewModel>(context);
    if (mvm.isLoading) return const Cargando();
    final Toping = mvm.selectedToping;

    List<Widget> _registros = [];
    if (modelo!.mediaToping.isNotEmpty) {
      for (int x = 0; x <= modelo.mediaToping.length - 1; x++) {
        _registros.add(itemMedia(context, x));
      }
    }
    Size s = MediaQuery.of(context).size;
    int axiscount = obtenerAxiscount(s);

    return Scaffold(
      appBar: encabezado(titulo: "Toping Categoria"),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(8),
        child: Column(
          children: [
            tarjeta(
              Padding(
                padding: const EdgeInsets.all(8),
                child: Column(
                  children: [
                    Row(
                      children: [
                        Expanded(
                          child: AppTextField(
                            maxLength: 100,
                            etiqueta: 'Clave',
                            controller: _clave,
                            hintText: 'Clave Toping',
                          ),
                        ),
                      ],
                    ),
                    Row(
                      children: [
                        Expanded(
                          child: AppTextField(
                            maxLength: 100,
                            etiqueta: 'Nombre',
                            controller: _nombre,
                            hintText: 'Nombre Toping',
                          ),
                        ),
                      ],
                    ),
                    Row(
                      children: [
                        Expanded(
                          child: AppTextField(
                            maxLength: 100,
                            etiqueta: 'Categoria',
                            controller: _categoria,
                            hintText: 'Nombre Categoria',
                          ),
                        ),
                      ],
                    ),
                    Row(
                      children: [
                        Expanded(
                          child: AppTextField(
                            maxLength: 100,
                            etiqueta: 'Precio',
                            controller: _costo,
                            hintText: 'Precio Toping',
                          ),
                        ),
                      ],
                    ),
                    Row(
                      children: [
                        Expanded(
                          child: AppTextField(
                            maxLength: 1000,
                            maxLines: 3,
                            etiqueta: 'Descripción',
                            controller: _descripcion,
                            hintText: 'Descripción de Toping',
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
            ),
            const SizedBox(height: 15),
            tarjeta(Column(children: [
              GridView.count(
                key: const Key("contenedor-1"),
                physics: const NeverScrollableScrollPhysics(),
                shrinkWrap: true,
                padding: const EdgeInsets.all(4),
                crossAxisCount: axiscount,
                crossAxisSpacing: 2,
                mainAxisSpacing: 1,
                children: [
                  ..._registros,
                  agregarMedia(accion: () async {
                    Navigator.push(
                      context,
                      MaterialPageRoute(
                          builder: (context) => const HomeScreen()),
                    );
                  }),
                ],
              ),
              const SizedBox(height: 30),
            ])),
            boton("Guardar", () async {
              Provider.of<TopingViewModel>(context, listen: false)
                  .setIsLoading(true);
              await mvm.guardarModelo(
                modelo: Toping!,
                clave: _clave.text,
                nombre: _nombre.text,
                descripcion: _descripcion.text,
              );
              Provider.of<TopingViewModel>(context, listen: false)
                  .setIsLoading(false);
              if (context.mounted) {
                Navigator.pop(context);
              }
            }),
          ],
        ),
      ),
    );
  }

  Widget itemMedia(BuildContext context, int index) {
    MediaToping mediaTC = Provider.of<TopingViewModel>(context, listen: false)
        .selectedToping!
        .mediaToping[index];

    // Asegúrate de que el objeto media no sea nulo
    if (mediaTC.media == null || mediaTC.media!.ruta!.isEmpty) {
      // Si es nulo, muestra un widget de placeholder
      return Container(
        alignment: Alignment.center,
        padding: EdgeInsets.all(8.0),
        child: Text('Imagen no disponible'),
      );
    }

    // Utiliza el objeto media para mostrar la imagen
    return Card(
      clipBehavior: Clip.antiAlias,
      child: Column(
        children: [
          Expanded(
            child: Image.network(
              mediaTC.media!.ruta!,
              fit: BoxFit.cover,
              errorBuilder: (context, error, stackTrace) {
                // Muestra un mensaje de error o imagen de placeholder
                return Center(child: Text('Error al cargar la imagen'));
              },
            ),
          ),
          Padding(
            padding: EdgeInsets.all(8.0),
            child: Text(mediaTC.media!.nombre ?? 'Sin nombre'),
          ),
        ],
      ),
    );
  }
}