nugrohob825/cims_apps
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: flow subscribe product

Browse Source
This commit is contained in:
Prajna Prayoga
2024-02-19 19:58:29 +07:00
parent 0762a8ab0c
commit 99db140a0c
31 changed files with 1170 additions and 372 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
lib/application/component/modal_redirect_app.dart Normal file
View File

@@ -0,0 +1,41 @@
import 'package:cims_apps/application/assets/path_assets.dart';
import 'package:cims_apps/application/component/image/image_view.dart';
import 'package:cims_apps/application/theme/color_palette.dart';
import 'package:flutter/material.dart';
class TypeApp {
String img, title;
TypeApp(this.img, this.title);
}
class ModalRedirectApp extends StatelessWidget {
final String value;
const ModalRedirectApp({super.key, required this.value});
@override
Widget build(BuildContext context) {
Map<String, TypeApp> typeApp = {
'Shopping Pay': TypeApp(PathAssets.imgOpenShopping, 'Shopping App'),
};
return Column(
children: [
ImageView(image: typeApp[value]!.img),
Text('Open ${typeApp[value]!.title}',
style: TextStyle(
fontSize: 22,
fontWeight: FontWeight.w600,
color: ColorPalette.slate800
),
),
Text('You will be redirected to the ${typeApp[value]!.title.toLowerCase()} to continue the payment',
style: TextStyle(
fontSize: 16,
color: ColorPalette.slate400
),
)
],
);
}
}

22
lib/application/component/goal_investing_view.dart → lib/application/component/subscribe/goal_investing_view.dart
View File

@@ -1,5 +1,7 @@
import 'package:cims_apps/application/assets/path_assets.dart';
import 'package:cims_apps/application/component/subscribe/other_plan_view.dart';
import 'package:cims_apps/application/theme/color_palette.dart';
import 'package:cims_apps/core/route/route.dart';
import 'package:cims_apps/core/utils/size_config.dart';
import 'package:flutter/material.dart';
@@ -20,7 +22,7 @@ class GoalInvestingView extends StatelessWidget {
GoalInvest(PathAssets.iconToga, 'Education'),
GoalInvest(PathAssets.iconCake, 'Marriage'),
GoalInvest(PathAssets.iconHouse, 'Old age days'),
GoalInvest(PathAssets.iconCreatePlan, 'Create Plan'),
GoalInvest(PathAssets.iconCreatePlan, 'Other Plan'),
];
return Column(
@@ -30,7 +32,18 @@ class GoalInvestingView extends StatelessWidget {
padding: EdgeInsets.only(top: e.key != 0 ? 16 : 0),
child: ListTile(
onTap: () {
onListSelected(e.value.title);
if(e.value.title == 'Other Plan'){
routePush(
context,
page: OtherPlanView(
selectedPlan: (value) {
onListSelected(e.value.title);
},
)
);
}else{
onListSelected(e.value.title);
}
},
shape: RoundedRectangleBorder(
side: BorderSide(color: ColorPalette.slate200),
@@ -51,10 +64,11 @@ class GoalInvestingView extends StatelessWidget {
title: Text(e.value.title,
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 16
fontSize: 16,
color: ColorPalette.slate800
),
),
trailing: Icon(Icons.chevron_right_rounded),
trailing: Icon(Icons.chevron_right_rounded, color: ColorPalette.slate400),
),
);
}).toList()

143
lib/application/component/subscribe/input_investment_view.dart Normal file
View File

