import 'package:flutter/material.dart';
import 'package:crcivan/BloC/DataService.dart';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'package:html/parser.dart' as htmlParser;
import 'package:html/dom.dart' as htmlDom;
import 'package:crcivan/bars/app_bar';
import 'package:crcivan/bars/bottom_bar';
import 'package:crcivan/widgets/background_widget.dart'; 
import 'package:crcivan/pages/utils.dart';
import 'dart:math' show min;

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

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

class _SeccionesPageState extends State<SeccionesPage> {
  final DataService dataService = DataService();
  String communicationDate = '';
  List<Map<String, dynamic>> seccionesData = [];

  @override
  void initState() {
    super.initState();
    obtenerDatosSecciones();
  }

  Future<void> obtenerDatosSecciones() async {
    try {
      final data = await dataService.obtenerDatosSecciones();
      setState(() {
        communicationDate = data['communicationDate'];
        seccionesData = data['seccionesData'];
      });
    } catch (e) {
      print('Error: $e');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: const CustomAppBar(),
      body: BackgroundWidget(
        child: Column(
          children: [
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Text(
                communicationDate,
                style: TextStyle(
                  fontSize: getResponsiveFontSize(context, 18.0),
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
            Expanded(
              child: ListView.builder(
                itemCount: seccionesData.length,
                itemBuilder: (context, index) {
                  final seccion = seccionesData[index];
                  return Padding(
                    padding: const EdgeInsets.only(bottom: 8.0),
                    child: Container(
                      decoration: BoxDecoration(
                        color: Colors.white.withOpacity(0.5),
                        borderRadius: BorderRadius.circular(10.0),
                      ),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Padding(
                            padding: const EdgeInsets.all(8.0),
                            child: Wrap(
                              children: [
                                Text(
                                  'ÚLTIMO RIEGO ',
                                  style: TextStyle(
                                    fontSize: min(getResponsiveFontSize(context, 20.0), 24.0),
                                    fontWeight: FontWeight.bold,
                                  ),
                                ),
                                Text(
                                  seccion['section'],
                                  style: TextStyle(
                                    fontSize: min(getResponsiveFontSize(context, 20.0), 24.0),
                                    fontWeight: FontWeight.bold,
                                  ),
                                ),
                              ],
                            ),
                          ),
                          if (seccion['guardInfo'] != null)
                            Padding(
                              padding: const EdgeInsets.symmetric(horizontal: 8.0),
                              child: Text(
                                seccion['guardInfo'],
                                style: TextStyle(
                                  fontSize: getResponsiveFontSize(context, 20.0),
                                  fontWeight: FontWeight.bold,
                                  fontStyle: FontStyle.italic,
                                ),
                              ),
                            ),
                          ...seccion['data'].map<Widget>((data) {
                            return Padding(
                              padding: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 4.0),
                              child: Text(
                                '${data['date']}: ${data['location']}',
                                style: TextStyle(
                                  fontSize: getResponsiveFontSize(context, 16.0),
                                ),
                              ),
                            );
                          }).toList(),
                        ],
                      ),
                    ),
                  );
                },
              ),
            ),
          ],
        ),
      ),
      bottomNavigationBar: const CustomBottomBar(),
    );
  }
}