renolation/worker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add account, checkout page

Browse Source
This commit is contained in:
Phuoc Nguyen
2025-11-03 15:54:51 +07:00
parent d8e3ca4c46
commit c689f967d5
16 changed files with 2319 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
lib/features/account/presentation/pages/account_page.dart
View File

@@ -191,7 +191,7 @@ class AccountPage extends StatelessWidget {
title: 'Địa chỉ đã lưu',
subtitle: 'Quản lý địa chỉ giao hàng',
onTap: () {
_showComingSoon(context);
context.push(RouteNames.addresses);
},
),
AccountMenuItem(
@@ -207,7 +207,7 @@ class AccountPage extends StatelessWidget {
title: 'Đổi mật khẩu',
subtitle: 'Cập nhật mật khẩu mới',
onTap: () {
_showComingSoon(context);
context.push(RouteNames.changePassword);
},
),
AccountMenuItem(

282
lib/features/account/presentation/pages/addresses_page.dart Normal file
View File

@@ -0,0 +1,282 @@
/// Addresses Page
///
/// Displays list of saved addresses with management options.
/// Features:
/// - List of saved addresses
/// - Default address indicator
/// - Edit/delete actions
/// - Set as default functionality
/// - Add new address
library;
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:go_router/go_router.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:worker/core/constants/ui_constants.dart';
import 'package:worker/core/theme/colors.dart';
import 'package:worker/features/account/presentation/widgets/address_card.dart';
/// Addresses Page
///
/// Page for managing saved delivery addresses.
class AddressesPage extends HookConsumerWidget {
const AddressesPage({super.key});
@override
Widget build(BuildContext context, WidgetRef ref) {
// Mock addresses data
final addresses = useState<List<Map<String, dynamic>>>([
{
'id': '1',
'name': 'Hoàng Minh Hiệp',
'phone': '0347302911',
'address':
'123 Đường Võ Văn Ngân, Phường Linh Chiểu, Thành phố Thủ Đức, TP.HCM',
'isDefault': true,
},
{
'id': '2',
'name': 'Hoàng Minh Hiệp',
'phone': '0347302911',
'address': '456 Đường Nguyễn Thị Minh Khai, Quận 3, TP.HCM',
'isDefault': false,
},
{
'id': '3',
'name': 'Công ty TNHH ABC',
'phone': '0283445566',
'address': '789 Đường Lê Văn Sỹ, Quận Phú Nhuận, TP.HCM',
'isDefault': false,
},
]);
return Scaffold(
backgroundColor: const Color(0xFFF4F6F8),
appBar: AppBar(
backgroundColor: Colors.white,
elevation: 0,
leading: IconButton(
icon: const Icon(Icons.arrow_back, color: Colors.black),
onPressed: () => context.pop(),
),
title: const Text(
'Địa chỉ đã lưu',
style: TextStyle(
color: Colors.black,
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
centerTitle: false,
actions: [
IconButton(
icon: const Icon(Icons.add, color: Colors.black),
onPressed: () {
_showAddAddress(context);
},
),
const SizedBox(width: AppSpacing.sm),
],
),
body: Column(
children: [
// Address List
Expanded(
child: addresses.value.isEmpty
? _buildEmptyState(context)
: ListView.separated(
padding: const EdgeInsets.all(AppSpacing.md),
itemCount: addresses.value.length,
separatorBuilder: (context, index) =>
const SizedBox(height: AppSpacing.md),
itemBuilder: (context, index) {
final address = addresses.value[index];
return AddressCard(
name: address['name'] as String,
phone: address['phone'] as String,
address: address['address'] as String,
isDefault: address['isDefault'] as bool,
onEdit: () {
_showEditAddress(context, address);
},
onDelete: () {
_showDeleteConfirmation(context, addresses, index);
},
onSetDefault: () {
_setDefaultAddress(addresses, index);
},
);
},
),
),
// Add New Address Button
Padding(
padding: const EdgeInsets.all(AppSpacing.md),
child: SizedBox(
width: double.infinity,
child: ElevatedButton.icon(
onPressed: () {
_showAddAddress(context);
},
icon: const Icon(Icons.add, size: 20),
label: const Text(
'Thêm địa chỉ mới',
style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
),
style: ElevatedButton.styleFrom(
backgroundColor: AppColors.primaryBlue,
foregroundColor: Colors.white,
padding: const EdgeInsets.symmetric(vertical: 14),
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppRadius.button),
),
),
),
),
),
],
),
);
}
/// Build empty state
Widget _buildEmptyState(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.location_off,
size: 64,
color: AppColors.grey500.withValues(alpha: 0.5),
),
const SizedBox(height: 16),
const Text(
'Chưa có địa chỉ nào',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
color: AppColors.grey500,
),
),
const SizedBox(height: 8),
const Text(
'Thêm địa chỉ để nhận hàng nhanh hơn',
style: TextStyle(fontSize: 14, color: AppColors.grey500),
),
const SizedBox(height: 24),
ElevatedButton.icon(
onPressed: () {
_showAddAddress(context);
},
icon: const Icon(Icons.add, size: 20),
label: const Text(
'Thêm địa chỉ mới',
style: TextStyle(fontSize: 14, fontWeight: FontWeight.w600),
),
style: ElevatedButton.styleFrom(
backgroundColor: AppColors.primaryBlue,
foregroundColor: Colors.white,
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppRadius.button),
),
),
),
],
),
);
}
/// Set address as default
void _setDefaultAddress(
ValueNotifier<List<Map<String, dynamic>>> addresses,
int index,
) {
final updatedAddresses = addresses.value.map((address) {
return {...address, 'isDefault': false};
}).toList();
updatedAddresses[index]['isDefault'] = true;
addresses.value = updatedAddresses;
}
/// Show add address dialog (TODO: implement form page)
void _showAddAddress(BuildContext context) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Chức năng thêm địa chỉ mới sẽ được phát triển'),
duration: Duration(seconds: 2),
),
);
}
/// Show edit address dialog (TODO: implement form page)
void _showEditAddress(BuildContext context, Map<String, dynamic> address) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('Chỉnh sửa địa chỉ: ${address['name']}'),
duration: const Duration(seconds: 2),
),
);
}
/// Show delete confirmation dialog
void _showDeleteConfirmation(
BuildContext context,
ValueNotifier<List<Map<String, dynamic>>> addresses,
int index,
) {
showDialog<void>(
context: context,
builder: (context) => AlertDialog(
title: const Text('Xóa địa chỉ'),
content: const Text('Bạn có chắc chắn muốn xóa địa chỉ này?'),
actions: [
TextButton(
onPressed: () => Navigator.pop(context),
child: const Text('Hủy'),
),
TextButton(
onPressed: () {
Navigator.pop(context);
_deleteAddress(context, addresses, index);
},
style: TextButton.styleFrom(foregroundColor: AppColors.danger),
child: const Text('Xóa'),
),
],
),
);
}
/// Delete address
void _deleteAddress(
BuildContext context,
ValueNotifier<List<Map<String, dynamic>>> addresses,
int index,
) {
final deletedAddress = addresses.value[index];
final updatedAddresses = List<Map<String, dynamic>>.from(addresses.value);
updatedAddresses.removeAt(index);
// If deleted address was default and there are other addresses,
// set the first one as default
if (deletedAddress['isDefault'] == true && updatedAddresses.isNotEmpty) {
updatedAddresses[0]['isDefault'] = true;
}
addresses.value = updatedAddresses;
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Đã xóa địa chỉ'),
duration: Duration(seconds: 2),
),
);
}
}

