diff --git a/assets/images/svg/email_icon.svg b/assets/images/svg/email_icon.svg new file mode 100644 index 0000000..9e052e7 --- /dev/null +++ b/assets/images/svg/email_icon.svg @@ -0,0 +1,4 @@ + + + + diff --git a/assets/images/svg/forward_chevron_icon.svg b/assets/images/svg/forward_chevron_icon.svg new file mode 100644 index 0000000..656d80e --- /dev/null +++ b/assets/images/svg/forward_chevron_icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/svg/my_account_icon.svg b/assets/images/svg/my_account_icon.svg new file mode 100644 index 0000000..4bfe5b1 --- /dev/null +++ b/assets/images/svg/my_account_icon.svg @@ -0,0 +1,4 @@ + + + + diff --git a/assets/images/svg/notes_icon.svg b/assets/images/svg/notes_icon.svg new file mode 100644 index 0000000..5d7ab0e --- /dev/null +++ b/assets/images/svg/notes_icon.svg @@ -0,0 +1,9 @@ + + + + + diff --git a/assets/images/svg/select_hospital_icon.svg b/assets/images/svg/select_hospital_icon.svg new file mode 100644 index 0000000..ce00f8c --- /dev/null +++ b/assets/images/svg/select_hospital_icon.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/lib/core/app_assets.dart b/lib/core/app_assets.dart index a2cbc49..1db8810 100644 --- a/lib/core/app_assets.dart +++ b/lib/core/app_assets.dart @@ -93,6 +93,11 @@ class AppAssets { static const String checkin_location_icon = '$svgBasePath/checkin_location_icon.svg'; static const String checkin_nfc_icon = '$svgBasePath/checkin_nfc_icon.svg'; static const String checkin_qr_icon = '$svgBasePath/checkin_qr_icon.svg'; + static const String my_account_icon = '$svgBasePath/my_account_icon.svg'; + static const String select_hospital_icon = '$svgBasePath/select_hospital_icon.svg'; + static const String email_icon = '$svgBasePath/email_icon.svg'; + static const String notes_icon = '$svgBasePath/notes_icon.svg'; + static const String forward_chevron_icon = '$svgBasePath/forward_chevron_icon.svg'; //bottom navigation// static const String homeBottom = '$svgBasePath/home_bottom.svg'; diff --git a/lib/presentation/habib_wallet/recharge_wallet_page.dart b/lib/presentation/habib_wallet/recharge_wallet_page.dart index 0d8f16c..453b6a0 100644 --- a/lib/presentation/habib_wallet/recharge_wallet_page.dart +++ b/lib/presentation/habib_wallet/recharge_wallet_page.dart @@ -1,13 +1,20 @@ import 'package:easy_localization/easy_localization.dart'; import 'package:flutter/material.dart'; +import 'package:hmg_patient_app_new/core/app_assets.dart'; +import 'package:hmg_patient_app_new/core/app_state.dart'; +import 'package:hmg_patient_app_new/core/dependencies.dart'; import 'package:hmg_patient_app_new/core/utils/size_utils.dart'; import 'package:hmg_patient_app_new/core/utils/utils.dart'; import 'package:hmg_patient_app_new/extensions/string_extensions.dart'; import 'package:hmg_patient_app_new/extensions/widget_extensions.dart'; import 'package:hmg_patient_app_new/generated/locale_keys.g.dart'; import 'package:hmg_patient_app_new/theme/colors.dart'; +import 'package:hmg_patient_app_new/widgets/buttons/custom_button.dart'; +import 'package:hmg_patient_app_new/widgets/common_bottom_sheet.dart'; import 'package:hmg_patient_app_new/widgets/input_widget.dart'; +import 'widgets/select-medical_file.dart'; + class RechargeWalletPage extends StatefulWidget { const RechargeWalletPage({super.key}); @@ -16,11 +23,11 @@ class RechargeWalletPage extends StatefulWidget { } class _RechargeWalletPageState extends State { - FocusNode textFocusNode = FocusNode(); @override Widget build(BuildContext context) { + AppState appState = getIt.get(); return Scaffold( backgroundColor: AppColors.bgScaffoldColor, appBar: AppBar( @@ -87,6 +94,109 @@ class _RechargeWalletPageState extends State { ), ), ), + SizedBox(height: 24.h), + Container( + decoration: RoundedRectangleBorder().toSmoothCornerDecoration( + color: AppColors.whiteColor, + borderRadius: 24.h, + hasShadow: false, + ), + child: Padding( + padding: EdgeInsets.all(16.h), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + children: [ + Utils.buildSvgWithAssets(icon: AppAssets.my_account_icon, width: 40.h, height: 40.h), + SizedBox(width: 8.h), + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + LocaleKeys.myAccount.tr(context: context).toText16(color: AppColors.textColor, weight: FontWeight.w500), + "${LocaleKeys.medicalFile.tr(context: context)}: ${appState.getAuthenticatedUser()!.patientId}".toText14(color: AppColors.greyTextColor, weight: FontWeight.w500), + ], + ), + ], + ), + Utils.buildSvgWithAssets(icon: AppAssets.arrow_down, width: 25.h, height: 25.h), + ], + ).onPress(() { + // showCommonBottomSheetWithoutHeight(context, title: "Select Medical File".needTranslation, child: SelectMedicalFile(), callBackFunc: () {}, isFullScreen: false); + showCommonBottomSheetWithoutHeight(context, title: "Select Medical File".needTranslation, child: const MultiPageBottomSheet(), callBackFunc: () {}, isFullScreen: false); + }), + SizedBox(height: 16.h), + Divider(color: AppColors.borderOnlyColor.withValues(alpha: 0.1), height: 1.h), + SizedBox(height: 16.h), + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + children: [ + Utils.buildSvgWithAssets(icon: AppAssets.select_hospital_icon, width: 40.h, height: 40.h), + SizedBox(width: 8.h), + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + LocaleKeys.hospital.tr(context: context).toText16(color: AppColors.textColor, weight: FontWeight.w500), + "Olaya".toText14(color: AppColors.greyTextColor, weight: FontWeight.w500), + ], + ), + ], + ), + Utils.buildSvgWithAssets(icon: AppAssets.arrow_down, width: 25.h, height: 25.h), + ], + ), + SizedBox(height: 16.h), + Divider(color: AppColors.borderOnlyColor.withValues(alpha: 0.1), height: 1.h), + SizedBox(height: 16.h), + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + children: [ + Utils.buildSvgWithAssets(icon: AppAssets.email_icon, width: 40.h, height: 40.h), + SizedBox(width: 8.h), + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + LocaleKeys.email.tr(context: context).toText12(color: AppColors.greyTextColor, fontWeight: FontWeight.w500), + "${appState.getAuthenticatedUser()!.emailAddress}".toText16(color: AppColors.textColor, weight: FontWeight.w500), + ], + ), + ], + ), + ], + ), + SizedBox(height: 16.h), + Divider(color: AppColors.borderOnlyColor.withValues(alpha: 0.1), height: 1.h), + SizedBox(height: 16.h), + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + children: [ + Utils.buildSvgWithAssets(icon: AppAssets.notes_icon, width: 40.h, height: 40.h), + SizedBox(width: 8.h), + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + LocaleKeys.notes.tr(context: context).toText12(color: AppColors.greyTextColor, fontWeight: FontWeight.w500), + "Lorem Ipsum".toText16(color: AppColors.textColor, weight: FontWeight.w500), + ], + ), + ], + ), + ], + ), + SizedBox(height: 8.h), + ], + ), + ), + ), ], ), ), @@ -97,6 +207,21 @@ class _RechargeWalletPageState extends State { borderRadius: 24.h, hasShadow: false, ), + child: CustomButton( + text: LocaleKeys.next.tr(context: context), + onPressed: () {}, + backgroundColor: AppColors.primaryRedColor, + borderColor: AppColors.primaryRedColor, + textColor: AppColors.whiteColor, + fontSize: 16, + fontWeight: FontWeight.w500, + borderRadius: 12, + padding: EdgeInsets.fromLTRB(10, 0, 10, 0), + height: 50.h, + icon: AppAssets.appointment_pay_icon, + iconColor: AppColors.whiteColor, + iconSize: 18.h, + ).paddingSymmetrical(24.h, 24.h), ), ], ), diff --git a/lib/presentation/habib_wallet/widgets/select-medical_file.dart b/lib/presentation/habib_wallet/widgets/select-medical_file.dart new file mode 100644 index 0000000..a6712f0 --- /dev/null +++ b/lib/presentation/habib_wallet/widgets/select-medical_file.dart @@ -0,0 +1,232 @@ +// import 'package:flutter/cupertino.dart'; +// import 'package:hmg_patient_app_new/core/utils/size_utils.dart'; +// +// class SelectMedicalFile extends StatelessWidget { +// const SelectMedicalFile({super.key}); +// +// @override +// Widget build(BuildContext context) { +// return Padding( +// padding: EdgeInsets.all(24.h), +// child: Column( +// crossAxisAlignment: CrossAxisAlignment.start, +// children: [ +// Container() +// ], +// ), +// ); +// } +// } + +import 'package:easy_localization/easy_localization.dart'; +import 'package:flutter/material.dart'; +import 'package:hmg_patient_app_new/core/app_assets.dart'; +import 'package:hmg_patient_app_new/core/app_state.dart'; +import 'package:hmg_patient_app_new/core/dependencies.dart'; +import 'package:hmg_patient_app_new/core/utils/size_utils.dart'; +import 'package:hmg_patient_app_new/core/utils/utils.dart'; +import 'package:hmg_patient_app_new/extensions/string_extensions.dart'; +import 'package:hmg_patient_app_new/extensions/widget_extensions.dart'; +import 'package:hmg_patient_app_new/generated/locale_keys.g.dart'; +import 'package:hmg_patient_app_new/theme/colors.dart'; + +class MultiPageBottomSheet extends StatefulWidget { + const MultiPageBottomSheet({Key? key}) : super(key: key); + + @override + State createState() => _MultiPageBottomSheetState(); +} + +class _MultiPageBottomSheetState extends State { + final PageController _pageController = PageController(); + int _currentPage = 0; + final int _totalPages = 3; + + late AppState appState; + + @override + void dispose() { + _pageController.dispose(); + super.dispose(); + } + + void _nextPage() { + if (_currentPage < _totalPages - 1) { + _pageController.animateToPage( + _currentPage + 2, + duration: const Duration(milliseconds: 300), + curve: Curves.easeInOut, + ); + } + } + + void _previousPage() { + if (_currentPage > 0) { + _pageController.previousPage( + duration: const Duration(milliseconds: 300), + curve: Curves.easeInOut, + ); + } + } + + @override + Widget build(BuildContext context) { + appState = getIt.get(); + return Container( + height: MediaQuery.of(context).size.height * 0.38, + child: Column( + children: [ + SizedBox(height: 12.h), + Expanded( + child: PageView( + controller: _pageController, + onPageChanged: (index) { + setState(() { + _currentPage = index; + }); + }, + children: [ + _buildPage1(), + _buildPage2(), + _buildPage3(), + ], + ), + ), + ], + ), + ); + } + + Widget _buildPage1() { + return Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Container( + decoration: RoundedRectangleBorder().toSmoothCornerDecoration( + color: AppColors.whiteColor, + borderRadius: 16.h, + hasShadow: false, + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + LocaleKeys.myMedicalFile.tr(context: context).toText16(color: AppColors.textColor, weight: FontWeight.w500), + "${LocaleKeys.fileno.tr(context: context)}: ${appState.getAuthenticatedUser()!.patientId}".toText12(color: AppColors.greyTextColor, fontWeight: FontWeight.w500), + ], + ), + Utils.buildSvgWithAssets(icon: AppAssets.forward_chevron_icon, iconColor: AppColors.textColor, width: 15.h, height: 15.h), + ], + ).paddingAll(16.h), + ).onPress(() { + Navigator.of(context).pop(); + }), + SizedBox(height: 16.h), + Container( + decoration: RoundedRectangleBorder().toSmoothCornerDecoration( + color: AppColors.whiteColor, + borderRadius: 16.h, + hasShadow: false, + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + LocaleKeys.myMedicalFile.tr(context: context).toText16(color: AppColors.textColor, weight: FontWeight.w500), + "${LocaleKeys.fileno.tr(context: context)}: ${appState.getAuthenticatedUser()!.patientId}".toText14(color: AppColors.greyTextColor, weight: FontWeight.w500), + ], + ), + Utils.buildSvgWithAssets(icon: AppAssets.forward_chevron_icon, iconColor: AppColors.textColor, width: 15.h, height: 15.h), + ], + ).paddingAll(16.h), + ), + SizedBox(height: 16.h), + Container( + decoration: RoundedRectangleBorder().toSmoothCornerDecoration( + color: AppColors.whiteColor, + borderRadius: 16.h, + hasShadow: false, + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + LocaleKeys.myMedicalFile.tr(context: context).toText16(color: AppColors.textColor, weight: FontWeight.w500), + "${LocaleKeys.fileno.tr(context: context)}: ${appState.getAuthenticatedUser()!.patientId}".toText14(color: AppColors.greyTextColor, weight: FontWeight.w500), + ], + ), + Utils.buildSvgWithAssets(icon: AppAssets.forward_chevron_icon, iconColor: AppColors.textColor, width: 15.h, height: 15.h), + ], + ).paddingAll(16.h), + ), + ], + ); + } + + Widget _buildPage2() { + return Padding( + padding: const EdgeInsets.all(16.0), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + 'Page 2: Settings', + style: Theme.of(context).textTheme.headlineSmall, + ), + const SizedBox(height: 16), + SwitchListTile( + title: const Text('Enable notifications'), + value: true, + onChanged: (value) {}, + ), + SwitchListTile( + title: const Text('Dark mode'), + value: false, + onChanged: (value) {}, + ), + const ListTile( + leading: Icon(Icons.language), + title: Text('Language'), + subtitle: Text('English'), + trailing: Icon(Icons.arrow_forward_ios), + ), + ], + ), + ); + } + + Widget _buildPage3() { + return Padding( + padding: const EdgeInsets.all(16.0), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + 'Page 3: Summary', + style: Theme.of(context).textTheme.headlineSmall, + ), + const SizedBox(height: 16), + const Card( + child: Padding( + padding: EdgeInsets.all(16.0), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text('Configuration Complete!'), + SizedBox(height: 8), + Text('Your settings have been saved successfully.'), + ], + ), + ), + ), + ], + ), + ); + } +}