import 'package:fcs/pages/util.dart';
import 'package:fcs/vo/manual.dart';
import 'package:fcs/widget/bottom_up_page_route.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:fcs/model/main_model.dart';
import 'package:fcs/widget/local_text.dart';
import 'package:fcs/widget/progress.dart';

import '../theme/theme.dart';
import '../widget/label_widgets.dart';
import '../widget/local_text.dart';
import 'instruction.dart';
import 'manual/manual_page.dart';

class BuyingOnlinePage extends StatefulWidget {
  @override
  _BuyingOnlinePagetate createState() => _BuyingOnlinePagetate();
}

class _BuyingOnlinePagetate extends State<BuyingOnlinePage>
    with SingleTickerProviderStateMixin {
  bool _isLoading = false;
  List<String> images = [
    'assets/Fullname.jpeg',
    'assets/FirstName&LastName.jpeg'
  ];
  TabController _tabController;

  @override
  void initState() {
    _tabController = TabController(vsync: this, length: 2);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    MainModel mainModel = Provider.of<MainModel>(context);

    final phoneBox =
        labeledText(context, mainModel.customer.phoneNumber, "user.phone");
    final fcsIdBox = Container(
        padding: EdgeInsets.only(top: 15),
        child: labeledText(context, mainModel.customer.fcsID, "user.fcs_id"));
    final shippingAddressBox = Container(
        padding: EdgeInsets.only(top: 15),
        child: labeledText(context, mainModel.customer.shippingAddress,
            "user.shipping_address"));
    final deliveryAddressBox = Container(
        padding: EdgeInsets.only(top: 15),
        child: labeledText(context, mainModel.customer.deliveryAddress,
            "user.deliveryAddress"));

    final instructionBox = Container(
      padding: EdgeInsets.only(left: 10, top: 30, bottom: 10),
      child: Center(
        child: Wrap(
          children: <Widget>[
            LocalText(
              context,
              'user.buying_instruction',
              color: labelColor,
              fontSize: 15,
            )
          ],
        ),
      ),
    );

    final amazonbutton = Container(
      padding: EdgeInsets.only(left: 10, right: 10, top: 10),
      child: Container(
        height: 45.0,
        decoration: BoxDecoration(
          color: primaryColor,
          shape: BoxShape.rectangle,
          // borderRadius: BorderRadius.all(Radius.circular(10.0))
        ),
        child: ButtonTheme(
          minWidth: 900.0,
          height: 100.0,
          child: FlatButton(
            onPressed: () {
              Navigator.of(context).push(BottomUpPageRoute(InstructionPage(
                name: 'Amazon',
                image: "assets/amazon_ins.png",
              )));
            },
            child: LocalText(
              context,
              'buy.amazon',
              color: Colors.white,
              fontSize: 16,
              fontWeight: FontWeight.bold,
            ),
          ),
        ),
      ),
    );

    return LocalProgress(
      inAsyncCall: _isLoading,
      child: Scaffold(
        appBar: AppBar(
          centerTitle: true,
          leading: new IconButton(
            icon: new Icon(Icons.close),
            onPressed: () => Navigator.of(context).pop(),
          ),
          title: LocalText(
            context,
            "buy_online.title",
            fontSize: 20,
            color: Colors.white,
          ),
          backgroundColor: primaryColor,
        ),
        body: ListView(
          shrinkWrap: true,
          padding: EdgeInsets.only(top: 10, left: 10, right: 10),
          children: <Widget>[
            nameWidget(mainModel.customer.name),
            phoneWidget(context, mainModel.customer.phoneNumber),
            Row(
              children: <Widget>[
                SizedBox(
                  width: 25,
                  height: 25,
                  child: FittedBox(
                    child: Image.asset("assets/logo.jpg"),
                    fit: BoxFit.fill,
                  ),
                ),
                fcsIdBox,
                Padding(
                  padding: const EdgeInsets.only(left: 7.0, top: 50),
                  child: Icon(
                    Icons.content_copy,
                    color: Colors.grey,
                  ),
                )
              ],
            ),
            Row(
              children: <Widget>[
                Icon(Icons.location_on),
                shippingAddressBox,
                Padding(
                  padding: const EdgeInsets.only(left: 7.0, top: 50),
                  child: Icon(
                    Icons.content_copy,
                    color: Colors.grey,
                  ),
                )
              ],
            ),

            // deliveryAddressBox,
            instructionBox,
            new Container(
              decoration: new BoxDecoration(color: Colors.white),
              child: new TabBar(
                // indicatorColor: primaryColor,
                labelColor: primaryColor,
                labelStyle: TextStyle(fontWeight: FontWeight.bold),
                unselectedLabelColor: Colors.grey,
                controller: _tabController,
                tabs: [
                  new Tab(
                    text: 'With FULL NAME',
                  ),
                  new Tab(
                    text: 'With FIRST NAME&\nLAST NAME',
                  ),
                ],
              ),
            ),
            new Container(
              padding: EdgeInsets.only(top: 10),
              height: 500,
              width: 500,
              child: new TabBarView(
                controller: _tabController,
                children: <Widget>[
                  Container(
                    child:
                        Image.asset('assets/Fullname.png', fit: BoxFit.contain),
                  ),
                  Container(
                    child: Image.asset('assets/FirstName&LastName.png',
                        fit: BoxFit.contain),
                  ),
                ],
              ),
            ),
            // Container(
            //   height: 500,
            //   width: 500,
            //   child: ListView.builder(
            //       itemCount: images.length,
            //       scrollDirection: Axis.horizontal,
            //       itemBuilder: (context, index) {
            //         return Container(
            //           padding: EdgeInsets.only(left: 0, right: 5, top: 5),
            //           child: Image.asset(images[index], fit: BoxFit.contain),
            //         );
            //       }),
            // ),

            SizedBox(height: 10)
          ],
        ),
      ),
    );
  }
}