This commit is contained in:
Phuoc Nguyen
2025-10-17 18:06:32 +07:00
parent 57bf73e4d1
commit e321e9a419
6 changed files with 445 additions and 231 deletions

View File

@@ -12,6 +12,7 @@ import 'package:worker/features/home/presentation/providers/promotions_provider.
import 'package:worker/features/home/presentation/widgets/member_card_widget.dart';
import 'package:worker/features/home/presentation/widgets/promotion_slider.dart';
import 'package:worker/features/home/presentation/widgets/quick_action_section.dart';
import 'package:worker/generated/l10n/app_localizations.dart';
/// Home Page
///
@@ -27,6 +28,8 @@ class HomePage extends ConsumerWidget {
@override
Widget build(BuildContext context, WidgetRef ref) {
final l10n = AppLocalizations.of(context);
// Watch member card state
final memberCardAsync = ref.watch(memberCardProvider);
@@ -34,224 +37,230 @@ class HomePage extends ConsumerWidget {
final promotionsAsync = ref.watch(promotionsProvider);
return Scaffold(
extendBodyBehindAppBar: true, // allow body to render behind status bar
backgroundColor: AppColors.grey50,
body: RefreshIndicator(
onRefresh: () async {
// Refresh both member card and promotions
await Future.wait<void>([
ref.read(memberCardProvider.notifier).refresh(),
ref.read(promotionsProvider.notifier).refresh(),
]);
},
child: CustomScrollView(
slivers: [
// App Bar
const SliverAppBar(
floating: true,
snap: true,
backgroundColor: AppColors.primaryBlue,
title: Text('Trang ch<63>'),
centerTitle: true,
),
body: MediaQuery.removePadding(
context: context,
removeTop: true,
child: RefreshIndicator(
onRefresh: () async {
// Refresh both member card and promotions
await Future.wait<void>([
ref.read(memberCardProvider.notifier).refresh(),
ref.read(promotionsProvider.notifier).refresh(),
]);
},
child: CustomScrollView(
slivers: [
// App Bar
// SliverAppBar(
// floating: true,
// snap: true,
// backgroundColor: AppColors.primaryBlue,
// title: Text(l10n.home),
// centerTitle: true,
// ),
// Member Card Section
SliverToBoxAdapter(
child: memberCardAsync.when(
data: (memberCard) => MemberCardWidget(memberCard: memberCard),
loading: () => Container(
margin: const EdgeInsets.all(16),
height: 200,
decoration: BoxDecoration(
color: AppColors.grey100,
borderRadius: BorderRadius.circular(16),
// Member Card Section
SliverToBoxAdapter(
child: memberCardAsync.when(
data: (memberCard) => MemberCardWidget(memberCard: memberCard),
loading: () => Container(
margin: const EdgeInsets.all(16),
height: 200,
decoration: BoxDecoration(
color: AppColors.grey100,
borderRadius: BorderRadius.circular(16),
),
child: const Center(
child: CircularProgressIndicator(),
),
),
child: const Center(
child: CircularProgressIndicator(),
),
),
error: (error, stack) => Container(
margin: const EdgeInsets.all(16),
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: AppColors.danger.withOpacity(0.1),
borderRadius: BorderRadius.circular(16),
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(
Icons.error_outline,
color: AppColors.danger,
size: 48,
),
const SizedBox(height: 8),
Text(
'Kh<EFBFBD>ng th<74> t<>i th<74> th<74>nh vi<76>n',
style: TextStyle(
error: (error, stack) => Container(
margin: const EdgeInsets.all(16),
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: AppColors.danger.withValues(alpha: 0.1),
borderRadius: BorderRadius.circular(16),
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(
Icons.error_outline,
color: AppColors.danger,
fontWeight: FontWeight.w600,
size: 48,
),
),
const SizedBox(height: 4),
Text(
error.toString(),
style: TextStyle(
color: AppColors.grey500,
fontSize: 12,
const SizedBox(height: 8),
Text(
l10n.error,
style: const TextStyle(
color: AppColors.danger,
fontWeight: FontWeight.w600,
),
),
textAlign: TextAlign.center,
),
],
const SizedBox(height: 4),
Text(
error.toString(),
style: const TextStyle(
color: AppColors.grey500,
fontSize: 12,
),
textAlign: TextAlign.center,
),
],
),
),
),
),
),
// Promotions Section
SliverToBoxAdapter(
child: promotionsAsync.when(
data: (promotions) => promotions.isNotEmpty
? Padding(
padding: const EdgeInsets.symmetric(vertical: 8),
child: PromotionSlider(
promotions: promotions,
onPromotionTap: (promotion) {
// TODO: Navigate to promotion details
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('Xem chi ti<74>t: ${promotion.title}'),
),
);
},
),
)
: const SizedBox.shrink(),
loading: () => const Padding(
padding: EdgeInsets.all(16),
child: Center(child: CircularProgressIndicator()),
// Promotions Section
SliverToBoxAdapter(
child: promotionsAsync.when(
data: (promotions) => promotions.isNotEmpty
? Padding(
padding: const EdgeInsets.symmetric(vertical: 8),
child: PromotionSlider(
promotions: promotions,
onPromotionTap: (promotion) {
// TODO: Navigate to promotion details
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('${l10n.viewDetails}: ${promotion.title}'),
),
);
},
),
)
: const SizedBox.shrink(),
loading: () => const Padding(
padding: EdgeInsets.all(16),
child: Center(child: CircularProgressIndicator()),
),
error: (error, stack) => const SizedBox.shrink(),
),
error: (error, stack) => const SizedBox.shrink(),
),
),
// Quick Action Sections
SliverToBoxAdapter(
child: Column(
children: [
const SizedBox(height: 8),
// Products & Cart Section
QuickActionSection(
title: 'S<EFBFBD>n ph<70>m & Gi<47> h<>ng',
actions: [
QuickAction(
icon: Icons.grid_view,
label: 'S<EFBFBD>n ph<70>m',
onTap: () => _showComingSoon(context, 'S<EFBFBD>n ph<70>m'),
),
QuickAction(
icon: Icons.shopping_cart,
label: 'Gi<EFBFBD> h<>ng',
badge: '3',
onTap: () => _showComingSoon(context, 'Gi<EFBFBD> h<>ng'),
),
QuickAction(
icon: Icons.favorite,
label: 'Y<EFBFBD>u th<EFBFBD>ch',
onTap: () => _showComingSoon(context, 'Y<EFBFBD>u th<EFBFBD>ch'),
),
],
),
// Quick Action Sections
SliverToBoxAdapter(
child: Column(
children: [
const SizedBox(height: 8),
// Products & Cart Section
QuickActionSection(
title: '${l10n.products} & ${l10n.cart}',
actions: [
QuickAction(
icon: Icons.grid_view,
label: l10n.products,
onTap: () => _showComingSoon(context, l10n.products, l10n),
),
QuickAction(
icon: Icons.shopping_cart,
label: l10n.cart,
badge: '3',
onTap: () => _showComingSoon(context, l10n.cart, l10n),
),
QuickAction(
icon: Icons.favorite,
label: 'Yêu thích',
onTap: () => _showComingSoon(context, 'Yêu thích', l10n),
),
],
),
// Loyalty Section
QuickActionSection(
title: 'Kh<EFBFBD>ch h<>ng th<74>n thi<68>t',
actions: [
QuickAction(
icon: Icons.card_giftcard,
label: '<10>i qu<71>',
onTap: () => _showComingSoon(context, '<10>i qu<71>'),
),
QuickAction(
icon: Icons.history,
label: 'L<EFBFBD>ch s<> i<>m',
onTap: () => _showComingSoon(context, 'L<EFBFBD>ch s<> i<>m'),
),
QuickAction(
icon: Icons.person_add,
label: 'Gi<EFBFBD>i thi<68>u b<>n',
onTap: () => _showComingSoon(context, 'Gi<EFBFBD>i thi<68>u b<>n'),
),
],
),
// Loyalty Section
QuickActionSection(
title: l10n.loyalty,
actions: [
QuickAction(
icon: Icons.card_giftcard,
label: l10n.redeemReward,
onTap: () => _showComingSoon(context, l10n.redeemReward, l10n),
),
QuickAction(
icon: Icons.history,
label: l10n.pointsHistory,
onTap: () => _showComingSoon(context, l10n.pointsHistory, l10n),
),
QuickAction(
icon: Icons.person_add,
label: l10n.referral,
onTap: () => _showComingSoon(context, l10n.referral, l10n),
),
],
),
// Quote Requests Section
QuickActionSection(
title: 'Y<EFBFBD>u c<>u b<>o gi<67> & b<>o gi<67>',
actions: [
QuickAction(
icon: Icons.description,
label: 'Y<EFBFBD>u c<>u b<>o gi<67>',
onTap: () => _showComingSoon(context, 'Y<EFBFBD>u c<>u b<>o gi<67>'),
),
QuickAction(
icon: Icons.receipt_long,
label: 'B<EFBFBD>o gi<67>',
onTap: () => _showComingSoon(context, 'B<EFBFBD>o gi<67>'),
),
],
),
// Quote Requests Section
QuickActionSection(
title: l10n.quotes,
actions: [
QuickAction(
icon: Icons.description,
label: l10n.quotes,
onTap: () => _showComingSoon(context, l10n.quotes, l10n),
),
QuickAction(
icon: Icons.receipt_long,
label: l10n.quotes,
onTap: () => _showComingSoon(context, l10n.quotes, l10n),
),
],
),
// Orders & Payments Section
QuickActionSection(
title: '<10>n h<>ng & thanh to<74>n',
actions: [
QuickAction(
icon: Icons.inventory_2,
label: '<10>n h<>ng',
onTap: () => _showComingSoon(context, '<10>n h<>ng'),
),
QuickAction(
icon: Icons.payment,
label: 'Thanh to<74>n',
onTap: () => _showComingSoon(context, 'Thanh to<74>n'),
),
],
),
// Orders & Payments Section
QuickActionSection(
title: '${l10n.orders} & ${l10n.payments}',
actions: [
QuickAction(
icon: Icons.inventory_2,
label: l10n.orders,
onTap: () => _showComingSoon(context, l10n.orders, l10n),
),
QuickAction(
icon: Icons.payment,
label: l10n.payments,
onTap: () => _showComingSoon(context, l10n.payments, l10n),
),
],
),
// Sample Houses & News Section
QuickActionSection(
title: 'Nh<EFBFBD> m<>u, d<> <20>n & tin t<>c',
actions: [
QuickAction(
icon: Icons.home_work,
label: 'Nh<EFBFBD> m<EFBFBD>u',
onTap: () => _showComingSoon(context, 'Nh<EFBFBD> m<EFBFBD>u'),
),
QuickAction(
icon: Icons.business,
label: 'ng k<> d<> <20>n',
onTap: () => _showComingSoon(context, 'ng k<> d<> <20>n'),
),
QuickAction(
icon: Icons.article,
label: 'Tin t<EFBFBD>c',
onTap: () => _showComingSoon(context, 'Tin t<EFBFBD>c'),
),
],
),
// Sample Houses & News Section
QuickActionSection(
title: l10n.projects,
actions: [
QuickAction(
icon: Icons.home_work,
label: 'Nhà mu',
onTap: () => _showComingSoon(context, 'Nhà mu', l10n),
),
QuickAction(
icon: Icons.business,
label: l10n.projects,
onTap: () => _showComingSoon(context, l10n.projects, l10n),
),
QuickAction(
icon: Icons.article,
label: 'Tin tc',
onTap: () => _showComingSoon(context, 'Tin tc', l10n),
),
],
),
// Bottom Padding (for FAB clearance)
const SizedBox(height: 80),
],
// Bottom Padding (for FAB clearance)
const SizedBox(height: 80),
],
),
),
),
],
],
),
),
),
// Floating Action Button (Chat)
floatingActionButton: FloatingActionButton(
onPressed: () => _showComingSoon(context, 'Chat'),
onPressed: () => _showComingSoon(context, l10n.chat, l10n),
backgroundColor: AppColors.accentCyan,
child: const Icon(Icons.chat_bubble),
),
@@ -260,51 +269,51 @@ class HomePage extends ConsumerWidget {
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
currentIndex: 0,
items: const [
items: [
BottomNavigationBarItem(
icon: Icon(Icons.home),
label: 'Trang ch<63>',
icon: const Icon(Icons.home),
label: l10n.home,
),
BottomNavigationBarItem(
icon: Icon(Icons.loyalty),
label: 'H<EFBFBD>i vi<76>n',
icon: const Icon(Icons.loyalty),
label: l10n.loyalty,
),
BottomNavigationBarItem(
icon: Icon(Icons.local_offer),
label: 'Khuy<EFBFBD>n m<>i',
icon: const Icon(Icons.local_offer),
label: l10n.promotions,
),
BottomNavigationBarItem(
icon: Badge(
icon: const Badge(
label: Text('5'),
child: Icon(Icons.notifications),
),
label: 'Th<EFBFBD>ng b<>o',
label: l10n.notifications,
),
BottomNavigationBarItem(
icon: Icon(Icons.account_circle),
label: 'C<EFBFBD>i <11>t',
icon: const Icon(Icons.account_circle),
label: l10n.settings,
),
],
onTap: (index) {
// TODO: Implement navigation
final labels = [
'Trang ch<63>',
'H<EFBFBD>i vi<76>n',
'Khuy<EFBFBD>n m<>i',
'Th<EFBFBD>ng b<>o',
'C<EFBFBD>i <11>t'
l10n.home,
l10n.loyalty,
l10n.promotions,
l10n.notifications,
l10n.settings,
];
_showComingSoon(context, labels[index]);
_showComingSoon(context, labels[index], l10n);
},
),
);
}
/// Show coming soon message
void _showComingSoon(BuildContext context, String feature) {
void _showComingSoon(BuildContext context, String feature, AppLocalizations l10n) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('$feature - S<EFBFBD>p ra m<>t'),
content: Text('$feature - ${l10n.comingSoon}'),
duration: const Duration(seconds: 1),
),
);