admin.suherdy/odoo_loyalty_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: implement loyalty rewards screen with point balance display and backend data fetching

Browse Source
This commit is contained in:
Suherdy Yacob 2026-06-16 07:16:00 +07:00
parent c680dd1c31
commit e0b959b858
6 changed files with 652 additions and 112 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

157
lib/screens/loyalty_dashboard.dart
View File

@ -130,39 +130,97 @@ class _LoyaltyCardTile extends StatelessWidget {
return Container( return Container(
margin: const EdgeInsets.fromLTRB(16, 16, 16, 8), margin: const EdgeInsets.fromLTRB(16, 16, 16, 8),
padding: const EdgeInsets.all(24),
decoration: BoxDecoration( decoration: BoxDecoration(
color: colorScheme.primary, borderRadius: BorderRadius.circular(20),
borderRadius: BorderRadius.circular(16), gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
colorScheme.primary,
Color.lerp(colorScheme.primary, Colors.black, 0.22) ?? colorScheme.primary,
],
),
border: Border.all( border: Border.all(
color: accentColor.withValues(alpha: 0.5), color: accentColor.withValues(alpha: 0.45),
width: 1.5, width: 1.5,
), ),
boxShadow: [ boxShadow: [
BoxShadow( BoxShadow(
color: Colors.black.withValues(alpha: 0.12), color: Colors.black.withValues(alpha: 0.16),
blurRadius: 16, blurRadius: 18,
offset: const Offset(0, 6), offset: const Offset(0, 8),
), ),
], ],
), ),
child: ClipRRect(
borderRadius: BorderRadius.circular(20),
child: Stack(
children: [
// Decorative background patterns
Positioned(
right: -40,
top: -40,
child: Container(
width: 180,
height: 180,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Colors.white.withValues(alpha: 0.04),
),
),
),
Positioned(
right: 20,
bottom: -80,
child: Container(
width: 200,
height: 200,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Colors.white.withValues(alpha: 0.03),
),
),
),
Positioned(
left: -30,
bottom: -40,
child: Container(
width: 130,
height: 130,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Colors.black.withValues(alpha: 0.06),
),
),
),
// Card Content
Padding(
padding: const EdgeInsets.all(24),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
// Top Row: Logo / Star + Tier Badge
Row( Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [ children: [
Expanded( Row(
child: Text( children: [
'${card['program_id']?[1] ?? 'Loyalty Program'}', Icon(
style: theme.textTheme.titleLarge?.copyWith( Icons.stars_rounded,
color: onPrimary, color: accentColor,
fontFamily: 'serif', size: 22,
), ),
softWrap: true, const SizedBox(width: 8),
Text(
'MAPAN CLUB',
style: theme.textTheme.labelMedium?.copyWith(
color: onPrimary.withValues(alpha: 0.85),
fontWeight: FontWeight.w900,
letterSpacing: 2.0,
), ),
), ),
const SizedBox(width: 12), ],
),
Container( Container(
padding: const EdgeInsets.symmetric( padding: const EdgeInsets.symmetric(
horizontal: 12, horizontal: 12,
@ -171,6 +229,13 @@ class _LoyaltyCardTile extends StatelessWidget {
decoration: BoxDecoration( decoration: BoxDecoration(
color: accentColor, color: accentColor,
borderRadius: BorderRadius.circular(20), borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.1),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
), ),
child: Text( child: Text(
tier, tier,
@ -186,17 +251,20 @@ class _LoyaltyCardTile extends StatelessWidget {
), ),
], ],
), ),
const SizedBox(height: 24), const SizedBox(height: 36),
// Middle Section: Card Label
Text( Text(
'MEMBERSHIP CODE', 'MEMBER ID',
style: theme.textTheme.bodySmall?.copyWith( style: theme.textTheme.labelSmall?.copyWith(
color: onPrimary.withValues(alpha: 0.7), color: onPrimary.withValues(alpha: 0.6),
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
fontSize: 10, letterSpacing: 1.5,
letterSpacing: 1.0,
), ),
), ),
const SizedBox(height: 4), const SizedBox(height: 8),
// Card Number (Membership Code)
Text( Text(
'${card['code'] ?? 'N/A'}', '${card['code'] ?? 'N/A'}',
style: theme.textTheme.titleMedium?.copyWith( style: theme.textTheme.titleMedium?.copyWith(
@ -204,9 +272,25 @@ class _LoyaltyCardTile extends StatelessWidget {
fontFamily: 'monospace', fontFamily: 'monospace',
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
shadows: [
Shadow(
color: Colors.black.withValues(alpha: 0.25),
offset: const Offset(1, 1),
blurRadius: 2,
),
],
), ),
), ),
const SizedBox(height: 20), const SizedBox(height: 24),
// Divider line
Container(
height: 1,
color: onPrimary.withValues(alpha: 0.12),
),
const SizedBox(height: 16),
// Bottom Section: Points
Row( Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.end, crossAxisAlignment: CrossAxisAlignment.end,
@ -217,43 +301,44 @@ class _LoyaltyCardTile extends StatelessWidget {
Text( Text(
'AVAILABLE POINTS', 'AVAILABLE POINTS',
style: theme.textTheme.bodySmall?.copyWith( style: theme.textTheme.bodySmall?.copyWith(
color: onPrimary.withValues(alpha: 0.7), color: onPrimary.withValues(alpha: 0.6),
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
fontSize: 10, fontSize: 9,
letterSpacing: 1.0, letterSpacing: 1.2,
), ),
), ),
const SizedBox(height: 4), const SizedBox(height: 6),
Row( Row(
children: [ children: [
Icon( Icon(
Icons.restaurant_rounded, Icons.restaurant_rounded,
color: accentColor, color: accentColor,
size: 16, size: 14,
), ),
const SizedBox(width: 6), const SizedBox(width: 6),
Text( Text(
'Dine & Save', 'Dine & Save',
style: theme.textTheme.bodyMedium?.copyWith( style: theme.textTheme.bodyMedium?.copyWith(
color: onPrimary.withValues(alpha: 0.9), color: onPrimary.withValues(alpha: 0.8),
fontStyle: FontStyle.italic, fontStyle: FontStyle.italic,
fontSize: 12,
), ),
), ),
], ],
), ),
], ],
), ),
const SizedBox(width: 16),
Expanded( Expanded(
child: Align( child: Align(
alignment: Alignment.bottomRight, alignment: Alignment.bottomRight,
child: FittedBox( child: FittedBox(
fit: BoxFit.scaleDown, fit: BoxFit.scaleDown,
child: Text( child: Text(
'${card['points'] ?? 0}', '${card['points'] ?? 0} pts',
style: theme.textTheme.displayMedium?.copyWith( style: theme.textTheme.headlineLarge?.copyWith(
color: accentColor, color: accentColor,
fontWeight: FontWeight.bold, fontWeight: FontWeight.w900,
fontSize: 32,
), ),
), ),
), ),
@ -263,6 +348,12 @@ class _LoyaltyCardTile extends StatelessWidget {
), ),
], ],
), ),
),
],
),
),
); );
} }
} }

