aefril/enaklo-flutter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: address page and payment page

Browse Source
This commit is contained in:
efrilm
2025-08-29 21:52:34 +07:00
parent b0cf40136b
commit 4d994e303b
5 changed files with 839 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/presentation/pages/account/address/address_page.dart
+398
View File
@@ -0,0 +1,398 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import '../../../../common/theme/theme.dart';
@RoutePage()
class AddressPage extends StatefulWidget {
const AddressPage({super.key});
@override
State<AddressPage> createState() => _AddressPageState();
}
class _AddressPageState extends State<AddressPage> {
// Sample saved addresses - replace with your actual data source
final List<Map<String, dynamic>> savedAddresses = [
{
'id': '1',
'label': 'Rumah',
'name': 'John Doe',
'phone': '081234567890',
'fullAddress': 'Jl. Merdeka No. 123, RT 01/RW 02, Menteng',
'city': 'Jakarta Pusat',
'province': 'DKI Jakarta',
'postalCode': '10110',
'isDefault': true,
},
{
'id': '2',
'label': 'Kantor',
'name': 'John Doe',
'phone': '081234567890',
'fullAddress': 'Jl. Sudirman No. 456, Lantai 10, SCBD',
'city': 'Jakarta Selatan',
'province': 'DKI Jakarta',
'postalCode': '12190',
'isDefault': false,
},
{
'id': '3',
'label': 'Apartemen',
'name': 'Jane Doe',
'phone': '087654321098',
'fullAddress': 'Jl. Casablanca Raya No. 789, Tower A Unit 15B',
'city': 'Jakarta Selatan',
'province': 'DKI Jakarta',
'postalCode': '12870',
'isDefault': false,
},
];
void _setDefaultAddress(String addressId) {
setState(() {
for (var address in savedAddresses) {
address['isDefault'] = address['id'] == addressId;
}
});
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(
'Alamat utama berhasil diubah',
style: AppStyle.md.copyWith(color: AppColor.white),
),
backgroundColor: AppColor.success,
behavior: SnackBarBehavior.floating,
),
);
}
void _deleteAddress(String addressId) {
setState(() {
savedAddresses.removeWhere((address) => address['id'] == addressId);
});
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(
'Alamat berhasil dihapus',
style: AppStyle.md.copyWith(color: AppColor.white),
),
backgroundColor: AppColor.success,
behavior: SnackBarBehavior.floating,
),
);
}
void _showDeleteDialog(String addressId, String label) {
showDialog(
context: context,
builder: (BuildContext context) {
return AlertDialog(
backgroundColor: AppColor.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
title: Text(
'Hapus Alamat',
style: AppStyle.lg.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.textPrimary,
),
),
content: Text(
'Apakah Anda yakin ingin menghapus alamat "$label"?',
style: AppStyle.md.copyWith(color: AppColor.textSecondary),
),
actions: [
TextButton(
onPressed: () => Navigator.pop(context),
child: Text(
'Batal',
style: AppStyle.md.copyWith(color: AppColor.textSecondary),
),
),
ElevatedButton(
onPressed: () {
Navigator.pop(context);
_deleteAddress(addressId);
},
style: ElevatedButton.styleFrom(
backgroundColor: AppColor.error,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(6),
),
),
child: Text(
'Hapus',
style: AppStyle.md.copyWith(
color: AppColor.white,
fontWeight: FontWeight.w600,
),
),
),
],
);
},
);
}
Widget _buildAddressCard(Map<String, dynamic> address) {
return Container(
decoration: BoxDecoration(
color: AppColor.white,
border: Border(bottom: BorderSide(color: AppColor.border, width: 1)),
),
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Container(
padding: const EdgeInsets.symmetric(
horizontal: 8,
vertical: 4,
),
decoration: BoxDecoration(
color: AppColor.background,
borderRadius: BorderRadius.circular(4),
border: Border.all(color: AppColor.border),
),
child: Text(
address['label'],
style: AppStyle.xs.copyWith(
color: AppColor.textPrimary,
fontWeight: FontWeight.w500,
),
),
),
if (address['isDefault']) ...[
const SizedBox(width: 8),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 8,
vertical: 4,
),
decoration: BoxDecoration(
color: AppColor.primary,
borderRadius: BorderRadius.circular(4),
),
child: Text(
'Utama',
style: AppStyle.xs.copyWith(
color: AppColor.white,
fontWeight: FontWeight.w500,
),
),
),
],
const Spacer(),
PopupMenuButton<String>(
color: AppColor.white,
icon: const Icon(
Icons.more_vert,
color: AppColor.textSecondary,
size: 20,
),
onSelected: (value) {
switch (value) {
case 'edit':
// Navigate to edit form
break;
case 'default':
_setDefaultAddress(address['id']);
break;
case 'delete':
_showDeleteDialog(address['id'], address['label']);
break;
}
},
itemBuilder: (context) => [
PopupMenuItem(
value: 'edit',
child: Text(
'Edit Alamat',
style: AppStyle.sm.copyWith(
color: AppColor.textPrimary,
),
),
),
if (!address['isDefault'])
PopupMenuItem(
value: 'default',
child: Text(
'Jadikan Utama',
style: AppStyle.sm.copyWith(
color: AppColor.textPrimary,
),
),
),
PopupMenuItem(
value: 'delete',
child: Text(
'Hapus Alamat',
style: AppStyle.sm.copyWith(color: AppColor.error),
),
),
],
),
],
),
const SizedBox(height: 12),
Text(
address['name'],
style: AppStyle.md.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.textPrimary,
),
),
const SizedBox(height: 4),
Text(
address['phone'],
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
),
const SizedBox(height: 8),
Text(
address['fullAddress'],
style: AppStyle.sm.copyWith(
color: AppColor.textSecondary,
height: 1.4,
),
),
const SizedBox(height: 4),
Text(
'${address['city']}, ${address['province']} ${address['postalCode']}',
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
),
],
),
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: AppColor.background,
appBar: AppBar(title: Text('Alamat Tersimpan')),
body: savedAddresses.isEmpty
? _buildEmptyState()
: Column(
children: [
Expanded(
child: ListView.builder(
itemCount: savedAddresses.length,
itemBuilder: (context, index) {
return _buildAddressCard(savedAddresses[index]);
},
),
),
Container(
padding: const EdgeInsets.all(20),
decoration: const BoxDecoration(
color: AppColor.white,
border: Border(top: BorderSide(color: AppColor.border)),
),
child: SafeArea(
child: SizedBox(
width: double.infinity,
height: 48,
child: ElevatedButton(
onPressed: () {
// Navigate to add new address form
},
style: ElevatedButton.styleFrom(
backgroundColor: AppColor.primary,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(
Icons.add,
color: AppColor.white,
size: 20,
),
const SizedBox(width: 8),
Text(
'Tambah Alamat Baru',
style: AppStyle.md.copyWith(
color: AppColor.white,
fontWeight: FontWeight.w600,
),
),
],
),
),
),
),
),
],
),
);
}
Widget _buildEmptyState() {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Icons.location_off, size: 80, color: AppColor.textLight),
const SizedBox(height: 16),
Text(
'Belum Ada Alamat Tersimpan',
style: AppStyle.lg.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.textSecondary,
),
),
const SizedBox(height: 8),
Text(
'Tambahkan alamat untuk memudahkan\nproses pengiriman',
textAlign: TextAlign.center,
style: AppStyle.md.copyWith(color: AppColor.textLight, height: 1.4),
),
const SizedBox(height: 32),
SizedBox(
width: 200,
height: 48,
child: ElevatedButton(
onPressed: () {
// Navigate to add address form
},
style: ElevatedButton.styleFrom(
backgroundColor: AppColor.primary,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(Icons.add, color: AppColor.white, size: 20),
const SizedBox(width: 8),
Text(
'Tambah Alamat',
style: AppStyle.md.copyWith(
color: AppColor.white,
fontWeight: FontWeight.w600,
),
),
],
),
),
),
],
),
);
}
}
lib/presentation/pages/account/payment/payment_page.dart
+218
View File
@@ -0,0 +1,218 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import '../../../../common/theme/theme.dart';
// Import your theme files here
// import 'theme.dart';
@RoutePage()
class PaymentPage extends StatefulWidget {
const PaymentPage({super.key});
@override
State<PaymentPage> createState() => _PaymentPageState();
}
class _PaymentPageState extends State<PaymentPage> {
// Sample saved payment methods data
final List<Map<String, dynamic>> savedPaymentMethods = [
{
'id': '1',
'type': 'credit_card',
'name': 'Kartu Kredit',
'details': '**** **** **** 1234',
'cardType': 'Visa',
'expiryDate': '12/26',
'isDefault': true,
'icon': Icons.credit_card,
},
{
'id': '2',
'type': 'credit_card',
'name': 'Kartu Debit',
'details': '**** **** **** 5678',
'cardType': 'Mastercard',
'expiryDate': '08/27',
'isDefault': false,
'icon': Icons.credit_card,
},
{
'id': '3',
'type': 'ewallet',
'name': 'DANA',
'details': '081234567890',
'cardType': 'E-Wallet',
'expiryDate': null,
'isDefault': false,
'icon': Icons.account_balance_wallet,
},
{
'id': '4',
'type': 'ewallet',
'name': 'GoPay',
'details': '081234567890',
'cardType': 'E-Wallet',
'expiryDate': null,
'isDefault': false,
'icon': Icons.account_balance_wallet,
},
{
'id': '5',
'type': 'bank_account',
'name': 'BCA',
'details': '**** **** 9012',
'cardType': 'Bank Account',
'expiryDate': null,
'isDefault': false,
'icon': Icons.account_balance,
},
];
Widget _buildPaymentCard(Map<String, dynamic> payment) {
return Container(
decoration: const BoxDecoration(
color: AppColor.white,
border: Border(bottom: BorderSide(color: AppColor.border)),
),
child: Padding(
padding: const EdgeInsets.all(16),
child: Row(
children: [
Container(
width: 48,
height: 48,
decoration: BoxDecoration(
color: AppColor.background,
borderRadius: BorderRadius.circular(8),
border: Border.all(color: AppColor.border),
),
child: Icon(payment['icon'], color: AppColor.primary, size: 24),
),
const SizedBox(width: 16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
payment['name'],
style: AppStyle.md.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.textPrimary,
),
),
],
),
const SizedBox(height: 4),
Row(
children: [
Text(
payment['cardType'],
style: AppStyle.sm.copyWith(
color: AppColor.textSecondary,
),
),
if (payment['expiryDate'] != null) ...[
Text(
' • ',
style: AppStyle.sm.copyWith(
color: AppColor.textSecondary,
),
),
Text(
'Exp: ${payment['expiryDate']}',
style: AppStyle.sm.copyWith(
color: AppColor.textSecondary,
),
),
],
],
),
],
),
),
],
),
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: AppColor.background,
appBar: AppBar(title: Text('Metode Pembayaran')),
body: savedPaymentMethods.isEmpty
? _buildEmptyState()
: Column(
children: [
Expanded(
child: ListView.builder(
itemCount: savedPaymentMethods.length,
itemBuilder: (context, index) {
return _buildPaymentCard(savedPaymentMethods[index]);
},
),
),
],
),
);
}
Widget _buildEmptyState() {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Icons.payment_outlined, size: 80, color: AppColor.textLight),
const SizedBox(height: 16),
Text(
'Belum Ada Metode Pembayaran',
style: AppStyle.lg.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.textSecondary,
),
),
const SizedBox(height: 8),
Text(
'Tambahkan kartu atau e-wallet untuk\nmemudahkan proses pembayaran',
textAlign: TextAlign.center,
style: AppStyle.md.copyWith(color: AppColor.textLight, height: 1.4),
),
const SizedBox(height: 32),
SizedBox(
width: 220,
height: 48,
child: ElevatedButton(
onPressed: () {
// Navigate to add payment method form
},
style: ElevatedButton.styleFrom(
backgroundColor: AppColor.primary,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(Icons.add, color: AppColor.white, size: 20),
const SizedBox(width: 8),
Text(
'Tambah Pembayaran',
style: AppStyle.md.copyWith(
color: AppColor.white,
fontWeight: FontWeight.w600,
),
),
],
),
),
),
],
),
);
}
}