import 'package:diplomaticquarterapp/core/viewModels/project_view_model.dart'; import 'package:diplomaticquarterapp/pages/ErService/EROnlineCheckIn/EROnlineCheckInBookAppointment.dart'; import 'package:diplomaticquarterapp/pages/ErService/EROnlineCheckIn/EROnlineCheckInPaymentDetails.dart'; import 'package:diplomaticquarterapp/theme/colors.dart'; import 'package:diplomaticquarterapp/uitl/app_toast.dart'; import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart'; import 'package:diplomaticquarterapp/uitl/utils_new.dart'; import 'package:diplomaticquarterapp/widgets/buttons/defaultButton.dart'; import 'package:diplomaticquarterapp/widgets/nfc/nfc_reader_sheet.dart'; import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart'; import 'package:diplomaticquarterapp/widgets/transitions/fade_page.dart'; import 'package:flutter/material.dart'; import 'package:flutter_nfc_kit/flutter_nfc_kit.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:provider/provider.dart'; class EROnlineCheckInHomePage extends StatefulWidget { const EROnlineCheckInHomePage(); @override State createState() => _EROnlineCheckInHomePageState(); } class _EROnlineCheckInHomePageState extends State { ProjectViewModel projectViewModel; bool _supportsNFC = false; @override Widget build(BuildContext context) { projectViewModel = Provider.of(context); FlutterNfcKit.nfcAvailability.then((value) { _supportsNFC = (value == NFCAvailability.available); }); return AppScaffold( isShowAppBar: true, appBarTitle: TranslationBase.of(context).emergency + " ${TranslationBase.of(context).checkinOptions}", isShowDecPage: false, showNewAppBar: true, showNewAppBarTitle: true, backgroundColor: Color(0xffF8F8F8), body: SingleChildScrollView( child: Padding( padding: EdgeInsets.all(16.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Container( decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.only(topLeft: Radius.circular(10), topRight: Radius.circular(10), bottomLeft: Radius.circular(10), bottomRight: Radius.circular(10)), boxShadow: [ BoxShadow( color: Colors.grey.withOpacity(0.1), spreadRadius: 5, blurRadius: 7, offset: Offset(0, 3), // changes position of shadow ), ], ), child: Padding( padding: const EdgeInsets.all(12.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Icon( Icons.check_circle, size: 50, color: CustomColors.green, ), mHeight(6), Text( "What is Online Check-In?", maxLines: 1, style: TextStyle( fontSize: 20, fontFamily: (projectViewModel.isArabic ? 'Cairo' : 'Poppins'), fontWeight: FontWeight.w700, color: Color(0xff2B353E), letterSpacing: -1.44, height: 35 / 24), ), Text( "online check-in lets patients fill out forms, share insurance details, and book appointments online, making their visit smoother and quicker.", style: TextStyle(fontSize: 14, color: CustomColors.textDarkColor, letterSpacing: -1.44, height: 35 / 24), ), mHeight(16), Text( "How can i use Online Check-In?", maxLines: 1, style: TextStyle( fontSize: 20, fontFamily: (projectViewModel.isArabic ? 'Cairo' : 'Poppins'), fontWeight: FontWeight.w700, color: Color(0xff2B353E), letterSpacing: -1.44, height: 35 / 24), ), Text( "online check-in lets patients fill out forms, share insurance details, and book appointments online, making their visit smoother and quicker.", style: TextStyle(fontSize: 14, color: CustomColors.textDarkColor, letterSpacing: -1.44, height: 35 / 24), ), ], ), ), ), mHeight(24), Container( width: double.infinity, decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.only(topLeft: Radius.circular(10), topRight: Radius.circular(10), bottomLeft: Radius.circular(10), bottomRight: Radius.circular(10)), boxShadow: [ BoxShadow( color: Colors.grey.withOpacity(0.1), spreadRadius: 5, blurRadius: 7, offset: Offset(0, 3), // changes position of shadow ), ], ), child: Padding( padding: const EdgeInsets.all(12.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Row( children: [ Container( width: 35, height: 35, decoration: BoxDecoration( color: CustomColors.green, borderRadius: BorderRadius.circular(50), ), child: Center( child: Text( "1", style: TextStyle(fontSize: 22, fontWeight: FontWeight.w700, color: CustomColors.white, letterSpacing: -1.44, height: 35 / 24), ), ), ), mWidth(12), SvgPicture.asset( "assets/images/new/tap.svg", width: 35, height: 35, ), ], ), Padding( padding: const EdgeInsets.only(left: 50, right: 50), child: Text( "Tap On", maxLines: 1, style: TextStyle( fontSize: 20, fontFamily: (projectViewModel.isArabic ? 'Cairo' : 'Poppins'), fontWeight: FontWeight.w700, color: Color(0xff2B353E), letterSpacing: -1.44, height: 35 / 24), ), ), Padding( padding: const EdgeInsets.only(left: 50, right: 50), child: Text( "Tap on the check-in button within the app", style: TextStyle(fontSize: 14, color: CustomColors.textDarkColor, letterSpacing: -1.44, height: 35 / 24), ), ), mHeight(16), Row( children: [ Container( width: 35, height: 35, decoration: BoxDecoration( color: CustomColors.green, borderRadius: BorderRadius.circular(50), ), child: Center( child: Text( "2", style: TextStyle(fontSize: 22, fontWeight: FontWeight.w700, color: CustomColors.white, letterSpacing: -1.44, height: 35 / 24), ), ), ), mWidth(12), SvgPicture.asset( "assets/images/new/NFC_Hold.svg", width: 35, height: 35, ), ], ), Padding( padding: const EdgeInsets.only(left: 50, right: 50), child: Text( "Hold your phone", maxLines: 1, style: TextStyle( fontSize: 20, fontFamily: (projectViewModel.isArabic ? 'Cairo' : 'Poppins'), fontWeight: FontWeight.w700, color: Color(0xff2B353E), letterSpacing: -1.44, height: 35 / 24), ), ), Padding( padding: const EdgeInsets.only(left: 50, right: 50), child: Text( "Hold the phone 1 to 2 cm from the NFC sign displayed on the board", style: TextStyle(fontSize: 14, color: CustomColors.textDarkColor, letterSpacing: -1.44, height: 35 / 24), ), ), mHeight(16), Row( children: [ Container( width: 35, height: 35, decoration: BoxDecoration( color: CustomColors.green, borderRadius: BorderRadius.circular(50), ), child: Center( child: Text( "3", style: TextStyle(fontSize: 22, fontWeight: FontWeight.w700, color: CustomColors.white, letterSpacing: -1.44, height: 35 / 24), ), ), ), mWidth(12), SvgPicture.asset( "assets/images/new/hourglass.svg", width: 35, height: 35, ), ], ), Padding( padding: const EdgeInsets.only(left: 50, right: 50), child: Text( "Wait your turn", maxLines: 1, style: TextStyle( fontSize: 20, fontFamily: (projectViewModel.isArabic ? 'Cairo' : 'Poppins'), fontWeight: FontWeight.w700, color: Color(0xff2B353E), letterSpacing: -1.44, height: 35 / 24), ), ), Padding( padding: const EdgeInsets.only(left: 50, right: 50), child: Text( "Please wait in the waiting area until called by the nurse", style: TextStyle(fontSize: 14, color: CustomColors.textDarkColor, letterSpacing: -1.44, height: 35 / 24), ), ), ], ), ), ), ], ), ), ), bottomSheet: Container( height: 80, color: CustomColors.white, padding: EdgeInsets.fromLTRB(12.0, 12.0, 12.0, 25.0), child: Row( children: [ Expanded( flex: 1, child: DefaultButton( TranslationBase.of(context).checkinOptions, () { if (_supportsNFC) { Future.delayed(const Duration(milliseconds: 500), () { showNfcReader(context, onNcfScan: (String nfcId) { Future.delayed(const Duration(milliseconds: 100), () { print(nfcId); Navigator.push(context, FadePage(page: EROnlineCheckInPaymentDetails())); }); }, onCancel: () { Navigator.of(context).pop(); }); }); } else { //NFCNotSupported AppToast.showErrorToast(message: TranslationBase.of(context).NFCNotSupported); } }, color: CustomColors.green, ), ), mWidth(12), Expanded( flex: 1, child: DefaultButton( TranslationBase.of(context).bookAppo, () { Navigator.push(context, FadePage(page: EROnlineCheckInBookAppointment())); }, color: CustomColors.accentColor, ), ), ], ), ), ); } }