import 'package:flutter/material.dart';

import '../../l10n/app_localizations.dart';
import 'SignUpService.dart';

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

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

class _CreateUserScreenState extends State<CreateUserScreen> {
  int _currentStep = 0;

  // Create a global key for each step
  final GlobalKey<StepCreateAccountState> createAccountKey =
      GlobalKey<StepCreateAccountState>();

  final GlobalKey<StepGetEmailVerificationState> emailVerificationKey =
      GlobalKey<StepGetEmailVerificationState>();

  final GlobalKey<StepGetRegistrationState> registrationKey =
      GlobalKey<StepGetRegistrationState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(AppLocalizations.of(context)!
            .signUpStep((_currentStep + 1).toString())),
      ),
      body: Column(
        children: [
          // Display the current step
          Expanded(
            child: _buildStep(_currentStep),
          ),

          // Navigation buttons
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              if (_currentStep > 0)
                ElevatedButton(
                  onPressed: () {
                    setState(() {
                      _currentStep--;
                    });
                  },
                  child: Text(AppLocalizations.of(context)!.previous),
                ),
              if (_currentStep < 2)
                ElevatedButton(
                  onPressed: () {
                    _proceedToNextStep();
                  },
                  child: Text(AppLocalizations.of(context)!.next),
                ),
            ],
          ),
        ],
      ),
    );
  }

  // Function to build the appropriate step based on the current step index
  Widget _buildStep(int stepIndex) {
    switch (stepIndex) {
      case 0:
        return StepCreateAccount(
          key: createAccountKey,
          onNext: () {
            _proceedToNextStep();
          },
        );
      case 1:
        return StepGetEmailVerification(
          key: emailVerificationKey,
          onNext: () {
            _proceedToNextStep();
          },
        );
      case 2:
        return StepGetRegistration(
          key: registrationKey,
          onNext: () {
            _proceedToNextStep();
          },
        );
      default:
        return Container(); // Return an empty container by default
    }
  }

  // Function to proceed to the next step
  void _proceedToNextStep() {
    if (_currentStep < 2) {
      setState(() {
        _currentStep++;
      });
    }
  }
}

// Define your individual step widgets here

class StepCreateAccount extends StatefulWidget {
  final Function onNext;

  const StepCreateAccount({Key? key, required this.onNext}) : super(key: key);

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

class StepCreateAccountState extends State<StepCreateAccount> {
  // Add your state variables for this step here
  String? accountId;
  final Map<String, dynamic> formData = {};
  final _formKey = GlobalKey<FormState>();
  final SignUpApiService userService = SignUpApiService();

