import 'dart:io'; import 'package:cached_network_image/cached_network_image.dart'; import 'package:dotted_border/dotted_border.dart'; import 'package:driver/constant/constant.dart'; import 'package:driver/constant/show_toast_dialog.dart'; import 'package:driver/controllers/verification_details_upload_controller.dart'; import 'package:driver/themes/app_them_data.dart'; import 'package:driver/themes/responsive.dart'; import 'package:driver/themes/round_button_fill.dart'; import 'package:driver/themes/theme_controller.dart'; import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:get/get.dart'; import 'package:image_picker/image_picker.dart'; class VerificationDetailsUploadScreen extends StatelessWidget { const VerificationDetailsUploadScreen({super.key}); @override Widget build(BuildContext context) { final themeController = Get.find(); final isDark = themeController.isDark.value; return GetX( init: DetailsUploadController(), builder: (controller) { return Scaffold( appBar: AppBar( backgroundColor: isDark ? AppThemeData.grey900 : AppThemeData.grey50, centerTitle: false, automaticallyImplyLeading: false, titleSpacing: 0, leading: InkWell( onTap: () { Get.back(); }, child: Icon( Icons.chevron_left_outlined, color: isDark ? AppThemeData.grey50 : AppThemeData.grey900, ), ), title: Text( "${controller.documentModel.value.title}", style: TextStyle(color: isDark ? AppThemeData.grey100 : AppThemeData.grey800, fontFamily: AppThemeData.bold, fontSize: 18), ), elevation: 0, ), body: controller.isLoading.value ? Constant.loader() : SingleChildScrollView( child: Padding( padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( "${'Upload'.tr} ${controller.documentModel.value.title} ${'for Verification'.tr}", style: TextStyle(color: isDark ? AppThemeData.grey100 : AppThemeData.grey800, fontFamily: AppThemeData.bold, fontSize: 22), ), const SizedBox( height: 5, ), Text( "${'Please upload a valid'.tr} ${controller.documentModel.value.title} ${'to verify your identity complete the registration process.'.tr}".tr, style: TextStyle(fontSize: 16, color: isDark ? AppThemeData.grey200 : AppThemeData.grey700, fontFamily: AppThemeData.regular), ), const SizedBox( height: 20, ), Visibility( visible: controller.documentModel.value.frontSide == true ? true : false, child: Padding( padding: const EdgeInsets.symmetric(vertical: 10), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( "${'Front Side of'} ${controller.documentModel.value.title.toString()}", style: TextStyle(color: isDark ? AppThemeData.grey50 : AppThemeData.grey900, fontFamily: AppThemeData.bold, fontSize: 16), ), const SizedBox( height: 10, ), controller.frontImage.value.isNotEmpty ? InkWell( onTap: () { if (controller.documents.value.status != "uploaded" || controller.documents.value.status == "rejected") { buildBottomSheet(context, controller, "front"); } }, child: SizedBox( height: Responsive.height(20, context), width: Responsive.width(90, context), child: ClipRRect( borderRadius: const BorderRadius.all(Radius.circular(10)), child: Constant().hasValidUrl(controller.frontImage.value) == false ? Image.file( File(controller.frontImage.value), height: Responsive.height(20, context), width: Responsive.width(80, context), fit: BoxFit.fill, ) : CachedNetworkImage( imageUrl: controller.frontImage.value.toString(), fit: BoxFit.fill, height: Responsive.height(20, context), width: Responsive.width(80, context), placeholder: (context, url) => Constant.loader(), errorWidget: (context, url, error) => Image.network( 'https://firebasestorage.googleapis.com/v0/b/goride-1a752.appspot.com/o/placeholderImages%2Fuser-placeholder.jpeg?alt=media&token=34a73d67-ba1d-4fe4-a29f-271d3e3ca115'), ), ), ), ) : DottedBorder( options: RoundedRectDottedBorderOptions( radius: const Radius.circular(12), dashPattern: const [6, 6, 6, 6], color: isDark ? AppThemeData.grey700 : AppThemeData.grey200, ), child: Container( decoration: BoxDecoration( color: isDark ? AppThemeData.grey900 : AppThemeData.grey50, borderRadius: const BorderRadius.all( Radius.circular(12), ), ), child: SizedBox( height: Responsive.height(22, context), width: Responsive.width(90, context), child: Column( crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center, children: [ SvgPicture.asset( 'assets/icons/ic_folder.svg', ), const SizedBox( height: 10, ), Text( "Choose a image and upload here".tr, style: TextStyle(color: isDark ? AppThemeData.grey100 : AppThemeData.grey800, fontFamily: AppThemeData.medium, fontSize: 16), ), const SizedBox( height: 5, ), Text( "JPEG, PNG".tr, style: TextStyle( fontSize: 12, color: isDark ? AppThemeData.grey200 : AppThemeData.grey700, fontFamily: AppThemeData.regular), ), const SizedBox( height: 10, ), RoundedButtonFill( title: "Brows Image".tr, color: AppThemeData.carRent50, textColor: AppThemeData.primary300, width: 30, height: 5, onPress: () async { buildBottomSheet(context, controller, "front"); }, ), ], )), ), ), ], ), ), ), Visibility( visible: controller.documentModel.value.backSide == true ? true : false, child: Padding( padding: const EdgeInsets.symmetric(vertical: 10), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( "${'Back side of'.tr} ${controller.documentModel.value.title.toString()}", style: TextStyle(color: isDark ? AppThemeData.grey50 : AppThemeData.grey900, fontFamily: AppThemeData.bold, fontSize: 16), ), const SizedBox( height: 10, ), controller.backImage.value.isNotEmpty ? InkWell( onTap: () { if (controller.documents.value.status != "uploaded" || controller.documents.value.status == "rejected") { buildBottomSheet(context, controller, "back"); } }, child: SizedBox( height: Responsive.height(20, context), width: Responsive.width(90, context), child: ClipRRect( borderRadius: const BorderRadius.all(Radius.circular(10)), child: Constant().hasValidUrl(controller.backImage.value) == false ? Image.file( File(controller.backImage.value), height: Responsive.height(20, context), width: Responsive.width(80, context), fit: BoxFit.fill, ) : CachedNetworkImage( imageUrl: controller.backImage.value.toString(), fit: BoxFit.fill, height: Responsive.height(20, context), width: Responsive.width(80, context), placeholder: (context, url) => Constant.loader(), errorWidget: (context, url, error) => Image.network( 'https://firebasestorage.googleapis.com/v0/b/goride-1a752.appspot.com/o/placeholderImages%2Fuser-placeholder.jpeg?alt=media&token=34a73d67-ba1d-4fe4-a29f-271d3e3ca115'), ), ), ), ) : DottedBorder( options: RoundedRectDottedBorderOptions( radius: const Radius.circular(12), dashPattern: const [6, 6, 6, 6], color: isDark ? AppThemeData.grey700 : AppThemeData.grey200, ), child: Container( decoration: BoxDecoration( color: isDark ? AppThemeData.grey900 : AppThemeData.grey50, borderRadius: const BorderRadius.all( Radius.circular(12), ), ), child: SizedBox( height: Responsive.height(22, context), width: Responsive.width(90, context), child: Column( crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center, children: [ SvgPicture.asset( 'assets/icons/ic_folder.svg', ), const SizedBox( height: 10, ), Text( "Choose a image and upload here".tr, style: TextStyle(color: isDark ? AppThemeData.grey100 : AppThemeData.grey800, fontFamily: AppThemeData.medium, fontSize: 16), ), const SizedBox( height: 5, ), Text( "JPEG, PNG".tr, style: TextStyle( fontSize: 12, color: isDark ? AppThemeData.grey200 : AppThemeData.grey700, fontFamily: AppThemeData.regular), ), const SizedBox( height: 10, ), RoundedButtonFill( title: "Brows Image".tr, color: AppThemeData.carRent50, textColor: AppThemeData.primary300, width: 30, height: 5, onPress: () async { buildBottomSheet(context, controller, "back"); }, ), ], )), ), ), ], ), ), ), const SizedBox( height: 30, ), ], ), ), ), bottomNavigationBar: controller.documents.value.status == "approved" || controller.documents.value.status == "uploaded" ? const SizedBox() : InkWell( onTap: () { if (controller.documentModel.value.frontSide == true && controller.frontImage.value.isEmpty) { ShowToastDialog.showToast("Please upload front side of document.".tr); } else if (controller.documentModel.value.backSide == true && controller.backImage.value.isEmpty) { ShowToastDialog.showToast("Please upload back side of document.".tr); } else { ShowToastDialog.showLoader("Please wait.".tr); controller.uploadDocument(); } }, child: Container( color: AppThemeData.primary300, width: Responsive.width(100, context), child: Padding( padding: const EdgeInsets.symmetric(vertical: 16), child: Text( "Upload Document".tr, textAlign: TextAlign.center, style: TextStyle( color: isDark ? AppThemeData.grey50 : AppThemeData.grey50, fontSize: 16, fontFamily: AppThemeData.medium, fontWeight: FontWeight.w400, ), ), ), ), ), ); }); } Future buildBottomSheet(BuildContext context, DetailsUploadController controller, String type) { return showModalBottomSheet( context: context, builder: (context) { final themeController = Get.find(); final isDark = themeController.isDark.value; return StatefulBuilder(builder: (context, setState) { return SizedBox( height: Responsive.height(22, context), child: Column( crossAxisAlignment: CrossAxisAlignment.center, children: [ Padding( padding: const EdgeInsets.only(top: 15), child: Text( "Please Select".tr, style: TextStyle(color: isDark ? AppThemeData.grey50 : AppThemeData.grey900, fontFamily: AppThemeData.bold, fontSize: 16), ), ), Row( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: [ Padding( padding: const EdgeInsets.all(18.0), child: Column( crossAxisAlignment: CrossAxisAlignment.center, children: [ IconButton( onPressed: () => controller.pickFile(source: ImageSource.camera, type: type), icon: const Icon( Icons.camera_alt, size: 32, )), Padding( padding: const EdgeInsets.only(top: 3), child: Text("Camera".tr), ), ], ), ), Padding( padding: const EdgeInsets.all(18.0), child: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: [ IconButton( onPressed: () => controller.pickFile(source: ImageSource.gallery, type: type), icon: const Icon( Icons.photo_library_sharp, size: 32, )), Padding( padding: const EdgeInsets.only(top: 3), child: Text("Gallery".tr), ), ], ), ) ], ), ], ), ); }); }); } }