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

Compare commits

base: admin.suherdy:6ff44041f08620721c76c6734597b75eaa781e74
Branches Tags
admin.suherdy:main
..
compare: admin.suherdy:e73fc63e878a0b07ad2bc04f6555824e672610b7
Branches Tags
admin.suherdy:main

No commits in common. "6ff44041f08620721c76c6734597b75eaa781e74" and "e73fc63e878a0b07ad2bc04f6555824e672610b7" have entirely different histories.
6ff44041f0 ... e73fc63e87

8 changed files with 283 additions and 568 deletions
Show Stats Expand all files Collapse all files

121
lib/screens/branches_screen.dart
View File

@ -3,6 +3,8 @@ import 'package:flutter/material.dart';
import 'package:geolocator/geolocator.dart'; import 'package:geolocator/geolocator.dart';
import 'package:url_launcher/url_launcher.dart'; import 'package:url_launcher/url_launcher.dart';
import '../services/odoo_service.dart'; import '../services/odoo_service.dart';
import '../theme/app_theme.dart';
class BranchesScreen extends StatefulWidget { class BranchesScreen extends StatefulWidget {
const BranchesScreen({super.key}); const BranchesScreen({super.key});
@ -151,9 +153,6 @@ class _BranchesScreenState extends State<BranchesScreen> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context);
final colorScheme = theme.colorScheme;
return _isLoading return _isLoading
? const Center(child: CircularProgressIndicator()) ? const Center(child: CircularProgressIndicator())
: RefreshIndicator( : RefreshIndicator(
@ -164,17 +163,17 @@ class _BranchesScreenState extends State<BranchesScreen> {
if (_locationDenied) if (_locationDenied)
Container( Container(
width: double.infinity, width: double.infinity,
color: colorScheme.surfaceContainerLow, color: AppTheme.surfaceContainerLow,
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10), padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10),
child: Row( child: Row(
children: [ children: [
Icon(Icons.location_off, size: 16, color: colorScheme.onSurfaceVariant), const Icon(Icons.location_off, size: 16, color: AppTheme.onSurfaceVariant),
const SizedBox(width: 8), const SizedBox(width: 8),
Expanded( Expanded(
child: Text( child: Text(
'Location not available. Showing branches alphabetically.', 'Location not available. Showing branches alphabetically.',
style: theme.textTheme.bodySmall?.copyWith( style: Theme.of(context).textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant, color: AppTheme.onSurfaceVariant,
), ),
), ),
), ),
@ -184,16 +183,16 @@ class _BranchesScreenState extends State<BranchesScreen> {
else if (_userPosition != null) else if (_userPosition != null)
Container( Container(
width: double.infinity, width: double.infinity,
color: colorScheme.surfaceContainerLow, color: AppTheme.surfaceContainerLow,
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10), padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10),
child: Row( child: Row(
children: [ children: [
Icon(Icons.my_location, size: 16, color: colorScheme.secondary), const Icon(Icons.my_location, size: 16, color: AppTheme.secondary),
const SizedBox(width: 8), const SizedBox(width: 8),
Text( Text(
'Sorted by distance from your location', 'Sorted by distance from your location',
style: theme.textTheme.bodySmall?.copyWith( style: Theme.of(context).textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant, color: AppTheme.onSurfaceVariant,
), ),
), ),
], ],
@ -234,16 +233,9 @@ class _BranchesScreenState extends State<BranchesScreen> {
return Container( return Container(
margin: const EdgeInsets.only(bottom: 12), margin: const EdgeInsets.only(bottom: 12),
decoration: BoxDecoration( decoration: const BoxDecoration(
color: colorScheme.surfaceContainerLow, color: AppTheme.surfaceContainerLow,
borderRadius: BorderRadius.circular(16), borderRadius: BorderRadius.zero,
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.03),
blurRadius: 8,
offset: const Offset(0, 3),
),
],
), ),
child: ListTile( child: ListTile(
contentPadding: const EdgeInsets.all(16), contentPadding: const EdgeInsets.all(16),
@ -252,67 +244,70 @@ class _BranchesScreenState extends State<BranchesScreen> {
leading: Container( leading: Container(
padding: const EdgeInsets.all(12), padding: const EdgeInsets.all(12),
decoration: BoxDecoration( decoration: BoxDecoration(
color: colorScheme.secondaryContainer, color: AppTheme.secondaryContainer
borderRadius: BorderRadius.circular(12), .withValues(alpha: 0.2),
shape: BoxShape.rectangle,
), ),
child: Icon(Icons.storefront, child: const Icon(Icons.storefront,
color: colorScheme.secondary), color: AppTheme.secondary),
), ),
title: Text( title: Row(
branch['name'] ?? 'Mapan Branch', children: [
style: theme Expanded(
.textTheme child: Text(
.titleMedium branch['name'] ?? 'Mapan Branch',
?.copyWith( style: Theme.of(context)
fontFamily: 'serif', .textTheme
fontWeight: FontWeight.bold, .titleMedium,
), ),
),
if (distanceLabel.isNotEmpty)
Container(
margin: const EdgeInsets.only(left: 8),
padding: const EdgeInsets.symmetric(
horizontal: 8, vertical: 3),
decoration: const BoxDecoration(
color: AppTheme.secondaryContainer,
),
child: Text(
distanceLabel,
style: Theme.of(context)
.textTheme
.labelLarge
?.copyWith(
color: AppTheme.onSecondaryContainer,
fontSize: 11,
fontWeight: FontWeight.bold,
),
),
),
],
), ),
subtitle: Padding( subtitle: Padding(
padding: const EdgeInsets.only(top: 6.0), padding: const EdgeInsets.only(top: 8.0),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
if (distanceLabel.isNotEmpty) ...[
Row(
children: [
Icon(
Icons.near_me_rounded,
size: 14,
color: colorScheme.primary,
),
const SizedBox(width: 4),
Text(
'$distanceLabel away',
style: theme.textTheme.bodyMedium?.copyWith(
color: colorScheme.primary,
fontWeight: FontWeight.bold,
),
),
],
),
const SizedBox(height: 6),
],
Text( Text(
addressParts.isEmpty addressParts.isEmpty
? 'No address specified' ? 'No address specified'
: addressParts, : addressParts,
style: theme.textTheme.bodyMedium, style: Theme.of(context).textTheme.bodyMedium,
), ),
if (phone.isNotEmpty) ...[ if (phone.isNotEmpty) ...[
const SizedBox(height: 4), const SizedBox(height: 4),
Row( Row(
children: [ children: [
Icon(Icons.phone, const Icon(Icons.phone,
size: 14, size: 14,
color: colorScheme.onSurfaceVariant), color: AppTheme.onSurfaceVariant),
const SizedBox(width: 4), const SizedBox(width: 4),
Text(phone, Text(phone,
style: theme style: Theme.of(context)
.textTheme .textTheme
.bodySmall .bodySmall
?.copyWith( ?.copyWith(
color: colorScheme.onSurfaceVariant)), color: AppTheme.onSurfaceVariant)),
], ],
), ),
] ]
@ -321,13 +316,13 @@ class _BranchesScreenState extends State<BranchesScreen> {
), ),
trailing: phone.isNotEmpty trailing: phone.isNotEmpty
? IconButton( ? IconButton(
icon: Icon(Icons.chat_bubble, icon: const Icon(Icons.chat_bubble,
color: colorScheme.onSurface), color: AppTheme.onSurface),
onPressed: () => _launchWhatsApp(phone), onPressed: () => _launchWhatsApp(phone),
tooltip: 'Chat on WhatsApp', tooltip: 'Chat on WhatsApp',
) )
: Icon(Icons.chevron_right, : const Icon(Icons.chevron_right,
color: colorScheme.onSurfaceVariant), color: AppTheme.onSurfaceVariant),
), ),
); );
}, },

122
lib/screens/loyalty_dashboard.dart
View File

@ -1,5 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../services/odoo_service.dart'; import '../services/odoo_service.dart';
import '../theme/app_theme.dart';
import '../widgets/carousel_widget.dart'; import '../widgets/carousel_widget.dart';
import '../widgets/promo_card_widget.dart'; import '../widgets/promo_card_widget.dart';
import '../widgets/subscription_list_widget.dart'; import '../widgets/subscription_list_widget.dart';
@ -36,14 +37,14 @@ class _LoyaltyDashboardState extends State<LoyaltyDashboard> {
OdooService().getCmsContent(), OdooService().getCmsContent(),
]); ]);
final rawCards = results[0] as List<dynamic>; final cards = results[0] as List<dynamic>;
final rawSubs = results[1] as List<dynamic>; final subs = results[1] as List<dynamic>;
final cms = results[2] as Map<String, dynamic>; final cms = results[2] as Map<String, dynamic>;
if (mounted) { if (mounted) {
setState(() { setState(() {
_loyaltyCards = rawCards; _loyaltyCards = cards;
_subscriptions = rawSubs; _subscriptions = subs;
_carouselSlides = (cms['carousel'] as List<dynamic>?) ?? []; _carouselSlides = (cms['carousel'] as List<dynamic>?) ?? [];
_promos = (cms['promos'] as List<dynamic>?) ?? []; _promos = (cms['promos'] as List<dynamic>?) ?? [];
_isLoading = false; _isLoading = false;
@ -111,34 +112,18 @@ class _LoyaltyCardTile extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context);
final colorScheme = theme.colorScheme;
final programName = (card['program_id']?[1] as String? ?? '').toLowerCase(); final programName = (card['program_id']?[1] as String? ?? '').toLowerCase();
String tier = 'MEMBER'; String tier = 'Member';
if (programName.contains('silver')) tier = 'SILVER MEMBER'; if (programName.contains('silver')) tier = 'Silver Member';
if (programName.contains('gold')) tier = 'GOLD MEMBER'; if (programName.contains('gold')) tier = 'Gold Member';
if (programName.contains('platinum')) tier = 'PLATINUM MEMBER'; if (programName.contains('platinum')) tier = 'Platinum Member';
final onPrimary = colorScheme.onPrimary;
final accentColor = colorScheme.secondary;
return Container( return Container(
margin: const EdgeInsets.fromLTRB(16, 16, 16, 8), margin: const EdgeInsets.fromLTRB(16, 16, 16, 0),
padding: const EdgeInsets.all(24), padding: const EdgeInsets.all(24),
decoration: BoxDecoration( decoration: const BoxDecoration(
color: colorScheme.primary, color: AppTheme.surfaceContainerHighest,
borderRadius: BorderRadius.circular(16), borderRadius: BorderRadius.zero,
border: Border.all(
color: accentColor.withValues(alpha: 0.5),
width: 1.5,
),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.12),
blurRadius: 16,
offset: const Offset(0, 6),
),
],
), ),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
@ -149,94 +134,43 @@ class _LoyaltyCardTile extends StatelessWidget {
Expanded( Expanded(
child: Text( child: Text(
'${card['program_id']?[1] ?? 'Loyalty Program'}', '${card['program_id']?[1] ?? 'Loyalty Program'}',
style: theme.textTheme.titleLarge?.copyWith( style: Theme.of(context).textTheme.titleLarge,
color: onPrimary,
fontFamily: 'serif',
),
softWrap: true, softWrap: true,
), ),
), ),
const SizedBox(width: 12), const SizedBox(width: 12),
Container( Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6), padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration( decoration: const BoxDecoration(
color: accentColor, color: AppTheme.secondaryContainer,
borderRadius: BorderRadius.circular(20), borderRadius: BorderRadius.zero,
), ),
child: Text( child: Text(
tier, tier,
style: theme.textTheme.labelLarge?.copyWith( style: Theme.of(context).textTheme.labelLarge?.copyWith(
color: colorScheme.primary.computeLuminance() > 0.5 ? Colors.black : Colors.white, color: AppTheme.onSecondaryContainer,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
fontSize: 9,
letterSpacing: 0.8,
), ),
), ),
), ),
], ],
), ),
const SizedBox(height: 24),
Text(
'MEMBERSHIP CODE',
style: theme.textTheme.bodySmall?.copyWith(
color: onPrimary.withValues(alpha: 0.7),
fontWeight: FontWeight.bold,
fontSize: 10,
letterSpacing: 1.0,
),
),
const SizedBox(height: 4),
Text(
'${card['code'] ?? 'N/A'}',
style: theme.textTheme.titleMedium?.copyWith(
color: onPrimary,
fontFamily: 'monospace',
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 20), const SizedBox(height: 20),
Text('Membership Code', style: Theme.of(context).textTheme.bodyMedium),
const SizedBox(height: 4),
Text('${card['code'] ?? 'N/A'}',
style: Theme.of(context).textTheme.titleMedium),
const SizedBox(height: 16),
Row( Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.end, crossAxisAlignment: CrossAxisAlignment.end,
children: [ children: [
Column( Text('Available Points',
crossAxisAlignment: CrossAxisAlignment.start, style: Theme.of(context).textTheme.bodyMedium),
children: [
Text(
'AVAILABLE POINTS',
style: theme.textTheme.bodySmall?.copyWith(
color: onPrimary.withValues(alpha: 0.7),
fontWeight: FontWeight.bold,
fontSize: 10,
letterSpacing: 1.0,
),
),
const SizedBox(height: 4),
Row(
children: [
Icon(
Icons.restaurant_rounded,
color: accentColor,
size: 16,
),
const SizedBox(width: 6),
Text(
'Dine & Save',
style: theme.textTheme.bodyMedium?.copyWith(
color: onPrimary.withValues(alpha: 0.9),
fontStyle: FontStyle.italic,
),
),
],
),
],
),
Text( Text(
'${card['points'] ?? 0}', '${card['points'] ?? 0}',
style: theme.textTheme.displayLarge?.copyWith( style: Theme.of(context).textTheme.displayMedium?.copyWith(
color: accentColor, color: AppTheme.primary,
fontWeight: FontWeight.bold,
), ),
), ),
], ],

22
lib/screens/main_shell.dart
View File

@ -5,6 +5,7 @@ import 'package:shared_preferences/shared_preferences.dart';
import '../services/odoo_service.dart'; import '../services/odoo_service.dart';
import '../services/notification_service.dart'; import '../services/notification_service.dart';
import '../services/theme_manager.dart'; import '../services/theme_manager.dart';
import '../theme/app_theme.dart';
import 'notifications_screen.dart'; import 'notifications_screen.dart';
import 'loyalty_dashboard.dart'; import 'loyalty_dashboard.dart';
import 'branches_screen.dart'; import 'branches_screen.dart';
@ -185,29 +186,16 @@ class _MainShellState extends State<MainShell> {
const SizedBox(width: 4), const SizedBox(width: 4),
], ],
), ),
body: Container( body: IndexedStack(
decoration: BoxDecoration( index: _currentIndex,
gradient: LinearGradient( children: _pages,
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
colorScheme.surfaceContainerLowest,
colorScheme.surface,
const Color(0xFFF3EAD3), // Warm traditional restaurant sand/cream
],
),
),
child: IndexedStack(
index: _currentIndex,
children: _pages,
),
), ),
bottomNavigationBar: NavigationBar( bottomNavigationBar: NavigationBar(
selectedIndex: _currentIndex, selectedIndex: _currentIndex,
onDestinationSelected: (index) { onDestinationSelected: (index) {
setState(() => _currentIndex = index); setState(() => _currentIndex = index);
}, },
backgroundColor: colorScheme.surfaceContainerLowest, backgroundColor: AppTheme.surfaceContainerLowest,
indicatorColor: colorScheme.primary, indicatorColor: colorScheme.primary,
destinations: List.generate(4, (i) { destinations: List.generate(4, (i) {
return NavigationDestination( return NavigationDestination(

13
lib/services/odoo_service.dart
View File

@ -48,18 +48,9 @@ class OdooService {
[ [
['partner_id', '=', partnerId], ['partner_id', '=', partnerId],
['program_id.program_type', '=', 'loyalty'], ['program_id.program_type', '=', 'loyalty'],
['program_id.active', '=', true],
], ],
], ],
'kwargs': { 'kwargs': {'fields': ['points', 'program_id', 'code']}
'fields': [
'points',
'program_id',
'code',
'subscription_start_date',
'subscription_end_date',
]
}
}) as List<dynamic>; }) as List<dynamic>;
} }
@ -74,12 +65,10 @@ class OdooService {
[ [
['partner_id', '=', partnerId], ['partner_id', '=', partnerId],
['program_id.program_type', '=', 'subscription'], ['program_id.program_type', '=', 'subscription'],
['program_id.active', '=', true],
], ],
], ],
'kwargs': { 'kwargs': {
'fields': [ 'fields': [
'points',
'program_id', 'program_id',
'code', 'code',
'subscription_start_date', 'subscription_start_date',

123
lib/theme/app_theme.dart
View File

@ -2,26 +2,26 @@ import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart'; import 'package:google_fonts/google_fonts.dart';
class AppTheme { class AppTheme {
// Warm Traditional Family Restaurant Brand Colors // Editorial Organicism Tokens
static const Color primary = Color(0xFF8A1C14); // Rich Brick/Crimson Red static const Color primary = Color(0xFFFFEF00);
static const Color primaryContainer = Color(0xFF8A1C14); static const Color primaryContainer = Color(0xFFFFEF00);
static const Color secondary = Color(0xFFB58428); // Warm Gold/Honey Amber static const Color secondary = Color(0xFF705900);
static const Color secondaryContainer = Color(0xFFF3DCA2); static const Color secondaryContainer = Color(0xFFFACD34);
static const Color onPrimaryContainer = Colors.white; static const Color onPrimaryContainer = Color(0xFF5F5800);
static const Color onSecondaryContainer = Color(0xFF5A3E00); static const Color onSecondaryContainer = Color(0xFF584500);
// Warm Ivory & Earthy Surface Hierarchy // Surface Hierarchy
static const Color surface = Color(0xFFFAF6EE); // Warm paper ivory background static const Color surface = Color(0xFFF7F7F4);
static const Color surfaceContainer = Color(0xFFF2EAD8); // Soft cream static const Color surfaceContainer = Color(0xFFE8E8E5);
static const Color surfaceContainerLow = Color(0xFFF7F1E3); // Milky cream static const Color surfaceContainerLow = Color(0xFFF0F1EE);
static const Color surfaceContainerLowest = Color(0xFFFCFAF6); // Softest ivory/white static const Color surfaceContainerLowest = Colors.white;
static const Color surfaceContainerHighest = Color(0xFFE5D5BA); // Warm toasted sand static const Color surfaceContainerHighest = Color(0xFFDCDDDA);
// Text & On-Colors // Text & On-Colors
static const Color onSurface = Color(0xFF2E251B); // Earthy dark brown instead of charcoal static const Color onSurface = Color(0xFF2D2F2D);
static const Color onSurfaceVariant = Color(0xFF635647); // Subdued warm wood tone static const Color onSurfaceVariant = Color(0xFF5A5C5A);
static const Color onPrimary = Colors.white; static const Color onPrimary = Color(0xFFFFF59B);
static const Color outlineVariant = Color(0xFFD3C5B1); // Soft sandy divider static const Color outlineVariant = Color(0xFFACADAB);
static ThemeData get lightTheme => getTheme(); static ThemeData get lightTheme => getTheme();
@ -31,8 +31,8 @@ class AppTheme {
final sColor = secondaryColor ?? secondary; final sColor = secondaryColor ?? secondary;
// Dynamically compute readable contrast text colors // Dynamically compute readable contrast text colors
final onPrimaryColor = pColor.computeLuminance() > 0.5 ? Color(0xFF2E251B) : Colors.white; final onPrimaryColor = pColor.computeLuminance() > 0.5 ? Colors.black : Colors.white;
final onSecondaryColor = sColor.computeLuminance() > 0.5 ? Color(0xFF2E251B) : Colors.white; final onSecondaryColor = sColor.computeLuminance() > 0.5 ? Colors.black : Colors.white;
return ThemeData( return ThemeData(
useMaterial3: true, useMaterial3: true,
@ -41,7 +41,7 @@ class AppTheme {
primary: pColor, primary: pColor,
primaryContainer: pColor, primaryContainer: pColor,
secondary: sColor, secondary: sColor,
secondaryContainer: sColor.withValues(alpha: 0.15), secondaryContainer: sColor,
onSecondaryContainer: onSecondaryColor, onSecondaryContainer: onSecondaryColor,
surface: surface, surface: surface,
onSurface: onSurface, onSurface: onSurface,
@ -50,91 +50,75 @@ class AppTheme {
error: const Color(0xFFB02500), error: const Color(0xFFB02500),
), ),
textTheme: baseTheme.textTheme.copyWith( textTheme: baseTheme.textTheme.copyWith(
displayLarge: GoogleFonts.lora( displayLarge: GoogleFonts.epilogue(
color: onSurface, color: onSurface,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
letterSpacing: -0.01, letterSpacing: -0.02,
), ),
displayMedium: GoogleFonts.lora( displayMedium: GoogleFonts.epilogue(
color: onSurface, color: onSurface,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
letterSpacing: -0.01, letterSpacing: -0.02,
), ),
displaySmall: GoogleFonts.lora( displaySmall: GoogleFonts.epilogue(
color: onSurface, color: onSurface,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
letterSpacing: -0.01, letterSpacing: -0.02,
), ),
headlineMedium: GoogleFonts.lora( headlineMedium: GoogleFonts.epilogue(
color: onSurface, color: onSurface,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
letterSpacing: -0.01, letterSpacing: -0.02,
), ),
titleLarge: GoogleFonts.lora( titleLarge: GoogleFonts.epilogue(
color: onSurface, color: onSurface,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
), ),
titleMedium: GoogleFonts.lora( titleMedium: GoogleFonts.epilogue(
color: onSurface, color: onSurface,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
), ),
titleSmall: GoogleFonts.lora( titleSmall: GoogleFonts.epilogue(
color: onSurface, color: onSurface,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
), ),
bodyLarge: GoogleFonts.manrope( bodyLarge: GoogleFonts.manrope(color: onSurface),
color: onSurface, bodyMedium: GoogleFonts.manrope(color: onSurfaceVariant),
letterSpacing: 0.1, bodySmall: GoogleFonts.manrope(color: onSurfaceVariant),
), labelLarge: GoogleFonts.manrope(color: onSurfaceVariant),
bodyMedium: GoogleFonts.manrope(
color: onSurfaceVariant,
letterSpacing: 0.1,
),
bodySmall: GoogleFonts.manrope(
color: onSurfaceVariant,
letterSpacing: 0.1,
),
labelLarge: GoogleFonts.manrope(
color: onSurfaceVariant,
fontWeight: FontWeight.w600,
),
), ),
elevatedButtonTheme: ElevatedButtonThemeData( elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom( style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder( shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.circular(28), // Elegant pill buttons borderRadius: BorderRadius.zero,
), ),
foregroundColor: onPrimaryColor, foregroundColor: onPrimaryColor,
backgroundColor: pColor, backgroundColor: pColor,
elevation: 2, elevation: 0,
shadowColor: pColor.withValues(alpha: 0.2), side: const BorderSide(color: Colors.red, width: 2),
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 14),
), ),
), ),
cardTheme: CardThemeData( cardTheme: const CardThemeData(
color: surfaceContainerLow, color: surfaceContainerLow,
elevation: 1, elevation: 0,
shadowColor: Colors.black.withValues(alpha: 0.05), shape: RoundedRectangleBorder(borderRadius: BorderRadius.zero),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16), // Softer warm card corners
),
margin: EdgeInsets.zero, margin: EdgeInsets.zero,
), ),
inputDecorationTheme: InputDecorationTheme( inputDecorationTheme: InputDecorationTheme(
filled: true, filled: true,
fillColor: surfaceContainer, fillColor: surfaceContainer, // Spec: surfaceContainer with 0px radius
contentPadding: const EdgeInsets.symmetric(horizontal: 20, vertical: 16), contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
border: OutlineInputBorder( border: const OutlineInputBorder(
borderSide: BorderSide.none, borderSide: BorderSide.none,
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.zero,
), ),
enabledBorder: OutlineInputBorder( enabledBorder: const OutlineInputBorder(
borderSide: BorderSide.none, borderSide: BorderSide.none,
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.zero,
), ),
focusedBorder: OutlineInputBorder( focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: pColor.withValues(alpha: 0.5), width: 1.5), borderSide: BorderSide(color: pColor.withValues(alpha: 0.5), width: 2),
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.zero,
), ),
labelStyle: const TextStyle(color: onSurfaceVariant), labelStyle: const TextStyle(color: onSurfaceVariant),
hintStyle: GoogleFonts.manrope(color: onSurfaceVariant), hintStyle: GoogleFonts.manrope(color: onSurfaceVariant),
@ -144,12 +128,11 @@ class AppTheme {
foregroundColor: onSurface, foregroundColor: onSurface,
elevation: 0, elevation: 0,
surfaceTintColor: Colors.transparent, surfaceTintColor: Colors.transparent,
centerTitle: true, titleTextStyle: GoogleFonts.epilogue(
titleTextStyle: GoogleFonts.lora(
color: onSurface, color: onSurface,
fontSize: 21, fontSize: 20,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
letterSpacing: -0.01, letterSpacing: -0.02,
), ),
), ),
); );

42
lib/widgets/carousel_widget.dart
View File

@ -2,6 +2,7 @@ import 'dart:convert';
import 'dart:typed_data'; import 'dart:typed_data';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:smooth_page_indicator/smooth_page_indicator.dart'; import 'package:smooth_page_indicator/smooth_page_indicator.dart';
import '../theme/app_theme.dart';
import '../screens/carousel_detail_screen.dart'; import '../screens/carousel_detail_screen.dart';
/// Auto-scrolling carousel widget that shows slides from CMS. /// Auto-scrolling carousel widget that shows slides from CMS.
@ -54,8 +55,6 @@ class _CarouselWidgetState extends State<CarouselWidget> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
if (widget.slides.isEmpty) return const SizedBox.shrink(); if (widget.slides.isEmpty) return const SizedBox.shrink();
final theme = Theme.of(context);
final colorScheme = theme.colorScheme;
return Column( return Column(
children: [ children: [
@ -84,8 +83,8 @@ class _CarouselWidgetState extends State<CarouselWidget> {
dotHeight: 6, dotHeight: 6,
dotWidth: 6, dotWidth: 6,
expansionFactor: 3, expansionFactor: 3,
dotColor: colorScheme.surfaceContainer, dotColor: AppTheme.surfaceContainer,
activeDotColor: colorScheme.secondary, activeDotColor: AppTheme.secondary,
), ),
), ),
), ),
@ -100,8 +99,6 @@ class _SlideImage extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context);
final colorScheme = theme.colorScheme;
final base64Img = slide['image'] as String?; final base64Img = slide['image'] as String?;
final externalUrl = slide['image_url'] as String?; final externalUrl = slide['image_url'] as String?;
@ -113,7 +110,7 @@ class _SlideImage extends StatelessWidget {
final Uint8List bytes = base64Decode(base64Img); final Uint8List bytes = base64Decode(base64Img);
image = Image.memory(bytes, fit: BoxFit.cover, width: double.infinity); image = Image.memory(bytes, fit: BoxFit.cover, width: double.infinity);
} catch (_) { } catch (_) {
image = _placeholder(colorScheme); image = _placeholder();
} }
} else if (externalUrl != null && externalUrl.isNotEmpty) { } else if (externalUrl != null && externalUrl.isNotEmpty) {
// External URL image // External URL image
@ -121,41 +118,28 @@ class _SlideImage extends StatelessWidget {
externalUrl, externalUrl,
fit: BoxFit.cover, fit: BoxFit.cover,
width: double.infinity, width: double.infinity,
errorBuilder: (_, __, ___) => _placeholder(colorScheme), errorBuilder: (_, __, ___) => _placeholder(),
loadingBuilder: (ctx, child, progress) { loadingBuilder: (ctx, child, progress) {
if (progress == null) return child; if (progress == null) return child;
return const Center(child: CircularProgressIndicator()); return const Center(child: CircularProgressIndicator());
}, },
); );
} else { } else {
image = _placeholder(colorScheme); image = _placeholder();
} }
return Container( return Container(
margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 4), margin: const EdgeInsets.symmetric(horizontal: 16),
decoration: BoxDecoration( decoration: const BoxDecoration(color: AppTheme.surfaceContainerLow),
color: colorScheme.surfaceContainerLow, child: ClipRect(child: image),
borderRadius: BorderRadius.circular(16),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.05),
blurRadius: 10,
offset: const Offset(0, 4),
),
],
),
child: ClipRRect(
borderRadius: BorderRadius.circular(16),
child: image,
),
); );
} }
Widget _placeholder(ColorScheme colorScheme) { Widget _placeholder() {
return Container( return Container(
color: colorScheme.surfaceContainer, color: AppTheme.surfaceContainer,
child: Center( child: const Center(
child: Icon(Icons.image_rounded, size: 48, color: colorScheme.outline), child: Icon(Icons.image_rounded, size: 48, color: AppTheme.outlineVariant),
), ),
); );
} }

