import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:teso/providers/user_provider.dart';
import 'GoldWithdrawal.dart';

class GoldTransactions extends StatefulWidget {
  @override
  _GoldTransactionsState createState() => _GoldTransactionsState();
}

class _GoldTransactionsState extends State<GoldTransactions> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PreferredSize(
        preferredSize: Size.fromHeight(65),
        child: Container(
          child: Material(
            elevation: 5.0,
            borderRadius: BorderRadius.only(
              bottomLeft: Radius.circular(30),
              bottomRight: Radius.circular(30),
            ),
            child: Padding(
              padding: const EdgeInsets.all(7.0),
              child: Column(
                children: [
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Wrap(
                        direction: Axis.horizontal,
                        children: [
                          Container(
                            child: Container(
                              height: 50.0,
                              width: 50.0,
                              decoration: new BoxDecoration(
                                shape: BoxShape.circle,
                              ),
                              child: Container(
                                width: 50,
                                height: 50,
                                decoration: BoxDecoration(
                                  shape: BoxShape.circle,
                                ),
                                child: ClipRRect(
                                  borderRadius: BorderRadius.only(
                                    topLeft: Radius.circular(50.0),
                                    topRight: Radius.circular(50.0),
                                    bottomLeft: Radius.circular(50),
                                    bottomRight: Radius.circular(50),
                                  ),
                                  child: Image(
                                    height: 50,
                                    width: 50,
                                    fit: BoxFit.fill,
                                    image:
                                        AssetImage("assets/images/gold1.png"),
                                  ),
                                ),
                              ),
                            ),
                          ),
                          Consumer<UserProvider>(
                            builder: (context, value, child) => Container(
                              width: 40,
                              height: 40,
                              child: Center(
                                child: Text(
                                  value.currentUser != null
                                      ? value.currentUser!.gold!
                                      : "00",
                                  style: TextStyle(
                                    fontSize: 20,
                                    fontWeight: FontWeight.bold,
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ],
                      ),
                      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: () => showDialog(
                            context: context,
                            builder: (BuildContext context) =>
                                GoldCoinWithdrawal(),
                          ),
                          child: Text(
                            "CASH OUT",
                            style: TextStyle(
                              color: Theme.of(context).colorScheme.secondary,
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
      body: SingleChildScrollView(
        scrollDirection: Axis.vertical,
        child: Column(
          children: [
            Container(
              margin: EdgeInsets.symmetric(vertical: 15),
              width: MediaQuery.of(context).size.width -
                  (MediaQuery.of(context).size.width) * 0.3,
              child: Center(
                child: Image(
                  width: MediaQuery.of(context).size.width -
                      (MediaQuery.of(context).size.width) * 0.50,
                  image: AssetImage("assets/images/background.png"),
                  fit: BoxFit.fill,
                ),
              ),
            ),
            SizedBox(height: 20.0),
            Container(
              width: MediaQuery.of(context).size.width,
              child: Center(
                child: Text(
                  "Earn more gold coins and redeem them as real cash . \n" +
                      " Would you like to earn some more gold coins ?",
                  style: TextStyle(
                    color: Theme.of(context).primaryColorLight,
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}