  @override
  Widget build(BuildContext context) {
    return Container(
      alignment: Alignment.center,
      child: Column(
        children: [
          Text(AppLocalizations.of(context)!.step1CreateAccount),
          TextFormField(
            decoration: InputDecoration(
                labelText:
                    AppLocalizations.of(context)!.companyName),
            onSaved: (value) => formData['companyName'] = value,
            validator: (value) {
              if (value == null || value.isEmpty) {
                return AppLocalizations.of(context)!.pleaseEnterThis(
                    AppLocalizations.of(context)!.companyName);
              }
              return null;
            },
          ),
          const SizedBox(height: 16),
          TextFormField(
            decoration: InputDecoration(
                labelText: AppLocalizations.of(context)!.email),
            onSaved: (value) => formData['email'] = value,
            validator: (value) {
              if (value == null || value.isEmpty) {
                return AppLocalizations.of(context)!.pleaseEnterThis(
                    AppLocalizations.of(context)!.email);
              }
              return null;
            },
          ),
          const SizedBox(height: 16),
          TextFormField(
            decoration: InputDecoration(
                labelText: AppLocalizations.of(context)!.mobileNo),
            onSaved: (value) => formData['mobile'] = value,
            validator: (value) {
              if (value == null || value.isEmpty) {
                return AppLocalizations.of(context)!.pleaseEnterThis(
                    AppLocalizations.of(context)!.mobileNo);
              }
              return null;
            },
          ),
          const SizedBox(height: 16),
          TextFormField(
            decoration: InputDecoration(
                labelText: AppLocalizations.of(context)!.workspace),
            onSaved: (value) => formData['workspace'] = value,
            validator: (value) {
              if (value == null || value.isEmpty) {
                return AppLocalizations.of(context)!.pleaseEnterThis(
                    AppLocalizations.of(context)!.workspace);
              }
              return null;
            },
          ),
          const SizedBox(height: 16),
          TextFormField(
            decoration: InputDecoration(
                labelText: AppLocalizations.of(context)!.gstNumber),
            onSaved: (value) => formData['gstNumber'] = value,
            validator: (value) {
              if (value == null || value.isEmpty) {
                return AppLocalizations.of(context)!.pleaseEnterThis(
                    AppLocalizations.of(context)!.gstNumber);
              }
              return null;
            },
          ),
          const SizedBox(height: 16),
          TextFormField(
            decoration: InputDecoration(
                labelText: AppLocalizations.of(context)!.pancard),
            onSaved: (value) => formData['pancard'] = value,
            validator: (value) {
              if (value == null || value.isEmpty) {
                return AppLocalizations.of(context)!.pleaseEnterThis(
                    AppLocalizations.of(context)!.pancard);
              }
              return null;
            },
          ),
          const SizedBox(height: 16),
          TextFormField(
            decoration: InputDecoration(
                labelText:
                    AppLocalizations.of(context)!.workingField),
            onSaved: (value) => formData['working'] = value,
            validator: (value) {
              if (value == null || value.isEmpty) {
                return AppLocalizations.of(context)!.pleaseEnterThis(
                    AppLocalizations.of(context)!.workingField);
              }
              return null;
            },
          ),
          const SizedBox(height: 16),
          Container(
            margin: const EdgeInsets.symmetric(vertical: 5), // Add margin
            child: ElevatedButton(
              onPressed: () async {
                if (_formKey.currentState!.validate()) {
                  _formKey.currentState!.save();
                  {
                    try {
                      print('form data is $formData');

                      final response =
                          await userService.createAccount(formData);

                      accountId = response['account_id'].toString();
                      print('after create account account id is $accountId');
                      // ignore: use_build_context_synchronously
                      // Navigator.pop(
                      //     _context, accountId); // Pop with account_id

                      // Navigator.pop(context);
                    } catch (e) {
                      // ignore: use_build_context_synchronously
                      showDialog(
                        context: context,
                        builder: (BuildContext context) {
                              return AlertDialog(
                            title: Text(
                                AppLocalizations.of(context)!.error),
                            content: Text(AppLocalizations.of(context)!
                                .accountCreationFailed(e.toString())),
                            actions: [
                              TextButton(
                                child: Text(
                                    AppLocalizations.of(context)!.ok),
                                onPressed: () {
                                  Navigator.of(context).pop();
                                },
                              ),
                            ],
                          );
                        },
                      );
                    }
                  }
                }
              },
              child: SizedBox(
                width: double.infinity,
                height: 50,
                child: Center(
                  child: Text(
                    AppLocalizations.of(context)!.submitCaps,
                    style: TextStyle(
                      fontSize: 16,
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                ),
              ),
            ),
          ),
          if (accountId != null)
            Text(AppLocalizations.of(context)!
                .selectedAccountId(accountId!)),
        ],
      ),
    );
  }
}

class StepGetEmailVerification extends StatefulWidget {
  final Function onNext;

  const StepGetEmailVerification({Key? key, required this.onNext})
      : super(key: key);

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

class StepGetEmailVerificationState extends State<StepGetEmailVerification> {
  @override
  Widget build(BuildContext context) {
    return Container(
      alignment: Alignment.center,
      child: Text(AppLocalizations.of(context)!.step2EmailVerification),
    );
  }
}

class StepGetRegistration extends StatefulWidget {
  final Function onNext;

  const StepGetRegistration({Key? key, required this.onNext}) : super(key: key);

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

class StepGetRegistrationState extends State<StepGetRegistration> {
  @override
  Widget build(BuildContext context) {
    return Container(
      alignment: Alignment.center,
      child: Text(AppLocalizations.of(context)!.step3GetRegistration),
    );
  }
}

// Example of a dialog to create an account
class CreateAccountDialog extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: Text(AppLocalizations.of(context)!.createAccount),
      content:
          Text(AppLocalizations.of(context)!.accountCreatedSuccess),
      actions: [
        ElevatedButton(
          onPressed: () {
            Navigator.of(context).pop('12345'); // Pass the created account ID
          },
          child: Text(AppLocalizations.of(context)!.ok),
        ),
      ],
    );
  }
}