import 'package:computo_lite/viewmodels/home_view_model.dart';
import 'package:computo_lite/viewmodels/login_view_model.dart';
import 'package:computo_lite/widgets/widgets_components.dart';
import 'package:flutter/material.dart';
import '../../widgets/app_drawer.dart';
import '../../themes/themes.dart';
import 'package:provider/provider.dart';

class HomeScreen extends StatelessWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final homeViewModel = Provider.of<HomeViewModel>(context);
    final opciones = homeViewModel.opciones;
    String correo = Provider.of<LoginViewModel>(context).correo;
    return WillPopScope(
      onWillPop: () async {
        return false;
      },
      child: Scaffold(
        drawer: AppDrawer(),
        appBar: AppBar(
          elevation: 0,
          title: const Text(
            'Inicio',
            style: TextStyle( color: Colors.white),
          ),
          iconTheme: const IconThemeData(color: Colors.white),
          actions: [usuarioHeader(correo)],
        ),
        body: GridView.builder(
          gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 1),
          itemCount: opciones.length,
          itemBuilder: (context, index) {
            final opcion = opciones[index];
            return Padding(
              padding: const EdgeInsets.all(8.0),
              child: InkWell(
                onTap: () {
                  Navigator.of(context).push(
                    MaterialPageRoute(
                      builder: (context) => opcion['pantalla'],
                    ),
                  );
                },
                child: Card(
                  surfaceTintColor: AppTheme.secondary,
                  elevation: 5,
                  child: Column(
                    children: [
                      Expanded(
                        child: Image(
                          image: AssetImage('assets/menu${index + 1}.png'),
                        ),
                      ),
                      ListTile(
                        title: Text(
                          opcion['opcion'],
                          style: const TextStyle(fontSize: 18),
                        ),
                        subtitle: Text(opcion['descripcion']),
                      ),
                      const SizedBox(
                        height: 5,
                      ),
                    ],
                  ),
                ),
              ),
            );
          },
        ),
      ),
    );
  }
}