import 'package:fcs/model/main_model.dart';
import 'package:fcs/widget/bottom_up_page_route.dart';
import 'package:flutter/material.dart';
import 'package:flutter_icons/flutter_icons.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:intl/intl.dart';
import 'package:logging/logging.dart';
import 'package:provider/provider.dart';
import 'dart:math' as math;
import 'package:fcs/charts/bar_chart.dart';
import 'package:fcs/charts/delivery_do_line.dart';
import 'package:fcs/charts/delivery_do_summary.dart';
import 'package:fcs/charts/delivery_line.dart';
import 'package:fcs/charts/delivery_summary.dart';
import 'package:fcs/charts/do_line.dart';
import 'package:fcs/charts/po_balance_chart.dart';
import 'package:fcs/charts/po_line.dart';
import 'package:fcs/charts/revenue_line.dart';
import 'package:fcs/model/language_model.dart';
import 'package:fcs/model/product_model.dart';
import 'package:fcs/pages/banks/banks.dart';
import 'package:fcs/pages/buyer_list.dart';
import 'package:fcs/pages/contact.dart';
import 'package:fcs/pages/delivery/delivery_list.dart';
import 'package:fcs/pages/manual/manual_page.dart';
import 'package:fcs/pages/notification_list.dart';
import 'package:fcs/pages/term.dart';
import 'package:fcs/reports/report_list.dart';
import 'package:fcs/widget/banner.dart';
import 'package:fcs/widget/local_text.dart';
import 'package:fcs/widget/localization/app_translations.dart';
import 'package:fcs/widget/offline_redirect.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:intl/intl.dart';
import 'package:logging/logging.dart';
import 'package:provider/provider.dart';

import '../theme/theme.dart';
import 'announcement_list.dart';
import 'buying_online.dart';
import 'do/do_list.dart';
import 'my_registeration.dart';
import 'pd/pd_list.dart';
import 'po/shipment_list.dart';
import 'products_list.dart';
import 'profile_page.dart';
import 'signin_page.dart';
import 'staff_list.dart';

import 'fcs_profile_page.dart';
import 'pd/pd_list.dart';
import 'pickup_list.dart';
import 'products_list.dart';
import 'profile_page.dart';
import 'shipment_rates.dart';
import 'storage/storage_list.dart';
import 'user_list.dart';

final msgLog = Logger('backgroundMessageHandler');

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

typedef BtnCallback();

class _HomePageState extends State<HomePage> {
  final log = Logger('_HomePageState');
  bool login = false;
  bool customer = true;

  @override
  void initState() {
    super.initState();
  }

  void dispose() {
    super.dispose();
  }

  static final List<String> chartDropdownItems = [
    'Last 7 days',
    'Last month',
    'Last three months'
  ];
  String actualDropdown = chartDropdownItems[0];
  int actualChart = 0;
  final numberFormatter = new NumberFormat("#,###");

  String pin;

