import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:ysairplane/base/YSBase.dart';
import 'package:ysairplane/tools/YSNetWorking.dart';
import 'package:ysairplane/tools/YSTools.dart';

import 'YSSetPayPass.dart';

class YSChangeOldPayPass extends StatefulWidget {
  @override
  _YSChangeOldPayPassState createState() => _YSChangeOldPayPassState();
}

class _YSChangeOldPayPassState extends State<YSChangeOldPayPass> {
  List _passArray = [];
  @override
  Widget build(BuildContext context) {
    return YSBase(
      ystitle: '修改支付密码',
      ysright: GestureDetector(
        child: Text('忘记密码',style: TextStyle(fontSize: zsp(32),color: Color(0xFF333333)),),
          onTap: (){
            Navigator.of(context).push(
              CupertinoPageRoute(
                builder: (context){
                  return YSSetPayPass();
                }
              )
            );
          }
      ),
      yschild: Stack(
        children: [
          Column(
            children: [
              Container(
                height: hsp(50),
                alignment: Alignment.center,
                margin: EdgeInsets.only(top: MediaQuery.of(context).padding.top+hsp(150)),
                child: Text('请输入旧的支付密码',style: TextStyle(fontSize: zsp(40),color: Color(0xFF333333),fontWeight: FontWeight.bold),),
              ),
              Container(
                width: MediaQuery.of(context).size.width-hsp(100),
                height: hsp(100),
                margin: EdgeInsets.only(top: hsp(200)),
                decoration: BoxDecoration(
                    border: Border.all(color: Color(0xFF108EE9),width: 2),
                    borderRadius: BorderRadius.all(Radius.circular(5))
                ),
                child: ListView.separated(
                  itemBuilder: (context,index){
                    return Container(
                      height: hsp(100),
                      width: (MediaQuery.of(context).size.width-hsp(100)-9)/6,
                      child: Container(
                        height: hsp(20),
                        width: hsp(20),
                        decoration: BoxDecoration(
                            color: index<_passArray.length?Colors.black:Colors.transparent,
                            borderRadius: BorderRadius.all(Radius.circular(50))
                        ),
                      ),
                      alignment: Alignment.center,
                    );
                  },
                  separatorBuilder: (context,index){
                    return Container(width: 1,color: Color(0xFF9A9A9A),height: hsp(100),);
                  },
                  itemCount: 6,
                  padding: EdgeInsets.all(0),
                  scrollDirection: Axis.horizontal,
                ),
              ),
              Container(
                height: hsp(50),
                alignment: Alignment.center,
                child: Text('支付密码不能是重复、连续的数字',style: TextStyle(fontSize: zsp(28),color: Color(0xFF999999)),),
              ),
            ],
          ),
          Container(
              margin: EdgeInsets.only(top: MediaQuery.of(context).size.height-hsp(432)-MediaQuery.of(context).padding.top-44),
              width: MediaQuery.of(context).size.width,
              decoration: BoxDecoration(
                  color: Color(0xFF8C8C8C),
                  border: Border(top: BorderSide(width: 1,color: Color(0xFF8C8C8C)))
              ),
              height: hsp(432),
              child: GridView.builder(
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 3,
                    mainAxisSpacing: 1,
                    crossAxisSpacing: 1,
                    childAspectRatio: ((MediaQuery.of(context).size.width-2)/3)/((hsp(432)-3)/4)
                ),
                itemBuilder: (context, index) {
                  return GestureDetector(
                    onTap: (){
                      if(index==9){
                        if(_passArray.length>0){
                          _passArray.removeAt(_passArray.length-1);
                        }
                        setState(() {});
                      }else if(index==11){
                        if(_passArray.length==6){
                          Navigator.of(context).push(
                              CupertinoPageRoute(
                                  builder: (context){
                                    return YSChangePayPass(oldPass: _passArray.join(''),);
                                  }
                              )
                          );
                        }else{
                          ysFlutterToast(context, '支付密码为6位数字');
                        }
                      }else{
                        if(_passArray.length<6){
                          _passArray.add(index+1);
                          setState(() {});
                        }
                      }
                    },
                    child: Container(
                      color: index==9||index==11?Color(0xFFD0D5DC):Colors.white,
                      child: Text(index==9?'删除':index==10?'0':index==11?'确认':'${index+1}',style: TextStyle(fontSize: zsp(40),color: Colors.black,fontWeight: FontWeight.bold),),
                      alignment: Alignment.center,
                    ),
                  );
                },
                itemCount: 12,
                padding: EdgeInsets.all(0),
                physics: NeverScrollableScrollPhysics(),
              )
          )
        ],
      ),
    );
  }
}

