import 'dart:ui';

import 'package:feelverapp/ui/booking/bookingflow.dart';
import 'package:feelverapp/ui/home/home.dart';
import 'package:feelverapp/ui/reserve/reserve_date_time.dart';
import 'package:feelverapp/util/AppBar.dart';
import 'package:feelverapp/util/SizeConfig.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class AccountSettingPage extends StatefulWidget {
  @override
  _AccountSettingPageState createState() => _AccountSettingPageState();
}

class _AccountSettingPageState extends State<AccountSettingPage> {
  @override
  Widget build(BuildContext context) {
    SizeConfig(context);
    return Scaffold(
      body: _setupView(),
    );
  }

  _setupView() {
    return Stack(
      children: <Widget>[
        containt(),
        header(),
        myAppBar(title: "ตั้งค่าบัญชี",),
      ],
    );
  }


  Widget containt(){
    return  Container(
      child: Column(
        children: <Widget>[
          Container(
            height: SizeConfig.getHeight(160),
          ),
          Expanded(
            child: SingleChildScrollView(
              child: Column(
                children: <Widget>[
                  SizedBox(height: SizeConfig.getHeight(65),),
                  Card1(),
                  Card2(),
                  LogoutButton(),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }


  Widget LogoutButton(){
    return Container(
//                                color: Colors.red,
      margin: EdgeInsets.only(right: SizeConfig.getPadding(16)+10,left: SizeConfig.getPadding(16)+10,top: SizeConfig.getPadding(10),bottom: SizeConfig.getPadding(30)),
      height: SizeConfig.getHeight(40),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.start,
        children: <Widget>[
          Container(
            child: Image.asset("assets/images/Icon_close.png"),
          ),
          SizedBox(
            width: 10,
          ),
          Text("ออกจากระบบ",style: TextStyle(
              color: Color(0xffEEAFB7),
              fontSize: SizeConfig.getFontSize(16),
              fontFamily: "SF_Pro_Text",
              fontWeight: FontWeight.w500),),
        ],),
    );
  }


  Widget Card1(){
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Container(
          margin: EdgeInsets.only(right: SizeConfig.getPadding(16),left: SizeConfig.getPadding(16),top: SizeConfig.getPadding(10),bottom: 5),
          child: Text("บัญชีของฉัน",style: TextStyle(
              color: Color(0xff6AB3AA),
              fontSize: SizeConfig.getFontSize(18),
              fontFamily: "SF_Pro_Text",
              fontWeight: FontWeight.w500),),
        ),
        Card(
          margin: EdgeInsets.only(right: SizeConfig.getPadding(16),left: SizeConfig.getPadding(16),top: SizeConfig.getPadding(10),bottom: SizeConfig.getPadding(10)),
          child: Container(
            margin: EdgeInsets.only(right: 10,left: 10),
//                          color: Colors.yellow,
            child: Column(
              children: <Widget>[
                Divider(color: Color(0x00000000),),
                Container(
//                                color: Colors.red,
                  height: SizeConfig.getHeight(40),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Text("ข้อมูลของฉัน",style: TextStyle(
                          color: Color(0xffEEAFB7),
                          fontSize: SizeConfig.getFontSize(16),
                          fontFamily: "SF_Pro_Text",
                          fontWeight: FontWeight.w500),),
                      Icon(Icons.keyboard_arrow_right,color: Color(0xAAA8B8C3),size: SizeConfig.getFontSize(26),),
                    ],),
                ),

                Divider(color: Color(0x11000000),),

                Container(
//                                color: Colors.red,
                  height: SizeConfig.getHeight(40),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Text("ที่อยู่ของฉัน",style: TextStyle(
                          color: Color(0xffEEAFB7),
                          fontSize: SizeConfig.getFontSize(16),
                          fontFamily: "SF_Pro_Text",
                          fontWeight: FontWeight.w500),),
                      Icon(Icons.keyboard_arrow_right,color: Color(0xAAA8B8C3),size: SizeConfig.getFontSize(26),),
                    ],),
                ),

                Divider(color: Color(0x11000000),),

                Container(
//                                color: Colors.red,
                  height: SizeConfig.getHeight(40),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Text("ข้อมูลบัญชีธนาคาร/บัตร",style: TextStyle(
                          color: Color(0xffEEAFB7),
                          fontSize: SizeConfig.getFontSize(16),
                          fontFamily: "SF_Pro_Text",
                          fontWeight: FontWeight.w500),),
                      Icon(Icons.keyboard_arrow_right,color: Color(0xAAA8B8C3),size: SizeConfig.getFontSize(26),),
                    ],),
                ),

                Divider(color: Color(0x11000000),),

                Container(
//                                color: Colors.red,
                  height: SizeConfig.getHeight(40),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Text("เปลี่ยนรหัสผ่าน",style: TextStyle(
                          color: Color(0xffEEAFB7),
                          fontSize: SizeConfig.getFontSize(16),
                          fontFamily: "SF_Pro_Text",
                          fontWeight: FontWeight.w500),),
                      Icon(Icons.keyboard_arrow_right,color: Color(0xAAA8B8C3),size: SizeConfig.getFontSize(26),),
                    ],),
                ),

                Divider(color: Color(0x00000000),),
              ],
            ),
          ),
        ),
      ],
    );
  }

  Widget Card2(){
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Container(
          margin: EdgeInsets.only(right: SizeConfig.getPadding(16),left: SizeConfig.getPadding(16),top: SizeConfig.getPadding(30),bottom: 5),
          child: Text("การตั้งค่า",style: TextStyle(
              color: Color(0xff6AB3AA),
              fontSize: SizeConfig.getFontSize(18),
              fontFamily: "SF_Pro_Text",
              fontWeight: FontWeight.w500),),
        ),
        Card(
          margin: EdgeInsets.only(right: SizeConfig.getPadding(16),left: SizeConfig.getPadding(16),top: SizeConfig.getPadding(10),bottom: SizeConfig.getPadding(10)),
          child: Container(
            margin: EdgeInsets.only(right: 10,left: 10),
//                          color: Colors.yellow,
//                          height: 200,
            child: Column(
              children: <Widget>[
                Divider(color: Color(0x00000000),),
                Container(
//                                color: Colors.red,
                  height: SizeConfig.getHeight(40),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Text("ตั้งค่าการแจ้งเตือน",style: TextStyle(
                          color: Color(0xffEEAFB7),
                          fontSize: SizeConfig.getFontSize(16),
                          fontFamily: "SF_Pro_Text",
                          fontWeight: FontWeight.w500),),
                      Icon(Icons.keyboard_arrow_right,color: Color(0xAAA8B8C3),size: SizeConfig.getFontSize(26),),
                    ],),
                ),

                Divider(color: Color(0x11000000),),

                Container(
//                                color: Colors.red,
                  height: SizeConfig.getHeight(40),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Text("ตั้งค่าการแชท",style: TextStyle(
                          color: Color(0xffEEAFB7),
                          fontSize: SizeConfig.getFontSize(16),
                          fontFamily: "SF_Pro_Text",
                          fontWeight: FontWeight.w500),),
                      Icon(Icons.keyboard_arrow_right,color: Color(0xAAA8B8C3),size: SizeConfig.getFontSize(26),),
                    ],),
                ),

                Divider(color: Color(0x11000000),),

                Container(
//                                color: Colors.red,
                  height: SizeConfig.getHeight(40),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Text("ภาษา",style: TextStyle(
                          color: Color(0xffEEAFB7),
                          fontSize: SizeConfig.getFontSize(16),
                          fontFamily: "SF_Pro_Text",
                          fontWeight: FontWeight.w500),),
                      Icon(Icons.keyboard_arrow_right,color: Color(0xAAA8B8C3),size: SizeConfig.getFontSize(26),),
                    ],),
                ),

                Divider(color: Color(0x00000000),),
              ],
            ),
          ),
        ),
      ],
    );
  }

  Widget buttonBar(){
    return Container(

      child: Row(
        children: <Widget>[
          Expanded(
            child: Container(
              height: SizeConfig.getHeight(130),
              padding: EdgeInsets.only(bottom: SizeConfig.getHeight(10)),
//                                color: Colors.green,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.end,
                children: <Widget>[
                  Image.asset("assets/images/icon_menu1_gray.png",
                    width: SizeConfig.getWidth(20),
                    height: SizeConfig.getHeight(30),
                    fit: BoxFit.cover,),
                  SizedBox(
                    height: SizeConfig.getHeight(8),
                  ),
                  Text("การจองของฉัน",
                    style: TextStyle(
                        color: Colors.black,
                        fontSize: SizeConfig.getFontSize(12),
                        fontFamily: "SF_Pro_Text",
                        fontWeight: FontWeight.w500),)
                ],
              ),
            ),
          ),
          Expanded(
            child: Container(
              height: SizeConfig.getHeight(130),
              padding: EdgeInsets.only(bottom: SizeConfig.getHeight(10)),
//                                color: Colors.blue,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.end,
                children: <Widget>[
                  Image.asset("assets/images/icon_menu2_gray.png",
                    width: SizeConfig.getWidth(20),
                    height: SizeConfig.getHeight(30),
                    fit: BoxFit.cover,),
                  SizedBox(
                    height: SizeConfig.getHeight(5),
                  ),
                  Text("ประวัติการใช้บริการ",
                    style: TextStyle(
                        color: Colors.black,
                        fontSize: SizeConfig.getFontSize(12),
                        fontFamily: "SF_Pro_Text",
                        fontWeight: FontWeight.w500),)
                ],
              ),
            ),
          ),
          Expanded(
            child: Container(
              height: SizeConfig.getHeight(130),
              padding: EdgeInsets.only(bottom: SizeConfig.getHeight(10)),
//                                color: Colors.red,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.end,
                children: <Widget>[
                  Image.asset("assets/images/icon_menu3_gray.png",
                    width: SizeConfig.getWidth(20),
                    height: SizeConfig.getHeight(30),
                    fit: BoxFit.cover,),
                  SizedBox(
                    height: SizeConfig.getHeight(5),
                  ),
                  Text("การแจ้งเตือน",
                    style: TextStyle(
                        color: Colors.black,
                        fontSize: SizeConfig.getFontSize(12),
                        fontFamily: "SF_Pro_Text",
                        fontWeight: FontWeight.w500),)
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget header(){
    return Container(
      height: SizeConfig.getHeight(210),
//                color: Colors.amber,
      child: Stack(
        children: <Widget>[



          Column(
            children: <Widget>[
              Container(
                color: Color(0xff6AB3AA),
                height: SizeConfig.getHeight(180),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.end,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Container(
                      width: 85,
                      height: 85,
                      margin: EdgeInsets.only(left: SizeConfig.getPadding(16),bottom: 10),
                      //color: Colors.brown,
                    ),

                    Expanded(
                      child: Container(
                        alignment: Alignment.bottomLeft,
                        margin: EdgeInsets.only(bottom: 10),
                        padding: EdgeInsets.only(left: 20),
                        height: 85,
                        //color: Colors.red,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.end,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: <Widget>[
                            Text("Rataya  Pratumkan",style: TextStyle(
                                color: Colors.white,
                                fontSize: SizeConfig.getFontSize(18),
                                fontFamily: "SF_Pro_Text",
                                fontWeight: FontWeight.w500),),
                            SizedBox(
                              height: 5,
                            ),
                            Text("แก้ไขข้อมูลส่วนตัว",style: TextStyle(
                                color: Colors.yellow,
                                fontSize: SizeConfig.getFontSize(12),
                                fontFamily: "SF_Pro_Text",
                                fontWeight: FontWeight.w500,decoration: TextDecoration.underline),
                            ),
                            SizedBox(
                              height: 5,
                            ),
                          ],
                        ),
                      ),
                    ),
                    Container(
                      alignment: Alignment.centerRight,
                      //color: Colors.yellow,
                      width: 85,
                      height: 85,
                      margin: EdgeInsets.only(right: SizeConfig.getPadding(16),bottom: 10),
                      child: Icon(Icons.settings,color: Colors.white,),
                    ),
                  ],
                ),
              )
            ],
          ),

          Column(
            mainAxisAlignment: MainAxisAlignment.end,
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.start,
                children: <Widget>[
                  Container(
                    width: 85,
                    height: 85,
                    margin: EdgeInsets.only(left: SizeConfig.getPadding(16),bottom: 10),
                    //color: Colors.brown,
                    child: ClipRRect(
                      borderRadius: BorderRadius.circular(50),
                      child: Image.network(
                        'https://scontent.fbkk7-2.fna.fbcdn.net/v/t1.0-9/104204530_3370427592977187_6031309814586327212_o.jpg?_nc_cat=106&_nc_sid=110474&_nc_eui2=AeE2vpoR5NHZLbG8b3YABiSdSsMCoPYM3W1KwwKg9gzdbZuYqR1gPnkW3tGe-TS2Vtphdvn2OuvO2CdDLaCMVvcI&_nc_ohc=T5EK3sWOgtAAX994m4I&_nc_ht=scontent.fbkk7-2.fna&oh=0b3e434546b19e256c07ecd6a4d499fb&oe=5F098A94',
                        width: 85.0,
                        height: 85.0,
                        fit: BoxFit.cover,
                      ),
                    ),
                  ),
                ],
              ),


            ],
          ),


        ],
      ),
    );
  }
}