  @override
  Widget build(BuildContext context) {
    login=Provider.of<MainModel>(context).isLogin();
    final helpBtn = _buildBtn2("manual.title",
        icon: FontAwesomeIcons.readme,
        imgIcon: Image.asset(
          "assets/manual.png",
          width: 40,
          height: 40,
          color: primaryColor,
        ),
        btnCallback: () => Navigator.of(context)
            .push(BottomUpPageRoute(ManualPage()))
        // btnCallback: () => Navigator.of(context)
        //     .push(MaterialPageRoute(builder: (_) => TestList()))
        );
    final announcementBtn = _buildBtn2("announcement.title",
        icon: Icons.announcement,
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => AnnouncementList())));

    final buyerBtn = _buildBtn("buyer.title",
        imgIcon: Image.asset(
          "assets/buyer.png",
          width: 40,
          height: 40,
          color: primaryColor,
        ),
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => BuyerList())));

    final reportBtn = _buildBtn2("report.title",
        icon: FontAwesomeIcons.paperPlane,
        imgIcon: Image.asset(
          "assets/report.png",
          width: 50,
          height: 50,
          // color: primaryColor,
        ),
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => ReportList())));

    final pickUpBtn = _buildBtn2("pickup",
        icon: MaterialCommunityIcons.directions,
        btnCallback: () => Navigator.of(context)
            .push(BottomUpPageRoute(PickUpList())));

    final shipmentCostBtn = _buildBtn2("rate",
        icon: FontAwesomeIcons.calculator,
        btnCallback: () => Navigator.of(context)
            .push(BottomUpPageRoute(ShipmentRates())));

    final fcsProfileBtn = _buildBtn2("profile.title",
        icon: Icons.account_circle,
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => FCSProfilePage())));

    final myRegBtn = _buildBtn("myreg.title",
        imgIcon: Image.asset(
          "assets/reg.png",
          width: 40,
          height: 30,
          color: primaryColor,
        ),
        btnCallback: () async {});

    final posBtn = _buildBtn("po.title",
        imgIcon: Image.asset(
          "assets/pay.png",
          width: 40,
          height: 40,
          color: primaryColor,
        ),
        btnCallback: () {});

    final dosBtn = _buildBtn("do.title",
        imgIcon: Image.asset(
          "assets/do.png",
          width: 40,
          height: 40,
          color: primaryColor,
        ),
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => DOList())));

    final shipmentBtn = _buildBtn2("shipment.title",
        icon: Ionicons.ios_airplane,
        imgIcon: Image.asset(
          "assets/truck.png",
          width: 50,
          height: 50,
          color: primaryColor,
        ),
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => ShipmentList())));

    final storageBtn = _buildBtn("storage.title",
        imgIcon: Image.asset(
          "assets/inventory.png",
          width: 40,
          height: 40,
          color: primaryColor,
        ),
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => StorageList())));

    final pdosBtn = _buildBtn("pd.title",
        imgIcon: Image.asset(
          "assets/pdo.png",
          width: 40,
          height: 40,
          color: primaryColor,
        ),
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => PDList())));

    final termBtn = _buildBtn2("term.title",
        icon: FontAwesomeIcons.fileContract,
        imgIcon: Image.asset(
          "assets/term.png",
          width: 40,
          height: 30,
          color: primaryColor,
        ), btnCallback: () {
      Navigator.push(context, MaterialPageRoute(builder: (context) => Term()));
    });

    final userBtn =
        _buildBtn("users.title", icon: Icons.group, btnCallback: () {
      Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => UserList()),
      );
    });


    final buyingBtn = _buildBtn2("buy_online",
        icon: MaterialCommunityIcons.cart_outline, btnCallback: () {
      Navigator.push(
        context,
        BottomUpPageRoute(BuyingOnlinePage())
        // MaterialPageRoute(builder: (context) => BuyingOnlinePage()),
      );
    });

    final notiBtn = _buildBtn2("notifications.title", icon: Icons.notifications,
        btnCallback: () {
      Navigator.push(
        context,
        BottomUpPageRoute(NotificationList()),
      );
    });

    final staffBtn = _buildBtn2("staff.title",
        icon: SimpleLineIcons.people,
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => StaffList())));

    final _bankAccountsBtn = _buildBtn2("banks.title",
        icon: FontAwesomeIcons.moneyCheck, btnCallback: () {
      Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => BankAccounts()),
      );
    });

    List<Widget> widgets = [];
    widgets.add(buyingBtn);
    widgets.add(pickUpBtn);
    widgets.add(shipmentBtn);
    widgets.add(notiBtn);
    widgets.add(staffBtn);
    // widgets.add(_bankAccountsBtn);
    widgets.add(announcementBtn);
    widgets.add(fcsProfileBtn);
    widgets.add(shipmentCostBtn);
    widgets.add(reportBtn);
    widgets.add(termBtn);
    widgets.add(_bankAccountsBtn);

    var revenueChart = Padding(
        padding: const EdgeInsets.all(10.0),
        child: ListView(
          shrinkWrap: true,
          children: <Widget>[RevenueLineChart()],
        ));

    var productListBox = Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              LocalText(context, 'products.prices', color: primaryColor),
              Row(
                children: <Widget>[
                  LocalText(context, 'products.gas',
                      color: Colors.black,
                      fontSize: 19,
                      fontWeight: FontWeight.w700),
                  Consumer<ProductModel>(builder: (context, model, child) {
                    return Text('   ${model.products.length}',
                        style: TextStyle(
                            color: Colors.black,
                            fontWeight: FontWeight.w700,
                            fontSize: 19.0));
                  }),
                ],
              ),
            ],
          ),
          Material(
              color: thirdColor,
              borderRadius: BorderRadius.circular(10.0),
              child: Center(
                  child: Padding(
                      padding: const EdgeInsets.all(5.0),
                      child: //Icon(Icons.timeline, color: Colors.white, size: 30.0),
                          Image.asset(
                        "assets/product.png",
                        width: 60,
                        height: 70,
                        color: Colors.white,
                      ))))
        ]);

    var poqtyByProductChart = Padding(
        padding: const EdgeInsets.all(10.0),
        child: ListView(
          shrinkWrap: true,
          children: <Widget>[BarChart()],
        ));

    var poChart = Padding(
        padding: const EdgeInsets.all(10.0),
        child: ListView(
          shrinkWrap: true,
          children: <Widget>[POLineChart()],
        ));

    var doChart = Padding(
        padding: const EdgeInsets.all(10.0),
        child: ListView(
          shrinkWrap: true,
          children: <Widget>[DOLineChart()],
        ));

    var deliveryChart = Padding(
        padding: const EdgeInsets.all(10.0),
        child: ListView(
          shrinkWrap: true,
          children: <Widget>[DeliveryBarChart()],
        ));

    var deliveryDOChart = Padding(
        padding: const EdgeInsets.all(10.0),
        child: ListView(
          shrinkWrap: true,
          children: <Widget>[DODeliveryLineChart()],
        ));

    var deliveryDoSummary = Padding(
        padding: const EdgeInsets.all(10.0),
        child: ListView(
          shrinkWrap: true,
          children: <Widget>[DeliveryDoSummaryChart()],
        ));
    var deliverySummary = Padding(
        padding: const EdgeInsets.all(10.0),
        child: ListView(
          shrinkWrap: true,
          children: <Widget>[DeliverySummary()],
        ));
    var poBalancebyBuyerChart = Padding(
        padding: const EdgeInsets.all(10.0),
        child: ListView(
          shrinkWrap: true,
          children: <Widget>[POBalanceChart()],
        ));
    List<Widget> chartWidgets = [];

    return OfflineRedirect(
      child: FlavorBanner(
        child: Scaffold(
            appBar: AppBar(
                elevation: 0,
                backgroundColor: primaryColor,
                title: ClipRRect(
                  child: Image.asset("assets/logo.jpg", height: 40),
                  borderRadius: new BorderRadius.circular(30.0),
                ),
                actions: login
                    ? <Widget>[
                        IconButton(
                          onPressed: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => Contact()),
                            );
                          },
                          iconSize: 30,
                          icon: Icon(Icons.notifications),
                        ),
                        IconButton(
                          onPressed: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => Profile()),
                            );
                          },
                          iconSize: 30,
                          icon: Icon(Icons.tune),
                        ),
                      ]
                    : <Widget>[
                        FlatButton(                          
                          onPressed: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => SigninPage()),
                            );
                          },
                          // iconSize: 30,
                          child: Text("Sign in",style: siginButtonStyle,),
                        ),
                        IconButton(
                          onPressed: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => SigninPage()),
                            );
                          },
                          iconSize: 30,
                          icon: Icon(MaterialCommunityIcons.login),
                        )
                      ]),
            body: Container(
                decoration: BoxDecoration(
                  gradient:
                      // RadialGradient(
                      //   center: const Alignment(-0.7, 0.6), // near the top right
                      //   radius: 0.6,
                      //   colors: [
                      //     secondaryColor,
                      //     primaryColor, // yellow sun
                      //   ],
                      //   stops: [0.4, 1.0],
                      // )
                      LinearGradient(
                    begin: Alignment.topCenter,
                    end: Alignment
                        .bottomCenter, // 10% of the width, so there are ten blinds.
                    colors: [
                      Color(0xd0272262),
                      Color(0xfa272262),
                      // Color(0xa0ff4400),
                      // secondaryColor,
                    ], // whitish to gray
                  ),
                  //     SweepGradient(
                  //   center: FractionalOffset.centerLeft,
                  //   startAngle: 0.0,
                  //   endAngle: math.pi * 2,
                  //   colors: const <Color>[
                  //     secondaryColor,
                  //     primaryColor,
                  //     secondaryColor,
                  //     primaryColor,
                  //     secondaryColor,
                  //   ],
                  //   stops: const <double>[0.0, 0.25, 0.5, 0.75, 1.0],
                  // ),
                ),
                child: Column(
                  children: <Widget>[
                    Expanded(
                      child: ListView(children: [
                        Wrap(
                          alignment: WrapAlignment.center,
                          children: widgets,
                        ),
                      ]),
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[
                        _buildSmallButton(
                            "Policies", FontAwesomeIcons.fileContract),
                        _buildSmallButton("Support", SimpleLineIcons.support),
                      ],
                    )
                  ],
                )
                // child: StaggeredGridView.count(
                //   crossAxisCount: 3,
                //   crossAxisSpacing: 12.0,
                //   mainAxisSpacing: 12.0,
                //   padding: EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
                //   children: <Widget>[
                //     _buildTile(
                //       Padding(
                //         padding: const EdgeInsets.all(20.0),
                //         child: productListBox,
                //       ),
                //       onTap: () => Navigator.of(context).push(
                //           MaterialPageRoute(builder: (_) => ProductsList())),
                //     ),
                //     new GridView.count(
                //       shrinkWrap: true,
                //       scrollDirection: Axis.horizontal,
                //       crossAxisCount: 1,
                //       crossAxisSpacing: 12,
                //       mainAxisSpacing: 12,
                //       padding: EdgeInsets.only(bottom: 5, left: 10, right: 5),
                //       children: widgets,
                //     ),
                //     Container(
                //       color:Colors.red
                //     ),

                //     _buildTile(
                //       PageView(
                //         children: chartWidgets,
                //       ),
                //     ),
                //   ],
                //   staggeredTiles: [
                //     StaggeredTile.extent(5, 110.0),
                //     StaggeredTile.extent(3, 110.0),
                //     StaggeredTile.extent(3, 250.0),
                //   ],
                // ),
                )),
      ),
    );
  }

  Widget _buildTile(Widget child, {Function() onTap}) {
    return Material(
        elevation: 0,
        borderRadius: BorderRadius.circular(12.0),
        // shadowColor: Colors.transparent,
        color: Colors.transparent,
        child: InkWell(
            onTap: onTap != null
                ? () => onTap()
                : () {
                    log.info('Not set yet');
                  },
            child: child));
  }

  Widget _buildBtn(String title,
      {Image imgIcon, IconData icon, BtnCallback btnCallback}) {
    var languageModel = Provider.of<LanguageModel>(context);
    return _buildTile(
      Padding(
        padding: const EdgeInsets.all(5.0),
        child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              icon != null
                  ? Material(
                      child: Padding(
                          padding: EdgeInsets.only(top: 10),
                          child: Icon(icon, color: primaryColor, size: 35.0)))
                  : Container(
                      padding: EdgeInsets.only(top: 3),
                      child: imgIcon,
                    ),
              Padding(padding: EdgeInsets.only(bottom: 10.0)),
              Text(AppTranslations.of(context).text(title),
                  style: languageModel.isEng
                      ? TextStyle(
                          color: Colors.black,
                          fontWeight: FontWeight.w700,
                          fontSize: 12.0)
                      : TextStyle(
                          color: Colors.black,
                          fontWeight: FontWeight.w700,
                          fontSize: 12.0,
                          fontFamily: "MyanmarUnicode")),
            ]),
      ),
      onTap: btnCallback,
    );
  }

  Widget _buildBtn2(String title,
      {Image imgIcon, IconData icon, BtnCallback btnCallback}) {
    var languageModel = Provider.of<LanguageModel>(context);
    return Container(
      width: 100,
      height: 100,
      decoration: new BoxDecoration(
          color: Colors.transparent, //new Color.fromRGBO(255, 0, 0, 0.0),
          borderRadius: new BorderRadius.only(
              topLeft: const Radius.circular(40.0),
              topRight: const Radius.circular(40.0))),
      // color: Colors.transparent,
      child: Padding(
        padding: const EdgeInsets.all(5.0),
        child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              // Padding(
              //     padding: EdgeInsets.only(top: 10),
              //     child: Icon(icon, color: Colors.white, size: 35.0)),
              // Padding(padding: EdgeInsets.only(bottom: 10.0)),
              ClipOval(
                child: Material(
                  color: Colors.black54, // button color
                  child: InkWell(
                    splashColor: primaryColor, // inkwell color
                    child: SizedBox(
                        width: 60,
                        height: 60,
                        child: Icon(icon, color: Colors.white, size: 30)),
                    onTap: btnCallback,
                  ),
                ),
              ),

              FittedBox(
                fit: BoxFit.fitWidth,
                child: Text(AppTranslations.of(context).text(title),
                    style: languageModel.isEng
                        ? TextStyle(
                            color: Colors.white,
                            fontWeight: FontWeight.w500,
                            fontSize: 14.0,
                            fontFamily: "Roboto")
                        : TextStyle(
                            color: Colors.white,
                            fontWeight: FontWeight.w700,
                            fontSize: 12.0,
                            fontFamily: "MyanmarUnicode")),
              ),
            ]),
      ),
    );
  }

  Widget _buildSmallButton(String text, IconData iconData) {
    return InkWell(
      onTap: () => {},
      child: Padding(
        padding: const EdgeInsets.all(18.0),
        child: Row(
          children: <Widget>[
            IconButton(
                icon: Icon(iconData, color: Colors.white70),
                color: Colors.white70,
                onPressed: null),
            // RaisedButton(onPressed: ()=>{},child: Row(
            //   children: <Widget>[
            //     IconButton(
            //     icon: Icon(iconData, ),
            //     onPressed: null),
            //     Text(text),
            //   ],
            // ),color: Colors.transparent,
            // focusColor: Colors.transparent,),
            Text(
              text,
              style: subMenuStyle,
            )
          ],
        ),
      ),
    );
  }
}