Feat: Done slicing for features information users in view profile

This commit is contained in:
orangdeso 2025-05-12 01:23:09 +07:00
parent fc76ecf4c8
commit 624c008499
4 changed files with 239 additions and 3 deletions

View File

@ -13,6 +13,7 @@ class ButtonOutline extends StatelessWidget {
final double? buttonWidth;
final TextStyle? customTextStyle;
final EdgeInsets? padding;
final Color borderColor;
const ButtonOutline({
Key? key,
@ -23,6 +24,7 @@ class ButtonOutline extends StatelessWidget {
this.buttonWidth,
this.customTextStyle,
this.padding,
this.borderColor = PrimaryColors.primary800,
}) : super(key: key);
@override
@ -39,7 +41,7 @@ class ButtonOutline extends StatelessWidget {
),
side: BorderSide(
width: 2.w,
color: PrimaryColors.primary800,
color: borderColor,
),
),
child: Padding(

View File

@ -0,0 +1,224 @@
import 'package:e_porter/_core/component/appbar/appbar_component.dart';
import 'package:e_porter/_core/component/button/button_outline.dart';
import 'package:e_porter/_core/component/card/custome_shadow_cotainner.dart';
import 'package:e_porter/_core/constants/colors.dart';
import 'package:e_porter/_core/constants/typography.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
class InformationUsersScreen extends StatefulWidget {
const InformationUsersScreen({super.key});
@override
State<InformationUsersScreen> createState() => _InformationUsersScreenState();
}
class _InformationUsersScreenState extends State<InformationUsersScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: GrayColors.gray50,
appBar: DefaultAppbarComponent(
title: 'Informasi Biodata',
textColor: Colors.white,
backgroundColors: PrimaryColors.primary800,
onTab: () {
Get.back();
},
),
body: SafeArea(
child: Padding(
padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 20.h),
child: SingleChildScrollView(
child: Form(
child: Column(
children: [
_buildHeaderInformation(),
_buildCardMain(),
_buildCardSecondary(),
],
),
),
),
),
),
bottomNavigationBar: CustomeShadowCotainner(
child: ButtonOutline(
text: 'Hapus Akun',
textColor: RedColors.red600,
borderColor: RedColors.red600,
onTap: () {},
),
),
);
}
Widget _buildHeaderInformation() {
return Row(
children: [
Icon(
Icons.info_outline_rounded,
color: GrayColors.gray500,
size: 24.sp,
),
Expanded(
child: Padding(
padding: EdgeInsets.only(left: 16.w),
child: TypographyStyles.caption(
'Semua informasi mengenai data diri Anda, akan ditampilkan di halaman ini. Lengkapi data diri anda untuk menikmati semua layanan E-Porter',
color: GrayColors.gray500,
maxlines: 5,
fontWeight: FontWeight.w400,
),
),
)
],
);
}
Widget _buildCardMain() {
return Padding(
padding: EdgeInsets.only(top: 32.h),
child: CustomeShadowCotainner(
child: Column(
children: [
itemWithButton(label: 'Nomor Telepon', value: 'value'),
SizedBox(height: 24.h),
itemWithButton(label: 'Email', value: 'ahmadzaqi98mmmmmm@gmail.com'),
SizedBox(height: 24.h),
itemDoubleWithButton(label1: 'Tipe ID', value2: 'value', label2: 'No ID', value1: 'value'),
],
),
),
);
}
Widget _buildCardSecondary() {
return Padding(
padding: EdgeInsets.only(top: 20.h),
child: CustomeShadowCotainner(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
itemWithButton(label: 'Nama Lengkap', value: 'Ahmad Zaqi', isDivider: false),
SizedBox(height: 24.h),
Row(
children: [
infoDoubleItem(label: 'Jenis Kelamin', value: 'value'),
SizedBox(width: 20.w),
infoDoubleItem(label: 'Tanggal Lahir', value: 'value'),
],
),
SizedBox(height: 24.h),
infoDoubleItem(label: 'Alamat', value: 'value'),
SizedBox(height: 24.h),
infoDoubleItem(label: 'Kota / Kabupaten', value: 'value'),
SizedBox(height: 24.h),
infoDoubleItem(label: 'Pekerjaan', value: 'value')
],
),
),
);
}
Widget itemWithButton({required String label, required String value, bool isDivider = true}) {
return Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
TypographyStyles.body(label, fontWeight: FontWeight.w400, color: GrayColors.gray500),
Padding(
padding: EdgeInsets.only(top: 10.h),
child: TypographyStyles.body(
value,
fontWeight: FontWeight.w500,
color: GrayColors.gray800,
),
),
],
),
),
Container(
padding: EdgeInsets.symmetric(vertical: 6.h, horizontal: 10.w),
decoration: BoxDecoration(
color: PrimaryColors.primary100,
borderRadius: BorderRadius.circular(10.r),
),
child: Row(
children: [
Icon(Icons.edit, color: PrimaryColors.primary800, size: 14.sp),
Padding(
padding: EdgeInsets.only(left: 8.w),
child: TypographyStyles.small('Ubah', color: PrimaryColors.primary800),
),
],
),
)
],
),
if (isDivider)
Padding(
padding: EdgeInsets.only(top: 10.h),
child: Divider(thickness: 1, color: GrayColors.gray200),
)
],
);
}
Widget itemDoubleWithButton({
required String label1,
required String label2,
required String value1,
required String value2,
}) {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
infoDoubleItem(label: label1, value: value1),
SizedBox(width: 20.w),
infoDoubleItem(label: label2, value: value2)
],
),
Container(
padding: EdgeInsets.symmetric(vertical: 6.h, horizontal: 10.w),
decoration: BoxDecoration(
color: PrimaryColors.primary100,
borderRadius: BorderRadius.circular(10.r),
),
child: Row(
children: [
Icon(Icons.edit, color: PrimaryColors.primary800, size: 14.sp),
Padding(
padding: EdgeInsets.only(left: 8.w),
child: TypographyStyles.small('Ubah', color: PrimaryColors.primary800),
),
],
),
)
],
);
}
Widget infoDoubleItem({required String label, required String value}) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
TypographyStyles.body(label, fontWeight: FontWeight.w400, color: GrayColors.gray500),
Padding(
padding: EdgeInsets.only(top: 10.h),
child: TypographyStyles.body(value, fontWeight: FontWeight.w500, color: GrayColors.gray800),
),
],
);
}
}

