import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../controllers/home_controller.dart';
import '../widgets/custom_text_field.dart';
import '../widgets/info_item.dart';
import '../widgets/primary_button.dart';

class HomePage extends GetView<HomeController> {
  static const String namedRoute = '/home-page';
  const HomePage({super.key});

  @override
  Widget build(BuildContext context) {
    var homeCtrl = controller;
    return Scaffold(
      body: Container(
        decoration: BoxDecoration(
          gradient: LinearGradient(
            begin: Alignment.topLeft,
            end: Alignment.bottomRight,
            colors: [Colors.blue.shade50, Colors.purple.shade50],
          ),
        ),
        child: SafeArea(
          child: SingleChildScrollView(
            child: Padding(
              padding: const EdgeInsets.symmetric(
                horizontal: 24.0,
                vertical: 32.0,
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                children: [
                  // Header & Image
                  Hero(
                    tag: 'fil01.jpg',
                    child: Container(
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(50),
                        boxShadow: [
                          BoxShadow(
                            color: Colors.black.withAlpha(25),
                            blurRadius: 20,
                            offset: Offset(0, 10),
                          ),
                        ],
                      ),
                      child: ClipRRect(
                        borderRadius: BorderRadius.circular(50),
                        child: Image.asset(
                          'assets/images/fil01.jpg',
                          width: 150,
                          height: 150,
                        ),
                      ),
                    ),
                  ),
                  SizedBox(height: 20),
                  Text(
                    'Filament Verwaltung Login',
                    textAlign: TextAlign.center,
                    style: Theme.of(context).textTheme.headlineLarge?.copyWith(
                      fontWeight: FontWeight.bold,
                      color: Colors.deepPurple.shade700,
                    ),
                  ),
                  SizedBox(height: 12),
                  Text(
                    'Verwalte deine Filamente einfach und übersichtlich',
                    textAlign: TextAlign.center,
                    style: Theme.of(context).textTheme.bodyLarge?.copyWith(
                      color: Colors.grey.shade700,
                    ),
                  ),
                  SizedBox(height: 20),

                  // Info Card
                  Card(
                    elevation: 4,
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(16),
                    ),
                    child: Padding(
                      padding: const EdgeInsets.all(20.0),
                      child: Column(
                        children: [
                          buildInfoItem(
                            icon: Icons.storage_rounded,
                            text: 'Speicherung in einer Datenbank',
                            color: Colors.blue,
                          ),
                          SizedBox(height: 12),
                          buildInfoItem(
                            icon: Icons.list_alt_rounded,
                            text: 'Filament laden → Login zur Liste',
                            color: Colors.green,
                          ),
                          SizedBox(height: 24),
                          CustomTextField(
                            controller: homeCtrl.benutzerController,
                            label: 'Benutzername',
                            hint: 'Benutzername eingeben',
                            icon: Icons.person_rounded,
                          ),
                          SizedBox(height: 12),
                          CustomTextField(
                            controller: homeCtrl.passwordController,
                            label: 'Benutzer Passwort',
                            hint: 'Passwort eingeben',
                            icon: Icons.lock_rounded,
                            isPassword: true,
                          ),
                          SizedBox(height: 4),
                          Center(
                            child: TextButton(
                              onPressed: () => homeCtrl.navigateToSignIn(),
                              child: const Text('Sign In'),
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                  SizedBox(height: 20),

                  // Action Buttons
                  buildPrimaryButton(
                    context: context,
                    icon: Icons.inventory_2_rounded,
                    label: 'Login Filamente laden',
                    onPressed: () => homeCtrl.logInAndloadFilaments(),
                    color: Colors.deepPurple,
                  ),
                  SizedBox(height: 16),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}