class YSChangePayPass extends StatefulWidget {
  final String oldPass;
  const YSChangePayPass({Key key, this.oldPass}) : super(key: key);
  @override
  _YSChangePayPassState createState() => _YSChangePayPassState();
}

class _YSChangePayPassState extends State<YSChangePayPass> {
  List _passArray = [];
  @override
  Widget build(BuildContext context) {
    return YSBase(
      ystitle: '修改支付密码',
      yschild: Stack(
        children: [
          Column(
            children: [
              Container(
                height: hsp(50),
                alignment: Alignment.center,
                margin: EdgeInsets.only(top: MediaQuery.of(context).padding.top+hsp(150)),
                child: Text('请输入新的支付密码',style: TextStyle(fontSize: zsp(40),color: Color(0xFF333333),fontWeight: FontWeight.bold),),
              ),
              Container(
                width: MediaQuery.of(context).size.width-hsp(100),
                height: hsp(100),
                margin: EdgeInsets.only(top: hsp(200)),
                decoration: BoxDecoration(
                    border: Border.all(color: Color(0xFF108EE9),width: 2),
                    borderRadius: BorderRadius.all(Radius.circular(5))
                ),
                child: ListView.separated(
                  itemBuilder: (context,index){
                    return Container(
                      height: hsp(100),
                      width: (MediaQuery.of(context).size.width-hsp(100)-9)/6,
                      child: Container(
                        height: hsp(20),
                        width: hsp(20),
                        decoration: BoxDecoration(
                            color: index<_passArray.length?Colors.black:Colors.transparent,
                            borderRadius: BorderRadius.all(Radius.circular(50))
                        ),
                      ),
                      alignment: Alignment.center,
                    );
                  },
                  separatorBuilder: (context,index){
                    return Container(width: 1,color: Color(0xFF9A9A9A),height: hsp(100),);
                  },
                  itemCount: 6,
                  padding: EdgeInsets.all(0),
                  scrollDirection: Axis.horizontal,
                ),
              ),
              Container(
                height: hsp(50),
                alignment: Alignment.center,
                child: Text('支付密码不能是重复、连续的数字',style: TextStyle(fontSize: zsp(28),color: Color(0xFF999999)),),
              ),
            ],
          ),
          Container(
              margin: EdgeInsets.only(top: MediaQuery.of(context).size.height-hsp(432)-MediaQuery.of(context).padding.top-44),
              width: MediaQuery.of(context).size.width,
              decoration: BoxDecoration(
                  color: Color(0xFF8C8C8C),
                  border: Border(top: BorderSide(width: 1,color: Color(0xFF8C8C8C)))
              ),
              height: hsp(432),
              child: GridView.builder(
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 3,
                    mainAxisSpacing: 1,
                    crossAxisSpacing: 1,
                    childAspectRatio: ((MediaQuery.of(context).size.width-2)/3)/((hsp(432)-3)/4)
                ),
                itemBuilder: (context, index) {
                  return GestureDetector(
                    onTap: (){
                      if(index==9){
                        if(_passArray.length>0){
                          _passArray.removeAt(_passArray.length-1);
                        }
                        setState(() {});
                      }else if(index==11){
                        if(_passArray.length==6){
                          Navigator.of(context).push(
                              CupertinoPageRoute(
                                  builder: (context){
                                    return YSChangePayPassAgain(oldPass: widget.oldPass,pass: _passArray.join(''),);
                                  }
                              )
                          );
                        }else{
                          ysFlutterToast(context, '支付密码为6位数字');
                        }
                      }else{
                        if(_passArray.length<6){
                          _passArray.add(index+1);
                          setState(() {});
                        }
                      }
                    },
                    child: Container(
                      color: index==9||index==11?Color(0xFFD0D5DC):Colors.white,
                      child: Text(index==9?'删除':index==10?'0':index==11?'确认':'${index+1}',style: TextStyle(fontSize: zsp(40),color: Colors.black,fontWeight: FontWeight.bold),),
                      alignment: Alignment.center,
                    ),
                  );
                },
                itemCount: 12,
                padding: EdgeInsets.all(0),
                physics: NeverScrollableScrollPhysics(),
              )
          )
        ],
      ),
    );
  }
}

class YSChangePayPassAgain extends StatefulWidget {
  final String oldPass,pass;
  const YSChangePayPassAgain({Key key, this.oldPass, this.pass}) : super(key: key);
  @override
  _YSChangePayPassAgainState createState() => _YSChangePayPassAgainState();
}