@@ -0,0 +1,143 @@
import 'package:cims_apps/application/component/button/button_view.dart';
import 'package:cims_apps/application/component/numeric_pad/numeric_pad.dart';
import 'package:cims_apps/application/theme/color_palette.dart';
import 'package:cims_apps/core/utils/number_formatter.dart';
import 'package:cims_apps/core/utils/size_config.dart';
import 'package:flutter/material.dart';
class InputInvestmentView extends StatefulWidget {
final String selectedPlan;
final void Function(String value) nextMove;
const InputInvestmentView({super.key, required this.selectedPlan, required this.nextMove});
@override
State<InputInvestmentView> createState() => _InputInvestmentViewState();
}
class _InputInvestmentViewState extends State<InputInvestmentView> {
TextEditingController inputController = TextEditingController();
@override
void initState() {
// TODO: implement initState
inputController.text = 'Rp 0';
super.initState();
}
@override
void dispose() {
// TODO: implement dispose
super.dispose();
inputController.dispose();
}
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(16)
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(height: 16),
Padding(
padding: EdgeInsets.symmetric(horizontal: 24, vertical: 12),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(widget.selectedPlan,
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.w700,
),
),
Row(
children: [
Icon(Icons.change_circle_outlined, color: ColorPalette.primary, size: 20),
SizedBox(width: 4),
Text('Change',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
color: ColorPalette.primary
),
)
],
)
],
),
TextField(
controller: inputController,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 28,
fontWeight: FontWeight.w600,
color: ColorPalette.slate800
),
keyboardType: TextInputType.number,
onChanged: (value) {
value = value.replaceAll('Rp ', '').replaceAll('.', '');
double parseValue = double.parse(value);
if(value.isNotEmpty){
inputController.text = NumberFormatter.numberCurrency(parseValue, 'Rp ', 'id_ID', decimalDigits: 0);
}else{
inputController.text = NumberFormatter.numberCurrency(0, 'Rp ', 'id_ID', decimalDigits: 0);
}
},
decoration: InputDecoration(
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: ColorPalette.primary,
width: 2
),
)
),
),
SizedBox(height: 12),
Text('Minimum Budget Rp1,000,000',
style: TextStyle(
color: ColorPalette.slate400,
fontSize: 16,
fontWeight: FontWeight.w600
),
),
SizedBox(height: 16),
NumericPad(onNumberSelected: (p0) {
String checkIsZeroInput = inputController.text.replaceAll('Rp ', '').replaceAll(',', '');
String getNumeric = p0;
if(p0.isNotEmpty){
if(checkIsZeroInput != '0'){
getNumeric = checkIsZeroInput + getNumeric;
}
}else{
getNumeric = checkIsZeroInput.substring(0, checkIsZeroInput.length - 1);
}
String formatNumeric = NumberFormatter.numberCurrency(
double.parse(getNumeric), 'Rp ', 'id_ID', decimalDigits: 0).replaceAll('.', ',');
inputController.text = formatNumeric;
}),
SizedBox(height: 8),
ButtonView(
name: 'Next',
onPressed: () {
widget.nextMove(inputController.text);
},
width: SizeConfig.width,
heightWrapContent: true,
contentPadding: EdgeInsets.symmetric(vertical: 16),
marginVertical: 0,
)
],
),
),
],
),
);;
}
}

182
lib/application/component/subscribe/other_plan_view.dart Normal file
View File

@@ -0,0 +1,182 @@
import 'package:cims_apps/application/assets/path_assets.dart';
import 'package:cims_apps/application/component/button/button_view.dart';
import 'package:cims_apps/application/component/custom_app_bar/custom_app_bar.dart';
import 'package:cims_apps/application/component/image/image_view.dart';
import 'package:cims_apps/application/component/text_form/text_form_view.dart';
import 'package:cims_apps/application/theme/color_palette.dart';
import 'package:cims_apps/core/utils/size_config.dart';
import 'package:flutter/material.dart';
class Plan {
String img, name;
Plan(this.img, this.name);
}
class OtherPlanView extends StatefulWidget {
final void Function(String value) selectedPlan;
const OtherPlanView({super.key, required this.selectedPlan});
@override
State<OtherPlanView> createState() => _OtherPlanViewState();
}
class _OtherPlanViewState extends State<OtherPlanView> {
TextEditingController createController = TextEditingController();
Plan selectedPlan = Plan('', '');
List<Plan> listPlan = [
Plan(PathAssets.iconToga, 'Education'),
Plan(PathAssets.iconCake, 'Marriage'),
Plan(PathAssets.iconHouse, 'Home'),
Plan(PathAssets.iconTicket, 'Entertainment'),
Plan(PathAssets.iconGadget, 'Gadget'),
Plan(PathAssets.iconMarket, 'Business'),
Plan(PathAssets.iconBag, 'Fashion'),
Plan(PathAssets.iconCart, 'Shop'),
Plan(PathAssets.iconCar, 'Vehicle'),
Plan(PathAssets.iconPlane, 'Holiday'),
Plan(PathAssets.iconCreatePlan, 'Create Plan'),
];
@override
void initState() {
// TODO: implement initState
super.initState();
}
@override
void dispose() {
// TODO: implement dispose
super.dispose();
createController.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: CustomAppBar(
height: 70,
title: 'Other Plan'
),
body: GridView(
padding: EdgeInsets.symmetric(horizontal: 24, vertical: 32),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 3),
children: listPlan.map((e) => cardPlan(e)).toList(),
),
bottomNavigationBar: Container(
height: 110,
padding: EdgeInsets.symmetric(horizontal: 24),
child: ButtonView(
name: 'Select',
disabled: !(selectedPlan.img != ''),
onPressed: () {
Navigator.pop(context);
widget.selectedPlan(selectedPlan.name);
},
heightWrapContent: true,
width: SizeConfig.width,
contentPadding: EdgeInsets.symmetric(vertical: 12),
textColor: selectedPlan.img == '' ? ColorPalette.slate500 : ColorPalette.white,
disabledBgColor: ColorPalette.slate200,
backgroundColor: ColorPalette.primary,
),
),
);
}
Widget cardPlan(Plan plan) {
return GestureDetector(
onTap: () {
if(plan.name == 'Create Plan'){
showModalBottomSheet(
context: context,
builder: (context) => modalCreatePlan(),
);
}
setState(() {
selectedPlan = plan;
});
},
child: Container(
padding: EdgeInsets.symmetric(horizontal: 16, vertical: 8),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
border: Border.all(color: selectedPlan == plan ? ColorPalette.primary : Colors.transparent)
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
width: SizeConfig.width * 0.12,
height: SizeConfig.width * 0.12,
padding: EdgeInsets.all(12),
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
color: ColorPalette.blue200.withOpacity(0.5)
),
child: ImageView(image: plan.img)
),
SizedBox(height: 12),
Text(plan.name,
style: TextStyle(
color: selectedPlan == plan ? ColorPalette.primary : ColorPalette.slate800,
fontWeight: FontWeight.w600
),
)
],
),
),
);
}
Widget modalCreatePlan() {
return Container(
padding: EdgeInsets.all(24),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text('Create your plan',
style: TextStyle(
fontWeight: FontWeight.w600,
color: ColorPalette.slate800,
fontSize: 16
),
),
GestureDetector(
onTap: () {
Navigator.pop(context);
},
child: Icon(Icons.close_rounded),
)
],
),
TextFormView(
name: 'Objective Name',
ctrl: createController,
),
SizedBox(height: 24),
ButtonView(
name: 'Select',
marginVertical: 0,
disabled: !(createController.text != ''),
onPressed: () {
Navigator.of(context)..pop()..pop();
widget.selectedPlan(selectedPlan.name);
},
heightWrapContent: true,
width: SizeConfig.width,
contentPadding: EdgeInsets.symmetric(vertical: 16),
textColor: createController.text == '' ? ColorPalette.slate500 : ColorPalette.white,
disabledBgColor: ColorPalette.slate200,
backgroundColor: ColorPalette.primary,
),
],
),
);
}
}