View File

@ -85,7 +85,9 @@ class _ProfileScreenState extends State<ProfileScreen> {
ProfileMenu(
label: 'Lihat Profile',
svgIcon: 'assets/icons/ic_profile.svg',
onTap: () {},
onTap: () {
Get.toNamed(Routes.INFORMATIONS);
},
),
Padding(
padding: EdgeInsets.symmetric(vertical: 20.h),
@ -219,7 +221,9 @@ class _ProfileScreenState extends State<ProfileScreen> {
ProfileMenu(
label: 'Lihat Profile',
svgIcon: 'assets/icons/ic_profile.svg',
onTap: () {},
onTap: () {
Get.toNamed(Routes.INFORMATIONS);
},
),
Padding(
padding: EdgeInsets.symmetric(vertical: 20.h),

View File

@ -34,6 +34,7 @@ import 'package:e_porter/presentation/screens/home/pages/ticket_booking_step4_sc
import 'package:e_porter/presentation/screens/home/pages/upload_file_screen.dart';
import 'package:e_porter/presentation/screens/navigation/main_navigation.dart';
import 'package:e_porter/presentation/screens/onboarding/onboarding_screen.dart';
import 'package:e_porter/presentation/screens/profile/pages/information_users_screen.dart';
import 'package:e_porter/presentation/screens/profile/pages/profile_screen.dart';
import 'package:e_porter/presentation/screens/profile/pages/add_passenger_screen.dart';
import 'package:e_porter/presentation/screens/splash/splash_screen.dart';
@ -193,6 +194,10 @@ class AppRoutes {
page: () => AddPassengerScreen(),
binding: ProfilBinding(),
),
GetPage(
name: Routes.INFORMATIONS,
page: () => InformationUsersScreen(),
),
];
}
@ -228,4 +233,5 @@ class Routes {
static const DETAILHISTORYPORTER = '/detail_history_porter';
static const ADDPASSENGER = '/add_passenger';
static const INFORMATIONS = '/informations';
}