import 'package:easy_localization/src/public_ext.dart'; import 'package:flutter/cupertino.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/api/dashboard_api_client.dart'; import 'package:mohem_flutter_app/classes/colors.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/dashboard/get_attendance_tracking_list_model.dart'; import 'package:mohem_flutter_app/provider/dashboard_provider_model.dart'; import 'package:mohem_flutter_app/theme/colors.dart'; import 'package:mohem_flutter_app/widgets/circular_avatar.dart'; import 'package:mohem_flutter_app/widgets/shimmer/dashboard_shimmer_widget.dart'; import 'package:provider/provider.dart'; import 'package:shimmer/shimmer.dart'; class DashboardScreen extends StatefulWidget { DashboardScreen({Key? key}) : super(key: key); @override _DashboardScreenState createState() { return _DashboardScreenState(); } } class _DashboardScreenState extends State { @override void initState() { super.initState(); final data = Provider.of(context, listen: false); data.fetchAttendanceTracking(); } int endTime = 0; @override void dispose() { super.dispose(); } @override Widget build(BuildContext context) { List names = [LocaleKeys.workList.tr(), LocaleKeys.missingSwipes.tr(), LocaleKeys.leaveBalance.tr(), LocaleKeys.ticketBalance.tr()]; List namesInt = [118, 02, 18.5, 03]; List namesColor = [0xff125765, 0xff239D8F, 0xff2BB8A8, 0xff1D92AA]; List namesT = [LocaleKeys.monthlyAttendance.tr(), LocaleKeys.workFromHome.tr(), LocaleKeys.ticketRequest.tr(), LocaleKeys.monthlyAttendance.tr()]; List iconT = ["assets/images/monthly_attendance.svg", "assets/images/work_from_home.svg", "assets/images/ticket_request.svg", "assets/images/work_from_home.svg"]; List namesD = ["Nostalgia Perfume Perfume", "Al Nafoura", "AlJadi", "Nostalgia Perfume"]; final data = Provider.of(context); endTime=DateTime.now().millisecondsSinceEpoch + Duration(seconds: data.isTimeRemainingInSeconds).inMilliseconds; return Scaffold( body: Column( children: [ Row( children: [ Row( mainAxisSize: MainAxisSize.min, children: [ 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(() {}), Expanded( child: Row( crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center, mainAxisSize: MainAxisSize.min, children: [ //AppLogo(), 8.width, LocaleKeys.mohemm.tr().toText14() ], ), ), SizedBox( width: 36, height: 36, child: Stack( alignment: Alignment.centerLeft, children: [ SvgPicture.asset("assets/images/announcements.svg"), Positioned( right: 0, top: 0, child: Container( padding: const EdgeInsets.only(left: 5, right: 5), decoration: BoxDecoration(color: MyColors.redColor, borderRadius: BorderRadius.circular(17)), child: "3".toText12(color: Colors.white), ), ) ], ), ).onPress(() { data.update(); }) ], ).paddingOnly(left: 21, right: 21, top: 48, bottom: 7), Expanded( child: ListView( padding: EdgeInsets.zero, children: [ Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ LocaleKeys.goodMorning.tr().toText14(color: MyColors.grey77Color), "Mahmoud Shrouf".toText24(isBold: true), 16.height, Row( children: [ Expanded( child: AspectRatio( aspectRatio: 159 / 159, child: (data.isAttendanceTrackingLoading ? GetAttendanceTrackingShimmer() : Container( decoration: BoxDecoration( borderRadius: BorderRadius.circular(15), gradient: const LinearGradient(transform: GradientRotation(.46), begin: Alignment.topRight, end: Alignment.bottomRight, colors: [ MyColors.gradiantEndColor, MyColors.gradiantStartColor, ]), ), child: Stack( alignment: Alignment.center, children: [ if (data.attendanceTracking?.pSwipeIn == null) SvgPicture.asset("assets/images/thumb.svg"), Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Expanded( child: Column( mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: [ CountdownTimer( endTime: endTime, onEnd: null, endWidget: "00:00:00".toText14(color: Colors.white, isBold: true), textStyle: TextStyle(color: Colors.white, fontSize: 14, letterSpacing: -0.48, fontWeight: FontWeight.bold), ), LocaleKeys.markAttendance.tr().toText14(color: Colors.white, isBold: true), if (data.attendanceTracking?.pSwipeIn == null) "01-02-2022".toText12(color: Colors.white), if (data.attendanceTracking?.pSwipeIn != null) Column( mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: [ 9.height, "07:55:12".toText14(color: Colors.white, isBold: true), LocaleKeys.timeLeftToday.tr().toText12(color: Colors.white), 9.height, const ClipRRect( borderRadius: BorderRadius.all( Radius.circular(20), ), child: LinearProgressIndicator( value: 0.7, minHeight: 8, valueColor: const AlwaysStoppedAnimation(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), (data.attendanceTracking?.pSwipeIn == null ? "--:--" : "09:00").toText14(color: Colors.white, isBold: true), 4.height ], ).paddingOnly(left: 12), ), Container( width: 45, height: 45, padding: const EdgeInsets.only(left: 14, right: 14), decoration: const BoxDecoration( color: Color(0xff259EA4), borderRadius: BorderRadius.only( bottomRight: Radius.circular(15), ), ), child: SvgPicture.asset(data.attendanceTracking?.pSwipeIn == null ? "assets/images/play.svg" : "assets/images/stop.svg"), ), ], ), ], ), ], ), ).onPress(() { Navigator.pushNamed(context, AppRoutes.todayAttendance); })) .animatedSwither(), ), ), 9.width, Expanded( child: GridView.builder( shrinkWrap: true, primary: false, physics: const NeverScrollableScrollPhysics(), gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2, childAspectRatio: 2 / 2, crossAxisSpacing: 9, mainAxisSpacing: 9), padding: EdgeInsets.zero, itemCount: 4, itemBuilder: (BuildContext context, int index) { return Container( decoration: BoxDecoration( color: Color(namesColor[index]), borderRadius: BorderRadius.circular(10), ), child: Column( mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.start, children: [ names[index].toText12(color: Colors.white), Row( children: [ Expanded( child: namesInt[index].toStringAsFixed(1).toText16(color: Colors.white, isBold: true), ), SvgPicture.asset("assets/images/arrow_next.svg", color: Colors.white) ], ) ], ).paddingOnly(left: 10, right: 10, bottom: 6, top: 6), ).onPress(() { Navigator.pushNamed(context, AppRoutes.workList); }); }, ), ), ], ), 20.height, Row( crossAxisAlignment: CrossAxisAlignment.center, children: [ Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, mainAxisSize: MainAxisSize.min, children: [ "Other".tr().toText12(), LocaleKeys.services.tr().toText24(isBold: true), ], ), ), LocaleKeys.viewAllServices.tr().toText12(isUnderLine: true), ], ), ], ).paddingOnly(left: 21, right: 21, top: 7), SizedBox( height: 105 + 26, child: ListView.separated( shrinkWrap: true, physics: const BouncingScrollPhysics(), padding: const EdgeInsets.only(left: 21, right: 21, top: 13, bottom: 13), scrollDirection: Axis.horizontal, itemBuilder: (cxt, index) { return AspectRatio( aspectRatio: 105 / 105, child: Container( decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.circular(15), boxShadow: [ BoxShadow( color: const Color(0xff000000).withOpacity(.05), blurRadius: 26, offset: const Offset(0, -3), ), ], ), child: Column( mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.start, children: [ SvgPicture.asset(iconT[index]), Row( crossAxisAlignment: CrossAxisAlignment.end, children: [ Expanded( child: namesT[index].toText11(isBold: true), ), SvgPicture.asset("assets/images/arrow_next.svg").paddingOnly(bottom: 4) ], ) ], ).paddingOnly(left: 10, right: 10, bottom: 10, top: 12), ), ); }, separatorBuilder: (cxt, index) => 9.width, itemCount: 4), ), 8.height, Container( width: double.infinity, padding: EdgeInsets.only(top: 31), decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.only(topRight: Radius.circular(50), topLeft: Radius.circular(50)), border: Border.all(color: MyColors.lightGreyEDColor, width: 1), ), child: Column( mainAxisSize: MainAxisSize.min, 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), ], ).paddingOnly(left: 21, right: 21), 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: (cxt, index) { return 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.lightGreyEDColor, width: 1), ), child: ClipRRect( borderRadius: const BorderRadius.all( Radius.circular(50), ), child: Image.network( "https://play-lh.googleusercontent.com/NPo88ojmhah4HDiposucJmfQIop4z4xc8kqJK9ITO9o-yCab2zxIp7PPB_XPj2iUojo", fit: BoxFit.cover, ), ), ), 4.height, Expanded( child: namesD[6 % (index + 1)].toText12(isCenter: true, maxLine: 2), ), ], ), ); }, separatorBuilder: (cxt, index) => 8.width, itemCount: 6), ), ], ), ) ], ), ) ], ), ); } }