import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:healthcare_user/settings.dart';
import 'package:image_picker/image_picker.dart';
import 'dart:io';
import 'dart:ui' as ui;

import 'login.dart';

class Dashboard extends StatefulWidget {
  const Dashboard({super.key});

  @override
  State<Dashboard> createState() => _DashboardState();
}

class _DashboardState extends State<Dashboard> {
  int _selectedIndex = 0;

  TextEditingController tankNameController = TextEditingController();
  TextEditingController blockNameController = TextEditingController();
  TextEditingController capacityController = TextEditingController();
  String dropdownTypeOfWater = 'General';
  String dropdownTankLocation = 'Sump';
  var typeOfWaterItems = [
    'General',
    'Bore',
    'Tanker',
  ];
  var typeOfTankLocationItems = [
    'Sump',
    'Overhead',
  ];

  bool isT1Checked = false;
  bool isT2Checked = false;
  bool isT3Checked = false;
  bool isS2T1Checked = false;
  bool isS2T2Checked = false;
  bool isS2T3Checked = false;
  bool isS3T1Checked = false;
  bool isS3T2Checked = false;
  bool isS3T3Checked = false;
  static const TextStyle optionStyle =
      TextStyle(fontSize: 30, fontWeight: FontWeight.bold);

  final ImagePicker _picker = ImagePicker();
  bool isTablet = false;
  bool isPhone = true;

  final double devicePixelRatio = ui.window.devicePixelRatio;
  static final ui.Size size1 = ui.window.physicalSize;
  final double width = size1.width;
  final double height = size1.height;

  devicedetection() {
    if (devicePixelRatio < 2 && (width >= 1000 || height >= 1000)) {
      isTablet = true;
      isPhone = false;
    } else if (devicePixelRatio == 2 && (width >= 1920 || height >= 1920)) {
      isTablet = true;
      isPhone = false;
    } else {
      isTablet = false;
      isPhone = true;
    }
  }


