import 'package:feelverapp/ui/booking/bookingform.dart';
import 'package:feelverapp/util/SizeConfig.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class BookingDetail extends StatefulWidget {
  @override
  _BookingDetailState createState() => _BookingDetailState();
}

class _BookingDetailState extends State<BookingDetail> {
  @override
  Widget build(BuildContext context) {
    return ListView(padding: EdgeInsets.all(0), children: <Widget>[
      _setupView(),
    ]);
  }

  _setupView() {
    return SingleChildScrollView(
      child: Column(
        children: <Widget>[
          Stack(
            children: <Widget>[
              Image.network(
                'https://www.cancurreu.com/wp-content/uploads/can_curreu_hotel_ibiza_spa_tratamientos.jpg',
                width: MediaQuery.of(context).size.width,
                height: SizeConfig.getHeight(450),
                fit: BoxFit.cover,
              ),

            ],
          ),
          Container(
            padding: EdgeInsets.only(
                left: SizeConfig.getPadding(24),
                top: SizeConfig.getPadding(16)),
            alignment: Alignment.topLeft,
            child: Text(
              '4 ธ.ค. 2561 18:55 น.',
              textAlign: TextAlign.left,
              style: TextStyle(
                  color: Colors.black54,
                  fontSize: SizeConfig.getFontSize(11),
                  fontFamily: "SF_Pro_Text",
                  fontWeight: FontWeight.w500),
            ),
          ),
          Container(
            padding: EdgeInsets.only(
                left: SizeConfig.getPadding(24),
                top: SizeConfig.getPadding(3),
                bottom: SizeConfig.getPadding(8)),
            alignment: Alignment.topLeft,
            child: Text(
              'Thai Body',
              textAlign: TextAlign.left,
              style: TextStyle(
                  color: Colors.black,
                  fontSize: SizeConfig.getFontSize(26),
                  fontFamily: "SF_Pro_Text",
                  fontWeight: FontWeight.w700),
            ),
          ),
          Row(
            children: <Widget>[
              SizedBox(
                width: SizeConfig.getWidth(24),
              ),
              ImageIcon(
                AssetImage('assets/images/ic_fav_active.png'),
                color: Colors.pink,
                size: SizeConfig.getFontSize(24),
              ),
              SizedBox(
                width: SizeConfig.getWidth(8),
              ),
              Container(
                alignment: Alignment.topLeft,
                child: Text(
                  '70',
                  textAlign: TextAlign.left,
                  style: TextStyle(
                      color: Colors.black54,
                      fontSize: SizeConfig.getFontSize(16),
                      fontFamily: "SF_Pro_Text",
                      fontWeight: FontWeight.w500),
                ),
                padding: EdgeInsets.only(
                    top: SizeConfig.getPadding(5),
                    left: SizeConfig.getPadding(0),
                    bottom: SizeConfig.getPadding(4)),
              ),
              SizedBox(
                width: SizeConfig.getWidth(20),
              ),
              ImageIcon(
                AssetImage('assets/images/ic_comment.png'),
                color: Colors.grey,
                size: SizeConfig.getFontSize(24),
              ),
              SizedBox(
                width: SizeConfig.getWidth(8),
              ),
              Container(
                alignment: Alignment.topLeft,
                child: Text(
                  '70',
                  textAlign: TextAlign.left,
                  style: TextStyle(
                      color: Colors.black54,
                      fontSize: SizeConfig.getFontSize(16),
                      fontFamily: "SF_Pro_Text",
                      fontWeight: FontWeight.w500),
                ),
                padding: EdgeInsets.only(
                    top: SizeConfig.getPadding(5),
                    left: SizeConfig.getPadding(0),
                    bottom: SizeConfig.getPadding(4)),
              ),
              SizedBox(
                width: SizeConfig.getWidth(20),
              ),
              ImageIcon(
                AssetImage('assets/images/facebook-icon.png'),
                color: Colors.grey,
                size: SizeConfig.getFontSize(24),
              ),
              SizedBox(
                width: SizeConfig.getWidth(20),
              ),
//              ImageIcon(
//                AssetImage('assets/images/ic_twitter.png'),
//                color: Colors.grey,
//                size: SizeConfig.getFontSize(24),
//              ),
            ],
          ),
          SizedBox(
            height: SizeConfig.getWidth(10),
          ),
          Container(
            padding: EdgeInsets.only(
              left: SizeConfig.getPadding(24),
              right: SizeConfig.getPadding(24),
            ),


          ),
          Container(
            alignment: Alignment.topLeft,
            padding: EdgeInsets.only(
                top: SizeConfig.getPadding(14),
                left: SizeConfig.getPadding(24),
                right: SizeConfig.getPadding(24)),
            child: Text(
              'A four hand massage performed by two therapists in unison, this experience coordinates a blend of Thai, Swedish, Shiatsu and Reflexology techniques using deep rhythmic movement to leave you feeling completely renewed. Top Tip: This is Khun Taras (our Group Spa Director) favourite massage. She loves it because having the sensation of two therapists working on you means your mind cant concentrate on one area and it basically just gives up! This massage almost forces you to switch your mind off. Try it and see.',
              textAlign: TextAlign.left,
              style: TextStyle(
                  color: Colors.black54,
                  fontSize: SizeConfig.getFontSize(14),
                  fontFamily: "SF_Pro_Text",
                  fontWeight: FontWeight.w500),
            ),
          ),
          Container(
            alignment: Alignment.topLeft,
            padding: EdgeInsets.only(
                top: SizeConfig.getPadding(24),
                left: SizeConfig.getPadding(24),
                right: SizeConfig.getPadding(24)),
            child: Text(
              'Thai Body Balance 60 นาที',
              textAlign: TextAlign.left,
              style: TextStyle(
                  color: Colors.black87,
                  fontSize: SizeConfig.getFontSize(20),
                  fontFamily: "SF_Pro_Text",
                  fontWeight: FontWeight.w500),
            ),
          ),
          SizedBox(
            height: SizeConfig.getHeight(10),
          ),
          Row(
            children: <Widget>[
              SizedBox(
                width: SizeConfig.getWidth(24),
              ),
              Image.asset(
                'assets/images/clock.png',
                width: SizeConfig.getWidth(20),
                height: SizeConfig.getWidth(20),
              ),
              SizedBox(
                width: SizeConfig.getWidth(10),
              ),
              Text(
                '150 นาที',
                textAlign: TextAlign.left,
                style: TextStyle(
                    color: Colors.black87,
                    fontSize: SizeConfig.getFontSize(12),
                    fontFamily: "SF_Pro_Text",
                    fontWeight: FontWeight.w500),
              ),
            ],
          ),
          Stack(
            children: <Widget>[
              Container(
                width: SizeConfig.getWidth(50),
                height: SizeConfig.getHeight(65),
                color: Color.fromRGBO(255, 0, 0, 1),
                margin: EdgeInsets.only(
                  left: SizeConfig.getPadding(24),
//                  right: SizeConfig.getPadding(20),
                  top: SizeConfig.getPadding(10),
                  bottom: SizeConfig.getPadding(20),
                ),
              ),
              Container(
                alignment: Alignment.topLeft,
                child: Text(
                  'Sale\n50%',
                  textAlign: TextAlign.left,
                  style: TextStyle(
                      color: Colors.white,
                      fontSize: SizeConfig.getFontSize(14),
                      fontFamily: "SF_Pro_Text",
                      fontWeight: FontWeight.w700),
                ),
                padding: EdgeInsets.only(
                  left: SizeConfig.getPadding(35),
//                  right: SizeConfig.getPadding(20),
                  top: SizeConfig.getPadding(20),
                  bottom: SizeConfig.getPadding(20),
                ),
              ),
              Container(
                alignment: Alignment.topLeft,
                child: Text(
                  '฿199.00',
                  textAlign: TextAlign.left,
                  style: TextStyle(
                      color: Color.fromRGBO(255, 0, 0, 1),
                      fontSize: SizeConfig.getFontSize(26),
                      fontFamily: "SF_Pro_Text",
                      fontWeight: FontWeight.w500),
                ),
                padding: EdgeInsets.only(
                  left: SizeConfig.getPadding(90),
//                  right: SizeConfig.getPadding(20),
                  top: SizeConfig.getPadding(10),
                  bottom: SizeConfig.getPadding(20),
                ),
              ),
              Container(
                alignment: Alignment.topLeft,
                padding: EdgeInsets.only(
                  left: SizeConfig.getPadding(90),
//                  right: SizeConfig.getPadding(20),
                  top: SizeConfig.getPadding(40),
                  bottom: SizeConfig.getPadding(20),
                ),
                child: Text(
                  '฿599.00 ',
                  textAlign: TextAlign.left,
                  style: TextStyle(
                      color: Colors.black45,
                      fontSize: SizeConfig.getFontSize(20),
                      decoration: TextDecoration.lineThrough,
                      fontFamily: "SF_Pro_Text",
                      fontWeight: FontWeight.w500),
                ),
              ),
              Container(
                margin: EdgeInsets.only(
                    top: SizeConfig.getPadding(20),
                    left: SizeConfig.getPadding(250)),

//                color: Colors.red,
                width: SizeConfig.getWidth(100),
                height: SizeConfig.getHeight(45),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(24),
                  color:Color.fromRGBO(69, 85, 79, 1),
                ),
                child: Container(
                  padding: EdgeInsets.only(top: SizeConfig.getPadding(6)),
                  child: Text(
                    'หยิบใส่รถเข็น',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                        color: Colors.white,
                        fontSize: SizeConfig.getFontSize(14),
                        fontFamily: "SF_Pro_Text",
                        fontWeight: FontWeight.w500),
                  ),
                ),
              ),

            ],
          ),



          SizedBox(
            height: SizeConfig.getHeight(30),
          ),
        ],
      ),
    );
  }
}