7
lib/screens/main_shell.dart
View File

@ -10,6 +10,7 @@ import 'loyalty_dashboard.dart';
import 'branches_screen.dart'; import 'branches_screen.dart';
import 'orders_screen.dart'; import 'orders_screen.dart';
import 'account_screen.dart'; import 'account_screen.dart';
import 'rewards_screen.dart';
class MainShell extends StatefulWidget { class MainShell extends StatefulWidget {
final int partnerId; final int partnerId;
@ -31,6 +32,7 @@ class _MainShellState extends State<MainShell> {
super.initState(); super.initState();
_pages = [ _pages = [
LoyaltyDashboard(partnerId: widget.partnerId), LoyaltyDashboard(partnerId: widget.partnerId),
RewardsScreen(partnerId: widget.partnerId),
const BranchesScreen(), const BranchesScreen(),
const OrdersScreen(), const OrdersScreen(),
const AccountScreen(), const AccountScreen(),
@ -120,9 +122,10 @@ class _MainShellState extends State<MainShell> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final navLabels = ['Home', 'Branches', 'Orders', 'Account']; final navLabels = ['Home', 'Rewards', 'Branches', 'History', 'Account'];
final navIcons = [ final navIcons = [
Icons.home_rounded, Icons.home_rounded,
Icons.redeem_rounded,
Icons.location_on_rounded, Icons.location_on_rounded,
Icons.receipt_long_rounded, Icons.receipt_long_rounded,
Icons.person_rounded, Icons.person_rounded,
@ -210,7 +213,7 @@ class _MainShellState extends State<MainShell> {
}, },
backgroundColor: colorScheme.surfaceContainerLowest, backgroundColor: colorScheme.surfaceContainerLowest,
indicatorColor: colorScheme.primary, indicatorColor: colorScheme.primary,
destinations: List.generate(4, (i) { destinations: List.generate(5, (i) {
return NavigationDestination( return NavigationDestination(
icon: Icon(navIcons[i], icon: Icon(navIcons[i],
color: i == _currentIndex color: i == _currentIndex

416
lib/screens/rewards_screen.dart Normal file
View File

@ -0,0 +1,416 @@
import 'package:flutter/material.dart';
import '../services/odoo_service.dart';
import '../utils/safe_cast.dart';
class RewardsScreen extends StatefulWidget {
final int partnerId;
const RewardsScreen({super.key, required this.partnerId});
@override
State<RewardsScreen> createState() => _RewardsScreenState();
}
class _RewardsScreenState extends State<RewardsScreen> {
double _userPoints = 0.0;
List<dynamic> _rewards = [];
bool _isLoading = true;
@override
void initState() {
super.initState();
_fetchData();
}
Future<void> _fetchData() async {
if (!mounted) return;
setState(() => _isLoading = true);
try {
final cards = await OdooService().getLoyaltyCards(widget.partnerId);
double totalPoints = 0.0;
List<dynamic> rawRewards = [];
if (cards.isNotEmpty) {
totalPoints = safeDouble(cards.first['points']);
final prog = cards.first['program_id'];
int? programId;
if (prog is List && prog.isNotEmpty) {
programId = prog[0] as int?;
} else if (prog is int) {
programId = prog;
}
if (programId != null) {
rawRewards = await OdooService().getLoyaltyRewards(programId);
}
}
if (mounted) {
setState(() {
_userPoints = totalPoints;
_rewards = rawRewards;
_isLoading = false;
});
}
} catch (e) {
if (mounted) {
setState(() => _isLoading = false);
final errStr = e.toString().toLowerCase();
final isSessionExpired = e.runtimeType.toString().contains('SessionExpired') ||
errStr.contains('session expired') ||
errStr.contains('session_expired');
if (!isSessionExpired) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Failed to load rewards. Please try again.')),
);
}
}
}
}
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
final colorScheme = theme.colorScheme;
if (_isLoading) {
return const Center(child: CircularProgressIndicator());
}
return Scaffold(
backgroundColor: Colors.transparent, // transparency allows MainShell gradient to show
body: RefreshIndicator(
onRefresh: _fetchData,
child: Column(
children: [
// Top Balance Banner
Container(
margin: const EdgeInsets.fromLTRB(16, 16, 16, 8),
padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 24),
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
colorScheme.primary,
colorScheme.primary.withValues(alpha: 0.85),
],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
borderRadius: BorderRadius.circular(16),
border: Border.all(
color: colorScheme.secondary.withValues(alpha: 0.4),
width: 1.5,
),
boxShadow: [
BoxShadow(
color: colorScheme.primary.withValues(alpha: 0.15),
blurRadius: 8,
offset: const Offset(0, 4),
),
],
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Points Balance',
style: theme.textTheme.labelMedium?.copyWith(
color: colorScheme.onPrimary.withValues(alpha: 0.8),
letterSpacing: 1.0,
),
),
const SizedBox(height: 4),
Text(
'${_userPoints.toStringAsFixed(0)} Points',
style: theme.textTheme.headlineMedium?.copyWith(
color: colorScheme.onPrimary,
fontWeight: FontWeight.bold,
fontFamily: 'Lora',
),
),
],
),
Icon(
Icons.stars_rounded,
color: colorScheme.secondary,
size: 44,
),
],
),
),
// Instruction Banner
Padding(
padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 8),
child: Row(
children: [
Icon(
Icons.info_outline_rounded,
size: 16,
color: colorScheme.primary.withValues(alpha: 0.75),
),
const SizedBox(width: 8),
Expanded(
child: Text(
'Present your Member ID barcode or Phone Number to the cashier to claim these rewards.',
style: theme.textTheme.bodySmall?.copyWith(
color: theme.textTheme.bodyMedium?.color?.withValues(alpha: 0.75),
height: 1.3,
),
),
),
],
),
),
// Rewards List
Expanded(
child: _rewards.isEmpty
? Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.redeem_rounded,
size: 64,
color: colorScheme.onSurfaceVariant.withValues(alpha: 0.3),
),
const SizedBox(height: 16),
Text(
'No rewards currently available',
style: theme.textTheme.titleMedium?.copyWith(
color: colorScheme.onSurfaceVariant.withValues(alpha: 0.6),
),
),
],
),
)
: ListView.builder(
padding: const EdgeInsets.fromLTRB(16, 8, 16, 24),
itemCount: _rewards.length,
itemBuilder: (context, index) {
final reward = _rewards[index];
final reqPoints = safeDouble(reward['required_points']);
final isAvailable = _userPoints >= reqPoints;
final String desc = safeString(reward['description']) ?? 'Loyalty Reward';
final String type = safeString(reward['reward_type']) ?? 'product';
// Decide icon based on reward type
IconData iconData = Icons.local_offer_rounded;
if (type == 'product') {
iconData = Icons.local_dining_rounded;
} else if (type == 'shipping') {
iconData = Icons.local_shipping_rounded;
}
return Container(
margin: const EdgeInsets.only(bottom: 14),
decoration: BoxDecoration(
color: colorScheme.surfaceContainerLow,
borderRadius: BorderRadius.circular(16),
border: Border.all(
color: colorScheme.outline.withValues(alpha: 0.15),
width: 1,
),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.04),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: IntrinsicHeight(
child: Row(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
// Left Points Ticket Column
Container(
width: 90,
decoration: BoxDecoration(
color: colorScheme.primary.withValues(alpha: 0.06),
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(15),
bottomLeft: Radius.circular(15),
),
),
padding: const EdgeInsets.symmetric(horizontal: 10),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
reqPoints.toStringAsFixed(0),
style: theme.textTheme.titleLarge?.copyWith(
color: colorScheme.primary,
fontWeight: FontWeight.bold,
fontFamily: 'monospace',
),
),
const SizedBox(height: 2),
Text(
'PTS',
style: theme.textTheme.labelSmall?.copyWith(
color: colorScheme.primary.withValues(alpha: 0.8),
fontWeight: FontWeight.w900,
letterSpacing: 1.0,
),
),
],
),
),
// Custom Dashed Divider (Simulating Tear-off Voucher)
CustomPaint(
size: const Size(1, double.infinity),
painter: _TicketDividerPainter(
color: colorScheme.outline.withValues(alpha: 0.25),
),
),
// Right Content Column
Expanded(
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Icon(
iconData,
size: 18,
color: colorScheme.secondary,
),
const SizedBox(width: 8),
Expanded(
child: Text(
desc,
style: theme.textTheme.titleMedium?.copyWith(
fontFamily: 'Lora',
fontWeight: FontWeight.bold,
height: 1.2,
),
),
),
],
),
const SizedBox(height: 12),
// Status indicator
isAvailable
? Container(
padding: const EdgeInsets.symmetric(
horizontal: 10,
vertical: 4,
),
decoration: BoxDecoration(
color: Colors.green.withValues(alpha: 0.1),
borderRadius: BorderRadius.circular(12),
border: Border.all(
color: Colors.green.withValues(alpha: 0.25),
),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(
Icons.check_circle_rounded,
size: 12,
color: Colors.green,
),
const SizedBox(width: 4),
Text(
'Available to Redeem',
style: theme.textTheme.bodySmall?.copyWith(
color: Colors.green[800],
fontWeight: FontWeight.bold,
fontSize: 10,
),
),
],
),
)
: Container(
padding: const EdgeInsets.symmetric(
horizontal: 10,
vertical: 4,
),
decoration: BoxDecoration(
color: colorScheme.error.withValues(alpha: 0.05),
borderRadius: BorderRadius.circular(12),
border: Border.all(
color: colorScheme.error.withValues(alpha: 0.2),
),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
Icons.lock_rounded,
size: 12,
color: colorScheme.error.withValues(alpha: 0.8),
),
const SizedBox(width: 4),
Text(
'Need ${(reqPoints - _userPoints).toStringAsFixed(0)} more pts',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.error,
fontWeight: FontWeight.bold,
fontSize: 10,
),
),
],
),
),
],
),
),
),
],
),
),
);
},
),
),
],
),
),
);
}
}
class _TicketDividerPainter extends CustomPainter {
final Color color;
_TicketDividerPainter({required this.color});
@override
void paint(Canvas canvas, Size size) {
final paint = Paint()
..color = color
..strokeWidth = 1.0
..style = PaintingStyle.stroke;
double maxH = size.height;
double dashHeight = 4.0;
double dashSpace = 4.0;
double currentY = 0.0;
while (currentY < maxH) {
canvas.drawLine(
Offset(0, currentY),
Offset(0, currentY + dashHeight),
paint,
);
currentY += dashHeight + dashSpace;
}
}
@override
bool shouldRepaint(covariant CustomPainter oldDelegate) => false;
}

