From 4c1cc7422b79064194eacf6d8ab5574ef411f786 Mon Sep 17 00:00:00 2001 From: Dian Bayu Nugroho Date: Thu, 15 Feb 2024 14:07:32 +0700 Subject: [PATCH] feat: submit photo selfie --- .../DisplayPictureScreen.dart | 6 +- .../submission_data/submission_parent.dart | 8 +- .../submission_data/submit_photo_selfie.dart | 125 ++++++++++++++++++ 3 files changed, 132 insertions(+), 7 deletions(-) create mode 100644 lib/features/auth/registration/view/submission_data/submit_photo_selfie.dart diff --git a/lib/application/component/take_picture_screen/DisplayPictureScreen.dart b/lib/application/component/take_picture_screen/DisplayPictureScreen.dart index 417d161..40ecd95 100644 --- a/lib/application/component/take_picture_screen/DisplayPictureScreen.dart +++ b/lib/application/component/take_picture_screen/DisplayPictureScreen.dart @@ -112,7 +112,7 @@ class DisplayPictureScreen extends StatelessWidget { children: [ Container( width: SizeConfig.width * .42, - height: SizeConfig.height * .15, + height: SizeConfig.height * .13, padding: const EdgeInsets.symmetric( vertical: 8.0, horizontal: 8.0), decoration: BoxDecoration( @@ -170,9 +170,9 @@ class DisplayPictureScreen extends StatelessWidget { ), ), SizedBox( - width: SizeConfig.width * .42, + width: SizeConfig.width * .4, child: ButtonView( - marginVertical: 8.0, + marginVertical: 0.0, name: 'Next', onPressed: () { provider.nextSubmission(context); diff --git a/lib/features/auth/registration/view/submission_data/submission_parent.dart b/lib/features/auth/registration/view/submission_data/submission_parent.dart index 585d7c3..3fd68b3 100644 --- a/lib/features/auth/registration/view/submission_data/submission_parent.dart +++ b/lib/features/auth/registration/view/submission_data/submission_parent.dart @@ -5,6 +5,7 @@ import 'package:cims_apps/core/utils/size_config.dart'; import 'package:cims_apps/features/auth/registration/view/submission_data/submit_photo_ktp.dart'; import 'package:cims_apps/features/auth/registration/view/submission_data/submit_email.dart'; import 'package:cims_apps/features/auth/registration/view/submission_data/submit_personal_data.dart'; +import 'package:cims_apps/features/auth/registration/view/submission_data/submit_photo_selfie.dart'; import 'package:cims_apps/features/auth/registration/viewmodel/submission_data_viewmodel.dart'; import 'package:cims_apps/features/bottom_navigation_view.dart'; import 'package:flutter/material.dart'; @@ -42,9 +43,7 @@ class _SubmissionParentState extends State { case 3: return const SubmitPhotoKtp(); case 4: - return Container( - child: Text("Step 4"), - ); + return const SubmitPhotoSelfie(); case 5: return Container( child: Text("Step 5"), @@ -113,7 +112,8 @@ class _SubmissionParentState extends State { child: _content(provider.getCurrentStep), ), ), - provider.getCurrentStep == 3 + provider.getCurrentStep == 3 || + provider.getCurrentStep == 4 ? const SizedBox() : Align( alignment: Alignment.bottomCenter, diff --git a/lib/features/auth/registration/view/submission_data/submit_photo_selfie.dart b/lib/features/auth/registration/view/submission_data/submit_photo_selfie.dart new file mode 100644 index 0000000..0458cde --- /dev/null +++ b/lib/features/auth/registration/view/submission_data/submit_photo_selfie.dart @@ -0,0 +1,125 @@ +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/image/image_view.dart'; +import 'package:cims_apps/application/component/take_picture_screen/take_picture_screen.dart'; +import 'package:cims_apps/application/component/text_caption/text_caption.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:cims_apps/features/auth/registration/viewmodel/submission_data_viewmodel.dart'; +import 'package:flutter/material.dart'; +import 'package:provider/provider.dart'; + +class SubmitPhotoSelfie extends StatelessWidget { + const SubmitPhotoSelfie({Key? key}) : super(key: key); + + @override + Widget build(BuildContext context) { + List listImg = [ + { + 'urlImg': PathAssets.imgSelfieBlur, + 'tag': 'Blurry and ID card is not visible' + }, + { + 'urlImg': PathAssets.imgSelfieClear, + 'tag': 'ID card and face clearly visible' + }, + ]; + return MultiProvider( + providers: [ + ChangeNotifierProvider( + create: (context) => SubmissionDataViewModel(), + ) + ], + builder: (context, child) { + return SizedBox( + height: SizeConfig.height * .75, + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + const TextCaption( + title: 'Take a selfie with your ID card', + subtitle: + 'Make sure your face and identity are clearly visible to ensure your identity is correct.', + ), + SizedBox( + height: SizeConfig.height * .42, + width: SizeConfig.width, + child: Wrap( + alignment: WrapAlignment.spaceBetween, + spacing: 2, + runSpacing: 2, + children: List.generate(listImg.length, (index) { + final urlList = listImg[index]['urlImg']; + final tag = listImg[index]['tag']; + return Column( + children: [ + ImageView( + image: urlList, + width: SizeConfig.width * .35, + ), + const SizedBox( + height: 8, + ), + SizedBox( + width: SizeConfig.width * .42, + child: Text( + tag, + textAlign: TextAlign.center, + style: const TextStyle( + color: ColorPalette.slate800, + fontWeight: FontWeight.w600), + ), + ), + ], + ); + }), + ), + ), + const Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + ImageView( + image: PathAssets.iconShield, + width: 20, + height: 22, + ), + SizedBox( + width: 8, + ), + Expanded( + child: Text( + 'In accordance with OJK regulations, a selfie with ID card is required to purchase mutual funds.', + maxLines: 2, + style: TextStyle( + fontSize: 12, + fontWeight: FontWeight.w600, + color: ColorPalette.primary, + ), + ), + ) + ], + ), + Consumer( + builder: (context, provider, child) { + return ButtonView( + name: 'Take a Photo', + marginVertical: 16.0, + onPressed: () { + provider.initCamera().then((cameras) { + routePush(context, + page: TakePictureScreen( + camera: cameras[1], + takeContent: 'selfie', + )); + }); + }, + ); + }) + ], + ), + ); + }); + } +}