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 '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/quota.dart';
import 'package:fcs/charts/revenue_line.dart';
import 'package:fcs/model/language_model.dart';
import 'package:fcs/model/main_model.dart';
import 'package:fcs/model/notification_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/my_registeration_info.dart';
import 'package:fcs/pages/notification_list.dart';
import 'package:fcs/pages/term.dart';
import 'package:fcs/pages/test_list.dart';
import 'package:fcs/pages/util.dart';
import 'package:fcs/reports/report_list.dart';
import 'package:fcs/vo/user.dart';
import 'package:fcs/widget/badge.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:fcs/vo/notification.dart' as Noti;

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 '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');

  @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) {
    final helpBtn = _buildBtn("manual.title",
        imgIcon: Image.asset(
          "assets/manual.png",
          width: 40,
          height: 40,
          color: primaryColor,
        ),
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => ManualPage()))
        // btnCallback: () => Navigator.of(context)
        //     .push(MaterialPageRoute(builder: (_) => TestList()))
        );
    final announcementBtn = _buildBtn("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 = _buildBtn("report.title",
        imgIcon: Image.asset(
          "assets/report.png",
          width: 50,
          height: 50,
          // color: primaryColor,
        ),
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => ReportList())));

    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 = _buildBtn("shipment.title",
        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 = _buildBtn("term.title",
        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 signinBtn = _buildBtn("login",
        icon: FontAwesomeIcons.signInAlt,
        btnCallback: () => Navigator.of(context)
            .push(MaterialPageRoute(builder: (_) => SigninPage())));

    final buyingBtn =
        _buildBtn("buy_online", icon: Icons.person, btnCallback: () {
      Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => BuyingOnlinePage()),
      );
    });

    final notiBtn = _buildBtn("notifications.title", icon: Icons.notifications,
        btnCallback: () {
      Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => NotificationList()),
      );
    });

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

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

    List<Widget> widgets = [helpBtn];
    widgets.add(signinBtn);
    widgets.add(buyingBtn);
    widgets.add(shipmentBtn);
    widgets.add(notiBtn);
    widgets.add(staffBtn);
    // 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(
                backgroundColor: primaryColor,
                title: ClipRRect(
                  child: Image.asset("assets/logo.png", height: 40),
                  borderRadius: new BorderRadius.circular(15.0),
                ),
                actions: <Widget>[
                  IconButton(
                    onPressed: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(builder: (context) => Contact()),
                      );
                    },
                    iconSize: 30,
                    icon: Icon(Icons.phone),
                  ),
                  IconButton(
                    onPressed: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(builder: (context) => Profile()),
                      );
                    },
                    iconSize: 30,
                    icon: Icon(Icons.account_circle),
                  ),
                ]),
            body: 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,
                ),
                _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: 30.0,
        borderRadius: BorderRadius.circular(12.0),
        shadowColor: Color(0x802196F3),
        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,
    );
  }

  _showNotifications() async {
    if (!super.mounted) return;
    await Navigator.push(
      context,
      MaterialPageRoute(builder: (context) => NotificationList()),
    );
    // Provider.of<NotificationModel>(context, listen: false).seen();
  }
}