import 'package:flutter/material.dart';
import 'tarjetaeta.dart';
import 'configuraciondomicilio.dart';

class Domicilio {
  final String id;
  final String etiqueta;
  final String direccion;

  Domicilio({required this.id, required this.etiqueta, required this.direccion});
}

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

  @override
  State<GestionDomiciliosScreen> createState() => _GestionDomiciliosScreenState();
}

class _GestionDomiciliosScreenState extends State<GestionDomiciliosScreen> {
  final List<Domicilio> _misDomicilios = [
    Domicilio(id: '1', etiqueta: 'Casa', direccion: 'Av. Paseo de la Reforma 222, CDMX'),
    Domicilio(id: '2', etiqueta: 'Trabajo', direccion: 'Colonia Centro, Calle Benito Juárez 45'),
  ];

  final _formKey = GlobalKey<FormState>();
  final _direccionController = TextEditingController();
  String _etiquetaSeleccionada = 'Casa';

  final List<String> _opcionesEtiquetas = ['Casa', 'Trabajo', 'Otro'];

  @override
  void dispose() {
    _direccionController.dispose();
    super.dispose();
  }

  void _mostrarFormularioAgregar(BuildContext context) {
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(top: Radius.circular(24)),
      ),
      builder: (context) {
        return StatefulBuilder(
          builder: (BuildContext context, StateSetter setModalState) {
            return Padding(
              padding: EdgeInsets.only(
                bottom: MediaQuery.of(context).viewInsets.bottom + 24,
                top: 24,
                left: 24,
                right: 24,
              ),
              child: Form(
                key: _formKey,
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      'Registrar Nuevo Domicilio',
                      style: Theme.of(context).textTheme.titleLarge?.copyWith(
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    const SizedBox(height: 8),
                    Text(
                      'Asigna una etiqueta para identificar dónde recogeremos los residuos.',
                      style: TextStyle(color: Colors.grey[600]),
                    ),
                    const SizedBox(height: 20),

                    Text('Etiqueta:', style: TextStyle(fontWeight: FontWeight.bold, color: Colors.green[800])),
                    const SizedBox(height: 8),
                    Row(
                      children: _opcionesEtiquetas.map((etiqueta) {
                        final bool isSelected = _etiquetaSeleccionada == etiqueta;
                        return Padding(
                          padding: const EdgeInsets.only(right: 8.0),
                          child: ChoiceChip(
                            label: Text(etiqueta),
                            selected: isSelected,
                            selectedColor: Colors.green[100],
                            checkmarkColor: Colors.green[800],
                            labelStyle: TextStyle(
                              color: isSelected ? Colors.green[800] : Colors.black,
                              fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
                            ),
                            onSelected: (bool selected) {
                              setModalState(() {
                                _etiquetaSeleccionada = etiqueta;
                              });
                            },
                          ),
                        );
                      }).toList(),
                    ),
                    const SizedBox(height: 20),

                    TextFormField(
                      controller: _direccionController,
                      decoration: InputDecoration(
                        labelText: 'Dirección completa',
                        hintText: 'Calle, número, colonia...',
                        prefixIcon: const Icon(Icons.location_on, color: Colors.green),
                        border: OutlineInputBorder(
                          borderRadius: BorderRadius.circular(12),
                        ),
                        focusedBorder: OutlineInputBorder(
                          borderRadius: BorderRadius.circular(12),
                          borderSide: const BorderSide(color: Colors.green, width: 2),
                        ),
                      ),
                      validator: (value) {
                        if (value == null || value.trim().isEmpty) {
                          return 'Por favor, ingresa una dirección';
                        }
                        return null;
                      },
                    ),
                    const SizedBox(height: 24),

                    SizedBox(
                      width: double.infinity,
                      height: 50,
                      child: ElevatedButton(
                        style: ElevatedButton.styleFrom(
                          backgroundColor: Colors.green[700],
                          foregroundColor: Colors.white,
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(12),
                          ),
                        ),
                        onPressed: () {
                          if (_formKey.currentState!.validate()) {
                            setState(() {
                              _misDomicilios.add(
                                Domicilio(
                                  id: DateTime.now().toString(),
                                  etiqueta: _etiquetaSeleccionada,
                                  direccion: _direccionController.text,
                                ),
                              );
                            });
                            _direccionController.clear();
                            Navigator.pop(context);

                            ScaffoldMessenger.of(context).showSnackBar(
                              const SnackBar(
                                content: Text('¡Domicilio registrado con éxito!'),
                                backgroundColor: Colors.green,
                              ),
                            );
                          }
                        },
                        child: const Text('Guardar Domicilio', style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold)),
                      ),
                    ),
                  ],
                ),
              ),
            );
          },
        );
      },
    );
  }

  IconData _obtenerIcono(String etiqueta) {
    switch (etiqueta.toLowerCase()) {
      case 'casa':
        return Icons.home_rounded;
      case 'trabajo':
        return Icons.business_center_rounded;
      default:
        return Icons.place_rounded;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Mis Domicilios', style: TextStyle(fontWeight: FontWeight.bold)),
        backgroundColor: Colors.green[700],
        foregroundColor: Colors.white,
      ),
      body: Column(
        children: [
          // USAMOS EL WIDGET EXTERNO AQUÍ DIRECTAMENTE
          const Padding(
            padding: EdgeInsets.only(top: 16.0, left: 16.0, right: 16.0),
            child: TarjetaEtaWidget(
              horaInicio: '7:20 p.m.',
              horaFin: '7:35 p.m.',
              minutosRestantes: 15,
              estadoCamion: 'en_camino',
            ),
          ),

          const Padding(
            padding: EdgeInsets.only(left: 18.0, top: 16.0, bottom: 4.0),
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                'Lugares de Recolección',
                style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold, color: Colors.grey),
              ),
            ),
          ),

          Expanded(
            child: _misDomicilios.isEmpty
                ? Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Icon(Icons.no_accounts_rounded, size: 80, color: Colors.grey[400]),
                  const SizedBox(height: 16),
                  Text('Aún no tienes domicilios registrados', style: TextStyle(color: Colors.grey[600], fontSize: 16)),
                ],
              ),
            )
                : ListView.builder(
              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
              itemCount: _misDomicilios.length,
              itemBuilder: (context, index) {
                final domicilio = _misDomicilios[index];

                return Card(
                  margin: const EdgeInsets.only(bottom: 12),
                  elevation: 2,
                  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
                  child: ListTile(
                    leading: CircleAvatar(
                      backgroundColor: Colors.green[50],
                      child: Icon(_obtenerIcono(domicilio.etiqueta), color: Colors.green[700]),
                    ),
                    title: Text(
                      domicilio.etiqueta,
                      style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
                    ),
                    subtitle: Text(domicilio.direccion, maxLines: 2, overflow: TextOverflow.ellipsis),
                    trailing: IconButton(
                      icon: const Icon(Icons.delete_outline, color: Colors.redAccent),
                      onPressed: () {
                        setState(() {
                          _misDomicilios.removeAt(index);
                        });
                      },
                    ),
                  ),
                );
              },
            ),
          ),
        ],
      ),
      floatingActionButton: FloatingActionButton.extended(
        onPressed: () => _mostrarFormularioAgregar(context),
        backgroundColor: Colors.green[700],
        foregroundColor: Colors.white,
        icon: const Icon(Icons.add_location_alt_rounded),
        label: const Text('Agregar lugar'),
      ),
    );
  }
}