deposit new ui
This commit is contained in:
jayesh
@@ -43,6 +43,8 @@ class RouteName {
|
||||
static const String withdrawalConfirmation = 'withdrawalConfirmation';
|
||||
static const String depositScreen = 'depositScreen';
|
||||
static const String depositPreview = 'depositPreview';
|
||||
static const String selectDepositMethodScreen = 'selectDepositMethodScreen';
|
||||
static const String depositStepScreen = 'depositStepScreen';
|
||||
|
||||
//Biometric
|
||||
static const String biometricScreen = 'biometricScreen';
|
||||
|
||||
@@ -8,7 +8,9 @@ import 'package:tanami_app/features/MainScreens/Invest/presentation/pages/paymen
|
||||
import 'package:tanami_app/features/MainScreens/Invest/presentation/pages/payment/invest_payment_screen.dart';
|
||||
import 'package:tanami_app/features/MainScreens/Portfolio/presentation/pages/portfolio_details_screen.dart';
|
||||
import 'package:tanami_app/features/MainScreens/Wallet/presentation/pages/deposit/deposit_screen.dart';
|
||||
import 'package:tanami_app/features/MainScreens/Wallet/presentation/pages/deposit/deposit_step_screen.dart';
|
||||
import 'package:tanami_app/features/MainScreens/Wallet/presentation/pages/deposit/preview.dart';
|
||||
import 'package:tanami_app/features/MainScreens/Wallet/presentation/pages/deposit/select_deposit_method_screen.dart';
|
||||
import 'package:tanami_app/features/MainScreens/Wallet/presentation/pages/filter_screen.dart';
|
||||
import 'package:tanami_app/features/MainScreens/Wallet/presentation/pages/walletDetails.dart';
|
||||
import 'package:tanami_app/features/MainScreens/Wallet/presentation/pages/withdrawal/confirmation.dart';
|
||||
@@ -208,6 +210,20 @@ final goRouter = GoRouter(
|
||||
return const DepositScreen();
|
||||
},
|
||||
),
|
||||
GoRoute(
|
||||
name: RouteName.selectDepositMethodScreen,
|
||||
path: RouteName.selectDepositMethodScreen,
|
||||
builder: (context, state) {
|
||||
return const SelectDepositMethodScreen();
|
||||
},
|
||||
),
|
||||
GoRoute(
|
||||
name: RouteName.depositStepScreen,
|
||||
path: RouteName.depositStepScreen,
|
||||
builder: (context, state) {
|
||||
return const DepositStepScreen();
|
||||
},
|
||||
),
|
||||
GoRoute(
|
||||
name: RouteName.depositPreview,
|
||||
path: RouteName.depositPreview,
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
class AppImages {
|
||||
//Splash
|
||||
static const String splashBg =
|
||||
"assets/images/welcome_screen/svg/tanamibg.svg";
|
||||
"assets/images/welcome_screen/svg/Splash_BG.svg";
|
||||
static const String splashLogo =
|
||||
"assets/images/welcome_screen/svg/Tanami_Capital_Splash_Logo.svg";
|
||||
|
||||
@@ -129,7 +129,6 @@ class AppImages {
|
||||
'assets/images/wallet_screen/search.png';
|
||||
static const String walletFilterIcon =
|
||||
'assets/images/wallet_screen/filter.png';
|
||||
|
||||
static const String depositListIcon =
|
||||
'assets/images/wallet_screen/deposit_list.png';
|
||||
static const String withdrawalListIcon =
|
||||
@@ -140,4 +139,7 @@ class AppImages {
|
||||
'assets/images/wallet_screen/yield_list.png';
|
||||
static const String refundListIcon =
|
||||
'assets/images/wallet_screen/refund_list.png';
|
||||
static const String dStep1Icon = 'assets/images/wallet_screen/d_step_1.svg';
|
||||
static const String dStep2Icon = 'assets/images/wallet_screen/d_step_2.svg';
|
||||
static const String dStep3Icon = 'assets/images/wallet_screen/d_step_3.svg';
|
||||
}
|
||||
|
||||
@@ -14,12 +14,12 @@ import '../../../../../../core/styles/app_images.dart';
|
||||
import '../../../../../../core/styles/app_text.dart';
|
||||
import '../../../../../../core/utils/language/localizations_delegate.dart';
|
||||
import '../../../../../../core/utils/text_formatter/comma_input_text_formatter.dart';
|
||||
import '../../../../../../shared/components/text_widget.dart';
|
||||
import '../../../../../countrySelection/bloc/choose_country_bloc.dart';
|
||||
import '../../../../../countrySelection/bloc/choose_country_state.dart';
|
||||
import '../../bloc/deposit/deposit_payment_bloc.dart';
|
||||
import '../../bloc/deposit/deposit_payment_event.dart';
|
||||
import '../../bloc/deposit/deposit_payment_state.dart';
|
||||
import '../../widgets/deposit_pay_method_section.dart';
|
||||
|
||||
class DepositLayout extends StatelessWidget {
|
||||
const DepositLayout({super.key});
|
||||
@@ -28,13 +28,12 @@ class DepositLayout extends StatelessWidget {
|
||||
Widget build(BuildContext context) {
|
||||
var localizations = AppLocalizations.of(context);
|
||||
final depositPaymentBloc = context.read<DepositPaymentBloc>();
|
||||
|
||||
int selectedIndex = 0;
|
||||
return Scaffold(
|
||||
bottomNavigationBar: BlocBuilder<DepositPaymentBloc, DepositPaymentState>(
|
||||
builder: (context, state) {
|
||||
return BlocBuilder<RadioBloc, RadioState>(
|
||||
builder: (context, radioState) {
|
||||
int selectedIndex = 0;
|
||||
if (radioState is RadioSelectionChanged) {
|
||||
selectedIndex = radioState.selectedIndex;
|
||||
}
|
||||
@@ -93,7 +92,7 @@ class DepositLayout extends StatelessWidget {
|
||||
: AppColor.inactiveBtnColor),
|
||||
child: Center(
|
||||
child: Text(
|
||||
localizations.translate(AppText.depositNoti),
|
||||
localizations.translate(AppText.next),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: state.isFormValid
|
||||
? AppColor.plainWhite
|
||||
@@ -117,258 +116,228 @@ class DepositLayout extends StatelessWidget {
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
RichText(
|
||||
text: TextSpan(
|
||||
children: [
|
||||
TextSpan(
|
||||
text: '${localizations.translate(AppText.balance)}: ',
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.grey,
|
||||
fontSize: 12.sp,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
TextSpan(
|
||||
text: 'SAR 178,000',
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.black,
|
||||
fontSize: 14.sp,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
height: 20.h,
|
||||
),
|
||||
// RichText(
|
||||
// text: TextSpan(
|
||||
// children: [
|
||||
// TextSpan(
|
||||
// text: '${localizations.translate(AppText.balance)}: ',
|
||||
// style: GoogleFonts.dmSans(
|
||||
// color: Colors.grey,
|
||||
// fontSize: 12.sp,
|
||||
// fontWeight: FontWeight.bold,
|
||||
// ),
|
||||
// ),
|
||||
// TextSpan(
|
||||
// text: 'SAR 178,000',
|
||||
// style: GoogleFonts.dmSans(
|
||||
// color: Colors.black,
|
||||
// fontSize: 14.sp,
|
||||
// fontWeight: FontWeight.bold,
|
||||
// ),
|
||||
// ),
|
||||
// ],
|
||||
// ),
|
||||
// ),
|
||||
|
||||
// SizedBox(
|
||||
// height: 20.h,
|
||||
// ),
|
||||
BlocBuilder<DepositPaymentBloc, DepositPaymentState>(
|
||||
builder: (context, state) {
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(22.r),
|
||||
color: Colors.white,
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.15),
|
||||
spreadRadius: 2,
|
||||
blurRadius: 10,
|
||||
offset: const Offset(0, 5),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: selectedIndex == 1
|
||||
? Row(children: [
|
||||
SvgPicture.asset(AppImages.applePayIcon),
|
||||
const Gap(5),
|
||||
TextWidget().text14W700(
|
||||
localizations
|
||||
.translate(AppText.applePayText),
|
||||
clr: AppColor.textLabelColor),
|
||||
])
|
||||
: Row(
|
||||
children: [
|
||||
SvgPicture.asset(AppImages.walletIcon),
|
||||
const Gap(5),
|
||||
TextWidget().text14W700(
|
||||
localizations
|
||||
.translate(AppText.bankTransfer),
|
||||
clr: AppColor.textLabelColor),
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
// decoration: BoxDecoration(
|
||||
// color: const Color(0xFFD8D8D8).withOpacity(0.4),
|
||||
// ),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
vertical: 16.0, horizontal: 12.0),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
Container(
|
||||
decoration: const BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: Color(0xFF0FA4A4)),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: Image.asset(
|
||||
'assets/images/wallet_screen/deposit_list.png',
|
||||
height: 36.h,
|
||||
),
|
||||
Text(
|
||||
'SAR',
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF363636),
|
||||
fontSize: 15.sp,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
width: 12.w,
|
||||
),
|
||||
Text(
|
||||
localizations.translate(AppText.depositTitle),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.black,
|
||||
fontSize: 17.sp,
|
||||
fontWeight: FontWeight.w700,
|
||||
SizedBox(
|
||||
width: 280.w,
|
||||
child: TextFormField(
|
||||
inputFormatters: [
|
||||
CommaTextInputFormatter(),
|
||||
FilteringTextInputFormatter.deny(
|
||||
RegExp(r'\s')),
|
||||
LengthLimitingTextInputFormatter(20),
|
||||
],
|
||||
validator: (value) {
|
||||
if (depositPaymentBloc
|
||||
.amountController.text.isEmpty) {
|
||||
return localizations.translate(
|
||||
AppText.pleaseEnterAmountText);
|
||||
}
|
||||
return null;
|
||||
},
|
||||
onChanged: (value) {
|
||||
depositPaymentBloc
|
||||
.add(FormTextChanged(text: value));
|
||||
},
|
||||
controller:
|
||||
depositPaymentBloc.amountController,
|
||||
cursorColor: Colors.black,
|
||||
keyboardType: TextInputType.number,
|
||||
textAlign: TextAlign.center,
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.black,
|
||||
fontSize: 16.sp,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
decoration: InputDecoration(
|
||||
hintText: '1000',
|
||||
hintStyle: GoogleFonts.dmSans(
|
||||
color: const Color(0xFFC6C6C6),
|
||||
fontSize: 16.sp,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
labelStyle:
|
||||
const TextStyle(color: Colors.black),
|
||||
contentPadding: const EdgeInsets.symmetric(
|
||||
vertical: 15, horizontal: 10),
|
||||
filled: true,
|
||||
fillColor: Colors.white,
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.white, width: 1),
|
||||
),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.white, width: 1),
|
||||
),
|
||||
disabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.white, width: 1),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.white, width: 1),
|
||||
),
|
||||
errorBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.red, width: 1),
|
||||
),
|
||||
focusedErrorBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.red, width: 1),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xFFD8D8D8).withOpacity(0.4),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
vertical: 16.0, horizontal: 12.0),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
'SAR',
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF363636),
|
||||
fontSize: 15.sp,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
width: 12.w,
|
||||
),
|
||||
SizedBox(
|
||||
width: 280.w,
|
||||
child: TextFormField(
|
||||
inputFormatters: [
|
||||
CommaTextInputFormatter(),
|
||||
FilteringTextInputFormatter.deny(
|
||||
RegExp(r'\s')),
|
||||
LengthLimitingTextInputFormatter(20),
|
||||
],
|
||||
validator: (value) {
|
||||
if (depositPaymentBloc
|
||||
.amountController.text.isEmpty) {
|
||||
return localizations.translate(
|
||||
AppText.pleaseEnterAmountText);
|
||||
}
|
||||
return null;
|
||||
},
|
||||
onChanged: (value) {
|
||||
depositPaymentBloc
|
||||
.add(FormTextChanged(text: value));
|
||||
},
|
||||
controller:
|
||||
depositPaymentBloc.amountController,
|
||||
cursorColor: Colors.black,
|
||||
keyboardType: TextInputType.number,
|
||||
textAlign: TextAlign.center,
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.black,
|
||||
fontSize: 16.sp,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
decoration: InputDecoration(
|
||||
hintText: '1000',
|
||||
hintStyle: GoogleFonts.dmSans(
|
||||
color: const Color(0xFFC6C6C6),
|
||||
fontSize: 16.sp,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
labelStyle:
|
||||
const TextStyle(color: Colors.black),
|
||||
contentPadding:
|
||||
const EdgeInsets.symmetric(
|
||||
vertical: 15, horizontal: 10),
|
||||
filled: true,
|
||||
fillColor: Colors.white,
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.white, width: 1),
|
||||
),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.white, width: 1),
|
||||
),
|
||||
disabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.white, width: 1),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.white, width: 1),
|
||||
),
|
||||
errorBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.red, width: 1),
|
||||
),
|
||||
focusedErrorBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.red, width: 1),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
// Container(
|
||||
// decoration: BoxDecoration(
|
||||
// color: const Color(0xFFD8D8D8).withOpacity(0.4),
|
||||
// borderRadius: BorderRadius.only(
|
||||
// bottomLeft: Radius.circular(22.r),
|
||||
// bottomRight: Radius.circular(22.r),
|
||||
// ),
|
||||
// border: const Border(
|
||||
// top: BorderSide(
|
||||
// color: Color(0xFFD8D8D8), width: 2.0),
|
||||
// ),
|
||||
// ),
|
||||
// child: Padding(
|
||||
// padding: const EdgeInsets.symmetric(
|
||||
// vertical: 16.0, horizontal: 12.0),
|
||||
// child: Column(
|
||||
// children: [
|
||||
// Row(
|
||||
// mainAxisAlignment:
|
||||
// MainAxisAlignment.spaceBetween,
|
||||
// children: [
|
||||
// Text(
|
||||
// localizations
|
||||
// .translate(AppText.processingFees),
|
||||
// style: GoogleFonts.dmSans(
|
||||
// color: const Color(0xFF535353),
|
||||
// fontSize: 14.sp,
|
||||
// fontWeight: FontWeight.w500,
|
||||
// ),
|
||||
// ),
|
||||
// Text(
|
||||
// '3%',
|
||||
// style: GoogleFonts.dmSans(
|
||||
// color: Colors.black,
|
||||
// fontSize: 14.sp,
|
||||
// fontWeight: FontWeight.w700,
|
||||
// ),
|
||||
// ),
|
||||
// ],
|
||||
// ),
|
||||
// ],
|
||||
// ),
|
||||
// ),
|
||||
// ),
|
||||
|
||||
const Gap(15),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
localizations
|
||||
.translate("Total : SAR ${state.amount}"),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF066123),
|
||||
fontSize: 16.sp,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
),
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xFFD8D8D8).withOpacity(0.4),
|
||||
borderRadius: BorderRadius.only(
|
||||
bottomLeft: Radius.circular(22.r),
|
||||
bottomRight: Radius.circular(22.r),
|
||||
),
|
||||
border: const Border(
|
||||
top: BorderSide(
|
||||
color: Color(0xFFD8D8D8), width: 2.0),
|
||||
),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
vertical: 16.0, horizontal: 12.0),
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment:
|
||||
MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
localizations
|
||||
.translate(AppText.processingFees),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF535353),
|
||||
fontSize: 14.sp,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'3%',
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.black,
|
||||
fontSize: 14.sp,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
Row(
|
||||
mainAxisAlignment:
|
||||
MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
localizations
|
||||
.translate(AppText.depositAmt),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF535353),
|
||||
fontSize: 14.sp,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'SAR ${state.amount}',
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.black,
|
||||
fontSize: 14.sp,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
),
|
||||
const Gap(30),
|
||||
const DepositPayMethodSection(),
|
||||
const Gap(16),
|
||||
// const Gap(30),
|
||||
// const DepositPayMethodSection(),
|
||||
// const Gap(16),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
@@ -8,15 +8,9 @@ import 'package:tanami_app/features/MainScreens/Wallet/presentation/pages/deposi
|
||||
|
||||
import '../../../../../../core/utils/language/localizations_delegate.dart';
|
||||
|
||||
class DepositScreen extends StatefulWidget {
|
||||
class DepositScreen extends StatelessWidget {
|
||||
const DepositScreen({super.key});
|
||||
|
||||
@override
|
||||
State<DepositScreen> createState() => _DepositScreenState();
|
||||
}
|
||||
|
||||
class _DepositScreenState extends State<DepositScreen> {
|
||||
int selectedIndex = 0;
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
var localizations = AppLocalizations.of(context);
|
||||
@@ -28,7 +22,7 @@ class _DepositScreenState extends State<DepositScreen> {
|
||||
scrolledUnderElevation: 0.0,
|
||||
centerTitle: true,
|
||||
title: Text(
|
||||
localizations.translate(AppText.depositScreenTitle),
|
||||
localizations.translate(AppText.deposit),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF272727),
|
||||
fontSize: 20.sp,
|
||||
|
||||
@@ -0,0 +1,161 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
||||
import 'package:flutter_svg/flutter_svg.dart';
|
||||
import 'package:gap/gap.dart';
|
||||
import 'package:google_fonts/google_fonts.dart';
|
||||
import 'package:tanami_app/core/routes/route_name.dart';
|
||||
import 'package:tanami_app/core/routes/routes.dart';
|
||||
import 'package:tanami_app/core/styles/app_images.dart';
|
||||
import 'package:tanami_app/shared/components/text_widget.dart';
|
||||
|
||||
import '../../../../../../core/styles/app_color.dart';
|
||||
import '../../../../../../core/styles/app_text.dart';
|
||||
import '../../../../../../core/utils/language/localizations_delegate.dart';
|
||||
import '../../../../../../shared/components/button_widget.dart';
|
||||
|
||||
class DepositStepScreen extends StatelessWidget {
|
||||
const DepositStepScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
var localizations = AppLocalizations.of(context);
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: Colors.white,
|
||||
bottomNavigationBar: Container(
|
||||
margin: const EdgeInsets.symmetric(
|
||||
horizontal: 16,
|
||||
vertical: 16,
|
||||
),
|
||||
width: 1.sw,
|
||||
height: 56.h,
|
||||
child: ButtonWidget().elevatedBtn(
|
||||
txtClr: AppColor.plainWhite,
|
||||
function: () {
|
||||
goRouter.pushNamed(RouteName.depositScreen);
|
||||
},
|
||||
text: localizations.translate(AppText.next),
|
||||
clr: AppColor.primaryColor2,
|
||||
),
|
||||
),
|
||||
appBar: AppBar(
|
||||
backgroundColor: Colors.white,
|
||||
elevation: 0,
|
||||
scrolledUnderElevation: 0.0,
|
||||
centerTitle: true,
|
||||
title: Text(
|
||||
localizations.translate(AppText.bankTransfer),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF272727),
|
||||
fontSize: 20.sp,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
actions: const [
|
||||
Icon(
|
||||
Icons.info,
|
||||
color: Color(0xFF363636),
|
||||
),
|
||||
Gap(10)
|
||||
],
|
||||
),
|
||||
body: Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 20),
|
||||
decoration: ShapeDecoration(
|
||||
color: const Color(0xFFF6F6F6),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(22),
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: [
|
||||
SizedBox(
|
||||
width: 0.8.sw,
|
||||
child: Text(
|
||||
'In order for you to complete a bank transfer, you need will need to create a deposit notification and transfer funds from your wallet, directly into your bank account.',
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF363636),
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
const Spacer(),
|
||||
const Icon(
|
||||
Icons.close,
|
||||
color: Color(0xFF363636),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
const Gap(16),
|
||||
TextWidget().text15W700("Please complete the below steps",
|
||||
clr: AppColor.plainBlack),
|
||||
const Gap(16),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: ListView(
|
||||
shrinkWrap: true,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
SvgPicture.asset(AppImages.dStep1Icon),
|
||||
const Gap(16),
|
||||
Expanded(
|
||||
child: TextWidget().text14W400(
|
||||
"Insert the amount you would like to transfer.",
|
||||
clr: const Color(0xFF363636),
|
||||
txtAlign: TextAlign.start,
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
const Gap(24),
|
||||
Row(
|
||||
children: [
|
||||
SvgPicture.asset(AppImages.dStep2Icon),
|
||||
const Gap(16),
|
||||
Expanded(
|
||||
child: TextWidget().text14W400(
|
||||
"Copy the bank details of your Tanami account shown on the next page. Make sure to keep note of the reference ID.",
|
||||
clr: const Color(0xFF363636),
|
||||
txtAlign: TextAlign.start,
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
const Gap(24),
|
||||
Row(
|
||||
children: [
|
||||
SvgPicture.asset(AppImages.dStep3Icon),
|
||||
const Gap(16),
|
||||
Expanded(
|
||||
child: TextWidget().text14W400(
|
||||
"Insert the amount you would like to transfer.",
|
||||
clr: const Color(0xFF363636),
|
||||
txtAlign: TextAlign.start,
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const Spacer(),
|
||||
TextWidget().text13W500(
|
||||
"Tanami will notify you upon receipt of your funds and it will appear in your wallet balance 3-4 business days after initiating the transfer.",
|
||||
clr: const Color(0xFF888888),
|
||||
fontStyle: FontStyle.italic),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -3,8 +3,8 @@ import 'package:flutter_screenutil/flutter_screenutil.dart';
|
||||
import 'package:gap/gap.dart';
|
||||
import 'package:google_fonts/google_fonts.dart';
|
||||
import 'package:tanami_app/core/routes/routes.dart';
|
||||
import 'package:tanami_app/core/styles/app_color.dart';
|
||||
import 'package:tanami_app/core/styles/app_text.dart';
|
||||
import 'package:tanami_app/shared/components/text_widget.dart';
|
||||
|
||||
import '../../../../../../core/utils/language/localizations_delegate.dart';
|
||||
|
||||
@@ -17,13 +17,13 @@ class DepositPreview extends StatefulWidget {
|
||||
|
||||
class _DepositPreviewState extends State<DepositPreview> {
|
||||
List values = [
|
||||
'Name Surname',
|
||||
'DE 1234 5678 9012 3456',
|
||||
'Hohenzollernring 58, 95444',
|
||||
'Name Bank',
|
||||
'Hohenzollernring 58, 95444',
|
||||
'BC12345',
|
||||
'FRYU FHDU 1234',
|
||||
'Tanami Capital W.L.L',
|
||||
'100000480779',
|
||||
'BH 23 BBKU 00100 00048 0779',
|
||||
'BBKUBHBM',
|
||||
'Bank of Bahrain and Kuwait B.S.C',
|
||||
'43 Government Avenue, Manama, Kingdom of Bahrain',
|
||||
'BH00600000',
|
||||
];
|
||||
|
||||
List titles2 = [
|
||||
@@ -42,13 +42,13 @@ class _DepositPreviewState extends State<DepositPreview> {
|
||||
Widget build(BuildContext context) {
|
||||
var localizations = AppLocalizations.of(context);
|
||||
List titles = [
|
||||
localizations.translate(AppText.accountHolderName),
|
||||
localizations.translate(AppText.iban),
|
||||
localizations.translate(AppText.beneficiaryAddress),
|
||||
localizations.translate(AppText.bankName),
|
||||
localizations.translate(AppText.branchAddress),
|
||||
localizations.translate(AppText.SWIFTcode),
|
||||
localizations.translate(AppText.refid),
|
||||
localizations.translate("Account Name"),
|
||||
localizations.translate("Account No."),
|
||||
localizations.translate("IBAN"),
|
||||
localizations.translate("SWIFT Code"),
|
||||
localizations.translate("Bank Name"),
|
||||
localizations.translate("Bank Address"),
|
||||
localizations.translate("Client ID"),
|
||||
];
|
||||
return Scaffold(
|
||||
backgroundColor: Colors.white,
|
||||
@@ -58,7 +58,7 @@ class _DepositPreviewState extends State<DepositPreview> {
|
||||
scrolledUnderElevation: 0.0,
|
||||
centerTitle: true,
|
||||
title: Text(
|
||||
localizations.translate(AppText.depositScreenTitle),
|
||||
localizations.translate("Deposit confirmation"),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF272727),
|
||||
fontSize: 20.sp,
|
||||
@@ -281,90 +281,102 @@ class _DepositPreviewState extends State<DepositPreview> {
|
||||
// SizedBox(
|
||||
// height: 20.h,
|
||||
// ),
|
||||
Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
localizations.translate(AppText.depositDetails),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.black,
|
||||
fontSize: 15.sp,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
height: 10.h,
|
||||
),
|
||||
const Divider(
|
||||
color: Color(0xFFE3E3E3),
|
||||
),
|
||||
SizedBox(
|
||||
height: 10.h,
|
||||
),
|
||||
ListView.builder(
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
itemCount: titles.length,
|
||||
shrinkWrap: true,
|
||||
itemBuilder: (context, index) {
|
||||
return Column(
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
Card(
|
||||
color: AppColor.plainWhite,
|
||||
elevation: 5,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
localizations.translate(AppText.depositDetails),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.black,
|
||||
fontSize: 15.sp,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
height: 10.h,
|
||||
),
|
||||
const Divider(
|
||||
color: Color(0xFFE3E3E3),
|
||||
),
|
||||
SizedBox(
|
||||
height: 10.h,
|
||||
),
|
||||
ListView.builder(
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
itemCount: titles.length,
|
||||
shrinkWrap: true,
|
||||
itemBuilder: (context, index) {
|
||||
return Column(
|
||||
children: [
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
Row(
|
||||
mainAxisAlignment:
|
||||
MainAxisAlignment.spaceBetween,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
titles[index],
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.black,
|
||||
fontSize: 14.sp,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
height: 8.h,
|
||||
),
|
||||
Text(
|
||||
values[index],
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF191B1E),
|
||||
fontSize: 14.sp,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
Column(
|
||||
crossAxisAlignment:
|
||||
CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
titles[index],
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.black,
|
||||
fontSize: 14.sp,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
height: 8.h,
|
||||
),
|
||||
SizedBox(
|
||||
width: 0.8.sw,
|
||||
child: Text(
|
||||
values[index],
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF191B1E),
|
||||
fontSize: 14.sp,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
// Image.asset(
|
||||
// 'assets/images/wallet_screen/copy.png',
|
||||
// height: 25.h,
|
||||
// )
|
||||
],
|
||||
),
|
||||
Image.asset(
|
||||
'assets/images/wallet_screen/copy.png',
|
||||
height: 25.h,
|
||||
)
|
||||
(index != titles.length - 1)
|
||||
? Column(
|
||||
children: [
|
||||
SizedBox(
|
||||
height: 12.h,
|
||||
),
|
||||
Divider(
|
||||
color: const Color(0xFFE3E3E3),
|
||||
height: 2.h),
|
||||
SizedBox(
|
||||
height: 12.h,
|
||||
),
|
||||
],
|
||||
)
|
||||
: SizedBox(
|
||||
height: 10.h,
|
||||
),
|
||||
],
|
||||
),
|
||||
(index != titles.length - 1)
|
||||
? Column(
|
||||
children: [
|
||||
SizedBox(
|
||||
height: 12.h,
|
||||
),
|
||||
Divider(
|
||||
color: const Color(0xFFE3E3E3),
|
||||
height: 2.h),
|
||||
SizedBox(
|
||||
height: 12.h,
|
||||
),
|
||||
],
|
||||
)
|
||||
: SizedBox(
|
||||
height: 10.h,
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
)
|
||||
],
|
||||
);
|
||||
},
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
@@ -378,6 +390,8 @@ class _DepositPreviewState extends State<DepositPreview> {
|
||||
onTap: () {
|
||||
goRouter.pop();
|
||||
goRouter.pop();
|
||||
goRouter.pop();
|
||||
goRouter.pop();
|
||||
},
|
||||
child: Container(
|
||||
margin: const EdgeInsets.all(10.0),
|
||||
@@ -391,7 +405,7 @@ class _DepositPreviewState extends State<DepositPreview> {
|
||||
padding: const EdgeInsets.symmetric(vertical: 20.0),
|
||||
child: Center(
|
||||
child: Text(
|
||||
localizations.translate(AppText.submitDeposit),
|
||||
localizations.translate(AppText.depositNoti),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: Colors.white,
|
||||
fontSize: 14.sp,
|
||||
@@ -403,19 +417,19 @@ class _DepositPreviewState extends State<DepositPreview> {
|
||||
),
|
||||
),
|
||||
const Gap(10),
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
goRouter.pop();
|
||||
},
|
||||
child: Center(
|
||||
child: TextWidget().text14W700(
|
||||
localizations.translate(AppText.back),
|
||||
clr: const Color(0xFF363636),
|
||||
textDecoration: TextDecoration.underline,
|
||||
),
|
||||
),
|
||||
),
|
||||
const Gap(20),
|
||||
// GestureDetector(
|
||||
// onTap: () {
|
||||
// goRouter.pop();
|
||||
// },
|
||||
// child: Center(
|
||||
// child: TextWidget().text14W700(
|
||||
// localizations.translate(AppText.back),
|
||||
// clr: const Color(0xFF363636),
|
||||
// textDecoration: TextDecoration.underline,
|
||||
// ),
|
||||
// ),
|
||||
// ),
|
||||
// const Gap(20),
|
||||
],
|
||||
),
|
||||
);
|
||||
|
||||
@@ -0,0 +1,68 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
||||
import 'package:google_fonts/google_fonts.dart';
|
||||
import 'package:tanami_app/core/routes/route_name.dart';
|
||||
import 'package:tanami_app/core/routes/routes.dart';
|
||||
|
||||
import '../../../../../../core/styles/app_color.dart';
|
||||
import '../../../../../../core/styles/app_text.dart';
|
||||
import '../../../../../../core/utils/language/localizations_delegate.dart';
|
||||
import '../../../../../../shared/components/button_widget.dart';
|
||||
import '../../../../../countrySelection/bloc/choose_country_bloc.dart';
|
||||
import '../../widgets/deposit_pay_method_section.dart';
|
||||
|
||||
class SelectDepositMethodScreen extends StatelessWidget {
|
||||
const SelectDepositMethodScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
var localizations = AppLocalizations.of(context);
|
||||
final radioBloc = context.read<RadioBloc>();
|
||||
return Scaffold(
|
||||
backgroundColor: Colors.white,
|
||||
bottomNavigationBar: Container(
|
||||
margin: const EdgeInsets.symmetric(
|
||||
horizontal: 16,
|
||||
vertical: 16,
|
||||
),
|
||||
width: 1.sw,
|
||||
height: 56.h,
|
||||
child: ButtonWidget().elevatedBtn(
|
||||
txtClr: AppColor.plainWhite,
|
||||
function: () {
|
||||
if (radioBloc.selectedCountry == 0) {
|
||||
goRouter.pushNamed(RouteName.depositStepScreen);
|
||||
} else {
|
||||
goRouter.pushNamed(RouteName.depositScreen);
|
||||
}
|
||||
},
|
||||
text: localizations.translate(AppText.next),
|
||||
clr: AppColor.primaryColor2,
|
||||
),
|
||||
),
|
||||
appBar: AppBar(
|
||||
backgroundColor: Colors.white,
|
||||
elevation: 0,
|
||||
scrolledUnderElevation: 0.0,
|
||||
centerTitle: true,
|
||||
title: Text(
|
||||
localizations.translate(AppText.deposit),
|
||||
style: GoogleFonts.dmSans(
|
||||
color: const Color(0xFF272727),
|
||||
fontSize: 20.sp,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
),
|
||||
body: const Padding(
|
||||
padding: EdgeInsets.all(16.0),
|
||||
child: Column(
|
||||
children: [
|
||||
DepositPayMethodSection(),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -88,7 +88,8 @@ class _WalletScreenState extends State<WalletScreen> {
|
||||
children: [
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
goRouter.pushNamed(RouteName.depositScreen);
|
||||
goRouter.pushNamed(
|
||||
RouteName.selectDepositMethodScreen);
|
||||
},
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
|
||||
@@ -25,7 +25,7 @@ class SplashLayout extends StatelessWidget {
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
),
|
||||
/* Positioned.fill(
|
||||
Positioned.fill(
|
||||
child: Align(
|
||||
alignment: Alignment.center,
|
||||
child: SvgPicture.asset(
|
||||
@@ -39,7 +39,7 @@ class SplashLayout extends StatelessWidget {
|
||||
alignment: Alignment.bottomCenter,
|
||||
child: BottomVersionWidget(),
|
||||
),
|
||||
), */
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
@@ -88,10 +88,11 @@ class TextWidget {
|
||||
);
|
||||
}
|
||||
|
||||
Widget text13W500(String text, {Color? clr}) {
|
||||
Widget text13W500(String text, {Color? clr, FontStyle? fontStyle}) {
|
||||
return Text(
|
||||
text,
|
||||
style: GoogleFonts.dmSans(
|
||||
fontStyle: fontStyle ?? FontStyle.normal,
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: clr ?? AppColor.plainWhite,
|
||||
|
||||
Reference in New Issue
Block a user