479
lib/features/account/presentation/pages/change_password_page.dart Normal file
View File

@@ -0,0 +1,479 @@
/// Change Password Page
///
/// Allows users to change their password.
/// Features:
/// - Current password verification
/// - New password with validation
/// - Password confirmation
/// - Show/hide password toggles
/// - Security tips
library;
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:go_router/go_router.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:worker/core/constants/ui_constants.dart';
import 'package:worker/core/theme/colors.dart';
/// Change Password Page
///
/// Page for changing user password with validation and security tips.
class ChangePasswordPage extends HookConsumerWidget {
const ChangePasswordPage({super.key});
@override
Widget build(BuildContext context, WidgetRef ref) {
// Form key for validation
final formKey = useMemoized(() => GlobalKey<FormState>());
// Password controllers
final currentPasswordController = useTextEditingController();
final newPasswordController = useTextEditingController();
final confirmPasswordController = useTextEditingController();
// Password visibility states
final currentPasswordVisible = useState<bool>(false);
final newPasswordVisible = useState<bool>(false);
final confirmPasswordVisible = useState<bool>(false);
// Password match state
final passwordsMatch = useState<bool?>(null);
// Listen to password changes for validation
useEffect(() {
void listener() {
final newPass = newPasswordController.text;
final confirmPass = confirmPasswordController.text;
if (confirmPass.isEmpty) {
passwordsMatch.value = null;
} else {
passwordsMatch.value = newPass == confirmPass;
}
}
newPasswordController.addListener(listener);
confirmPasswordController.addListener(listener);
return () {
newPasswordController.removeListener(listener);
confirmPasswordController.removeListener(listener);
};
}, []);
return Scaffold(
backgroundColor: const Color(0xFFF4F6F8),
appBar: AppBar(
backgroundColor: Colors.white,
elevation: 0,
leading: IconButton(
icon: const Icon(Icons.arrow_back, color: Colors.black),
onPressed: () => context.pop(),
),
title: const Text(
'Thay đổi mật khẩu',
style: TextStyle(
color: Colors.black,
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
centerTitle: false,
actions: const [SizedBox(width: AppSpacing.sm)],
),
body: Form(
key: formKey,
child: SingleChildScrollView(
child: Column(
children: [
const SizedBox(height: AppSpacing.md),
// Form Card
Container(
margin: const EdgeInsets.symmetric(horizontal: AppSpacing.md),
padding: const EdgeInsets.all(AppSpacing.md),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(AppRadius.card),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.05),
blurRadius: 8,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Title
const Text(
'Cập nhật mật khẩu',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: Color(0xFF212121),
),
),
const SizedBox(height: AppSpacing.lg),
// Current Password
_buildPasswordField(
label: 'Mật khẩu hiện tại',
controller: currentPasswordController,
isVisible: currentPasswordVisible,
required: true,
validator: (value) {
if (value == null || value.isEmpty) {
return 'Vui lòng nhập mật khẩu hiện tại';
}
return null;
},
),
const SizedBox(height: AppSpacing.md),
// New Password
_buildPasswordField(
label: 'Mật khẩu mới',
controller: newPasswordController,
isVisible: newPasswordVisible,
required: true,
helpText: 'Mật khẩu phải có ít nhất 6 ký tự',
validator: (value) {
if (value == null || value.isEmpty) {
return 'Vui lòng nhập mật khẩu mới';
}
if (value.length < 6) {
return 'Mật khẩu phải có ít nhất 6 ký tự';
}
return null;
},
),
const SizedBox(height: AppSpacing.md),
// Confirm Password
_buildPasswordField(
label: 'Nhập lại mật khẩu mới',
controller: confirmPasswordController,
isVisible: confirmPasswordVisible,
required: true,
validator: (value) {
if (value == null || value.isEmpty) {
return 'Vui lòng nhập lại mật khẩu mới';
}
if (value != newPasswordController.text) {
return 'Mật khẩu không khớp';
}
return null;
},
),
// Password match indicator
if (passwordsMatch.value != null) ...[
const SizedBox(height: 8),
Row(
children: [
Icon(
passwordsMatch.value == true
? Icons.check_circle
: Icons.error,
size: 16,
color: passwordsMatch.value == true
? AppColors.success
: AppColors.danger,
),
const SizedBox(width: 8),
Text(
passwordsMatch.value == true
? 'Mật khẩu khớp'
: 'Mật khẩu không khớp',
style: TextStyle(
fontSize: 14,
color: passwordsMatch.value == true
? AppColors.success
: AppColors.danger,
),
),
],
),
],
const SizedBox(height: AppSpacing.lg),
// Security Tips
_buildSecurityTips(),
],
),
),
const SizedBox(height: AppSpacing.lg),
// Action Buttons
_buildActionButtons(
context: context,
formKey: formKey,
currentPasswordController: currentPasswordController,
newPasswordController: newPasswordController,
confirmPasswordController: confirmPasswordController,
),
const SizedBox(height: AppSpacing.lg),
],
),
),
),
);
}
/// Build password field with show/hide toggle
Widget _buildPasswordField({
required String label,
required TextEditingController controller,
required ValueNotifier<bool> isVisible,
bool required = false,
String? helpText,
String? Function(String?)? validator,
}) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
RichText(
text: TextSpan(
text: label,
style: const TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
color: Color(0xFF1E293B),
),
children: [
if (required)
const TextSpan(
text: ' *',
style: TextStyle(color: AppColors.danger),
),
],
),
),
const SizedBox(height: 8),
TextFormField(
controller: controller,
obscureText: !isVisible.value,
validator: validator,
decoration: InputDecoration(
hintText: 'Nhập $label',
hintStyle: TextStyle(
color: AppColors.grey500.withValues(alpha: 0.6),
fontSize: 14,
),
filled: true,
fillColor: const Color(0xFFF8FAFC),
contentPadding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 12,
),
suffixIcon: IconButton(
icon: Icon(
isVisible.value ? Icons.visibility_off : Icons.visibility,
size: 20,
color: AppColors.grey500,
),
onPressed: () {
isVisible.value = !isVisible.value;
},
),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(AppRadius.input),
borderSide: const BorderSide(color: Color(0xFFE2E8F0)),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(AppRadius.input),
borderSide: const BorderSide(color: Color(0xFFE2E8F0)),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(AppRadius.input),
borderSide: const BorderSide(
color: AppColors.primaryBlue,
width: 2,
),
),
errorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(AppRadius.input),
borderSide: const BorderSide(color: AppColors.danger),
),
focusedErrorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(AppRadius.input),
borderSide: const BorderSide(color: AppColors.danger, width: 2),
),
),
),
if (helpText != null) ...[
const SizedBox(height: 8),
Text(
helpText,
style: const TextStyle(fontSize: 12, color: AppColors.grey500),
),
],
],
);
}
/// Build security tips section
Widget _buildSecurityTips() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: const Color(0xFFF8FAFC),
borderRadius: BorderRadius.circular(AppRadius.card),
border: Border.all(color: const Color(0xFFE2E8F0)),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Gợi ý bảo mật:',
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w600,
color: Color(0xFF212121),
),
),
const SizedBox(height: 12),
_buildSecurityTip('Sử dụng ít nhất 8 ký tự'),
_buildSecurityTip('Kết hợp chữ hoa, chữ thường và số'),
_buildSecurityTip('Bao gồm ký tự đặc biệt (!@#\$%^&*)'),
_buildSecurityTip('Không sử dụng thông tin cá nhân'),
_buildSecurityTip('Thường xuyên thay đổi mật khẩu'),
],
),
);
}
/// Build individual security tip
Widget _buildSecurityTip(String text) {
return Padding(
padding: const EdgeInsets.only(bottom: 8),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Icon(
Icons.check_circle_outline,
size: 16,
color: AppColors.success,
),
const SizedBox(width: 8),
Expanded(
child: Text(
text,
style: const TextStyle(
fontSize: 13,
color: Color(0xFF475569),
height: 1.4,
),
),
),
],
),
);
}
/// Build action buttons
Widget _buildActionButtons({
required BuildContext context,
required GlobalKey<FormState> formKey,
required TextEditingController currentPasswordController,
required TextEditingController newPasswordController,
required TextEditingController confirmPasswordController,
}) {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: AppSpacing.md),
child: Row(
children: [
// Cancel Button
Expanded(
child: OutlinedButton(
onPressed: () {
context.pop();
},
style: OutlinedButton.styleFrom(
padding: const EdgeInsets.symmetric(vertical: 14),
side: const BorderSide(color: AppColors.grey100),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppRadius.button),
),
),
child: const Text(
'Hủy bỏ',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
color: AppColors.grey900,
),
),
),
),
const SizedBox(width: AppSpacing.sm),
// Change Password Button
Expanded(
flex: 2,
child: ElevatedButton.icon(
onPressed: () {
if (formKey.currentState?.validate() ?? false) {
_changePassword(
context,
currentPasswordController.text,
newPasswordController.text,
);
}
},
icon: const Icon(Icons.key, size: 20),
label: const Text(
'Đổi mật khẩu',
style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
),
style: ElevatedButton.styleFrom(
backgroundColor: AppColors.primaryBlue,
foregroundColor: Colors.white,
padding: const EdgeInsets.symmetric(vertical: 14),
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppRadius.button),
),
),
),
),
],
),
);
}
/// Change password
void _changePassword(
BuildContext context,
String currentPassword,
String newPassword,
) {
// TODO: Implement actual password change with backend
// For now, just show success message
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Mật khẩu đã được thay đổi thành công!'),
backgroundColor: AppColors.success,
duration: Duration(seconds: 2),
),
);
// Navigate back after a short delay
Future.delayed(const Duration(milliseconds: 500), () {
if (context.mounted) {
context.pop();
}
});
}
}