26
lib/services/odoo_service.dart
View File

@ -303,4 +303,30 @@ class OdooService {
} }
} }
} }
/// Fetch active loyalty rewards for a list of program IDs.
Future<List<dynamic>> getLoyaltyRewards(List<int> programIds) async {
if (programIds.isEmpty) return [];
return await callKw({
'model': 'loyalty.reward',
'method': 'search_read',
'args': [
[
['program_id', 'in', programIds],
['program_id.active', '=', true],
],
],
'kwargs': {
'fields': [
'id',
'program_id',
'description',
'required_points',
'reward_type',
'reward_product_id',
'reward_product_qty',
]
}
}) as List<dynamic>;
}
} }

11
lib/utils/safe_cast.dart
View File

@ -7,3 +7,14 @@ String? safeString(dynamic value) {
} }
return null; return null;
} }
/// Safely converts a dynamic value from Odoo JSON-RPC to a double.
double safeDouble(dynamic value) {
if (value is num) {
return value.toDouble();
}
if (value is String) {
return double.tryParse(value) ?? 0.0;
}
return 0.0;
}

7
lib/widgets/promo_card_widget.dart
View File

@ -18,13 +18,6 @@ class PromoCardRow extends StatelessWidget {
return Column( return Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Padding(
padding: const EdgeInsets.fromLTRB(16, 0, 16, 12),
child: Text(
'Promo Highlights',
style: Theme.of(context).textTheme.titleMedium,
),
),
SizedBox( SizedBox(
height: 180, height: 180,
child: ListView.builder( child: ListView.builder(