import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:teso/Pages/PageWidgets/CoinPurchase/AmountInput.dart';
import 'package:teso/Pages/PageWidgets/CoinPurchase/MomoType.dart';
import 'package:teso/Pages/PageWidgets/CoinPurchase/phonenumber.dart';
import 'package:teso/Pages/Sub_Pages/Payments/Withdrawal.dart';
import 'package:teso/providers/pageAnimations.dart';
import 'package:teso/util/SizeConfig.dart';

class GoldCoinWithdrawal extends StatefulWidget {
  @override
  _GoldCoinWithdrawalState createState() => _GoldCoinWithdrawalState();
}

class _GoldCoinWithdrawalState extends State<GoldCoinWithdrawal> {
  bool loading = false;
  TextEditingController amount;
  TextEditingController momoNumber;
  String tapped;

  @override
  void initState() {
    super.initState();
    amount = new TextEditingController();
    momoNumber = new TextEditingController();
    selectTransfer("MTN");
  }

  void selectTransfer(String type) {
    setState(() {
      tapped = type;
    });
    print(tapped);
  }

  submit() async {
    await Navigator.push(
      context,
      PageTransition(
        child: WithdrawalPage(
          amount: amount.text,
          momonumber: momoNumber.text,
          provider: tapped,
        ),
        type: PageTransitionType.fade,
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    SizeConfig().init(context);
    return Dialog(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(Consts.padding),
      ),
      elevation: 0.0,
      backgroundColor: Colors.transparent,
      child: SingleChildScrollView(
        scrollDirection: Axis.vertical,
        child: Container(
          child: Stack(
            children: <Widget>[
              Container(
                padding: EdgeInsets.only(
                  top: Consts.padding,
                  bottom: Consts.padding,
                  left: Consts.padding,
                  right: Consts.padding,
                ),
                margin: EdgeInsets.only(top: Consts.avatarRadius),
                decoration: new BoxDecoration(
                  color: Theme.of(context).primaryColor,
                  shape: BoxShape.rectangle,
                  borderRadius: BorderRadius.circular(Consts.padding),
                ),
                child: Column(
                  //  mainAxisSize: MainAxisSize.min, // To make the card compact
                  children: <Widget>[
                    SizedBox(height: 14.0),
                    Container(
                      width: double.infinity,
                      child: Text(
                        "Amount",
                        style: TextStyle(
                          color: Theme.of(context).primaryColorLight,
                          fontSize: 17,
                        ),
                      ),
                    ),
                    SizedBox(height: 10.0),
                    buildAmount(context, amount),
                    SizedBox(height: 14.0),
                    SingleChildScrollView(
                      scrollDirection: Axis.horizontal,
                      child: Row(
                        children: [
                          buildType(context, "assets/images/MTN.png", "MTN",
                              selectTransfer, tapped),
                          buildType(context, "assets/images/Vodafone.png",
                              "VODAFONE", selectTransfer, tapped),
                          buildType(context, "assets/images/AirtelTigo.png",
                              "AIRTEL", selectTransfer, tapped),
                        ],
                      ),
                    ),
                    SizedBox(height: 14.0),
                    Container(
                      width: double.infinity,
                      child: Text(
                        "Phone number",
                        style: TextStyle(
                          color: Theme.of(context).primaryColorLight,
                          fontSize: 17,
                        ),
                      ),
                    ),
                    SizedBox(height: 10.0),
                    inputTelNumber(context, momoNumber),
                    SizedBox(height: 14.0),
                    Align(
                      alignment: Alignment.bottomCenter,
                      child: Container(
                        height: 35,
                        padding: EdgeInsets.all(10),
                        margin: EdgeInsets.all(7),
                        decoration: BoxDecoration(
                            color: Theme.of(context).backgroundColor,
                            borderRadius:
                                BorderRadius.all(Radius.circular(20.0)),
                            border: Border.all(
                              color: Theme.of(context).colorScheme.secondary,
                            )),
                        child: InkWell(
                          onTap: submit,
                          child: Text(
                            "SUBMIT",
                            style: TextStyle(
                              color: Theme.of(context).colorScheme.secondary,
                            ),
                          ),
                        ),
                      ),
                    ),
                    Visibility(
                      visible: loading,
                      child: Align(
                        alignment: Alignment.bottomCenter,
                        child: CupertinoActivityIndicator(
                          animating: true,
                          radius: 15,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class Consts {
  Consts._();

  static const double padding = 16.0;
  static const double avatarRadius = 55.0;
}