From 2a0206c9cdbd38888df0328ab668d81d3af93d16 Mon Sep 17 00:00:00 2001 From: Godwin Asuquo <41484542+godilite@users.noreply.github.com> Date: Mon, 11 Jul 2022 18:25:18 +0300 Subject: [PATCH] Implement gift card details screen (#408) * Implement gift card details screen --- lib/di.dart | 6 + lib/router.dart | 5 + lib/routes.dart | 2 +- .../ionia/cards/ionia_account_cards_page.dart | 6 + .../cards/ionia_gift_card_detail_page.dart | 173 ++++++++++++++++++ res/values/strings_en.arb | 2 +- 6 files changed, 192 insertions(+), 2 deletions(-) create mode 100644 lib/src/screens/ionia/cards/ionia_gift_card_detail_page.dart diff --git a/lib/di.dart b/lib/di.dart index ba49c9914..d026ff136 100644 --- a/lib/di.dart +++ b/lib/di.dart @@ -3,6 +3,8 @@ import 'package:cake_wallet/entities/parse_address_from_domain.dart'; import 'package:cake_wallet/entities/wake_lock.dart'; import 'package:cake_wallet/ionia/ionia_anypay.dart'; import 'package:cake_wallet/ionia/ionia_category.dart'; +import 'package:cake_wallet/ionia/ionia_gift_card.dart'; +import 'package:cake_wallet/src/screens/ionia/cards/ionia_gift_card_detail_page.dart'; import 'package:cake_wallet/view_model/ionia/ionia_auth_view_model.dart'; import 'package:cake_wallet/view_model/ionia/ionia_buy_card_view_model.dart'; import 'package:cake_wallet/view_model/ionia/ionia_filter_view_model.dart'; @@ -711,6 +713,10 @@ Future setup( return IoniaBuyGiftCardDetailPage(getIt.get(param1: amount, param2: merchant)); }); + getIt.registerFactoryParam((IoniaGiftCard giftCard, _) { + return IoniaGiftCardDetailPage(giftCard); + }); + getIt.registerFactoryParam((List args, _) { final amount = args.first as String; final merchant = args.last as IoniaMerchant; diff --git a/lib/router.dart b/lib/router.dart index 2f336a6c5..9764ec17a 100644 --- a/lib/router.dart +++ b/lib/router.dart @@ -8,6 +8,7 @@ import 'package:cake_wallet/src/screens/buy/pre_order_page.dart'; import 'package:cake_wallet/src/screens/ionia/cards/ionia_account_cards_page.dart'; import 'package:cake_wallet/src/screens/ionia/cards/ionia_account_page.dart'; import 'package:cake_wallet/src/screens/ionia/cards/ionia_custom_tip_page.dart'; +import 'package:cake_wallet/src/screens/ionia/cards/ionia_gift_card_detail_page.dart'; import 'package:cake_wallet/src/screens/order_details/order_details_page.dart'; import 'package:cake_wallet/src/screens/pin_code/pin_code_widget.dart'; import 'package:cake_wallet/src/screens/restore/restore_from_backup_page.dart'; @@ -446,6 +447,10 @@ Route createRoute(RouteSettings settings) { final args = settings.arguments as List; return CupertinoPageRoute(builder: (_) =>getIt.get(param1: args)); + case Routes.ioniaGiftCardDetailPage: + final args = settings.arguments as List; + return CupertinoPageRoute(builder: (_) => getIt.get(param1: args.first)); + default: return MaterialPageRoute( builder: (_) => Scaffold( diff --git a/lib/routes.dart b/lib/routes.dart index cc4ca7114..1b04db1eb 100644 --- a/lib/routes.dart +++ b/lib/routes.dart @@ -72,5 +72,5 @@ class Routes { static const ioniaAccountPage = 'ionia_account_page'; static const ioniaAccountCardsPage = 'ionia_account_cards_page'; static const ioniaCustomTipPage = 'ionia_custom_tip_page'; - + static const ioniaGiftCardDetailPage = '/ionia_gift_card_detail_page'; } diff --git a/lib/src/screens/ionia/cards/ionia_account_cards_page.dart b/lib/src/screens/ionia/cards/ionia_account_cards_page.dart index 07ab4b17e..5e752e5fa 100644 --- a/lib/src/screens/ionia/cards/ionia_account_cards_page.dart +++ b/lib/src/screens/ionia/cards/ionia_account_cards_page.dart @@ -1,5 +1,6 @@ import 'package:cake_wallet/ionia/ionia_gift_card.dart'; import 'package:cake_wallet/ionia/ionia_merchant.dart'; +import 'package:cake_wallet/routes.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/src/screens/ionia/widgets/card_item.dart'; import 'package:cake_wallet/typography.dart'; @@ -147,6 +148,11 @@ class _IoniaCardListView extends StatelessWidget { return Padding( padding: const EdgeInsets.only(bottom: 16), child: CardItem( + onTap: () => Navigator.pushNamed( + context, + Routes.ioniaGiftCardDetailPage, + arguments: [merchant], + ), title: merchant.legalName, backgroundColor: Theme.of(context).accentTextTheme.display4.backgroundColor.withOpacity(0.1), discount: 0, diff --git a/lib/src/screens/ionia/cards/ionia_gift_card_detail_page.dart b/lib/src/screens/ionia/cards/ionia_gift_card_detail_page.dart new file mode 100644 index 000000000..4c47f90a7 --- /dev/null +++ b/lib/src/screens/ionia/cards/ionia_gift_card_detail_page.dart @@ -0,0 +1,173 @@ +import 'package:cake_wallet/ionia/ionia_gift_card.dart'; +import 'package:cake_wallet/src/screens/base_page.dart'; +import 'package:cake_wallet/src/screens/ionia/widgets/ionia_tile.dart'; +import 'package:cake_wallet/src/screens/ionia/widgets/text_icon_button.dart'; +import 'package:cake_wallet/src/widgets/alert_background.dart'; +import 'package:cake_wallet/src/widgets/primary_button.dart'; +import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart'; +import 'package:cake_wallet/typography.dart'; +import 'package:cake_wallet/utils/show_pop_up.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter/src/widgets/framework.dart'; +import 'package:cake_wallet/generated/i18n.dart'; + +class IoniaGiftCardDetailPage extends BasePage { + IoniaGiftCardDetailPage(this.merchant); + + final IoniaGiftCard merchant; + + @override + Widget leading(BuildContext context) { + if (ModalRoute.of(context).isFirst) { + return null; + } + + final _backButton = Icon( + Icons.arrow_back_ios, + color: Theme.of(context).primaryTextTheme.title.color, + size: 16, + ); + return Padding( + padding: const EdgeInsets.only(left: 10.0), + child: SizedBox( + height: 37, + width: 37, + child: ButtonTheme( + minWidth: double.minPositive, + child: FlatButton( + highlightColor: Colors.transparent, + splashColor: Colors.transparent, + padding: EdgeInsets.all(0), + onPressed: () => onClose(context), + child: _backButton), + ), + ), + ); + } + + @override + Widget middle(BuildContext context) { + return Text( + merchant.legalName, + style: textLargeSemiBold(color: Theme.of(context).accentTextTheme.display4.backgroundColor), + ); + } + + @override + Widget body(BuildContext context) { + return ScrollableWithBottomSection( + contentPadding: EdgeInsets.all(24), + content: Column( + children: [ + if (merchant.barcodeUrl != null && merchant.barcodeUrl.isNotEmpty) + Padding( + padding: const EdgeInsets.symmetric( + horizontal: 24.0, + vertical: 24, + ), + child: SizedBox(height: 96, width: double.infinity, child: Image.network(merchant.barcodeUrl)), + ), + SizedBox(height: 24), + IoniaTile( + title: S.of(context).gift_card_number, + subTitle: merchant.cardNumber, + ), + Divider(height: 30), + IoniaTile( + title: S.of(context).pin_number, + subTitle: merchant.cardPin ?? '', + ), + Divider(height: 30), + IoniaTile( + title: S.of(context).amount, + subTitle: merchant.remainingAmount.toString() ?? '0', + ), + Divider(height: 50), + TextIconButton( + label: S.of(context).how_to_use_card, + onTap: () => _showHowToUseCard(context, merchant), + ), + ], + ), + bottomSection: Padding( + padding: EdgeInsets.only(bottom: 12), + child: LoadingPrimaryButton( + isLoading: false, + onPressed: () {}, + text: S.of(context).mark_as_redeemed, + color: Theme.of(context).accentTextTheme.body2.color, + textColor: Colors.white, + )), + ); + } + + void _showHowToUseCard( + BuildContext context, + IoniaGiftCard merchant, + ) { + showPopUp( + context: context, + builder: (BuildContext context) { + return AlertBackground( + child: Material( + color: Colors.transparent, + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + SizedBox(height: 10), + Container( + padding: EdgeInsets.only(top: 24, left: 24, right: 24), + margin: EdgeInsets.all(24), + decoration: BoxDecoration( + color: Theme.of(context).backgroundColor, + borderRadius: BorderRadius.circular(30), + ), + child: Column( + children: [ + Text( + S.of(context).how_to_use_card, + style: textLargeSemiBold( + color: Theme.of(context).textTheme.body1.color, + ), + ), + SizedBox(height: 24), + Align( + alignment: Alignment.bottomLeft, + child: Text( + '', + style: textMedium( + color: Theme.of(context).textTheme.display2.color, + ), + ), + ), + SizedBox(height: 35), + PrimaryButton( + onPressed: () => Navigator.pop(context), + text: S.of(context).send_got_it, + color: Color.fromRGBO(233, 242, 252, 1), + textColor: Theme.of(context).textTheme.display2.color, + ), + SizedBox(height: 21), + ], + ), + ), + InkWell( + onTap: () => Navigator.pop(context), + child: Container( + margin: EdgeInsets.only(bottom: 40), + child: CircleAvatar( + child: Icon( + Icons.close, + color: Colors.black, + ), + backgroundColor: Colors.white, + ), + ), + ) + ], + ), + ), + ); + }); + } +} diff --git a/res/values/strings_en.arb b/res/values/strings_en.arb index b3e683946..ec420ba24 100644 --- a/res/values/strings_en.arb +++ b/res/values/strings_en.arb @@ -620,5 +620,5 @@ "awaiting_payment_confirmation": "Awaiting payment confirmation", "transaction_sent_notice": "If the screen doesn’t proceed after 1 minute, check a block explorer and your email.", "agree": "Agree", - "in_store": "In Store" + "in_store": "In Store", }