  Widget _dashBoard() {
    return Container(
      color: screenBackgroundColor,
      child: Column(
        children: <Widget>[
          Container(
              height: MediaQuery.of(context).size.height * .250,
              width: double.infinity,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(0),
              ),
              //color: Colors.red,
              child: FittedBox(
                child: Image(
                  image: isTablet
                      ? AssetImage('images/appbg.png')
                      : AssetImage('images/mobilebg.png'),
                ),
                fit: BoxFit.fill,
              )),
          SizedBox(height: 5),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Expanded(
                  child: GestureDetector(
                onTap: () {
                  /*Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => TankLevelsNew()),
                  );*/
                },
                child: Container(
                  padding: EdgeInsets.all(05),
                  margin:
                      EdgeInsets.only(left: 15, top: 10, right: 0, bottom: 0),
                  //height: MediaQuery.of(context).size.height * .05,
                  //width: MediaQuery.of(context).size.width * .45,
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(12),
                  ),
                  // Change button text when light changes state.

                  child: Column(
                    children: [
                      Container(
                          padding: EdgeInsets.fromLTRB(35, 10, 0, 0),
                          child: new SvgPicture.asset(
                              "assets/images/tanklevels.svg")),
                      Text(
                        'Tank Levels',
                        style: dashboardTextStyle(),
                      ),
                    ],
                  ),
                ),
              )),
            ],
          ),
        ],
      ),
    );
  }

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

  showLogoutAlertDialog(context) {
    return showDialog(
        context: context,
        barrierDismissible: false,
        builder: (BuildContext context) {
          return StatefulBuilder(
              builder: (BuildContext context, StateSetter setState) {
            return AlertDialog(
                title: const Text('Do you really want to logout?'),
                actions: <Widget>[
                  TextButton(
                    child: Text('No', style: textButtonStyle()),
                    onPressed: () {
                      Navigator.of(context).pop();
                    },
                  ),
                  TextButton(
                    child: Text('Yes', style: textButtonStyle()),
                    onPressed: () async {
                      await AppSettings.clearSharedPreferences();
                      await Navigator.pushAndRemoveUntil(
                        context,
                        MaterialPageRoute(builder: (context) => Login()),
                        (Route<dynamic> route) => false,
                      );
                    },
                  ),
                ]);
          });
        });
  }

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () async {
        if (_selectedIndex == 0) {
          final shouldPop = await showDialog<bool>(
            context: context,
            builder: (context) {
              return AlertDialog(
                title: const Text('Do you want to exit app?',
                    style: TextStyle(
                      color: primaryColor,
                      fontSize: 20,
                    )),
                actionsAlignment: MainAxisAlignment.spaceBetween,
                actions: [
                  TextButton(
                    onPressed: () {
                      SystemNavigator.pop();
                    },
                    child: const Text('Yes',
                        style: TextStyle(
                          color: primaryColor,
                          fontSize: 20,
                        )),
                  ),
                  TextButton(
                    onPressed: () {
                      Navigator.of(context).pop(false);
                    },
                    child: const Text('No',
                        style: TextStyle(
                          color: primaryColor,
                          fontSize: 20,
                        )),
                  ),
                ],
              );
            },
          );
          return shouldPop!;
        } else {
          setState(() {
            _selectedIndex = 0;
          });
          return false;
        }
      },
      child: Scaffold(
        resizeToAvoidBottomInset: false,
        appBar: AppSettings.appBar('Arminta Water Management'),
        drawer: Drawer(
          // Add a ListView to the drawer. This ensures the user can scroll
          // through the options in the drawer if there isn't enough vertical
          // space to fit everything.
          //backgroundColor: screenBackgroundColor,
          child: ListView(
            // Important: Remove any padding from the ListView.
            padding: EdgeInsets.zero,
            children: [
              DrawerHeader(
                  decoration: const BoxDecoration(
                    color: primaryColor,
                  ),
                  child: Row(
                    children: [
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Expanded(
                            child: GestureDetector(
                              child: Container(
                                width: MediaQuery.of(context).size.width * .20,
                                height:
                                    MediaQuery.of(context).size.height * .15,
                                decoration: BoxDecoration(
                                    shape: BoxShape.circle,
                                    image: DecorationImage(
                                        image: (AppSettings.updatedImage !=
                                                null)
                                            ? FileImage(
                                                    AppSettings.updatedImage!)
                                                as ImageProvider
                                            : AssetImage(
                                                "images/profile_pic.png"), // picked file
                                        fit: BoxFit.cover)),
                              ),
                              onTap: () {
                                /*showModalBottomSheet<void>(
                                    context: context,
                                    builder: (BuildContext context) {
                                      return SizedBox(
                                        height: 200,
                                        child: Center(
                                          child: Row(
                                            mainAxisAlignment:
                                                MainAxisAlignment.center,
                                            children: <Widget>[
                                              GestureDetector(
                                                child: Icon(
                                                  Icons.camera_alt_outlined,
                                                  size: 100,
                                                  color: greyColor,
                                                ),
                                                onTap: () async {
                                                  await takeImageFromCamera();
                                                  Navigator.pop(context);
                                                },
                                              ),
                                              SizedBox(
                                                width: MediaQuery.of(context)
                                                        .size
                                                        .width *
                                                    .20,
                                              ),
                                              GestureDetector(
                                                child: Icon(
                                                  Icons.photo,
                                                  size: 100,
                                                  color: greyColor,
                                                ),
                                                onTap: () async {
                                                  await pickImageFromGallery();
                                                  Navigator.pop(context);
                                                },
                                              ),
                                            ],
                                          ),
                                        ),
                                      );
                                    });*/
                              },
                            ),
                          ),
                          Text(
                            AppSettings.userName,
                            style: TextStyle(color: Colors.white, fontSize: 15),
                          ),
                          Text(
                            AppSettings.phoneNumber,
                            style: TextStyle(color: Colors.white, fontSize: 15),
                          ),
                          Text(
                            AppSettings.email,
                            style: TextStyle(color: Colors.white, fontSize: 15),
                          ),
                        ],
                      ),
                      Container()
                    ],
                  )),

              ListTile(
                title: Row(
                  children: const [
                    Image(
                        image: const AssetImage('images/editprofileblue.png'),
                        height: 25,
                        width: 25,
                        fit: BoxFit.fill),
                    const SizedBox(
                      width: 10,
                    ),
                    const SizedBox(
                      width: 10,
                    ),
                    Text('Edit Profile', style: TextStyle(color: primaryColor)),
                  ],
                ),
                onTap: () {
                 /* Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => UpdateProfile()),
                  );*/
                },
              ),
              Divider(
                color: Colors.grey,
              ),
              // Add Tanks
              ListTile(
                title: Row(
                  children: const [
                    Image(
                        image: const AssetImage('images/addtankerblue.png'),
                        height: 25,
                        width: 25,
                        fit: BoxFit.fill),
                    const SizedBox(
                      width: 10,
                    ),
                    Text('Add Tanks', style: TextStyle(color: primaryColor)),
                  ],
                ),
                onTap: () {
                  /*Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => AddTanks()),
                  );*/
                },
              ),
              Divider(
                color: Colors.grey,
              ),
              ListTile(
                title: Row(
                  children: const [
                    Image(
                        image: const AssetImage('images/tankviewblue.png'),
                        height: 25,
                        width: 25,
                        fit: BoxFit.fill),
                    const SizedBox(
                      width: 10,
                    ),
                    Text('Tanks View', style: TextStyle(color: primaryColor)),
                  ],
                ),
                onTap: () {
                  /*Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => TanksView()),
                  );*/
                },
              ),
              Divider(
                color: Colors.grey,
              ),
              //Add Tanker
              ListTile(
                title: Row(
                  children: const [
                    Image(
                        image: const AssetImage('images/suppliersblue.png'),
                        height: 25,
                        width: 25,
                        fit: BoxFit.fill),
                    const SizedBox(
                      width: 10,
                    ),
                    Text('Add Water Suppliers',
                        style: TextStyle(color: primaryColor)),
                  ],
                ),
                onTap: () {
                 /* Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => Suppliers()),
                  );*/
                },
              ),
              Divider(
                color: Colors.grey,
              ),
              ListTile(
                title: Row(
                  children: const [
                    Image(
                        image: const AssetImage('images/connectionsblue.png'),
                        height: 25,
                        width: 25,
                        fit: BoxFit.fill),
                    const SizedBox(
                      width: 10,
                    ),
                    Text('Connections', style: TextStyle(color: primaryColor)),
                  ],
                ),
                onTap: () {
                 /* Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => ConnectionsView()),
                  );*/
                },
              ),
              Divider(
                color: Colors.grey,
              ),
              ListTile(
                title: Row(
                  children: const [
                    Image(
                        image: const AssetImage('images/resourceblue.png'),
                        height: 25,
                        width: 25,
                        fit: BoxFit.fill),
                    const SizedBox(
                      width: 10,
                    ),
                    Text('Resources', style: TextStyle(color: primaryColor)),
                  ],
                ),
                onTap: () {
                  /*Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => Resources()),
                  );*/
                },
              ),
              Divider(
                color: Colors.grey,
              ),
              ListTile(
                title: Row(
                  children: const [
                    Image(
                        image: const AssetImage('images/customercareblue.png'),
                        height: 25,
                        width: 25,
                        fit: BoxFit.fill),
                    const SizedBox(
                      width: 10,
                    ),
                    Text('Accounts', style: TextStyle(color: primaryColor)),
                  ],
                ),
                onTap: () {
                  /*Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => UserAccounts()),
                  );*/
                },
              ),
              Divider(
                color: Colors.grey,
              ),
              ListTile(
                title: Row(
                  children: const [
                    Image(
                        image: const AssetImage('images/customercareblue.png'),
                        height: 25,
                        width: 25,
                        fit: BoxFit.fill),
                    const SizedBox(
                      width: 10,
                    ),
                    Text('Customer Support',
                        style: TextStyle(color: primaryColor)),
                  ],
                ),
                onTap: () {},
              ),
              Divider(
                color: Colors.grey,
              ),
              ListTile(
                title: Row(
                  children: const [
                    Image(
                        image: const AssetImage('images/logoutblue.png'),
                        height: 25,
                        width: 25,
                        fit: BoxFit.fill),
                    const SizedBox(
                      width: 10,
                    ),
                    Text('Logout', style: TextStyle(color: primaryColor)),
                  ],
                ),
                onTap: () async {
                  showLogoutAlertDialog(context);
                },
              ),
            ],
          ),
        ),
        body: _dashBoard(),
        /*body: IndexedStack(
          index: _selectedIndex,
          children: screens,
        ),*/
        /* bottomNavigationBar: Container(
          //height: MediaQuery.of(context).size.height,
          child: BottomNavigationBar(
            items: const <BottomNavigationBarItem>[
              BottomNavigationBarItem(
                icon: Icon(
                  Icons.home,
                ),
                label: 'Home',
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.propane_tank),
                label: 'Add Tanks',
              ),
              */ /*BottomNavigationBarItem(
                icon: Icon(Icons.private_connectivity_outlined),
                label: 'CreateConnections',
              ),*/ /*
              BottomNavigationBarItem(
                icon: Icon(Icons.list_alt),
                label: 'Add Tanker',
              ),
            ],
            currentIndex: _selectedIndex,
            selectedItemColor: primaryColor,
            unselectedItemColor: greyColor,
            showUnselectedLabels: true,
            onTap: _onItemTapped,
          ),
        ),*/
      ),
    );
  }
}