import 'dart:async';
import 'dart:io';

import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:flutter_countdown_timer/flutter_countdown_timer.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:mohem_flutter_app/app_state/app_state.dart';
import 'package:mohem_flutter_app/classes/colors.dart';
import 'package:mohem_flutter_app/classes/utils.dart';
import 'package:mohem_flutter_app/config/routes.dart';
import 'package:mohem_flutter_app/extensions/int_extensions.dart';
import 'package:mohem_flutter_app/extensions/string_extensions.dart';
import 'package:mohem_flutter_app/extensions/widget_extensions.dart';
import 'package:mohem_flutter_app/generated/locale_keys.g.dart';
import 'package:mohem_flutter_app/models/offers_and_discounts/get_offers_list.dart';
import 'package:mohem_flutter_app/provider/dashboard_provider_model.dart';
import 'package:mohem_flutter_app/ui/landing/widget/app_drawer.dart';
import 'package:mohem_flutter_app/ui/landing/widget/menus_widget.dart';
import 'package:mohem_flutter_app/ui/landing/widget/services_widget.dart';
import 'package:mohem_flutter_app/ui/marathon/widgets/marathon_banner.dart';
import 'package:mohem_flutter_app/widgets/bottom_sheet.dart';
import 'package:mohem_flutter_app/widgets/mark_attendance_widget.dart';
import 'package:mohem_flutter_app/widgets/shimmer/dashboard_shimmer_widget.dart';
import 'package:mohem_flutter_app/widgets/shimmer/offers_shimmer_widget.dart';
import 'package:provider/provider.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';

class DashboardScreen extends StatefulWidget {
  DashboardScreen({Key? key}) : super(key: key);

  @override
  _DashboardScreenState createState() {
    return _DashboardScreenState();
  }
}

class _DashboardScreenState extends State<DashboardScreen> {
  late DashboardProviderModel data;
  final GlobalKey<ScaffoldState> _scaffoldState = GlobalKey();

  final RefreshController _refreshController = RefreshController(initialRefresh: false);

  int currentIndex = 0;

  @override
  void initState() {
    super.initState();
    scheduleMicrotask(() {
      data = Provider.of<DashboardProviderModel>(context, listen: false);
      _onRefresh();
    });
  }

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

