import 'package:driverapp/app-icons/driver_app_icons.dart';
import 'package:driverapp/core/viewModels/authentication_view_model.dart';
import 'package:driverapp/core/viewModels/project_view_model.dart';
import 'package:driverapp/pages/authentication/verification_page.dart';
import 'package:driverapp/uitl/translations_delegate_base.dart';
import 'package:driverapp/uitl/utils.dart';
import 'package:driverapp/widgets/buttons/secondary_button.dart';
import 'package:driverapp/widgets/input/text_field.dart';
import 'package:driverapp/widgets/others/app_scaffold_widget.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter/widgets.dart';
import 'package:provider/provider.dart';

import '../../root_page.dart';

// ignore: must_be_immutable
class ForgetPasswordPage extends StatelessWidget {
  final forgetPasswordFormKey = GlobalKey<FormState>();
  int driverID;
  ProjectViewModel projectViewModel;
  AuthenticationViewModel authenticationViewModel;

  getOpt(BuildContext context) async {
    if (forgetPasswordFormKey.currentState.validate()) {
      forgetPasswordFormKey.currentState.save();
      await authenticationViewModel.getOpt(driverID);
      if (authenticationViewModel.isError) {
        Utils.showErrorToast(authenticationViewModel.error);
      } else {
        Navigator.push(
          context,
          MaterialPageRoute(builder: (context) => VerificationPage()),
        );
      }
    }
  }

  @override
  Widget build(BuildContext context) {
    projectViewModel = Provider.of(context);
    authenticationViewModel = Provider.of(context);

    return AnimatedSwitcher(
      duration: Duration(microseconds: 350),
      child: AppScaffold(
        isShowAppBar: false,
        body: SingleChildScrollView(
          child: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                FractionallySizedBox(
                  widthFactor: 0.80,
                  child: Column(
                    children: <Widget>[
                      SizedBox(
                        height: MediaQuery.of(context).size.height * 0.25,
                      ),
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          Container(
                            child: Icon(
                              DriverApp.qustion_mark,
                              size: 150,
                              color: Theme.of(context).primaryColor,
                            ),
                            margin: EdgeInsets.only(
                              top: 20,
                            ),
                          ),
                        ],
                      ),
                      SizedBox(
                        height: 20,
                      ),
                      Column(
                        children: <Widget>[
                          Center(
                            child: Text(
                              "Forgot Password?",
                              style: TextStyle(
                                  fontSize: 25,
                                  letterSpacing: 1,
                                  fontWeight: FontWeight.w600),
                            ),
                          ),
                        ],
                      ),
                      SizedBox(
                        height: 30,
                      ),
                      SizedBox(
                        height: 10,
                      ),
                      Form(
                        key: forgetPasswordFormKey,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                          children: <Widget>[
                            Padding(
                              padding:
                                  const EdgeInsets.symmetric(horizontal: 20),
                              child: Row(
                                mainAxisAlignment: MainAxisAlignment.end,
                                children: <Widget>[
                                  Expanded(
                                    child: Text(
                                      TranslationBase.of(context)
                                          .enterForgetIdMsg,
                                      style: TextStyle(
                                          fontSize: 13, color: Colors.grey),
                                    ),
                                  ),
                                  SizedBox(
                                    height: 10,
                                  )
                                ],
                              ),
                            ),
                            SizedBox(
                              height: 10,
                            ),
                            Container(
                              child: TextFields(
                                hintText: TranslationBase.of(context).enterId,
                                keyboardType: TextInputType.number,
                                validator: (value) {
                                  if (value.isEmpty) {
                                    return TranslationBase.of(context)
                                        .pleaseEnterYourID;
                                  }
                                  return null;
                                },
                                onSaved: (value) {
                                  driverID = int.parse(value.trim());
                                },
                              ),
                            ),
                            SizedBox(
                              height: 20,
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
                SizedBox(
                  height: 20,
                ),
                SizedBox(
                  height: 10,
                ),
                Container(
                    margin: EdgeInsets.all(10),
                    height: MediaQuery.of(context).size.height * 0.22,
                    child: Column(
                      children: <Widget>[
                        SecondaryButton(
                          label: TranslationBase.of(context).getOPT,
                          onTap: () async {
                            await getOpt(context);
                          },
                          disabled: authenticationViewModel.isLoading,
                          loading: authenticationViewModel.isLoading,
                        ),
                        SizedBox(
                          height: 30,
                        ),
                        SecondaryButton(
                          label: TranslationBase.of(context).cancel,
                          onTap: () {
                            Navigator.pushReplacement(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => RootPage()),
                            );
                          },
                          color: Color(0xffE9F1F1),
                          borderColor: Colors.black54,
                          textColor: Theme.of(context).primaryColor,
                        ),
                      ],
                    ))
              ],
            ),
          ),
        ),
      ),
    );
  }
}
