app_notificaciones_ador/lib/pages/embalses

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'package:html/parser.dart' as htmlParser;
import 'package:flutter_project/bars/app_bar';
import 'package:flutter_project/bars/bottom_bar';

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

  @override
  _EmbalsesPageState createState() => _EmbalsesPageState();
}

class _EmbalsesPageState extends State<EmbalsesPage> {
List<Map<String, dynamic>> embalsesData = [];
  @override
  void initState() {
    super.initState();
    obtenerDatos();
  }

  Future<void> obtenerDatos() async {
    final response = await http.get(Uri.parse('http://www.crcivan.com/escaparate/noticias.cgi?idnoticias=192683'));
    if (response.statusCode == 200) {
      final document = htmlParser.parse(response.body);

      // Buscar los elementos <span> dentro de la estructura específica
      final elementosSpan = document.querySelectorAll('html > body > div > center > table > tbody > tr > td > div > center > table > tbody > tr > td > table > tbody > tr > td > font > font > table > tbody > tr > td > span');
      final nombreEmbalses = document.querySelectorAll('html > body > div > center > table > tbody > tr > td > div > center > table > tbody > tr > td > table > tbody > tr > td > font > font > table > tbody > tr > td > p > span');
      
      final filaTabla = document.querySelectorAll('html > body > div > center > table > tbody > tr > td > div > center > table > tbody > tr > td > table > tbody > tr > td > font > font > table > tbody > tr');
      // Limpiar la lista de datos antes de actualizarla
      setState(() {
        embalsesData.clear();
      });   

     /* for (var i = 0; i < filaTabla.length; i++){
        var nombre[i] = filaTabla.child('td > p > span');
        List elemento[i] = filaTabla.child('td > span');
        embalseData.add(nombre, elemento);
      }*/

      // Agregar textos de los elementos <span> a la lista
  /*  for (var i = 0; i < elementosSpan.length; i++) {
        final elemento = elementosSpan[i];
        final style = elemento.attributes['style'];
        if (style != null && style.contains('font-size: 12pt;')) {
          setState(() {
            // Verificar si el índice es válido antes de agregar los datos a embalsesData
            if (i < nombreEmbalses.length) {
              embalsesData.add({
                'nombre': nombreEmbalses[i].text,
                'otroTexto': elemento.text,
              });
            }
          });
        }
      } */

  for (var fila in filaTabla) {
  var nombreElemento = fila.querySelector('td > p > span');
  var elementos = fila.querySelectorAll('td > span');

  if (nombreElemento != null && elementos.isNotEmpty) {
    var nombre = nombreElemento.text;
    var listaElementos = elementos.map<String>((elemento) => elemento.text).toList();

    // Crear un mapa con el nombre del embalse y sus elementos
    var embalseMap = {'nombre': nombre, 'elementos': listaElementos};

    // Agregar el mapa a la lista de embalsesData
    setState(() {
      embalsesData.add(embalseMap);
    });
  }
}


    } else {
      throw Exception('Error al cargar los datos de embalses');
    }

  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: const CustomAppBar(),
      body: Stack(
        children: [
          // Fondo con la imagen
          Positioned.fill(
            child: Image(
              image: AssetImage('assets/logo-fondo.png'),
              fit: BoxFit.cover,
            ),
          ),
          Padding(
  padding: const EdgeInsets.all(8.0),
  child: ListView.builder(
    itemCount: embalsesData.length,
    itemBuilder: (context, index) {
      final embalseData = embalsesData[index];
      final nombreEmbalse = embalseData['nombre'];
      final listaElementos = embalseData['elementos'];

      return Padding(
        padding: const EdgeInsets.only(bottom: 8.0),
        child: Container(
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(10.0),
          ),
          child: Column(
            children: [
              Row(
                children: [
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Text(
                        nombreEmbalse!,
                        style: TextStyle(
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                  ),
                ],
              ),
              Row(
                children: [
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.symmetric(horizontal: 8.0),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: listaElementos.map<Widget>((elemento) {
                          return Text(
                            elemento,
                            style: TextStyle(
                              fontWeight: FontWeight.normal,
                            ),
                          );
                        }).toList(),
                      ),
                    ),
                  ),
                ],
              ),
            ],
          ),
        ),
      );
    },
  ),),
  ],
),

      bottomNavigationBar: const CustomBottomBar(),
    );
  }
}