class _YSChangePayPassAgainState extends State<YSChangePayPassAgain> {
  List _passArray = [];
  @override
  Widget build(BuildContext context) {
    return YSBase(
      ystitle: '修改支付密码',
      yschild: Stack(
        children: [
          Column(
            children: [
              Container(
                height: hsp(50),
                alignment: Alignment.center,
                margin: EdgeInsets.only(top: MediaQuery.of(context).padding.top+hsp(150)),
                child: Text('请再次填写以确认',style: TextStyle(fontSize: zsp(40),color: Color(0xFF333333),fontWeight: FontWeight.bold),),
              ),
              Container(
                width: MediaQuery.of(context).size.width-hsp(100),
                height: hsp(100),
                margin: EdgeInsets.only(top: hsp(200)),
                decoration: BoxDecoration(
                    border: Border.all(color: Color(0xFF108EE9),width: 2),
                    borderRadius: BorderRadius.all(Radius.circular(5))
                ),
                child: ListView.separated(
                  itemBuilder: (context,index){
                    return Container(
                      height: hsp(100),
                      width: (MediaQuery.of(context).size.width-hsp(100)-9)/6,
                      child: Container(
                        height: hsp(20),
                        width: hsp(20),
                        decoration: BoxDecoration(
                            color: index<_passArray.length?Colors.black:Colors.transparent,
                            borderRadius: BorderRadius.all(Radius.circular(50))
                        ),
                      ),
                      alignment: Alignment.center,
                    );
                  },
                  separatorBuilder: (context,index){
                    return Container(width: 1,color: Color(0xFF9A9A9A),height: hsp(100),);
                  },
                  itemCount: 6,
                  padding: EdgeInsets.all(0),
                  scrollDirection: Axis.horizontal,
                ),
              ),
              Container(
                height: hsp(50),
                alignment: Alignment.center,
                child: Text('支付密码不能是重复、连续的数字',style: TextStyle(fontSize: zsp(28),color: Color(0xFF999999)),),
              ),
              GestureDetector(
                onTap: (){
                  if(_passArray.length==6){
                    _postPayPassData();
                  }else{
                    ysFlutterToast(context, '支付密码为6位数字');
                  }
                },
                child: Container(
                  height: hsp(90),
                  width: MediaQuery.of(context).size.width-wsp(50)*2,
                  alignment: Alignment.center,
                  margin: EdgeInsets.only(top: hsp(80)),
                  decoration: BoxDecoration(
                      color: Color(0xFF3B7EF2),
                      borderRadius: BorderRadius.all(Radius.circular(5))
                  ),
                  child: Text('完成',style: TextStyle(fontSize: zsp(34),color: Colors.white),),
                ),
              ),
            ],
          ),
          Container(
              margin: EdgeInsets.only(top: MediaQuery.of(context).size.height-hsp(432)-MediaQuery.of(context).padding.top-44),
              width: MediaQuery.of(context).size.width,
              decoration: BoxDecoration(
                  color: Color(0xFF8C8C8C),
                  border: Border(top: BorderSide(width: 1,color: Color(0xFF8C8C8C)))
              ),
              height: hsp(432),
              child: GridView.builder(
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 3,
                    mainAxisSpacing: 1,
                    crossAxisSpacing: 1,
                    childAspectRatio: ((MediaQuery.of(context).size.width-2)/3)/((hsp(432)-3)/4)
                ),
                itemBuilder: (context, index) {
                  return GestureDetector(
                    onTap: (){
                      if(index==9){
                        if(_passArray.length>0){
                          _passArray.removeAt(_passArray.length-1);
                        }
                        setState(() {});
                      }else if(index==11){
                        if(_passArray.length==6){
                          _postPayPassData();
                        }else{
                          ysFlutterToast(context, '支付密码为6位数字');
                        }
                      }else{
                        if(_passArray.length<6){
                          _passArray.add(index+1);
                          setState(() {});
                        }
                      }
                    },
                    child: Container(
                      color: index==9||index==11?Color(0xFFD0D5DC):Colors.white,
                      child: Text(index==9?'删除':index==10?'0':index==11?'确认':'${index+1}',style: TextStyle(fontSize: zsp(40),color: Colors.black,fontWeight: FontWeight.bold),),
                      alignment: Alignment.center,
                    ),
                  );
                },
                itemCount: 12,
                padding: EdgeInsets.all(0),
                physics: NeverScrollableScrollPhysics(),
              )
          )

        ],
      ),
    );
  }

  _postPayPassData() async{
    if(widget.pass!=_passArray.join('')){
      ysFlutterToast(context, '新密码两次输入不一致');
      return;
    }
    var dict = await ysRequestHttpEncrypt(context,type: requestType.post,api: '/app/applets/balance/resetPayPassword',
        parameter: {'oldPassword':widget.oldPass,'password':_passArray.join('')},isLoading: false,isToken: true);
    if(dict!=null){
      Navigator.pop(context);
      Navigator.pop(context);
      Navigator.pop(context);
    }
  }
}