import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_alipay/flutter_alipay.dart';
import 'package:ysairplane/base/YSBase.dart';
import 'package:ysairplane/code/YSBill.dart';
import 'package:ysairplane/tools/YSTools.dart';
import 'package:fluwx/fluwx.dart';

class YSMoney extends StatefulWidget {
  @override
  _YSMoneyState createState() => _YSMoneyState();
}

class _YSMoneyState extends State<YSMoney> {
  List array = ['支付宝','微信'];
  int _selected = 0;
  bool _isSucceed = false;
  @override
  Widget build(BuildContext context) {
    return YSBase(
      ystitle: '钱包',
      ysright: GestureDetector(
        child: Text('账单',style: TextStyle(fontSize: zsp(34),color: Color(0xFF131318)),),
        onTap: (){
          Navigator.of(context).push(
            CupertinoPageRoute(
              builder: (context){
                return YSBill();
              }
            )
          );
        },
      ),
      yschild: Container(
        height: MediaQuery.of(context).size.height-MediaQuery.of(context).padding.top-44,
        width: MediaQuery.of(context).size.width,
        color: Color(0xFFF5F6F8),
        child: SingleChildScrollView(
          child: _isSucceed==true?Column(
            children: [
              Container(
                color: Colors.white,
                width: MediaQuery.of(context).size.width,
                padding: EdgeInsets.only(left: wsp(30),right: wsp(30),top: hsp(60),bottom: hsp(60)),
                child: Column(
                  children: [
                    Image(
                      image: AssetImage('lib/images/succeed.png'),
                      height: hsp(130),
                      width: wsp(130)
                    ),
                    Container(
                      child: Text('充值成功',style: TextStyle(fontSize: zsp(40),color: Color(0xFF333333)),),
                      margin: EdgeInsets.only(top: hsp(40),bottom: hsp(33)),
                    ),
                    Text('本次充值可用金额1100元',style: TextStyle(fontSize: zsp(28),color: Color(0xFF878787)),),
                  ],
                ),
              ),
              GestureDetector(
                onTap: (){
                  setState(() {
                    _isSucceed = false;
                  });
                },
                child: Container(
                  height: hsp(94),
                  width: MediaQuery.of(context).size.width-wsp(24)*2,
                  alignment: Alignment.center,
                  margin: EdgeInsets.only(top: hsp(58)),
                  decoration: BoxDecoration(
                      color: Color(0xFF0079FF),
                      borderRadius: BorderRadius.all(Radius.circular(5))
                  ),
                  child: Text('完成',style: TextStyle(color: Colors.white,fontSize: zsp(34)),),
                ),
              )
            ],
          ):Column(
            children: [
              Container(
                margin: EdgeInsets.only(left: wsp(24),right: wsp(24),bottom: hsp(24),top: hsp(18)),
                height: hsp(240),
                decoration: BoxDecoration(
                  image: DecorationImage(
                    image: AssetImage('lib/images/top.png'),
                    fit: BoxFit.fill
                  ),
                ),
                child: Stack(
                  children: [
                    Container(
                      margin: EdgeInsets.only(left: wsp(46),top: hsp(65)),
                      child: Row(
                        children: [
                          Text('可用余额(RMB)  ',style: TextStyle(fontSize: zsp(24),color: Colors.white),),
                          Image(image: AssetImage('lib/images/eyes2.png'),color: Colors.white,height: hsp(21),width: wsp(28),)
                        ],
                      ),
                    ),
                    Container(
                      margin: EdgeInsets.only(left: wsp(48),top: hsp(120)),
                      child: Text('99.69',style: TextStyle(fontSize: zsp(68),color: Colors.white,fontWeight: FontWeight.bold),),
                    )
                  ],
                ),
              ),
              Container(
                margin: EdgeInsets.only(left: wsp(24),right: wsp(24),bottom: hsp(14)),
                width: MediaQuery.of(context).size.width-wsp(48),
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.all(Radius.circular(5))
                ),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      padding: EdgeInsets.only(left: wsp(40),right: wsp(40),top: hsp(26),bottom: hsp(26)),
                      decoration: BoxDecoration(
                        border: Border(bottom: BorderSide(color: Color(0xFFF5F5F7),width: hsp (1)))
                      ),
                      child: Text('优惠活动',style: TextStyle(fontSize: zsp(30)),),
                    ),
                    Container(
                      height: hsp(370),
                      margin: EdgeInsets.only(left: wsp(34),right: wsp(34),top: hsp(40),bottom: hsp(40)),
                      child: GridView.builder(
                        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                          crossAxisCount: 3,
                          crossAxisSpacing: wsp(20),
                          mainAxisSpacing: hsp(20),
                          childAspectRatio: wsp(198)/hsp(110)
                        ),
                        itemBuilder: (context,index){
                          return GestureDetector(
                            onTap: (){
                              setState(() {
                                _selected = index;
                              });
                            },
                            child: index==8?Container(
                              height: hsp(110),
                              decoration: BoxDecoration(
                                  color: Color(0xFFF5F7F7),
                                  border: Border.all(color: index==_selected?Color(0xFF0079FF):Colors.transparent,width: 0.5),
                                  borderRadius: BorderRadius.all(Radius.circular(5))
                              ),
                              child: Center(child: Text('其他金额',style: TextStyle(fontSize: zsp(26),color: Color(0xFF999999)),)),
                            ):Container(
                              padding: EdgeInsets.only(top: hsp(15),bottom: hsp(15)),
                              height: hsp(110),
                              decoration: BoxDecoration(
                                color: Color(0xFFF5F7F7),
                                border: Border.all(color: index==_selected?Color(0xFF0079FF):Colors.transparent,width: 0.5),
                                borderRadius: BorderRadius.all(Radius.circular(5))
                              ),
                              child: Column(
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                children: [
                                  Row(
                                    children: [
                                      Image(height: hsp(26),width: wsp(26),image: AssetImage('lib/images/money2.png')),
                                      Text(' ${(index+1)*100}',style: TextStyle(fontSize: zsp(30),fontWeight: FontWeight.bold,color: Color(0xFF181818)),)
                                    ],
                                    mainAxisSize: MainAxisSize.min,
                                  ),
                                  Text('充值1000送100',style: TextStyle(fontSize: zsp(20),color: Color(0xFF999999)),)
                                ],
                              ),
                            ),
                          );
                        },
                        itemCount: 9,
                        physics: NeverScrollableScrollPhysics(),
                      ),
                    ),
                    if(_selected==8)Container(
                      width: MediaQuery.of(context).size.width,
                      margin: EdgeInsets.only(left: wsp(34),right: wsp(34),bottom: hsp(22)),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text('转入金额',style: TextStyle(fontSize: zsp(28),color: Color(0xFF333333)),),
                          Container(
                            height: hsp(100),
                            decoration: BoxDecoration(
                              border: Border(bottom: BorderSide(color: Color(0xFFEEEEEE),width: 0.5))
                            ),
                            child: CupertinoTextField(
                              decoration: BoxDecoration(),
                              prefix: Text('\n¥',style: TextStyle(fontSize: zsp(36),color: Color(0xFF333333)),),
                              style: TextStyle(fontSize: zsp(60),color: Color(0xFF333333),fontWeight: FontWeight.bold),
                              keyboardType: TextInputType.number,
                              suffix: Image(image: AssetImage('lib/images/off2.png'),height: 20,width: 20,),
                            ),
                          )
                        ],
                      ),
                    ),
                    Container(
                      margin: EdgeInsets.only(left: wsp(34),right: wsp(34),bottom: hsp(49)),
                      child: Row(
                        children: [
                          Text('充值即代表同意',style: TextStyle(fontSize: zsp(22),color: Color(0xFF999999)),),
                          Text('《某某充值协议》',style: TextStyle(fontSize: zsp(22),color: Color(0xFF0079FF),fontWeight: FontWeight.bold),)
                        ],
                      ),
                    )
                  ],
                ),
              ),
              Container(
                height: hsp(92),
                width: MediaQuery.of(context).size.width-wsp(48),
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.all(Radius.circular(5))
                ),
                padding: EdgeInsets.only(left: wsp(30),right: wsp(30)),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text('支付方式',style: TextStyle(fontSize: zsp(32),color: Color(0xFF000000)),),
                    DropdownButton(
                      value: '${array[0]}',
                      items: [
                        for(int i=0;i<array.length;i++)DropdownMenuItem(child: Text('${array[i]}'),value: '${array[i]}',),
                      ],
                      onChanged: (value){

                      },
                      underline: Container(),
                      icon: Icon(Icons.keyboard_arrow_down,size: zsp(30),color: Color(0xFF999999),),
                      style: TextStyle(fontSize: zsp(30),color: Color(0xFF999999)),
                    )
                  ],
                ),
              ),
              GestureDetector(
                onTap: (){
                  setState(() {
                    _isSucceed = true;
                  });
                },
                child: GestureDetector(
                  onTap: (){
                    _payClick(false);
                  },
                  child: Container(
                    height: hsp(90),
                    width: MediaQuery.of(context).size.width-wsp(24)*2,
                    alignment: Alignment.center,
                    margin: EdgeInsets.only(top: hsp(65)),
                    decoration: BoxDecoration(
                      color: Color(0xFF0079FF),
                      borderRadius: BorderRadius.all(Radius.circular(5))
                    ),
                    child: Text('充值',style: TextStyle(color: Colors.white,fontSize: zsp(34)),),
                  ),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }

  _payClick(bool isWechat) async{
    if(isWechat==true){
      payWithWeChat(
          appId: null,
          partnerId: null,
          prepayId: null,
          packageValue: null,
          nonceStr: null,
          timeStamp: null,
          sign: null
      ).then((value){
        print('value == $value');
      });
    }else{
      var payResult = await FlutterAlipay.pay('payUrl');
      print('$payResult');
    }
  }

}