import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:localstore/localstore.dart';
import 'package:quiosco_soler_2/clientes/models/cuentas_bancarias.dart';

import '../pages/avisos.dart';
import '../pages/comentarios.dart';

class LateralMenuCliente extends StatefulWidget {
  final CuentasBancarias cuentasBancarias;
  final void Function(bool) shouldRefresh;

  const LateralMenuCliente({Key? key, required this.cuentasBancarias, required this.shouldRefresh}) : super(key: key);

  @override
  State<LateralMenuCliente> createState() => _LateralMenuClienteState();
}

class _LateralMenuClienteState extends State<LateralMenuCliente> {
  final db = Localstore.instance;

  Map<String, dynamic> _info = {};
  bool _isLoading = true;

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

  void init() async{
    final items = await db.collection('clientes').get();
    final key = items!.keys.last;
    _info = items[key];

    setState(() => _isLoading = false);
  }

  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: ListView(
        padding: EdgeInsets.zero,
        children: [
          DrawerHeader(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Container(
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(50.0),
                  ),
                  width: 64.0,
                  height: 64.0,
                  child: const Icon(
                    Icons.account_circle,
                    color: Color(0xFFFF0000),
                    size: 64.0,
                  ),
                ),
                const SizedBox(height: 8.0),
                const Text(
                  'CLIENTE',
                  textAlign: TextAlign.center,
                  style: TextStyle(
                    fontFamily: 'Helvetica Neue Black Cond',
                    fontSize: 18.0,
                    color: Colors.white,
                  ),
                ),
                const SizedBox(height: 16.0),
              ],
            ),
            decoration: const BoxDecoration(color: Color(0xFFFF0000)),
          ),
          if(_isLoading)
            const Center(
              child: CircularProgressIndicator(),
            ),
          if(!_isLoading)
            Column(
              children: [
                Container(
                  child: Text(
                    '${_info['dinum']}\n\n${_info['user']}',
                    textAlign: TextAlign.center,
                    style: GoogleFonts.roboto(
                      fontWeight: FontWeight.w500,
                      color: Colors.black,
                      fontSize: 18.0,
                    ),
                  ),
                  margin: const EdgeInsets.all(10.0),
                  padding: const EdgeInsets.only(bottom: 10.0),
                  decoration: const BoxDecoration(
                      border: Border(
                          bottom: BorderSide(
                              color: Color.fromRGBO(255, 0, 0, 1),
                              width: 2.0
                          )
                      )
                  ),
                ),
                ListTile(
                  leading: const Icon(
                    Icons.account_balance_wallet,
                    color: Color.fromRGBO(255, 0, 0, 1),
                    size: 32.0,
                  ),
                  title: Text(
                    'CUENTAS BANCARIAS S&P',
                    style: GoogleFonts.roboto(
                        color: Colors.black,
                        fontSize: 16.0
                    ),
                  ),
                  onTap: (){
                    showDialog(
                      context: context,
                      barrierDismissible: true,
                      builder: (_) {
                        List<String> infoElements = widget.cuentasBancarias.result!.info!.split('##');
                        List<Widget> children = [];

                        for(int i = 0; i < infoElements.length; i++){
                          List<String> infoDetails = infoElements[i].split('|');
                          for(int j = 0; j < infoDetails.length; j++){
                            children.add(Container(
                              child: Text(
                                infoDetails[j],
                                textAlign: TextAlign.start,
                                style: GoogleFonts.roboto(
                                    fontSize: 16,
                                    fontWeight: j == 0 ? FontWeight.bold : FontWeight.normal
                                ),
                              ),
                              margin: EdgeInsets.fromLTRB(
                                  4.0,
                                  j == 0 ? 8.0 : 0.0,
                                  4.0,
                                  j == 0 ? 12.0 : 0.0
                              ),
                            ));
                          }
                          children.add(const SizedBox(height: 8.0));
                        }

                        return AlertDialog(
                          title: Text(
                            'Cuentas Bancarias S&P',
                            textAlign: TextAlign.center,
                            style: GoogleFonts.robotoSlab(
                                fontWeight: FontWeight.bold,
                                fontSize: 18.0
                            ),
                          ),
                          content: Column(
                            mainAxisSize: MainAxisSize.min,
                            children: children,
                          ),
                        );
                      },
                    );
                  },
                ),
                Container(
                  margin: const EdgeInsets.symmetric(horizontal: 20.0),
                  color: Colors.black12,
                  height: 2.0,
                  width: double.infinity,
                ),
                Container(
                  margin: const EdgeInsets.symmetric(vertical: 8.0),
                  padding: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 8.0),
                  child: Text(
                    _buildDate(),
                    style: GoogleFonts.roboto(
                        color: Colors.black,
                        fontSize: 16.0,
                        fontWeight: FontWeight.w500
                    ),
                    textAlign: TextAlign.center,
                  ),
                ),
                ListTile(
                  leading: const Icon(
                    Icons.help_outline,
                    color: Color.fromRGBO(255, 0, 0, 1),
                    size: 32.0,
                  ),
                  title: Text(
                    'DUDAS Y/O COMENTARIOS',
                    style: GoogleFonts.roboto(
                        color: Colors.black,
                        fontSize: 16.0,
                        fontWeight: FontWeight.w500
                    ),
                  ),
                  onTap: () => Navigator.push(context, MaterialPageRoute(
                      builder: (context) => ComentariosPage()
                  )),
                ),
                ListTile(
                  leading: const Icon(
                    Icons.markunread,
                    color: Color.fromRGBO(255, 0, 0, 1),
                    size: 32.0,
                  ),
                  title: Text(
                    'AVISOS',
                    style: GoogleFonts.roboto(
                        color: Colors.black,
                        fontSize: 16.0,
                        fontWeight: FontWeight.w500
                    ),
                  ),
                  onTap: () => Navigator.of(context).push(MaterialPageRoute(
                      builder: (context) => AvisosPage()
                  )),
                ),
                ListTile(
                  leading: const Icon(
                    Icons.refresh,
                    color: Color.fromRGBO(255, 0, 0, 1),
                    size: 32.0,
                  ),
                  title: Text(
                    'ACTUALIZAR DATOS',
                    style: GoogleFonts.roboto(
                        color: Colors.black,
                        fontSize: 16.0,
                        fontWeight: FontWeight.w500
                    ),
                  ),
                  onTap: (){
                    widget.shouldRefresh(true);
                    Navigator.pop(context);
                  },
                )
              ],
            )
        ],
      ),
    );
  }

  String _buildDate(){
    int dayInt = DateTime.now().day;
    int monthInt = DateTime.now().month;
    int year = DateTime.now().year;

    String day = dayInt < 10 ? "0$dayInt" : "$dayInt";
    String month = monthInt < 10 ? "0$monthInt" : "$monthInt";

    return "FECHA - $day/$month/$year";
  }
}
