import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:localstore/localstore.dart';
import 'package:memorias_calculo_web/src/pages/calculadora_ambiental_page.dart';
import 'package:memorias_calculo_web/src/providers/proyectos_provider.dart';

import '../widgets/encabezado_pais.dart';

import 'package:http/http.dart' as http;
import 'dart:html' as html;

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

  @override
  State<VentilacionAmbientalPage> createState() => _VentilacionAmbientalPageState();
}

class _VentilacionAmbientalPageState extends State<VentilacionAmbientalPage> {
  final ProyectosProvider _proyectosProvider = ProyectosProvider();
  final db = Localstore.instance;
  final List<Map<String, String?>> _projects = [];
  final Map<String, String> _estatusCodigos = {
    "C" : "Cálculo de equipos de extracción y louvers",
    "F" : "Finalizado"
  };

  String _idUsuario = "";
  String _token = "";
  String _pais = "";
  String _code = "";
  bool _isLoading = true;

  @override
  void initState() {
    super.initState();
    _fetchProjects().then((value){
      if(mounted){
        setState(() => _isLoading = false);
      }
    });
  }

  Future<void> _fetchProjects() async{
    final items = await db.collection('login').get();
    final lastID = items?.keys.last;
    final data = items?[lastID];

    _pais = data['pais'];
    _idUsuario = data['idUsuario'];
    _token = data['token'];

    final paisArr = data['pais'].split(" ");
    _code = paisArr.last.replaceAll("(", "").replaceAll(")", "");

    final proyectos = await _proyectosProvider.fetchProyectos(_idUsuario, "ambiental", _token);
    proyectos.result.forEach((element) {
      final timestamp = int.parse(element.fmodificacion);
      final date = DateTime.fromMillisecondsSinceEpoch(timestamp * 1000);

      final proyecto = {
        "idProyecto": element.id,
        "nombreProyecto": element.nombre,
        "estatus" : element.estatus,
        "ulModificacion" : date.toString(),
        "datos": element.datos,
        "archpdf": element.archpdf
      };

      _projects.add(proyecto);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: _isLoading ? const Center(
        child: CircularProgressIndicator(),
      ) : LayoutBuilder(
        builder: (context, constraints) {
          final parentHeight = constraints.maxHeight;
          final parentWidth = constraints.maxWidth;

          double containerHeight = parentHeight;
          double containerWidth = parentWidth > 1440
              ? parentWidth*0.5 : parentWidth > 1280 && parentWidth <= 1440
              ? parentWidth*0.6 : parentWidth > 1080 && parentWidth <= 1280
              ? parentWidth*0.75 : parentWidth > 900 && parentWidth <= 1080
              ? parentWidth*0.8 : parentWidth > 720 && parentWidth <= 900
              ? parentWidth*0.85 : parentWidth > 540 && parentWidth <= 720
              ? parentWidth*0.9 : parentWidth;
          double containerMargin = (parentWidth - containerWidth) / 2;

          return Container(
            height: containerHeight,
            width: containerWidth,
            margin: EdgeInsets.symmetric(
              horizontal: containerMargin,
            ),
            child: Column(
              children: [
                const SizedBox(height: 8.0),
                Container(
                  margin: const EdgeInsets.symmetric(
                    horizontal: 32.0,
                  ),
                  child: Row(
                    children: [
                      TextButton(
                        child: Text(
                          "Portal de memorias de cálculo >",
                          style: GoogleFonts.roboto(
                            fontSize: 16.0,
                            fontWeight: FontWeight.bold,
                            fontStyle: FontStyle.italic,
                          ),
                        ),
                        onPressed: () => Navigator.pop(context),
                        style: TextButton.styleFrom(
                          padding: const EdgeInsets.fromLTRB(0, 0, 8.0, 0),
                          minimumSize: const Size(0, 0),
                          tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                        ),
                      ),
                      const SizedBox(width: 8.0),
                      Expanded(
                        child: Container(
                          padding: const EdgeInsets.fromLTRB(0, 0, 8.0, 0),
                          child: Text(
                            "Memoria de cálculo de ventilación ambiental",
                            maxLines: 1,
                            overflow: TextOverflow.ellipsis,
                            style: GoogleFonts.roboto(
                              fontSize: 16.0,
                              color: Colors.black54,
                              fontWeight: FontWeight.bold,
                              fontStyle: FontStyle.italic,
                            ),
                          ),
                        ),
                      )
                    ],
                  ),
                ),
                const SizedBox(height: 8.0),
                EncabezadoPais(paisCode: _code, paisName: _pais),
                const SizedBox(height: 32.0),
                Image.asset(
                  "1.png",
                  width: 120.0,
                ),
                const SizedBox(height: 48.0),
                Container(
                  width: double.infinity,
                  padding: const EdgeInsets.symmetric(
                    horizontal: 32.0,
                  ),
                  child: const Text(
                    "MEMORIA DE CÁLCULO VENTILACIÓN AMBIENTAL",
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      fontFamily: "Helvetica Neue Black Cond",
                      fontSize: 28.0,
                    ),
                  ),
                ),
                const SizedBox(height: 16.0),
                Container(
                  margin: const EdgeInsets.symmetric(
                    horizontal: 32.0,
                  ),
                  child: Text(
                    "NUEVO PROYECTO",
                    textAlign: TextAlign.center,
                    style: GoogleFonts.robotoSlab(
                      fontWeight: FontWeight.bold,
                      fontSize: 18.0,
                    ),
                  ),
                ),
                const SizedBox(height: 16.0),
                Container(
                  width: double.infinity,
                  margin: const EdgeInsets.symmetric(
                    horizontal: 32.0,
                  ),
                  padding: const EdgeInsets.all(32.0),
                  color: const Color(0x0F000000),
                  child: Row(
                    children: [
                      Expanded(
                        child: ElevatedButton(
                          style: ElevatedButton.styleFrom(
                            primary: Colors.white,
                            onPrimary: const Color.fromRGBO(180, 4, 4, 0.25),
                            padding: const EdgeInsets.all(16.0),
                          ),
                          child: Column(
                            children: [
                              Image.asset(
                                "nuevo2.png",
                                width: 64.0,
                              ),
                              const SizedBox(height: 8.0),
                              Text(
                                "Crear nuevo proyecto",
                                style: GoogleFonts.roboto(
                                  fontWeight: FontWeight.bold,
                                  fontSize: 16.0,
                                  color: const Color(0xFFB40404),
                                ),
                              ),
                            ],
                          ),
                          onPressed: () async{
                            final controller = TextEditingController();
                            final shouldCreate = await showDialog(
                              context: context,
                              barrierDismissible: false,
                              builder: (context) => AlertDialog(
                                title: Text(
                                  "Nombre del proyecto",
                                  textAlign: TextAlign.center,
                                  style: GoogleFonts.roboto(
                                    fontWeight: FontWeight.bold,
                                  ),
                                ),
                                content: TextField(
                                  controller: controller,
                                  decoration: InputDecoration(
                                    hintStyle: GoogleFonts.roboto(
                                      color: Colors.grey,
                                      fontStyle: FontStyle.italic,
                                    ),
                                    hintText: "Ingresa el nombre del proyecto",
                                  ),
                                  style: GoogleFonts.roboto(),
                                  maxLines: 1,
                                  maxLength: 100,
                                  onSubmitted: (val){
                                    if(val.isNotEmpty){
                                      Navigator.pop(context, true);
                                    }
                                  },
                                ),
                                actions: [
                                  TextButton(
                                    child: const Text("Cancelar"),
                                    onPressed: () => Navigator.pop(context, false),
                                  ),
                                  TextButton(
                                    child: const Text("Aceptar"),
                                    onPressed: (){
                                      if(controller.text.isNotEmpty){
                                        Navigator.pop(context, true);
                                      }else{
                                        Fluttertoast.showToast(
                                          msg: "EL nombre del proyecto no debe estar vacío",
                                          toastLength: Toast.LENGTH_SHORT,
                                          timeInSecForIosWeb: 3,
                                          gravity: ToastGravity.CENTER,
                                          webBgColor: "linear-gradient(to right, #b40404, #ff0000)",
                                        );
                                      }
                                    },
                                  )
                                ],
                              ),
                            );

                            if(shouldCreate){
                              final url = Uri.https("smart.solerpalau.mx", "PR/api/v1/quiosco/matrizMemoriasCalculo/nuevoProyectoVentilacion");
                              final res = await http.post(url,
                                headers: {
                                  "Authorization": "Bearer $_token"
                                },
                                body: {
                                  "NOMBREPROYECTO": controller.text,
                                  "MEMORIA": "ambiental",
                                  "FCREACION": DateTime.now().toIso8601String().substring(0, 19),
                                  "FMODIF": DateTime.now().toIso8601String().substring(0, 19),
                                  "IDUSUARIO": _idUsuario,
                                  "ESTATUS": "C"
                                },
                              );

                              print(res.body);
                              final decoded = jsonDecode(res.body);
                              if(!decoded['response']){
                                Fluttertoast.showToast(
                                  msg: decoded['message'],
                                  toastLength: Toast.LENGTH_SHORT,
                                  timeInSecForIosWeb: 3,
                                  gravity: ToastGravity.CENTER,
                                  webBgColor: "linear-gradient(to right, #b40404, #ff0000)",
                                );
                              }else{
                                String idProyecto = decoded['result']['idProyecto'];
                                await Navigator.push(context, MaterialPageRoute(
                                  builder: (context) => CalculadoraAmbientalPage(
                                    pais: _pais,
                                    code: _code,
                                    idProyecto: idProyecto,
                                    idUsuario: _idUsuario,
                                    token: _token,
                                    datos: "",
                                    noProyecto: controller.text,
                                    archpdf: "",
                                  ),
                                ));

                                setState(() => _isLoading = true);

                                _projects.clear();
                                await _fetchProjects();

                                setState(() => _isLoading = false);
                              }
                            }
                          },
                        ),
                        flex: 1,
                      ),
                    ],
                  ),
                ),
                const SizedBox(height: 16.0),
                Container(
                  margin: const EdgeInsets.symmetric(
                    horizontal: 32.0,
                  ),
                  child: Text(
                    "HISTORIAL DE PROYECTOS",
                    textAlign: TextAlign.center,
                    style: GoogleFonts.robotoSlab(
                      fontWeight: FontWeight.bold,
                      fontSize: 18.0,
                    ),
                  ),
                ),
                const SizedBox(height: 16.0),
                if(_projects.isEmpty)
                  Container(
                    width: double.infinity,
                    margin: const EdgeInsets.symmetric(
                      horizontal: 32.0,
                    ),
                    child: Text(
                      "Aún no has creado ningún proyecto.",
                      style: GoogleFonts.roboto(
                        fontWeight: FontWeight.bold,
                        fontSize: 18.0,
                      ),
                    ),
                  ),
                if(_projects.isNotEmpty)
                  Expanded(
                    child: Container(
                      width: double.infinity,
                      margin: const EdgeInsets.symmetric(
                        horizontal: 32.0,
                      ),
                      child: Column(
                        children: [
                          Container(
                            child: Row(
                              children: [
                                Expanded(
                                  child: Row(
                                    children: [
                                      IconButton(
                                        icon: const Icon(
                                          Icons.filter_alt_outlined,
                                        ),
                                        onPressed: () => true,
                                      ),
                                      Text(
                                        "Nombre",
                                        style: GoogleFonts.roboto(
                                          fontWeight: FontWeight.bold,
                                          fontSize: 18.0,
                                        ),
                                      ),
                                    ],
                                  ),
                                  flex: 5,
                                ),
                                Expanded(
                                  child: Row(
                                    children: [
                                      IconButton(
                                        icon: const Icon(
                                          Icons.filter_alt_outlined,
                                        ),
                                        onPressed: () => true,
                                      ),
                                      Text(
                                        "Estatus",
                                        style: GoogleFonts.roboto(
                                            fontWeight: FontWeight.bold,
                                            fontSize: 18.0
                                        ),
                                      ),
                                    ],
                                  ),
                                  flex: 5,
                                ),
                                Expanded(
                                  child: Text(
                                    "Última Modificación",
                                    style: GoogleFonts.roboto(
                                      fontSize: 18.0,
                                      fontWeight: FontWeight.bold,
                                    ),
                                    maxLines: 1,
                                    overflow: TextOverflow.ellipsis,
                                  ),
                                  flex: 3,
                                ),
                                Expanded(
                                  child: Container(),
                                  flex: 1,
                                ),
                              ],
                            ),
                            padding: const EdgeInsets.only(
                              right: 16.0,
                            ),
                            decoration: const BoxDecoration(
                                border: Border(
                                    bottom: BorderSide(
                                        color: Colors.black54,
                                        width: 2.0
                                    )
                                )
                            ),
                          ),
                          Expanded(
                            child: ListView.separated(
                              itemCount: _projects.length,
                              itemBuilder: (context, index){
                                return ListTile(
                                  title: Row(
                                    children: [
                                      Expanded(
                                        child: Text(
                                          _projects[index]["nombreProyecto"]!,
                                          style: GoogleFonts.roboto(
                                            fontSize: 16.0,
                                          ),
                                          maxLines: 1,
                                          overflow: TextOverflow.ellipsis,
                                        ),
                                        flex: 5,
                                      ),
                                      Expanded(
                                        child: Text(
                                          _estatusCodigos[_projects[index]["estatus"]!]!,
                                          style: GoogleFonts.roboto(
                                            fontSize: 16.0,
                                          ),
                                          maxLines: 1,
                                          overflow: TextOverflow.ellipsis,
                                        ),
                                        flex: 5,
                                      ),
                                      Expanded(
                                        child: Text(
                                          _buildDate(_projects[index]["ulModificacion"]!),
                                          style: GoogleFonts.roboto(
                                            fontSize: 16.0,
                                          ),
                                          maxLines: 1,
                                          overflow: TextOverflow.ellipsis,
                                        ),
                                        flex: 3,
                                      ),
                                      Expanded(
                                        child: PopupMenuButton<String>(
                                          onSelected: (val) async{
                                            const auth = "smart.solerpalau.mx";
                                            if(val == "Eliminar"){
                                              final url = Uri.https(auth, "PR/api/v1/quiosco/matrizMemoriasCalculo/borrarProyectos");
                                              final res = await http.post(url,
                                                  headers: {
                                                    "Authorization": "Bearer $_token",
                                                  },
                                                  body: {
                                                    "IDUSUARIO": _idUsuario,
                                                    "IDPROYECTO": _projects[index]["idProyecto"]
                                                  }
                                              );

                                              final decoded = jsonDecode(res.body);
                                              if(!decoded['response']){
                                                Fluttertoast.showToast(
                                                  msg: decoded['message'],
                                                  toastLength: Toast.LENGTH_SHORT,
                                                  timeInSecForIosWeb: 4,
                                                  gravity: ToastGravity.CENTER,
                                                  webBgColor: "linear-gradient(to right, #b40404, #ff0000)",
                                                );
                                              }else{
                                                Fluttertoast.showToast(
                                                  msg: decoded['message'],
                                                  toastLength: Toast.LENGTH_SHORT,
                                                  timeInSecForIosWeb: 4,
                                                  gravity: ToastGravity.CENTER,
                                                  webBgColor: "linear-gradient(to right, #266B1F, #98F58F)",
                                                );

                                                setState(() => _isLoading = true);

                                                _projects.clear();
                                                await _fetchProjects();

                                                setState(() => _isLoading = false);
                                              }
                                            }else if(val == "Descargar PDF"){
                                              html.AnchorElement anchorElement = html.AnchorElement(href: _projects[index]["archpdf"]!);
                                              anchorElement.download = _projects[index]["archpdf"]!;
                                              anchorElement.target = "_blank";
                                              anchorElement.click();
                                            }
                                          },
                                          itemBuilder: (context) => ["Eliminar", if(_projects[index]["archpdf"]!.isNotEmpty)"Descargar PDF"].map((e) => PopupMenuItem(
                                            value: e,
                                            child: Row(
                                              children: [
                                                Text(
                                                  e,
                                                  style: GoogleFonts.roboto(
                                                    fontSize: 16.0,
                                                    color: Colors.black54,
                                                  ),
                                                ),
                                                const SizedBox(width: 8.0),
                                                Icon(
                                                  e == "Eliminar" ? Icons.delete : Icons.file_download,
                                                  color: Colors.black54,
                                                ),
                                              ],
                                            ),
                                          )).toList(),
                                        ),
                                      )
                                    ],
                                  ),
                                  onTap: () async{
                                    await Navigator.push(context, MaterialPageRoute(
                                      builder: (context) => CalculadoraAmbientalPage(
                                        pais: _pais,
                                        code: _code,
                                        idProyecto: _projects[index]["idProyecto"]!,
                                        idUsuario: _idUsuario,
                                        token: _token,
                                        datos: _projects[index]["datos"]!,
                                        noProyecto: _projects[index]["nombreProyecto"]!,
                                        archpdf: "",
                                      ),
                                    ));

                                    setState(() => _isLoading = true);

                                    _projects.clear();
                                    await _fetchProjects();

                                    setState(() => _isLoading = false);
                                  },
                                );
                              },
                              separatorBuilder: (context, index){
                                return const Divider();
                              },
                            ),
                          )
                        ],
                      ),
                    ),
                  )
              ],
            ),
          );
        },
      ),
    );
  }

  String _buildDate(String date){
    final parsed = DateTime.parse(date);
    final now = DateTime.now();

    final diff = now.difference(parsed).inDays;
    if(diff == 0){
      return "Hoy";
    }else if(diff == 1){
      return "Ayer";
    }else if(diff >= 2 && diff < 31){
      return "Hace $diff días";
    }else if(diff >= 31 && diff <= 359){
      final diffMes = diff~/30;
      return "Hace $diffMes mes(es)";
    }else if(diff > 359){
      final diffAnio = diff~/359;
      return "Hace $diffAnio año(s)";
    }else{
      return "Hace mucho tiempo";
    }
  }
}