254
lib/application/component/subscribe/total_payment_view.dart Normal file
View File

@@ -0,0 +1,254 @@
import 'package:cims_apps/application/component/button/button_view.dart';
import 'package:cims_apps/application/theme/color_palette.dart';
import 'package:cims_apps/core/route/route.dart';
import 'package:cims_apps/core/utils/number_formatter.dart';
import 'package:cims_apps/features/dashboard/dashboard_account/view/product/view/step_subscribe/payment_method_view.dart';
import 'package:cims_apps/features/dashboard/dashboard_account/view/product/view_model/product_view_model.dart';
import 'package:flutter/material.dart';
class TotalPaymentView extends StatefulWidget {
final int totalInvest;
final List<Product> listProduct;
const TotalPaymentView({
super.key,
required this.listProduct,
required this.totalInvest,
});
@override
State<TotalPaymentView> createState() => _TotalPaymentViewState();
}
class _TotalPaymentViewState extends State<TotalPaymentView> {
bool isAgreement = false;
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(16)
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Padding(
padding: const EdgeInsets.all(24.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text('Your Investment Today',
style: TextStyle(
color: ColorPalette.slate800,
fontWeight: FontWeight.w600,
fontSize: 16
),
),
GestureDetector(
onTap: () => Navigator.pop(context),
child: const Icon(Icons.close_rounded)
)
],
),
),
...widget.listProduct.asMap().entries.map((e) {
return Container(
padding: const EdgeInsets.only(left: 16, right: 24, bottom: 16, top: 16),
decoration: BoxDecoration(
border: Border(
left: BorderSide(
width: 8,
color: ColorPalette.investTypeColor[e.value.type]!
)
)
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
flex: 5,
child: Text(e.value.name ?? '',
style: const TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16
),
)
),
Expanded(
flex: 7,
child: Text(
NumberFormatter.numberCurrency(widget.totalInvest * e.value.totalPercent!, 'Rp ', 'id_ID'),
textAlign: TextAlign.end,
style: const TextStyle(
fontWeight: FontWeight.w700,
fontSize: 18,
color: ColorPalette.slate800
),
)
)
],
),
);
}).toList(),
const SizedBox(height: 16),
const Padding(
padding: EdgeInsets.symmetric(horizontal: 24),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text('Purchase Commission',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16
),
),
Text('Free',
style: TextStyle(
color: ColorPalette.primary,
fontSize: 18,
fontWeight: FontWeight.w700
),
)
],
),
),
const SizedBox(height: 16,),
Container(
color: ColorPalette.slate200.withOpacity(0.5),
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text('Total',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16
),
),
Text(NumberFormatter.numberCurrency(widget.totalInvest, 'Rp ', 'id_ID'),
textAlign: TextAlign.end,
style: const TextStyle(
fontWeight: FontWeight.w700,
fontSize: 18,
color: ColorPalette.slate800
),
)
],
),
),
buttonAgreement(),
Container(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text('Total Payment',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16
),
),
Text(NumberFormatter.numberCurrency(widget.totalInvest, 'Rp ', 'id_ID'),
textAlign: TextAlign.end,
style: const TextStyle(
fontWeight: FontWeight.w700,
fontSize: 18,
color: ColorPalette.slate800
),
)
],
),
),
ButtonView(
disabled: !isAgreement,
name: 'Subscribe Now',
onPressed: () {
routePush(context, page: PaymentMethodView(
totalInvest: widget.totalInvest,
));
},
disabledBgColor: ColorPalette.slate200.withOpacity(0.5),
textColor: isAgreement ? Colors.white : ColorPalette.slate400,
textWeight: FontWeight.w700,
textSize: 20,
backgroundColor: ColorPalette.primary,
)
],
),
);
}
Widget buttonAgreement() {
bool isAgree = isAgreement;
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
GestureDetector(
onTap: () {
setState(() {
isAgreement = !isAgreement;
});
},
child: AnimatedContainer(
margin: const EdgeInsets.only(top: 4),
duration: const Duration(milliseconds: 200),
height: 16,
width: 16,
padding: const EdgeInsets.all(1),
alignment: Alignment.center,
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(
color: isAgree ? ColorPalette.primary : ColorPalette.slate200
)
),
child: AnimatedContainer(
duration: const Duration(milliseconds: 200),
child: Container(
decoration: BoxDecoration(
color: isAgree ? ColorPalette.primary : ColorPalette.white,
shape: BoxShape.circle
),
),
),
),
),
const SizedBox(width: 12,),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text('I agree to buy the mutual fund on this page and have read and agreed to all the contents of the Prospectus and summary information and understand the risks of my investment decision.',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
color: ColorPalette.slate400
),
),
GestureDetector(
onTap: () {
},
child: const Text('Read More',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
decoration: TextDecoration.underline,
color: ColorPalette.primary
),
)
)
],
)
)
],
),
);
}
}

