From bf0c1458272eacbe84ebd09c8af28b7dfadf1520 Mon Sep 17 00:00:00 2001 From: Godwin Asuquo Date: Fri, 4 Mar 2022 16:09:14 +0100 Subject: [PATCH] add increase deposit ui --- lib/di.dart | 9 + lib/router.dart | 12 +- lib/routes.dart | 2 + .../screens/loan/confirm_deposit_page.dart | 165 +++++++++++++++++ .../screens/loan/increase_deposit_page.dart | 171 ++++++++++++++++++ lib/src/screens/loan/loan_account_page.dart | 3 - lib/src/screens/loan/loan_detail_page.dart | 92 ++-------- .../loan/widgets/loan_detail_tile.dart | 72 ++++++++ 8 files changed, 444 insertions(+), 82 deletions(-) create mode 100644 lib/src/screens/loan/confirm_deposit_page.dart create mode 100644 lib/src/screens/loan/increase_deposit_page.dart create mode 100644 lib/src/screens/loan/widgets/loan_detail_tile.dart diff --git a/lib/di.dart b/lib/di.dart index 11efa766c..33c5c1451 100644 --- a/lib/di.dart +++ b/lib/di.dart @@ -1,6 +1,8 @@ import 'package:cake_wallet/entities/wake_lock.dart'; import 'package:cake_wallet/monero/monero.dart'; import 'package:cake_wallet/bitcoin/bitcoin.dart'; +import 'package:cake_wallet/src/screens/loan/confirm_deposit_page.dart'; +import 'package:cake_wallet/src/screens/loan/increase_deposit_page.dart'; import 'package:cake_wallet/src/screens/loan/loan_account_page.dart'; import 'package:cake_wallet/src/screens/loan/loan_detail_page.dart'; import 'package:cake_wallet/view_model/loan/loan_account_view_model.dart'; @@ -647,5 +649,12 @@ Future setup( loanDetailViewModel: getIt.get(param1: loanItem))); + getIt.registerFactoryParam( + (LoanItem loanItem, _) => IncreaseDeposit( + loanDetailViewModel: + getIt.get(param1: loanItem))); + + getIt.registerFactory(() => ConfirmDepositPage()); + _isSetupFinished = true; } diff --git a/lib/router.dart b/lib/router.dart index 1fd3aee9e..cf6687a1e 100644 --- a/lib/router.dart +++ b/lib/router.dart @@ -4,6 +4,8 @@ import 'package:cake_wallet/src/screens/backup/backup_page.dart'; import 'package:cake_wallet/src/screens/backup/edit_backup_password_page.dart'; import 'package:cake_wallet/src/screens/buy/buy_webview_page.dart'; import 'package:cake_wallet/src/screens/buy/pre_order_page.dart'; +import 'package:cake_wallet/src/screens/loan/confirm_deposit_page.dart'; +import 'package:cake_wallet/src/screens/loan/increase_deposit_page.dart'; import 'package:cake_wallet/src/screens/loan/loan_account_page.dart'; import 'package:cake_wallet/src/screens/loan/loan_detail_page.dart'; import 'package:cake_wallet/src/screens/order_details/order_details_page.dart'; @@ -397,11 +399,19 @@ Route createRoute(RouteSettings settings) { return CupertinoPageRoute( fullscreenDialog: true, builder: (_) => getIt.get()); - case Routes.loanDetails: + case Routes.loanDetails: return MaterialPageRoute( builder: (_) => getIt.get(param1: settings.arguments as LoanItem)); + case Routes.increaseDeposit: + return MaterialPageRoute( + builder: (_) => getIt.get( + param1: settings.arguments as LoanItem)); + + case Routes.confirmDepositPage: + return CupertinoPageRoute( + builder: (_) => getIt.get()); default: return MaterialPageRoute( builder: (_) => Scaffold( diff --git a/lib/routes.dart b/lib/routes.dart index 1b8e96d56..8b7ab5299 100644 --- a/lib/routes.dart +++ b/lib/routes.dart @@ -62,4 +62,6 @@ class Routes { static const moneroNewWalletFromWelcome = '/monero_new_wallet'; static const loanAccount = '/loan_account'; static const loanDetails = '/loan_details'; + static const increaseDeposit = '/increase_deposit'; + static const confirmDepositPage = '/confrim_deposit'; } diff --git a/lib/src/screens/loan/confirm_deposit_page.dart b/lib/src/screens/loan/confirm_deposit_page.dart new file mode 100644 index 000000000..cc487d71e --- /dev/null +++ b/lib/src/screens/loan/confirm_deposit_page.dart @@ -0,0 +1,165 @@ +import 'package:cake_wallet/src/screens/base_page.dart'; +import 'package:cake_wallet/src/screens/receive/widgets/qr_image.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/src/widgets/trail_button.dart'; +import 'package:cake_wallet/utils/show_bar.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; +import 'package:cake_wallet/generated/i18n.dart'; +import 'package:flutter/src/widgets/framework.dart'; + +class ConfirmDepositPage extends BasePage { + ConfirmDepositPage(); + @override + String get title => 'Increase Deposit'; + + @override + Color get titleColor => Color(0xff355688); + + @override + AppBarStyle get appBarStyle => AppBarStyle.transparent; + + @override + Widget trailing(BuildContext context) { + final questionImage = Image.asset('assets/images/question_mark.png', + color: Theme.of(context).primaryTextTheme.title.color); + + return SizedBox( + height: 20.0, + width: 20.0, + child: ButtonTheme( + minWidth: double.minPositive, + child: FlatButton( + highlightColor: Colors.transparent, + splashColor: Colors.transparent, + padding: EdgeInsets.all(0), + onPressed: () => null, + child: questionImage, + ), + ), + ); + } + + @override + Widget body(BuildContext context) { + return ScrollableWithBottomSection( + content: Column( + children: [ + SizedBox(height: 50), + SizedBox( + height: 140, + width: 140, + child: AspectRatio( + aspectRatio: 1, + child: QrImage( + data: "url", + backgroundColor: Theme.of(context).primaryTextTheme.title.color, + version: 2, + foregroundColor: + Theme.of(context).accentTextTheme.display3.backgroundColor, + ), + ), + ), + SizedBox(height: 50), + ConfirmDetailTile( + text: '3524232', + label: 'ID', + shouldCopy: true, + ), + Divider(), + ConfirmDetailTile( + text: '0.1300', + label: 'Amount', + ), + Divider(), + ConfirmDetailTile( + text: 'waiting', + label: 'Status', + ), + Divider(), + ConfirmDetailTile( + text: '355442sdl;kmsmadsasx32', + label: 'Address', + shouldCopy: true, + ), + ], + ), + bottomSection: Column( + children: [ + SizedBox(height: 20), + Padding( + padding: EdgeInsets.only(bottom: 12), + child: PrimaryButton( + onPressed: () => null, + text: 'Confirm', + color: Theme.of(context).accentTextTheme.body2.color, + textColor: Colors.white, + ), + ), + SizedBox(height: 20), + ], + ), + ); + } +} + +class ConfirmDetailTile extends StatelessWidget { + final String label; + + final bool shouldCopy; + + final String text; + + const ConfirmDetailTile({ + @required this.text, + @required this.label, + this.shouldCopy = false, + }); + + @override + Widget build(BuildContext context) { + return Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + '$label:', + style: TextStyle( + color: Color(0xff7A93BA), + fontFamily: 'Poppins', + fontWeight: FontWeight.w500, + fontSize: 16), + ), + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + '$text', + style: TextStyle( + color: Theme.of(context).primaryTextTheme.title.color, + fontFamily: 'Poppins', + fontWeight: FontWeight.w500, + fontSize: 16, + ), + ), + if (shouldCopy) + InkWell( + child: Padding( + padding: const EdgeInsets.all(8.0), + child: Icon( + Icons.copy, + size: 16, + color: Theme.of(context).primaryTextTheme.title.color, + ), + ), + onTap: () { + Clipboard.setData(ClipboardData(text: '$text')); + showBar(context, S.of(context).copied_to_clipboard); + }, + ) + ], + ), + ], + ); + } +} diff --git a/lib/src/screens/loan/increase_deposit_page.dart b/lib/src/screens/loan/increase_deposit_page.dart new file mode 100644 index 000000000..139b23483 --- /dev/null +++ b/lib/src/screens/loan/increase_deposit_page.dart @@ -0,0 +1,171 @@ +import 'package:cake_wallet/routes.dart'; +import 'package:cake_wallet/src/screens/base_page.dart'; +import 'package:cake_wallet/src/screens/loan/widgets/loan_detail_tile.dart'; +import 'package:cake_wallet/src/widgets/base_text_form_field.dart'; +import 'package:cake_wallet/src/widgets/keyboard_done_button.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/themes/theme_base.dart'; +import 'package:cake_wallet/view_model/loan/loan_detail_view_model.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; +import 'package:flutter/src/widgets/framework.dart'; +import 'package:keyboard_actions/keyboard_actions.dart'; + +class IncreaseDeposit extends BasePage { + IncreaseDeposit({this.loanDetailViewModel}) + : _amountFocus = FocusNode(), + _amountController = TextEditingController(); + + final LoanDetailViewModel loanDetailViewModel; + final FocusNode _amountFocus; + final TextEditingController _amountController; + + @override + String get title => 'Increase deposit'; + + @override + Color get titleColor => Colors.white; + + @override + bool get extendBodyBehindAppBar => true; + + @override + AppBarStyle get appBarStyle => AppBarStyle.transparent; + + Color get textColor => + currentTheme.type == ThemeType.dark ? Colors.white : Color(0xff393939); + + @override + Widget middle(BuildContext context) => Text( + title, + style: TextStyle( + color: Colors.white, + fontFamily: 'Poppins', + fontSize: 22, + fontWeight: FontWeight.w600, + ), + ); + + @override + Widget body(BuildContext context) { + return KeyboardActions( + config: KeyboardActionsConfig( + keyboardActionsPlatform: KeyboardActionsPlatform.IOS, + keyboardBarColor: + Theme.of(context).accentTextTheme.body2.backgroundColor, + nextFocus: false, + actions: [ + KeyboardActionsItem( + focusNode: _amountFocus, + toolbarButtons: [(_) => KeyboardDoneButton()], + ), + ]), + child: SizedBox( + height: 0, + child: ScrollableWithBottomSection( + contentPadding: EdgeInsets.zero, + content: Column( + children: [ + Container( + padding: EdgeInsets.only(bottom: 20), + child: Align( + alignment: Alignment.bottomCenter, + child: SizedBox( + width: 160, + child: BaseTextFormField( + controller: _amountController, + focusNode: _amountFocus, + keyboardType: TextInputType.numberWithOptions( + signed: false, decimal: true), + inputFormatters: [ + FilteringTextInputFormatter.deny(RegExp('[\\-|\\ ]')) + ], + hintText: '0.0000', + placeholderTextStyle: TextStyle( + color: + Theme.of(context).primaryTextTheme.headline.color, + fontSize: 36, + ), + borderColor: + Theme.of(context).primaryTextTheme.headline.color, + textColor: Colors.white, + textStyle: TextStyle( + color: Colors.white, + fontSize: 36, + ), + prefixIcon: Padding( + padding: const EdgeInsets.only(top: 5.0), + child: Text( + 'XMR: ', + style: TextStyle( + color: Colors.white, + fontSize: 36, + ), + ), + ), + ), + ), + ), + height: 180, + width: double.infinity, + decoration: BoxDecoration( + borderRadius: BorderRadius.only( + bottomLeft: Radius.circular(24), + bottomRight: Radius.circular(24)), + gradient: LinearGradient(colors: [ + Theme.of(context).primaryTextTheme.subhead.color, + Theme.of(context).primaryTextTheme.subhead.decorationColor, + ], begin: Alignment.topLeft, end: Alignment.bottomRight), + ), + ), + SizedBox(height: 30), + Padding( + padding: const EdgeInsets.symmetric(horizontal: 20.0), + child: IncreaseDepositContent(), + ) + ], + ), + bottomSection: Column( + children: [ + SizedBox(height: 20), + Padding( + padding: EdgeInsets.only(bottom: 12), + child: PrimaryButton( + onPressed: () => Navigator.of(context) + .pushNamed(Routes.confirmDepositPage), + text: 'Confirm', + color: Theme.of(context).accentTextTheme.body2.color, + textColor: Colors.white, + ), + ), + ], + ), + ), + ), + ); + } +} + +class IncreaseDepositContent extends StatelessWidget { + const IncreaseDepositContent(); + + @override + Widget build(BuildContext context) { + return Column( + children: [ + LoanDetailTile( + title: 'Liquidation price will become', + trailing: '101.53 XMR/USDT', + ), + SizedBox(height: 30), + LoanDetailTile( + title: 'Buffer', + subtitle: + 'How much XMR must fall in relation to USDT before liquidation', + trailing: '44.8% -> 72.1%', + ), + ], + ); + } +} diff --git a/lib/src/screens/loan/loan_account_page.dart b/lib/src/screens/loan/loan_account_page.dart index 935979923..60ba7e40f 100644 --- a/lib/src/screens/loan/loan_account_page.dart +++ b/lib/src/screens/loan/loan_account_page.dart @@ -29,9 +29,6 @@ class LoanAccountPage extends BasePage { @override String get title => 'Loan Account'; - @override - Color get titleColor => Colors.white; - @override bool get extendBodyBehindAppBar => true; diff --git a/lib/src/screens/loan/loan_detail_page.dart b/lib/src/screens/loan/loan_detail_page.dart index c432150f7..7e6bf2e4d 100644 --- a/lib/src/screens/loan/loan_detail_page.dart +++ b/lib/src/screens/loan/loan_detail_page.dart @@ -1,9 +1,9 @@ -import 'package:cake_wallet/di.dart'; +import 'package:cake_wallet/routes.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/src/screens/dashboard/widgets/sync_indicator_icon.dart'; +import 'package:cake_wallet/src/screens/loan/widgets/loan_detail_tile.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/store/settings_store.dart'; import 'package:cake_wallet/themes/theme_base.dart'; import 'package:cake_wallet/view_model/loan/loan_detail_view_model.dart'; import 'package:flutter/material.dart'; @@ -83,7 +83,8 @@ class LoanDetailPage extends BasePage { Padding( padding: EdgeInsets.only(bottom: 12), child: PrimaryButton( - onPressed: () {}, + onPressed: () => Navigator.of(context) + .pushNamed(Routes.increaseDeposit, arguments: loanDetailViewModel.loanDetails), text: 'Increase Deposit', color: Theme.of(context).accentTextTheme.body2.color, textColor: Colors.white, @@ -124,22 +125,22 @@ class LendContent extends StatelessWidget { Widget build(BuildContext context) { return Column( children: [ - LoanDetailItem( + LoanDetailTile( title: 'Initial deposit', trailing: '101.53 USDT', ), SizedBox(height: 30), - LoanDetailItem( + LoanDetailTile( title: 'Earned interest', trailing: '101.53 USDT', ), SizedBox(height: 30), - LoanDetailItem( + LoanDetailTile( title: 'Current value', trailing: '101.53 USDT', ), SizedBox(height: 30), - LoanDetailItem( + LoanDetailTile( title: 'Interest value', trailing: '12.23% APY', ), @@ -157,32 +158,32 @@ class LoanContent extends StatelessWidget { Widget build(BuildContext context) { return Column( children: [ - LoanDetailItem( + LoanDetailTile( title: 'You got', trailing: '101.53 USDT', ), SizedBox(height: 30), - LoanDetailItem( + LoanDetailTile( title: 'Your deposit', trailing: '101.53 USDT', ), SizedBox(height: 30), - LoanDetailItem( + LoanDetailTile( title: 'Repayment', trailing: '101.53 USDT', ), SizedBox(height: 30), - LoanDetailItem( + LoanDetailTile( title: 'Market price', trailing: '1,779.42 XMR/USDT', ), SizedBox(height: 30), - LoanDetailItem( + LoanDetailTile( title: 'Liquidation price', trailing: '1,779.42 XMR/USDT', ), SizedBox(height: 30), - LoanDetailItem( + LoanDetailTile( title: 'Buffer', subtitle: 'How much XMR must fall in relation to USDT before liquidation', @@ -192,68 +193,3 @@ class LoanContent extends StatelessWidget { ); } } - -class LoanDetailItem extends StatelessWidget { - LoanDetailItem({ - @required this.title, - this.subtitle, - @required this.trailing, - }); - - final String title; - final String subtitle; - final String trailing; - - ThemeBase get currentTheme => getIt.get().currentTheme; - - Color get textColor => - currentTheme.type == ThemeType.dark ? Colors.white : Color(0xff393939); - - @override - Widget build(BuildContext context) { - return Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text( - title, - style: TextStyle( - color: textColor, - fontFamily: 'Poppins', - fontSize: 18, - fontWeight: FontWeight.w600, - ), - ), - subtitle != null - ? SizedBox( - width: 200, - child: Text( - subtitle, - style: TextStyle( - color: textColor, - fontFamily: 'Poppins', - fontSize: 12, - fontStyle: FontStyle.italic, - fontWeight: FontWeight.w400, - ), - ), - ) - : SizedBox.shrink(), - ], - ), - Text( - trailing, - style: TextStyle( - color: textColor, - fontFamily: 'Poppins', - fontSize: 18, - fontWeight: FontWeight.w400, - ), - ), - ], - ); - } -} diff --git a/lib/src/screens/loan/widgets/loan_detail_tile.dart b/lib/src/screens/loan/widgets/loan_detail_tile.dart new file mode 100644 index 000000000..4492921f7 --- /dev/null +++ b/lib/src/screens/loan/widgets/loan_detail_tile.dart @@ -0,0 +1,72 @@ +import 'package:cake_wallet/di.dart'; +import 'package:cake_wallet/store/settings_store.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; +import 'package:flutter/material.dart'; + +class LoanDetailTile extends StatelessWidget { + LoanDetailTile({ + @required this.title, + this.subtitle, + @required this.trailing, + }); + + final String title; + final String subtitle; + final String trailing; + + ThemeBase get currentTheme => getIt.get().currentTheme; + + Color get textColor => + currentTheme.type == ThemeType.dark ? Colors.white : Color(0xff393939); + + @override + Widget build(BuildContext context) { + return Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + SizedBox( + width: 150, + child: Text( + title, + style: TextStyle( + color: textColor, + fontFamily: 'Poppins', + fontSize: 18, + fontWeight: FontWeight.w600, + ), + ), + ), + subtitle != null + ? SizedBox( + width: 200, + child: Text( + subtitle, + style: TextStyle( + color: textColor, + fontFamily: 'Poppins', + fontSize: 12, + fontStyle: FontStyle.italic, + fontWeight: FontWeight.w400, + ), + ), + ) + : SizedBox.shrink(), + ], + ), + Text( + trailing, + style: TextStyle( + color: textColor, + fontFamily: 'Poppins', + fontSize: 18, + fontWeight: FontWeight.w400, + ), + ), + ], + ); + } +}