import 'package:em2rp/views/widgets/nav/main_drawer.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:em2rp/providers/users_provider.dart';
import 'package:em2rp/models/user_model.dart';
import 'package:em2rp/views/widgets/user_management/user_card.dart';
import 'package:em2rp/views/widgets/user_management/edit_user_dialog.dart';
import 'package:em2rp/utils/colors.dart';
import 'package:em2rp/widgets/permission_gate.dart';
import 'package:em2rp/models/role_model.dart';

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

  @override
  State<UserManagementPage> createState() => _UserManagementPageState();
}

class _UserManagementPageState extends State<UserManagementPage> {
  @override
  void initState() {
    super.initState();
    Future.microtask(
        () => Provider.of<UsersProvider>(context, listen: false).fetchUsers());
  }

  @override
  Widget build(BuildContext context) {
    return PermissionGate(
      requiredPermissions: [Permission.viewUsers],
      fallback: Scaffold(
        appBar: AppBar(
          title: const Text('Accès refusé'),
          backgroundColor: AppColors.rouge,
        ),
        body: const Center(
          child: Text(
            'Vous n\'avez pas les permissions nécessaires pour accéder à cette page.',
            textAlign: TextAlign.center,
            style: TextStyle(fontSize: 16),
          ),
        ),
      ),
      child: Scaffold(
        appBar: AppBar(
          title: const Text('Gestion des utilisateurs'),
          backgroundColor: AppColors.rouge,
        ),
        drawer: const MainDrawer(currentPage: '/account_management'),
        body: Consumer<UsersProvider>(
          builder: (context, usersProvider, child) {
            if (usersProvider.isLoading) {
              return const Center(child: CircularProgressIndicator());
            }
            final users = usersProvider.users;
            if (users.isEmpty) {
              return const Center(child: Text("Aucun utilisateur trouvé"));
            }

            final width = MediaQuery.of(context).size.width;
            int crossAxisCount;

            if (width > 1200) {
              crossAxisCount = 4;
            } else if (width > 800) {
              crossAxisCount = 3;
            } else if (width > 600) {
              crossAxisCount = 2;
            } else {
              crossAxisCount = 1;
            }

            return Padding(
              padding: const EdgeInsets.all(16),
              child: GridView.builder(
                itemCount: users.length,
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: crossAxisCount,
                  crossAxisSpacing: 16,
                  mainAxisSpacing: 16,
                  mainAxisExtent: width < 600 ? 80 : 180,
                ),
                itemBuilder: (context, i) {
                  final user = users[i];
                  return UserCard(
                    user: user,
                    onEdit: () => showDialog(
                        context: context,
                        builder: (_) => EditUserDialog(user: user)),
                    onDelete: () => usersProvider.deleteUser(user.uid),
                  );
                },
              ),
            );
          },
        ),
        floatingActionButton: FloatingActionButton(
          backgroundColor: AppColors.rouge,
          child: const Icon(Icons.add, color: AppColors.blanc),
          onPressed: () => _showCreateUserDialog(context),
        ),
      ),
    );
  }

  void _showCreateUserDialog(BuildContext context) {
    final firstNameController = TextEditingController();
    final lastNameController = TextEditingController();
    final emailController = TextEditingController();
    final phoneController = TextEditingController();
    final roleController = TextEditingController();

    showDialog(
      context: context,
      builder: (context) => AlertDialog(
        title: const Text('Créer un utilisateur'),
        content: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            TextField(
                controller: firstNameController,
                decoration: const InputDecoration(labelText: 'Prénom')),
            TextField(
                controller: lastNameController,
                decoration: const InputDecoration(labelText: 'Nom')),
            TextField(
                controller: emailController,
                decoration: const InputDecoration(labelText: 'Email')),
            TextField(
                controller: phoneController,
                decoration: const InputDecoration(labelText: 'Téléphone')),
            TextField(
                controller: roleController,
                decoration: const InputDecoration(labelText: 'Rôle')),
          ],
        ),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(context),
            child: const Text('Annuler'),
          ),
          TextButton(
            onPressed: () {
              final newUser = UserModel(
                uid: '',
                firstName: firstNameController.text,
                lastName: lastNameController.text,
                email: emailController.text,
                phoneNumber: phoneController.text,
                role: roleController.text,
                profilePhotoUrl: '',
              );
              Navigator.pop(context);
            },
            child: const Text('Créer'),
          ),
        ],
      ),
    );
  }
}