Merge pull request 'bayu/dev' (#20) from bayu/dev into dev
Reviewed-on: #20
This commit is contained in:
commit
41f0bb7a68
BIN
assets/images/img-expand-purchase.png
Normal file
BIN
assets/images/img-expand-purchase.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
|
|
@ -104,6 +104,8 @@ class PathAssets {
|
||||||
'assets/images/img-payment-success.png';
|
'assets/images/img-payment-success.png';
|
||||||
static const String frameSignature = 'assets/images/frame-signature.png';
|
static const String frameSignature = 'assets/images/frame-signature.png';
|
||||||
static const String imgFinish = 'assets/images/img-finish.png';
|
static const String imgFinish = 'assets/images/img-finish.png';
|
||||||
|
static const String imgExpandPurchase =
|
||||||
|
'assets/images/img-expand-purchase.png';
|
||||||
static const String imgEmptyTransaction =
|
static const String imgEmptyTransaction =
|
||||||
'assets/images/img-empty-transaction.png';
|
'assets/images/img-empty-transaction.png';
|
||||||
|
|
||||||
|
|
|
||||||
391
lib/features/transaction/view/subscribe_detail_view.dart
Normal file
391
lib/features/transaction/view/subscribe_detail_view.dart
Normal file
|
|
@ -0,0 +1,391 @@
|
||||||
|
import 'package:cims_apps/application/assets/path_assets.dart';
|
||||||
|
import 'package:cims_apps/application/component/button/back_button_view.dart';
|
||||||
|
import 'package:cims_apps/application/component/image/image_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 SubscribeDetailView extends StatelessWidget {
|
||||||
|
const SubscribeDetailView({Key? key}) : super(key: key);
|
||||||
|
|
||||||
|
Widget _stepper(
|
||||||
|
TextTheme textTheme, {
|
||||||
|
required String description,
|
||||||
|
String? date,
|
||||||
|
time,
|
||||||
|
bool isActive = false,
|
||||||
|
bool isDone = false,
|
||||||
|
bool isLast = false,
|
||||||
|
}) {
|
||||||
|
return Container(
|
||||||
|
padding: const EdgeInsets.only(top: 8.0, left: 16.0),
|
||||||
|
child: Row(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
Column(
|
||||||
|
children: [
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.only(left: 2.0, top: 8.0),
|
||||||
|
child: Icon(
|
||||||
|
Icons.circle_rounded,
|
||||||
|
size: 10,
|
||||||
|
color: isDone
|
||||||
|
? ColorPalette.primary
|
||||||
|
: isActive
|
||||||
|
? ColorPalette.primary
|
||||||
|
: ColorPalette.slate400,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
if (!isLast)
|
||||||
|
ConstrainedBox(
|
||||||
|
constraints: BoxConstraints.expand(
|
||||||
|
height: SizeConfig.width * .2, width: 0.0),
|
||||||
|
child: Padding(
|
||||||
|
padding: const EdgeInsets.symmetric(vertical: 4.0),
|
||||||
|
child: VerticalDivider(
|
||||||
|
color:
|
||||||
|
isDone ? ColorPalette.primary : ColorPalette.slate400,
|
||||||
|
thickness: 2.0,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.only(left: 16.0),
|
||||||
|
child: Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.only(bottom: 8.0),
|
||||||
|
child: Text(
|
||||||
|
description,
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 16,
|
||||||
|
fontWeight: FontWeight.w600,
|
||||||
|
color: isDone
|
||||||
|
? Colors.black87
|
||||||
|
: isActive
|
||||||
|
? ColorPalette.primary
|
||||||
|
: ColorPalette.slate400,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
isDone
|
||||||
|
? Row(
|
||||||
|
children: [
|
||||||
|
Text(date ?? ''),
|
||||||
|
const Padding(
|
||||||
|
padding: EdgeInsets.symmetric(horizontal: 4.0),
|
||||||
|
child: Icon(
|
||||||
|
Icons.circle,
|
||||||
|
size: 6,
|
||||||
|
color: ColorPalette.slate400,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
Text(time ?? ''),
|
||||||
|
],
|
||||||
|
)
|
||||||
|
: const SizedBox(),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
)
|
||||||
|
],
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
Widget _listProduct(BuildContext context) {
|
||||||
|
TextTheme textTheme = Theme.of(context).textTheme;
|
||||||
|
return Padding(
|
||||||
|
padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
|
||||||
|
child: Column(
|
||||||
|
children: [
|
||||||
|
Row(
|
||||||
|
children: [
|
||||||
|
ImageView(
|
||||||
|
image: PathAssets.imgProduct,
|
||||||
|
width: SizeConfig.width * .1,
|
||||||
|
),
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.only(left: 8.0),
|
||||||
|
child: Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
Text(
|
||||||
|
'Gemilang Dana Kas Maxima',
|
||||||
|
style: textTheme.headlineSmall,
|
||||||
|
),
|
||||||
|
Container(
|
||||||
|
padding: const EdgeInsets.symmetric(
|
||||||
|
horizontal: 8.0, vertical: 2.0),
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: ColorPalette.purple100,
|
||||||
|
border: Border.all(
|
||||||
|
width: 1,
|
||||||
|
color: ColorPalette.purple,
|
||||||
|
),
|
||||||
|
borderRadius:
|
||||||
|
const BorderRadius.all(Radius.circular(24)),
|
||||||
|
),
|
||||||
|
child: const Text(
|
||||||
|
'Money Market',
|
||||||
|
style: TextStyle(
|
||||||
|
color: ColorPalette.purple500,
|
||||||
|
),
|
||||||
|
)),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.symmetric(vertical: 8.0),
|
||||||
|
child: Row(
|
||||||
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||||
|
children: [
|
||||||
|
const Text('Investment Amount'),
|
||||||
|
Text(
|
||||||
|
'Rp 2.000.000',
|
||||||
|
style: textTheme.headlineSmall,
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const Divider(
|
||||||
|
color: ColorPalette.slate200,
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
Widget _cardContent(BuildContext context) {
|
||||||
|
TextTheme textTheme = Theme.of(context).textTheme;
|
||||||
|
List mySteps = const [
|
||||||
|
{
|
||||||
|
'desc': 'Payment Being Verified',
|
||||||
|
'date': '07 Feb 2024 ',
|
||||||
|
'time': '21:01',
|
||||||
|
'isActive': false,
|
||||||
|
'isDone': true,
|
||||||
|
'isLast': false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'desc': 'Successful Payment',
|
||||||
|
'date': '07 Feb 2024 ',
|
||||||
|
'time': '21:01',
|
||||||
|
'isActive': true,
|
||||||
|
'isDone': false,
|
||||||
|
'isLast': false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'desc': 'Investment Manager Verification',
|
||||||
|
'date': '07 Feb 2024 ',
|
||||||
|
'time': '21:01',
|
||||||
|
'isActive': false,
|
||||||
|
'isDone': false,
|
||||||
|
'isLast': false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'desc': 'Successful Purchase',
|
||||||
|
'date': '07 Feb 2024 ',
|
||||||
|
'time': '21:01',
|
||||||
|
'isActive': false,
|
||||||
|
'isDone': false,
|
||||||
|
'isLast': true,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
return SingleChildScrollView(
|
||||||
|
padding: const EdgeInsets.symmetric(horizontal: 16.0),
|
||||||
|
child: Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
Row(
|
||||||
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
|
children: [
|
||||||
|
const Icon(Icons.access_time, color: ColorPalette.slate400),
|
||||||
|
const Padding(
|
||||||
|
padding: EdgeInsets.symmetric(horizontal: 8.0),
|
||||||
|
child: Text('Waiting for Payment'),
|
||||||
|
),
|
||||||
|
Text('23:56:42', style: textTheme.headlineSmall),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.symmetric(vertical: 16.0),
|
||||||
|
child: Text('Purchase Details', style: textTheme.headlineSmall),
|
||||||
|
),
|
||||||
|
Container(
|
||||||
|
margin: const EdgeInsets.symmetric(vertical: 8.0),
|
||||||
|
padding: const EdgeInsets.only(bottom: 16.0),
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: Colors.white,
|
||||||
|
border: Border.all(width: 1, color: ColorPalette.slate200),
|
||||||
|
borderRadius: const BorderRadius.all(Radius.circular(12)),
|
||||||
|
),
|
||||||
|
child: ExpansionTile(
|
||||||
|
shape: ShapeBorder.lerp(
|
||||||
|
const StadiumBorder(side: BorderSide.none),
|
||||||
|
InputBorder.none,
|
||||||
|
0),
|
||||||
|
title: Row(
|
||||||
|
children: [
|
||||||
|
ImageView(
|
||||||
|
image: PathAssets.iconEducation,
|
||||||
|
width: SizeConfig.width * .08,
|
||||||
|
),
|
||||||
|
const Padding(
|
||||||
|
padding: EdgeInsets.only(left: 8.0),
|
||||||
|
child: Text('Education'),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
subtitle: Padding(
|
||||||
|
padding: const EdgeInsets.only(left: 40.0),
|
||||||
|
child: Text('3 Subscriptions', style: textTheme.bodyMedium),
|
||||||
|
),
|
||||||
|
children: [
|
||||||
|
_listProduct(context),
|
||||||
|
_listProduct(context),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
...mySteps.map((e) {
|
||||||
|
return _stepper(
|
||||||
|
textTheme,
|
||||||
|
description: '${e['desc']}',
|
||||||
|
date: e['date'],
|
||||||
|
time: e['time'],
|
||||||
|
isActive: e['isActive'],
|
||||||
|
isDone: e['isDone'],
|
||||||
|
isLast: e['isLast'],
|
||||||
|
);
|
||||||
|
}),
|
||||||
|
Container(
|
||||||
|
margin: const EdgeInsets.symmetric(vertical: 8.0),
|
||||||
|
// padding: const EdgeInsets.only(bottom: 16.0),
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: Colors.white,
|
||||||
|
border: Border.all(width: 1, color: ColorPalette.slate200),
|
||||||
|
borderRadius: const BorderRadius.all(Radius.circular(12)),
|
||||||
|
),
|
||||||
|
child: ExpansionTile(
|
||||||
|
shape: ShapeBorder.lerp(
|
||||||
|
const StadiumBorder(side: BorderSide.none),
|
||||||
|
InputBorder.none,
|
||||||
|
0),
|
||||||
|
title: Row(
|
||||||
|
children: [
|
||||||
|
const Expanded(
|
||||||
|
child: Text('When Is My Purchase Complete?')),
|
||||||
|
ImageView(
|
||||||
|
image: PathAssets.imgExpandPurchase,
|
||||||
|
width: SizeConfig.width * .15,
|
||||||
|
),
|
||||||
|
],
|
||||||
|
))),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Scaffold(
|
||||||
|
body: SizedBox(
|
||||||
|
child: Stack(
|
||||||
|
children: [
|
||||||
|
const ImageView(image: PathAssets.imgDashboardAccount),
|
||||||
|
Column(
|
||||||
|
children: [
|
||||||
|
SizedBox(height: SizeConfig.height * .05),
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.all(16.0),
|
||||||
|
child: Row(
|
||||||
|
mainAxisAlignment: MainAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
BackButtonView(
|
||||||
|
onPress: () => Navigator.pop(context),
|
||||||
|
),
|
||||||
|
const Padding(
|
||||||
|
padding: EdgeInsets.symmetric(horizontal: 80.0),
|
||||||
|
child: Text(
|
||||||
|
'Subscribe Detail',
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 18,
|
||||||
|
color: Colors.white,
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
Row(
|
||||||
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
|
children: [
|
||||||
|
ImageView(
|
||||||
|
image: PathAssets.imgProduct,
|
||||||
|
width: SizeConfig.width * .08,
|
||||||
|
),
|
||||||
|
const Padding(
|
||||||
|
padding: EdgeInsets.only(left: 8.0),
|
||||||
|
child: Text(
|
||||||
|
'Shopping Pay',
|
||||||
|
style: TextStyle(
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
color: Colors.white,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
const Padding(
|
||||||
|
padding: EdgeInsets.only(top: 8.0),
|
||||||
|
child: Row(
|
||||||
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
|
children: [
|
||||||
|
Text(
|
||||||
|
'No.Subscribe : ',
|
||||||
|
style: TextStyle(
|
||||||
|
fontWeight: FontWeight.normal,
|
||||||
|
color: Colors.white,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
'PI9393084SDMI1',
|
||||||
|
style: TextStyle(
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
color: Colors.white,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
Expanded(
|
||||||
|
child: Container(
|
||||||
|
color: Colors.transparent,
|
||||||
|
width: SizeConfig.width,
|
||||||
|
padding: const EdgeInsets.only(top: 32.0),
|
||||||
|
child: Container(
|
||||||
|
margin: const EdgeInsets.only(top: 32.0),
|
||||||
|
padding: const EdgeInsets.only(top: 32.0),
|
||||||
|
decoration: const BoxDecoration(
|
||||||
|
color: Colors.white,
|
||||||
|
borderRadius: BorderRadius.only(
|
||||||
|
topLeft: Radius.circular(24),
|
||||||
|
topRight: Radius.circular(24)),
|
||||||
|
),
|
||||||
|
child: _cardContent(context)),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
)
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -1,8 +1,10 @@
|
||||||
import 'package:cims_apps/application/assets/path_assets.dart';
|
import 'package:cims_apps/application/assets/path_assets.dart';
|
||||||
import 'package:cims_apps/application/component/card_transaction/card_transaction_view.dart';
|
import 'package:cims_apps/application/component/card_transaction/card_transaction_view.dart';
|
||||||
import 'package:cims_apps/application/component/card_transaction/empty_card_transaction.dart';
|
import 'package:cims_apps/application/component/card_transaction/empty_card_transaction.dart';
|
||||||
|
import 'package:cims_apps/core/route/route.dart';
|
||||||
import 'package:cims_apps/core/utils/number_formatter.dart';
|
import 'package:cims_apps/core/utils/number_formatter.dart';
|
||||||
import 'package:cims_apps/core/utils/string_utils.dart';
|
import 'package:cims_apps/core/utils/string_utils.dart';
|
||||||
|
import 'package:cims_apps/features/transaction/view/subscribe_detail_view.dart';
|
||||||
import 'package:cims_apps/features/transaction/viewmodel/transaction_viewmodel.dart';
|
import 'package:cims_apps/features/transaction/viewmodel/transaction_viewmodel.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:provider/provider.dart';
|
import 'package:provider/provider.dart';
|
||||||
|
|
@ -19,7 +21,9 @@ class WaitingView extends StatelessWidget {
|
||||||
children: [
|
children: [
|
||||||
provider.listWaitingTransaction.isNotEmpty
|
provider.listWaitingTransaction.isNotEmpty
|
||||||
? CardTransactionView(
|
? CardTransactionView(
|
||||||
onTap: () {},
|
onTap: () {
|
||||||
|
routePush(context, page: const SubscribeDetailView());
|
||||||
|
},
|
||||||
iconPath: PathAssets.iconEducation,
|
iconPath: PathAssets.iconEducation,
|
||||||
type: 'Education',
|
type: 'Education',
|
||||||
amount: NumberFormatter.numberCurrency(
|
amount: NumberFormatter.numberCurrency(
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user