52
lib/application/component/success_view.dart Normal file
View File

@@ -0,0 +1,52 @@
import 'package:cims_apps/application/component/button/button_view.dart';
import 'package:cims_apps/application/component/image/image_view.dart';
import 'package:cims_apps/core/utils/size_config.dart';
import 'package:flutter/material.dart';
class SuccessView extends StatelessWidget {
final String img;
final String textTitle;
final Widget? subtitle;
final void Function() nextRoute;
const SuccessView({super.key,
required this.img,
required this.textTitle,
required this.subtitle,
required this.nextRoute
});
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
ImageView(image: img, width: SizeConfig.width * .8,),
Text(textTitle,
style: TextStyle(
fontWeight: FontWeight.w700,
fontSize: 28,
),
),
subtitle ?? SizedBox()
],
),
),
bottomNavigationBar: Container(
padding: EdgeInsets.all(24),
height: 110,
width: SizeConfig.width,
child: ButtonView(
name: 'Done',
onPressed: nextRoute,
marginVertical: 0,
heightWrapContent: true,
width: SizeConfig.width,
textSize: 20,
contentPadding: EdgeInsets.symmetric(vertical: 12),
),
),
);
}
}

10
lib/application/component/text_form/text_form_view.dart
View File

@@ -5,6 +5,7 @@ import 'package:remove_emoji_input_formatter/remove_emoji_input_formatter.dart';
class TextFormView extends StatelessWidget {
final String name;
final double nameSize;
final String? helperText;
final String? initialValue;
final VoidCallback? onTap;
@@ -40,6 +41,7 @@ class TextFormView extends StatelessWidget {
TextFormView(
{Key? key,
required this.name,
this.nameSize = 16,
this.helperText,
this.onTap,
this.fontColorDisabled,
@@ -97,17 +99,17 @@ class TextFormView extends StatelessWidget {
children: [
Text(
name,
style: const TextStyle(
fontSize: 16,
style: TextStyle(
fontSize: nameSize,
fontWeight: FontWeight.w600,
color: ColorPalette.slate800,
),
),
suffixLable ??
const Text(
Text(
"",
style: TextStyle(
fontSize: 16,
fontSize: nameSize,
color: Colors.red,
),
),