43
lib/widgets/promo_card_widget.dart
View File

@ -1,6 +1,7 @@
import 'dart:convert'; import 'dart:convert';
import 'dart:typed_data'; import 'dart:typed_data';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../theme/app_theme.dart';
import '../screens/promo_detail_screen.dart'; import '../screens/promo_detail_screen.dart';
/// Horizontal scrollable row of promo highlight cards. /// Horizontal scrollable row of promo highlight cards.
@ -47,8 +48,6 @@ class _PromoCard extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context);
final colorScheme = theme.colorScheme;
final base64Img = promo['image_128'] as String?; final base64Img = promo['image_128'] as String?;
final title = promo['name'] as String? ?? ''; final title = promo['name'] as String? ?? '';
@ -59,10 +58,10 @@ class _PromoCard extends StatelessWidget {
imageWidget = Image.memory(bytes, fit: BoxFit.cover, imageWidget = Image.memory(bytes, fit: BoxFit.cover,
width: double.infinity, height: 110); width: double.infinity, height: 110);
} catch (_) { } catch (_) {
imageWidget = _imagePlaceholder(colorScheme); imageWidget = _imagePlaceholder();
} }
} else { } else {
imageWidget = _imagePlaceholder(colorScheme); imageWidget = _imagePlaceholder();
} }
return GestureDetector( return GestureDetector(
@ -74,21 +73,9 @@ class _PromoCard extends StatelessWidget {
}, },
child: Container( child: Container(
width: 140, width: 140,
margin: const EdgeInsets.only(right: 12, bottom: 6), margin: const EdgeInsets.only(right: 12),
decoration: BoxDecoration( decoration: const BoxDecoration(
color: colorScheme.surfaceContainerLowest, color: AppTheme.surfaceContainerLow,
borderRadius: BorderRadius.circular(16),
border: Border.all(
color: colorScheme.outline.withValues(alpha: 0.3),
width: 1,
),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.03),
blurRadius: 6,
offset: const Offset(0, 3),
),
],
), ),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
@ -96,19 +83,15 @@ class _PromoCard extends StatelessWidget {
SizedBox( SizedBox(
height: 110, height: 110,
width: double.infinity, width: double.infinity,
child: ClipRRect( child: ClipRect(child: imageWidget),
borderRadius: const BorderRadius.vertical(top: Radius.circular(15)),
child: imageWidget,
),
), ),
Padding( Padding(
padding: const EdgeInsets.all(8.0), padding: const EdgeInsets.all(8.0),
child: Text( child: Text(
title, title,
style: theme.textTheme.labelLarge?.copyWith( style: Theme.of(context).textTheme.labelLarge?.copyWith(
color: colorScheme.onSurface, color: AppTheme.onSurface,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
fontSize: 11,
), ),
maxLines: 2, maxLines: 2,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
@ -120,11 +103,11 @@ class _PromoCard extends StatelessWidget {
); );
} }
Widget _imagePlaceholder(ColorScheme colorScheme) { Widget _imagePlaceholder() {
return Container( return Container(
color: colorScheme.surfaceContainer, color: AppTheme.surfaceContainer,
child: Center( child: const Center(
child: Icon(Icons.local_offer_rounded, size: 32, color: colorScheme.outline), child: Icon(Icons.local_offer_rounded, size: 32, color: AppTheme.outlineVariant),
), ),
); );
} }

363
lib/widgets/subscription_list_widget.dart
View File

@ -1,8 +1,8 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../theme/app_theme.dart';
/// "My Subscriptions" list displayed on the home tab below the loyalty card. /// Compact "My Subscriptions" list — displayed on the home tab below the loyalty card.
/// Renders each subscription as a beautiful standalone ticket card visually distinct /// Each row shows the subscription name, active/expired badge, validity period, and card code.
/// from the points-based loyalty card.
class SubscriptionListWidget extends StatelessWidget { class SubscriptionListWidget extends StatelessWidget {
final List<dynamic> subscriptions; final List<dynamic> subscriptions;
@ -12,39 +12,48 @@ class SubscriptionListWidget extends StatelessWidget {
Widget build(BuildContext context) { Widget build(BuildContext context) {
if (subscriptions.isEmpty) return const SizedBox.shrink(); if (subscriptions.isEmpty) return const SizedBox.shrink();
final theme = Theme.of(context);
final colorScheme = theme.colorScheme;
return Column( return Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Padding( Padding(
padding: const EdgeInsets.fromLTRB(16, 24, 16, 8), padding: const EdgeInsets.fromLTRB(16, 20, 16, 10),
child: Text( child: Text(
'MY SUBSCRIPTIONS', 'MY SUBSCRIPTIONS',
style: theme.textTheme.labelLarge?.copyWith( style: Theme.of(context).textTheme.labelLarge?.copyWith(
color: colorScheme.onSurfaceVariant, color: AppTheme.onSurfaceVariant,
letterSpacing: 1.2, letterSpacing: 1.2,
fontSize: 11, fontSize: 11,
fontWeight: FontWeight.bold,
), ),
), ),
), ),
...subscriptions.map((sub) => _SubscriptionCard(sub: sub)), Container(
margin: const EdgeInsets.symmetric(horizontal: 16),
decoration: const BoxDecoration(
color: AppTheme.surfaceContainerLow,
),
child: Column(
children: List.generate(subscriptions.length, (index) {
final sub = subscriptions[index];
final isLast = index == subscriptions.length - 1;
return _SubscriptionTile(sub: sub, isLast: isLast);
}),
),
),
], ],
); );
} }
} }
class _SubscriptionCard extends StatelessWidget { class _SubscriptionTile extends StatelessWidget {
final dynamic sub; final dynamic sub;
final bool isLast;
const _SubscriptionCard({required this.sub}); const _SubscriptionTile({required this.sub, required this.isLast});
/// Determine active/expired status from subscription_end_date. /// Determine active/expired status from subscription_end_date.
bool _isActive() { bool _isActive() {
final endRaw = sub['subscription_end_date']; final endRaw = sub['subscription_end_date'];
if (endRaw == null || endRaw == false) return true; // no end date = active if (endRaw == null || endRaw == false) return true; // no end date = no expiry
try { try {
final endDate = DateTime.parse(endRaw.toString()); final endDate = DateTime.parse(endRaw.toString());
return endDate.isAfter(DateTime.now()); return endDate.isAfter(DateTime.now());
@ -76,9 +85,6 @@ class _SubscriptionCard extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context);
final colorScheme = theme.colorScheme;
final programName = sub['program_id'] is List final programName = sub['program_id'] is List
? (sub['program_id'][1] as String? ?? 'Subscription') ? (sub['program_id'][1] as String? ?? 'Subscription')
: 'Subscription'; : 'Subscription';
@ -87,245 +93,98 @@ class _SubscriptionCard extends StatelessWidget {
final endDate = _formatDate(sub['subscription_end_date']); final endDate = _formatDate(sub['subscription_end_date']);
final active = _isActive(); final active = _isActive();
return Padding( return Container(
padding: const EdgeInsets.fromLTRB(16, 8, 16, 8), decoration: BoxDecoration(
child: PhysicalShape( border: isLast
clipper: TicketClipper(), ? null
color: colorScheme.surfaceContainerLowest, : const Border(
elevation: 3, bottom: BorderSide(
shadowColor: Colors.black.withValues(alpha: 0.15), color: AppTheme.surfaceContainer,
child: Container( width: 1,
padding: const EdgeInsets.all(20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Top Section: Title & Status
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
Icon(
Icons.local_activity_rounded, // Distinct ticket pass icon
size: 18,
color: active ? colorScheme.primary : colorScheme.outline,
),
const SizedBox(width: 8),
Text(
'SUBSCRIPTION PASS', // Distinct title
style: theme.textTheme.labelLarge?.copyWith(
color: active ? colorScheme.primary : colorScheme.outline,
fontWeight: FontWeight.bold,
fontSize: 10,
letterSpacing: 1.2,
),
),
],
),
Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: active
? const Color(0xFF1B5E20).withValues(alpha: 0.10)
: const Color(0xFFB02500).withValues(alpha: 0.08),
borderRadius: BorderRadius.circular(20),
),
child: Text(
active ? 'ACTIVE' : 'EXPIRED',
style: TextStyle(
fontSize: 9,
fontWeight: FontWeight.bold,
letterSpacing: 0.8,
color: active
? const Color(0xFF2E7D32)
: const Color(0xFFB02500),
),
),
),
],
),
const SizedBox(height: 18),
// Dashed Separator
CustomPaint(
size: const Size(double.infinity, 1),
painter: DashedLinePainter(
color: colorScheme.outline.withValues(alpha: 0.25),
), ),
), ),
const SizedBox(height: 18), ),
// Bottom Section: Details padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
Text( child: Row(
programName, crossAxisAlignment: CrossAxisAlignment.center,
style: theme.textTheme.titleMedium?.copyWith( children: [
fontWeight: FontWeight.bold, // Icon
color: colorScheme.onSurface, Container(
fontFamily: 'serif', padding: const EdgeInsets.all(10),
), decoration: BoxDecoration(
), color: active
const SizedBox(height: 12), ? AppTheme.secondaryContainer.withValues(alpha: 0.35)
Row( : AppTheme.surfaceContainer,
mainAxisAlignment: MainAxisAlignment.spaceBetween, shape: BoxShape.rectangle,
children: [ ),
Column( child: Icon(
crossAxisAlignment: CrossAxisAlignment.start, Icons.verified_rounded,
children: [ size: 22,
Text( color: active ? AppTheme.secondary : AppTheme.outlineVariant,
'Pass Code', // Distinct field label ),
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
fontSize: 10,
),
),
const SizedBox(height: 2),
Text(
code.isNotEmpty ? code : 'N/A',
style: theme.textTheme.bodyMedium?.copyWith(
fontFamily: 'monospace',
fontWeight: FontWeight.bold,
color: colorScheme.onSurface,
),
),
],
),
if (sub['points'] != null)
Column(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Text(
'Claim Balance',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
fontSize: 10,
),
),
const SizedBox(height: 2),
Text(
'${(sub['points'] as num).toDouble() % 1 == 0 ? (sub['points'] as num).toInt() : sub['points']} Claims',
style: theme.textTheme.bodyMedium?.copyWith(
color: colorScheme.primary,
fontWeight: FontWeight.bold,
),
),
],
),
],
),
if (sub['subscription_start_date'] != null && sub['subscription_start_date'] != false) ...[
const SizedBox(height: 12),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Valid From',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
fontSize: 10,
),
),
const SizedBox(height: 2),
Text(
startDate,
style: theme.textTheme.bodyMedium?.copyWith(
color: colorScheme.onSurface,
fontWeight: FontWeight.w600,
),
),
],
),
Column(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Text(
'Expires On',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
fontSize: 10,
),
),
const SizedBox(height: 2),
Text(
endDate,
style: theme.textTheme.bodyMedium?.copyWith(
color: colorScheme.onSurface,
fontWeight: FontWeight.w600,
),
),
],
),
],
),
],
],
), ),
),
const SizedBox(width: 14),
// Name + dates
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
programName,
style: Theme.of(context).textTheme.titleSmall?.copyWith(
fontWeight: FontWeight.bold,
color: AppTheme.onSurface,
),
),
const SizedBox(height: 3),
Text(
'$startDate → $endDate',
style: Theme.of(context).textTheme.bodySmall?.copyWith(
color: AppTheme.onSurfaceVariant,
),
),
if (code.isNotEmpty) ...[
const SizedBox(height: 2),
Text(
code,
style: Theme.of(context).textTheme.bodySmall?.copyWith(
color: AppTheme.outlineVariant,
fontFamily: 'monospace',
fontSize: 11,
),
),
],
],
),
),
const SizedBox(width: 8),
// Active / Expired badge
Container(
padding: const EdgeInsets.symmetric(horizontal: 9, vertical: 4),
decoration: BoxDecoration(
color: active
? const Color(0xFF1B5E20).withValues(alpha: 0.12)
: const Color(0xFFB02500).withValues(alpha: 0.10),
borderRadius: BorderRadius.circular(4),
),
child: Text(
active ? 'ACTIVE' : 'EXPIRED',
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.bold,
letterSpacing: 0.8,
color: active
? const Color(0xFF2E7D32)
: const Color(0xFFB02500),
),
),
),
],
), ),
); );
} }
} }
/// Custom Clipper for a ticket-like appearance with side notches.
class TicketClipper extends CustomClipper<Path> {
@override
Path getClip(Size size) {
final path = Path();
path.lineTo(0, 0);
path.lineTo(size.width, 0);
// Right side notch at height 49 (approx. center of vertical separator space)
const double notchY = 49.0;
const double notchRadius = 8.0;
path.lineTo(size.width, notchY - notchRadius);
path.arcToPoint(
Offset(size.width, notchY + notchRadius),
radius: const Radius.circular(notchRadius),
clockwise: false,
);
path.lineTo(size.width, size.height);
path.lineTo(0, size.height);
// Left side notch
path.lineTo(0, notchY + notchRadius);
path.arcToPoint(
const Offset(0, notchY - notchRadius),
radius: const Radius.circular(notchRadius),
clockwise: false,
);
path.close();
return path;
}
@override
bool shouldReclip(CustomClipper<Path> oldClipper) => false;
}
/// Painter to draw a clean dashed divider line.
class DashedLinePainter extends CustomPainter {
final Color color;
DashedLinePainter({required this.color});
@override
void paint(Canvas canvas, Size size) {
double dashWidth = 5.0;
double dashSpace = 4.0;
double startX = 0.0;
final paint = Paint()
..color = color
..strokeWidth = 1.0;
while (startX < size.width) {
canvas.drawLine(
Offset(startX, 0),
Offset(startX + dashWidth, 0),
paint,
);
startX += dashWidth + dashSpace;
}
}
@override
bool shouldRepaint(CustomPainter oldDelegate) => false;
}