  void _onRefresh() async {
    data.initProvider();
    // data.getITGNotification().then((value) {
    //   print("--------------------detail_1-----------------");
    //   print(value!.result!.data!.notificationMasterId);
    //   print(value.result!.data!.notificationTitle);
    // });
    data.fetchListMenu();
    data.fetchAttendanceTracking(context);
    data.fetchWorkListCounter(context);
    data.fetchMissingSwipe(context);
    data.fetchLeaveTicketBalance(context, DateTime.now());
    data.fetchMenuEntries();
    data.getCategoryOffersListAPI(context);
    data.fetchChatCounts();
    _refreshController.refreshCompleted();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldState,
      // appBar: AppBar(
      //   actions: [
      //     IconButton(
      //         onPressed: () {
      //           data.getITGNotification().then((value) {
      //             print("--------------------detail_1-----------------");
      //             if (value!.result!.data != null) {
      //               print(value.result!.data!.notificationMasterId);
      //               print(value.result!.data!.notificationType);
      //               if (value.result!.data!.notificationType == "Survey") {
      //                 Navigator.pushNamed(context, AppRoutes.survey, arguments: value.result!.data);
      //               } else {
      //                 DashboardApiClient().getAdvertisementDetail(value.result!.data!.notificationMasterId ?? "").then(
      //                   (value) {
      //                     if (value!.mohemmItgResponseItem!.statusCode == 200) {
      //                       if (value.mohemmItgResponseItem!.result!.data != null) {
      //                         String? image64 = value.mohemmItgResponseItem!.result!.data!.advertisement!.viewAttachFileColl!.first.base64String;
      //                         print(image64);
      //                         var sp = image64!.split("base64,");
      //                         Navigator.push(
      //                           context,
      //                           MaterialPageRoute(
      //                             builder: (context) => MovieTheaterBody(
      //                               encodedBytes: sp[1],
      //                             ),
      //                           ),
      //                         );
      //                       }
      //                     }
      //                   },
      //                 );
      //               }
      //             }
      //           });
      //         },
      //         icon: Icon(Icons.add))
      //   ],
      // ),
      body: Column(
        children: [
          Row(
            children: [
              Builder(builder: (BuildContext context) {
                return Row(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    Image.memory(
                      Utils.dataFromBase64String(
                        AppState().memberInformationList!.eMPLOYEEIMAGE ?? "",
                      ),
                      errorBuilder: (BuildContext context, Object error, StackTrace? stackTrace) {
                        return SvgPicture.asset(
                          "assets/images/user.svg",
                          height: 34,
                          width: 34,
                        );
                      },
                      width: 34,
                      height: 34,
                      fit: BoxFit.cover,
                    ).circle(50),
                    // CircularAvatar(
                    //   width: 34,
                    //   height: 34,
                    //   url: "https://cdn4.iconfinder.com/data/icons/professions-2-2/151/89-512.png",
                    // ),
                    8.width,
                    SvgPicture.asset("assets/images/side_nav.svg"),
                  ],
                ).onPress(() {
                  _scaffoldState.currentState!.openDrawer();
                });
              }),
              Image.asset("assets/images/logos/main_mohemm_logo.png", width: 134, height: 28).expanded,
              SvgPicture.asset(
                "assets/images/announcements.svg",
                matchTextDirection: true,
              ).onPress(() async {
                await Navigator.pushNamed(context, AppRoutes.announcements);
              })
            ],
          ).paddingOnly(left: 21, right: 21, top: 48, bottom: 7),
          Expanded(
            child: SmartRefresher(
              enablePullDown: true,
              enablePullUp: false,
              header: const MaterialClassicHeader(
                color: MyColors.gradiantEndColor,
              ),
              controller: _refreshController,
              onRefresh: _onRefresh,
              child: SingleChildScrollView(
                child: Column(
                  children: [
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        LocaleKeys.goodMorning.tr().toText14(color: MyColors.grey77Color),
                        (AppState().memberInformationList!.eMPLOYEENAME ?? "").toText24(isBold: true),
                        16.height,
                        Row(
                          children: [
                            Expanded(
                              child: AspectRatio(
                                aspectRatio: 159 / 159,
                                child: Consumer<DashboardProviderModel>(
                                  builder: (BuildContext context, DashboardProviderModel model, Widget? child) {
                                    return (model.isAttendanceTrackingLoading
                                            ? GetAttendanceTrackingShimmer()
                                            : Container(
                                                decoration: BoxDecoration(
                                                  borderRadius: BorderRadius.circular(15),
                                                  gradient: const LinearGradient(transform: GradientRotation(.46), begin: Alignment.topRight, end: Alignment.bottomLeft, colors: [
                                                    MyColors.gradiantEndColor,
                                                    MyColors.gradiantStartColor,
                                                  ]),
                                                ),
                                                child: Stack(
                                                  alignment: Alignment.center,
                                                  children: [
                                                    if (model.isTimeRemainingInSeconds == 0) SvgPicture.asset("assets/images/thumb.svg"),
                                                    Column(
                                                      crossAxisAlignment: CrossAxisAlignment.start,
                                                      children: [
                                                        Expanded(
                                                          child: Column(
                                                            mainAxisSize: MainAxisSize.min,
                                                            crossAxisAlignment: CrossAxisAlignment.start,
                                                            children: [
                                                              LocaleKeys.markAttendance.tr().toText14(color: Colors.white, isBold: true),
                                                              if (model.isTimeRemainingInSeconds == 0) DateTime.now().toString().split(" ")[0].toText12(color: Colors.white),
                                                              if (model.isTimeRemainingInSeconds != 0)
                                                                Column(
                                                                  mainAxisSize: MainAxisSize.min,
                                                                  crossAxisAlignment: CrossAxisAlignment.start,
                                                                  children: [
                                                                    9.height,
                                                                    CountdownTimer(
                                                                      endTime: model.endTime,
                                                                      onEnd: null,
                                                                      endWidget: "00:00:00".toText14(color: Colors.white, isBold: true),
                                                                      textStyle: const TextStyle(color: Colors.white, fontSize: 14, letterSpacing: -0.48, fontWeight: FontWeight.bold),
                                                                    ),
                                                                    LocaleKeys.timeLeftToday.tr().toText12(color: Colors.white),
                                                                    9.height,
                                                                    ClipRRect(
                                                                      borderRadius: const BorderRadius.all(Radius.circular(20)),
                                                                      child: LinearProgressIndicator(
                                                                        value: model.progress,
                                                                        minHeight: 8,
                                                                        valueColor: const AlwaysStoppedAnimation<Color>(Colors.white),
                                                                        backgroundColor: const Color(0xff196D73),
                                                                      ),
                                                                    ),
                                                                  ],
                                                                ),
                                                            ],
                                                          ).paddingOnly(top: 12, right: 15, left: 12),
                                                        ),
                                                        Row(
                                                          children: [
                                                            Expanded(
                                                              child: Column(
                                                                mainAxisSize: MainAxisSize.min,
                                                                crossAxisAlignment: CrossAxisAlignment.start,
                                                                children: [
                                                                  LocaleKeys.checkIn.tr().toText12(color: Colors.white),
                                                                  (model.attendanceTracking!.pSwipeIn == null ? "--:--" : model.attendanceTracking!.pSwipeIn)
                                                                      .toString()
                                                                      .toText14(color: Colors.white, isBold: true),
                                                                  4.height,
                                                                ],
                                                              ).paddingOnly(left: 12, right: 12),
                                                            ),
                                                            Container(
                                                              margin: EdgeInsets.only(top: AppState().isArabic(context) ? 6 : 0),
                                                              width: 45,
                                                              height: 45,
                                                              padding: const EdgeInsets.only(left: 14, right: 14),
                                                              decoration: BoxDecoration(
                                                                color: Color(0xff259EA4),
                                                                borderRadius: BorderRadius.only(
                                                                  bottomRight: AppState().isArabic(context) ? Radius.circular(0) : Radius.circular(15),
                                                                  bottomLeft: AppState().isArabic(context) ? Radius.circular(15) : Radius.circular(0),
                                                                ),
                                                              ),
                                                              child: SvgPicture.asset(model.isTimeRemainingInSeconds == 0 ? "assets/images/attendance.svg" : "assets/images/attendance.svg"),
                                                            ).onPress(() {
                                                              showMyBottomSheet(
                                                                context,
                                                                callBackFunc: () {},
                                                                child: MarkAttendanceWidget(model, isFromDashboard: true),
                                                              );
                                                            }),
                                                          ],
                                                        ),
                                                      ],
                                                    ),
                                                  ],
                                                ),
                                              ).onPress(
                                                () {
                                                  Navigator.pushNamed(context, AppRoutes.todayAttendance);
                                                },
                                              ))
                                        .animatedSwither();
                                  },
                                ),
                              ),
                            ),
                            9.width,
                            Expanded(
                              child: MenusWidget(),
                            ),
                          ],
                        ),
                      ],
                    ).paddingOnly(left: 21, right: 21, top: 7),
                    MarathonBanner().paddingAll(20),
                    ServicesWidget(),
                    // 8.height,
                    Container(
                      width: double.infinity,
                      padding: const EdgeInsets.only(top: 31),
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: const BorderRadius.only(topRight: Radius.circular(50), topLeft: Radius.circular(50)),
                        border: Border.all(color: MyColors.lightGreyEDColor, width: 1),
                      ),
                      child: Column(
                        mainAxisSize: MainAxisSize.min,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Row(
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: [
                              Expanded(
                                child: Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  mainAxisSize: MainAxisSize.min,
                                  children: [
                                    LocaleKeys.offers.tr().toText12(),
                                    Row(
                                      children: [
                                        LocaleKeys.discounts.tr().toText24(isBold: true),
                                        6.width,
                                        Container(
                                            padding: const EdgeInsets.only(left: 8, right: 8),
                                            decoration: BoxDecoration(
                                              color: MyColors.yellowColor,
                                              borderRadius: BorderRadius.circular(10),
                                            ),
                                            child: LocaleKeys.newString.tr().toText10(isBold: true)),
                                      ],
                                    ),
                                  ],
                                ),
                              ),
                              LocaleKeys.viewAllOffers.tr().toText12(isUnderLine: true).onPress(() {
                                Navigator.pushNamed(context, AppRoutes.offersAndDiscounts);
                              })
                            ],
                          ).paddingOnly(left: 21, right: 21),
                          Consumer<DashboardProviderModel>(
                            builder: (context, model, child) {
                              return SizedBox(
                                height: 103 + 33,
                                child: ListView.separated(
                                    shrinkWrap: true,
                                    physics: const BouncingScrollPhysics(),
                                    padding: const EdgeInsets.only(left: 21, right: 21, top: 13),
                                    scrollDirection: Axis.horizontal,
                                    itemBuilder: (BuildContext cxt, int index) {
                                      return model.isOffersLoading
                                          ? const OffersShimmerWidget()
                                          : InkWell(
                                              onTap: () {
                                                navigateToDetails(data.getOffersList[index]);
                                              },
                                              child: SizedBox(
                                                width: 73,
                                                child: Column(
                                                  crossAxisAlignment: CrossAxisAlignment.center,
                                                  children: [
                                                    Container(
                                                      width: 73,
                                                      height: 73,
                                                      decoration: BoxDecoration(
                                                        borderRadius: const BorderRadius.all(
                                                          Radius.circular(100),
                                                        ),
                                                        border: Border.all(color: MyColors.lightGreyE3Color, width: 1),
                                                      ),
                                                      child: ClipRRect(
                                                        borderRadius: const BorderRadius.all(
                                                          Radius.circular(50),
                                                        ),
                                                        child: Hero(
                                                          tag: "ItemImage" + data.getOffersList[index].rowID!,
                                                          transitionOnUserGestures: true,
                                                          child: Image.network(
                                                            data.getOffersList[index].bannerImage!,
                                                            fit: BoxFit.contain,
                                                          ),
                                                        ),
                                                      ),
                                                    ),
                                                    4.height,
                                                    Expanded(
                                                      child: AppState().isArabic(context)
                                                          ? data.getOffersList[index].titleAR!.toText12(isCenter: true, maxLine: 1)
                                                          : data.getOffersList[index].title!.toText12(isCenter: true, maxLine: 1),
                                                    ),
                                                  ],
                                                ),
                                              ),
                                            );
                                    },
                                    separatorBuilder: (BuildContext cxt, int index) => 8.width,
                                    itemCount: 6),
                              );
                            },
                          ),
                        ],
                      ),
                    )
                  ],
                ),
              ),
            ),
          )
        ],
      ),
      drawer: SafeArea(
        child: AppDrawer(onLanguageChange: _onRefresh),
      ),
      bottomNavigationBar: SizedBox(
        height: Platform.isAndroid ? 70 : 100,
        child: BottomNavigationBar(
          items: <BottomNavigationBarItem>[
            BottomNavigationBarItem(
              icon: SvgPicture.asset(
                "assets/icons/home.svg",
                color: currentIndex == 0 ? MyColors.grey3AColor : MyColors.grey98Color,
              ).paddingAll(4),
              label: LocaleKeys.home.tr(),
            ),
            BottomNavigationBarItem(
              icon: SvgPicture.asset(
                "assets/icons/create_req.svg",
                color: currentIndex == 1 ? MyColors.grey3AColor : MyColors.grey98Color,
              ).paddingAll(4),
              label: LocaleKeys.createRequest.tr(),
            ),
            BottomNavigationBarItem(
              icon: Stack(
                alignment: Alignment.centerLeft,
                children: [
                  SvgPicture.asset(
                    "assets/icons/work_list.svg",
                    color: currentIndex == 2 ? MyColors.grey3AColor : MyColors.grey98Color,
                  ).paddingAll(4),
                  Consumer<DashboardProviderModel>(
                    builder: (BuildContext cxt, DashboardProviderModel data, Widget? child) {
                      if (data.workListCounter == 0) {
                        return const SizedBox();
                      }
                      return Positioned(
                        right: 0,
                        top: 0,
                        child: Container(
                          padding: const EdgeInsets.only(left: 4, right: 4),
                          alignment: Alignment.center,
                          decoration: BoxDecoration(color: MyColors.redColor, borderRadius: BorderRadius.circular(17)),
                          child: data.workListCounter.toString().toText10(color: Colors.white),
                        ),
                      );
                    },
                  ),
                ],
              ),
              label: LocaleKeys.workList.tr(),
            ),
            BottomNavigationBarItem(
              icon: SvgPicture.asset(
                "assets/icons/item_for_sale.svg",
                color: currentIndex == 3 ? MyColors.grey3AColor : MyColors.grey98Color,
              ).paddingAll(4),
              label: LocaleKeys.itemsForSale.tr(),
            ),
            BottomNavigationBarItem(
              icon: Stack(
                alignment: Alignment.centerLeft,
                children: [
                  SvgPicture.asset(
                    "assets/icons/chat/chat.svg",
                    color: currentIndex == 4 ? MyColors.grey3AColor : MyColors.grey98Color,
                  ).paddingAll(4),
                  Consumer<DashboardProviderModel>(
                    builder: (BuildContext cxt, DashboardProviderModel data, Widget? child) {
                      if (data.chatUConvCounter == 0) {
                        return const SizedBox();
                      }
                      return Positioned(
                        right: 0,
                        top: 0,
                        child: Container(
                          padding: const EdgeInsets.only(left: 4, right: 4),
                          alignment: Alignment.center,
                          decoration: BoxDecoration(color: MyColors.redColor, borderRadius: BorderRadius.circular(17)),
                          child: data.chatUConvCounter.toString().toText10(color: Colors.white),
                        ),
                      );
                    },
                  ),
                ],
              ),
              label: LocaleKeys.chat.tr(),
            ),
          ],
          currentIndex: currentIndex,
          selectedLabelStyle: const TextStyle(fontSize: 10, color: MyColors.grey3AColor, fontWeight: FontWeight.w600),
          unselectedLabelStyle: const TextStyle(fontSize: 10, color: MyColors.grey98Color, fontWeight: FontWeight.w600),
          type: BottomNavigationBarType.fixed,
          selectedItemColor: MyColors.grey3AColor,
          backgroundColor: MyColors.backgroundColor,
          selectedIconTheme: const IconThemeData(color: MyColors.grey3AColor, size: 28),
          unselectedIconTheme: const IconThemeData(color: MyColors.grey98Color, size: 28),
          onTap: (int index) {
            if (index == 1) {
              Navigator.pushNamed(context, AppRoutes.mowadhafhi);
            } else if (index == 2) {
              Navigator.pushNamed(context, AppRoutes.workList);
            } else if (index == 3) {
              Navigator.pushNamed(context, AppRoutes.itemsForSale);
            } else if (index == 4) {
              Navigator.pushNamed(context, AppRoutes.chat);
            }
          },
        ),
      ),
    );
  }

  void navigateToDetails(OffersListModel offersListModelObj) {
    List<OffersListModel> getOffersDetailList = [];
    getOffersDetailList.clear();
    int counter = 1;

    getOffersDetailList.add(offersListModelObj);

    data.getOffersList.forEach((OffersListModel element) {
      if (counter <= 4) {
        if (element.rowID != offersListModelObj.rowID) {
          getOffersDetailList.add(element);
          counter++;
        }
      }
    });

    Navigator.pushNamed(context, AppRoutes.offersAndDiscountsDetails, arguments: getOffersDetailList);
  }
}
