import 'dart:convert';
import 'package:frontend/config/apiUrl.dart';
import 'package:http/http.dart' as http;
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';


class LoginPage1 extends StatefulWidget {
  const LoginPage1({super.key});

  @override
  _LoginPageState createState() => _LoginPageState();
} 

class _LoginPageState extends State<LoginPage1> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body:  LoginWidget(),
    );
  }
}


//  StatefulWidget for  Body Content
class LoginWidget extends StatefulWidget{
  const LoginWidget({super.key});

  @override
  _LoginWidgetState createState() => _LoginWidgetState();
}

class _LoginWidgetState extends State<LoginWidget>{

  final _formKey = GlobalKey<FormState>();
  final TextEditingController _emailController = TextEditingController();
  final TextEditingController _passwordController = TextEditingController();
  bool _obscureText = true;

  void _login(BuildContext context) async {
    if (_formKey.currentState!.validate()) {
      // const String url = '$apiUrl/auth/login'; // Replace with actual API URL
      const String url = 'https://apitest.tripapprovaltool.com/auth/login';

      try {
        final response = await http.post(
          Uri.parse(url),
          headers: {
            'Content-Type': 'application/json',
            'Accept': 'application/json'},
          body: jsonEncode({
            'email': _emailController.text.trim(),
            'password': _passwordController.text.trim(),
          }),
        );

        if (response.statusCode == 200) {
          ScaffoldMessenger.of(context).showSnackBar(
            const SnackBar(content: Text("Login Successful")),
          );
          context.go('/home'); // Login Success
        }
        else {
          ScaffoldMessenger.of(context).showSnackBar(
            SnackBar(content: Text("Login Failed: ${jsonDecode(response.body)['message']}")),
          );
        }
      } catch (e) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(content: Text("Error: $e")),
        );
      }
    }
  }


  @override
  Widget build(BuildContext context){
    double myHeight = MediaQuery.of(context).size.height;
    double myWidth = MediaQuery.of(context).size.width;


    return Padding(
      padding: const EdgeInsets.all(16.0),

      child: Form(
        key: _formKey,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 8),

              child: Center(
                child: Text(
                  "Hello! , Welcome Back",
                  style: TextStyle(
                      fontSize: 24,
                      fontWeight: FontWeight.bold,
                      color: Colors.blueAccent
                  ),
                ),
              ),
            ),
            SizedBox(height: myHeight/10),
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 8),
              child: const Text(
                "EMAIL",
                style: TextStyle(
                    fontSize: 14,
                    fontWeight: FontWeight.bold,
                    color: Colors.blueAccent
                ),
              ),
            ),
            SizedBox(height:8),
            TextFormField(
              controller: _emailController,
              style: const TextStyle(fontSize: 12),
              decoration: InputDecoration(
                labelText: 'Enter the email',
                labelStyle: TextStyle(color: Colors.grey,),
                floatingLabelBehavior: FloatingLabelBehavior.never,
                filled: true,
                border: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(12), // Rounded corners// Remove the default border
                    borderSide: BorderSide.none
                ),
              ),
              validator: (value){
                if(value == null || value.isEmpty){
                  return 'Required Email';
                }
                return null;
              },
            ),


            const SizedBox(height: 16),
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 8),
              child: const Text(
                "PASSWORD",
                style: TextStyle(
                    fontSize: 14,
                    fontWeight: FontWeight.bold,
                    color: Colors.blueAccent
                ),
              ),
            ),
            SizedBox(height:8),
            TextFormField(
              controller:_passwordController,
              style: const TextStyle(fontSize: 12),
              obscureText: _obscureText,
              decoration: InputDecoration(
                  labelText: "Enter the password",
                  labelStyle: TextStyle(color: Colors.grey,),
                  floatingLabelBehavior: FloatingLabelBehavior.never,
                  suffixIcon: IconButton(
                    icon: Icon(
                      _obscureText ? Icons.visibility_off : Icons.visibility,
                      color: Colors.blueAccent,
                    ),
                    onPressed: () {
                      setState(() {
                        _obscureText = !_obscureText; // Toggle state
                      });
                    },
                  ),
                  filled: true,
                  border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(12),
                      borderSide: BorderSide.none
                  )
              ),
              validator: (value){
                if(value == null || value.isEmpty){
                  return 'Required Password';
                }
                return null;
              },
            ),
            const SizedBox(height: 20),
            Center(
              child: ElevatedButton(
                  onPressed: (){
                    _login(context);
                  },
                  style: ElevatedButton.styleFrom(
                      backgroundColor: Colors.blueAccent, // Change button color
                      foregroundColor: Colors.white, // Text color
                      padding: const EdgeInsets.symmetric(horizontal: 24,vertical: 12),
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(12),
                      )
                  ),

                  child: const Text(
                      "Login")
              ),
            ),
          ],
        ),
      ),
    );
  }
}