EnakPoint & EnakCoin wallet, PIN, outlet, order, community, reward
- Wallet EnakPoint & EnakCoin: beranda, riwayat, saldo kedaluwarsa, kode bayar, tukar EnakCoin, transfer - PIN (buat, ganti, lupa), outlet, riwayat order, game spin - Halaman community, webview, coming soon, dan ikon menu beranda baru - Redesign Reward Saya: kartu tiket, filter chip, detail kode + QR - Hapus customer point loader, menu, dan checkout lama - Base URL ke enaklo-pos-api.altru.id Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
efrilm
co-authored by
Claude Opus 5.5
Claude Opus 5.5
parent
5954510b93
commit
f5e3075205
@@ -2,62 +2,31 @@ import 'package:auto_route/auto_route.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../../../common/theme/theme.dart';
|
||||
import '../../../sample/reward_sample_data.dart';
|
||||
import '../../components/assets/assets.gen.dart';
|
||||
import '../../router/app_router.gr.dart';
|
||||
import 'reward_ui.dart';
|
||||
import 'widgets/reward_card.dart';
|
||||
import 'widgets/reward_detail_sheet.dart';
|
||||
|
||||
// Models
|
||||
class Reward {
|
||||
final String id;
|
||||
final String name;
|
||||
final String image;
|
||||
final int pointsUsed;
|
||||
final String description;
|
||||
final DateTime redeemedAt;
|
||||
final RewardStatus status;
|
||||
final String? couponCode;
|
||||
final String? validUntil;
|
||||
final String? termsAndConditions;
|
||||
final String categoryName;
|
||||
final String categoryIcon;
|
||||
enum _RewardFilter {
|
||||
all('Semua'),
|
||||
active('Aktif'),
|
||||
used('Terpakai'),
|
||||
expired('Kedaluwarsa');
|
||||
|
||||
Reward({
|
||||
required this.id,
|
||||
required this.name,
|
||||
required this.image,
|
||||
required this.pointsUsed,
|
||||
required this.description,
|
||||
required this.redeemedAt,
|
||||
required this.status,
|
||||
required this.categoryName,
|
||||
required this.categoryIcon,
|
||||
this.couponCode,
|
||||
this.validUntil,
|
||||
this.termsAndConditions,
|
||||
});
|
||||
const _RewardFilter(this.label);
|
||||
|
||||
String get statusText {
|
||||
switch (status) {
|
||||
case RewardStatus.active:
|
||||
return "Aktif";
|
||||
case RewardStatus.used:
|
||||
return "Sudah Digunakan";
|
||||
case RewardStatus.expired:
|
||||
return "Kadaluarsa";
|
||||
}
|
||||
}
|
||||
final String label;
|
||||
|
||||
Color get statusColor {
|
||||
switch (status) {
|
||||
case RewardStatus.active:
|
||||
return AppColor.success;
|
||||
case RewardStatus.used:
|
||||
return AppColor.textSecondary;
|
||||
case RewardStatus.expired:
|
||||
return AppColor.error;
|
||||
}
|
||||
}
|
||||
bool matches(Reward reward) => switch (this) {
|
||||
_RewardFilter.all => true,
|
||||
_RewardFilter.active => reward.status == RewardStatus.active,
|
||||
_RewardFilter.used => reward.status == RewardStatus.used,
|
||||
_RewardFilter.expired => reward.status == RewardStatus.expired,
|
||||
};
|
||||
}
|
||||
|
||||
enum RewardStatus { active, used, expired }
|
||||
|
||||
@RoutePage()
|
||||
class RewardPage extends StatefulWidget {
|
||||
const RewardPage({super.key});
|
||||
@@ -66,350 +35,368 @@ class RewardPage extends StatefulWidget {
|
||||
State<RewardPage> createState() => _RewardPageState();
|
||||
}
|
||||
|
||||
class _RewardPageState extends State<RewardPage>
|
||||
with SingleTickerProviderStateMixin {
|
||||
late TabController _tabController;
|
||||
class _RewardPageState extends State<RewardPage> {
|
||||
_RewardFilter _filter = _RewardFilter.all;
|
||||
|
||||
// Sample reward data
|
||||
final List<Reward> rewards = [
|
||||
Reward(
|
||||
id: "r1",
|
||||
name: "Es Teh Manis",
|
||||
image: "🧊",
|
||||
pointsUsed: 1500,
|
||||
description: "Teh manis dingin segar",
|
||||
redeemedAt: DateTime.now().subtract(Duration(hours: 2)),
|
||||
status: RewardStatus.active,
|
||||
categoryName: "Minuman",
|
||||
categoryIcon: "🥤",
|
||||
couponCode: "ETM123456",
|
||||
validUntil: "31 Des 2025",
|
||||
termsAndConditions:
|
||||
"Berlaku untuk dine-in dan take away. Tidak dapat digabung dengan promo lain.",
|
||||
),
|
||||
Reward(
|
||||
id: "r2",
|
||||
name: "Diskon 50%",
|
||||
image: "🏷️",
|
||||
pointsUsed: 5000,
|
||||
description: "Potongan harga 50% untuk semua menu",
|
||||
redeemedAt: DateTime.now().subtract(Duration(days: 1)),
|
||||
status: RewardStatus.used,
|
||||
categoryName: "Voucher",
|
||||
categoryIcon: "🎟️",
|
||||
couponCode: "DISC50789",
|
||||
validUntil: "15 Des 2025",
|
||||
termsAndConditions:
|
||||
"Berlaku untuk pembelian minimum Rp 50.000. Tidak berlaku untuk menu promo.",
|
||||
),
|
||||
Reward(
|
||||
id: "r3",
|
||||
name: "Nasi Gudeg",
|
||||
image: "🍛",
|
||||
pointsUsed: 4000,
|
||||
description: "Gudeg Jogja autentik",
|
||||
redeemedAt: DateTime.now().subtract(Duration(days: 3)),
|
||||
status: RewardStatus.active,
|
||||
categoryName: "Makanan",
|
||||
categoryIcon: "🍽️",
|
||||
couponCode: "GUDEG456",
|
||||
validUntil: "25 Des 2025",
|
||||
termsAndConditions:
|
||||
"Berlaku untuk 1 porsi. Dapat dimakan di tempat atau dibawa pulang.",
|
||||
),
|
||||
Reward(
|
||||
id: "r4",
|
||||
name: "Gratis Ongkir",
|
||||
image: "🚚",
|
||||
pointsUsed: 2000,
|
||||
description: "Bebas ongkos kirim untuk pesanan apapun",
|
||||
redeemedAt: DateTime.now().subtract(Duration(days: 15)),
|
||||
status: RewardStatus.expired,
|
||||
categoryName: "Voucher",
|
||||
categoryIcon: "🎟️",
|
||||
validUntil: "20 Agu 2025",
|
||||
termsAndConditions:
|
||||
"Berlaku untuk area Jabodetabek. Minimum pembelian Rp 25.000.",
|
||||
),
|
||||
Reward(
|
||||
id: "r5",
|
||||
name: "Kopi Susu",
|
||||
image: "☕",
|
||||
pointsUsed: 2000,
|
||||
description: "Kopi dengan susu creamy",
|
||||
redeemedAt: DateTime.now().subtract(Duration(days: 7)),
|
||||
status: RewardStatus.used,
|
||||
categoryName: "Minuman",
|
||||
categoryIcon: "🥤",
|
||||
couponCode: "KOPI987654",
|
||||
validUntil: "30 Nov 2025",
|
||||
termsAndConditions:
|
||||
"Berlaku untuk size regular. Dapat request level manis.",
|
||||
),
|
||||
];
|
||||
/// Aktif lebih dulu, urut yang paling cepat berakhir; sisanya terbaru dulu.
|
||||
final List<Reward> _rewards = [...rewardSamples]
|
||||
..sort((a, b) {
|
||||
final aActive = a.status == RewardStatus.active;
|
||||
final bActive = b.status == RewardStatus.active;
|
||||
if (aActive != bActive) return aActive ? -1 : 1;
|
||||
if (aActive) return a.validUntil.compareTo(b.validUntil);
|
||||
return b.redeemedAt.compareTo(a.redeemedAt);
|
||||
});
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_tabController = TabController(length: 4, vsync: this);
|
||||
}
|
||||
List<Reward> get _activeRewards =>
|
||||
_rewards.where(_RewardFilter.active.matches).toList();
|
||||
|
||||
List<Reward> get filteredRewards {
|
||||
switch (_tabController.index) {
|
||||
case 0:
|
||||
return rewards; // Semua
|
||||
case 1:
|
||||
return rewards.where((r) => r.status == RewardStatus.active).toList();
|
||||
case 2:
|
||||
return rewards.where((r) => r.status == RewardStatus.used).toList();
|
||||
case 3:
|
||||
return rewards.where((r) => r.status == RewardStatus.expired).toList();
|
||||
default:
|
||||
return rewards;
|
||||
}
|
||||
}
|
||||
int _countOf(_RewardFilter filter) => _rewards.where(filter.matches).length;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final visible = _rewards.where(_filter.matches).toList();
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: AppColor.backgroundLight,
|
||||
appBar: AppBar(title: Text("Reward Saya"), centerTitle: true),
|
||||
body: Column(
|
||||
children: [
|
||||
_buildCleanTabBar(),
|
||||
Expanded(
|
||||
child: TabBarView(
|
||||
controller: _tabController,
|
||||
children: [
|
||||
_buildRewardList(), // Semua
|
||||
_buildRewardList(), // Aktif
|
||||
_buildRewardList(), // Digunakan
|
||||
_buildRewardList(), // Kadaluarsa
|
||||
],
|
||||
backgroundColor: AppColor.background,
|
||||
appBar: AppBar(title: const Text('Reward Saya')),
|
||||
body: CustomScrollView(
|
||||
slivers: [
|
||||
SliverToBoxAdapter(child: _buildSummary()),
|
||||
SliverPersistentHeader(
|
||||
pinned: true,
|
||||
delegate: _FilterHeaderDelegate(
|
||||
selected: _filter,
|
||||
countOf: _countOf,
|
||||
onSelected: (filter) => setState(() => _filter = filter),
|
||||
),
|
||||
),
|
||||
if (visible.isEmpty)
|
||||
SliverFillRemaining(hasScrollBody: false, child: _buildEmpty())
|
||||
else
|
||||
SliverPadding(
|
||||
padding: const EdgeInsets.fromLTRB(16, 4, 16, 32),
|
||||
sliver: SliverList.separated(
|
||||
itemCount: visible.length,
|
||||
separatorBuilder: (_, _) => const SizedBox(height: 12),
|
||||
itemBuilder: (context, index) {
|
||||
final reward = visible[index];
|
||||
return RewardCard(
|
||||
reward: reward,
|
||||
onTap: () => RewardDetailSheet.show(context, reward),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildCleanTabBar() {
|
||||
final activeCount = rewards
|
||||
.where((r) => r.status == RewardStatus.active)
|
||||
.length;
|
||||
final usedCount = rewards
|
||||
.where((r) => r.status == RewardStatus.used)
|
||||
.length;
|
||||
final expiredCount = rewards
|
||||
.where((r) => r.status == RewardStatus.expired)
|
||||
.length;
|
||||
Widget _buildSummary() {
|
||||
final active = _activeRewards;
|
||||
// Sudah terurut: yang pertama adalah yang paling cepat berakhir.
|
||||
final expiringSoon = active.where(isRewardExpiringSoon).firstOrNull;
|
||||
|
||||
return Container(
|
||||
margin: EdgeInsets.symmetric(horizontal: 20, vertical: 12),
|
||||
margin: const EdgeInsets.fromLTRB(16, 16, 16, 4),
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.white,
|
||||
gradient: const LinearGradient(
|
||||
colors: AppColor.primaryGradient,
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.04),
|
||||
blurRadius: 20,
|
||||
offset: Offset(0, 4),
|
||||
color: AppColor.primary.withOpacity(0.3),
|
||||
blurRadius: 12,
|
||||
offset: const Offset(0, 6),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: TabBar(
|
||||
controller: _tabController,
|
||||
indicatorSize: TabBarIndicatorSize.tab,
|
||||
isScrollable: true,
|
||||
tabAlignment: TabAlignment.start,
|
||||
dividerColor: Colors.transparent,
|
||||
onTap: (index) => setState(() {}),
|
||||
tabs: [
|
||||
_buildCleanTab("Semua", rewards.length),
|
||||
_buildCleanTab("Aktif", activeCount),
|
||||
_buildCleanTab("Terpakai", usedCount),
|
||||
_buildCleanTab("Expired", expiredCount),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildCleanTab(String label, int count) {
|
||||
return Container(height: 44, child: Center(child: Text("$label ($count)")));
|
||||
}
|
||||
|
||||
Widget _buildRewardList() {
|
||||
final filteredData = filteredRewards;
|
||||
|
||||
if (filteredData.isEmpty) {
|
||||
return _buildEmptyState();
|
||||
}
|
||||
|
||||
return ListView.builder(
|
||||
padding: EdgeInsets.symmetric(horizontal: 20, vertical: 8),
|
||||
itemCount: filteredData.length,
|
||||
itemBuilder: (context, index) {
|
||||
final reward = filteredData[index];
|
||||
return _buildCleanRewardCard(reward);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildEmptyState() {
|
||||
String message;
|
||||
String icon;
|
||||
|
||||
switch (_tabController.index) {
|
||||
case 1:
|
||||
message = "Belum ada reward aktif";
|
||||
icon = "🎯";
|
||||
break;
|
||||
case 2:
|
||||
message = "Belum ada reward yang digunakan";
|
||||
icon = "✅";
|
||||
break;
|
||||
case 3:
|
||||
message = "Tidak ada reward yang kadaluarsa";
|
||||
icon = "⏰";
|
||||
break;
|
||||
default:
|
||||
message = "Belum ada reward";
|
||||
icon = "🎁";
|
||||
}
|
||||
|
||||
return Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(icon, style: TextStyle(fontSize: 64)),
|
||||
SizedBox(height: 16),
|
||||
Text(
|
||||
message,
|
||||
style: AppStyle.lg.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
SizedBox(height: 8),
|
||||
Text(
|
||||
"Tukar poin Anda untuk mendapatkan reward menarik",
|
||||
style: AppStyle.sm.copyWith(color: AppColor.textLight),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
SizedBox(height: 24),
|
||||
ElevatedButton(
|
||||
onPressed: () => context.router.back(),
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: AppColor.primary,
|
||||
foregroundColor: AppColor.white,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
padding: EdgeInsets.symmetric(horizontal: 24, vertical: 12),
|
||||
elevation: 0,
|
||||
),
|
||||
child: Text(
|
||||
"Tukar Poin Sekarang",
|
||||
style: AppStyle.sm.copyWith(
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppColor.white,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildCleanRewardCard(Reward reward) {
|
||||
return Container(
|
||||
margin: EdgeInsets.only(bottom: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.white,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.04),
|
||||
blurRadius: 20,
|
||||
offset: Offset(0, 4),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: InkWell(
|
||||
onTap: () {},
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
child: Padding(
|
||||
padding: EdgeInsets.all(20),
|
||||
child: Row(
|
||||
Row(
|
||||
children: [
|
||||
// Product Image - Simplified
|
||||
Container(
|
||||
width: 56,
|
||||
height: 56,
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.backgroundLight,
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
width: 48,
|
||||
height: 48,
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: const BoxDecoration(
|
||||
color: AppColor.white,
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Center(
|
||||
child: Text(reward.image, style: TextStyle(fontSize: 24)),
|
||||
child: Assets.icons.enakrewardIcon.image(
|
||||
fit: BoxFit.contain,
|
||||
// Aset aslinya besar; decode seukuran tampilan saja.
|
||||
cacheWidth: (32 * MediaQuery.devicePixelRatioOf(context))
|
||||
.round(),
|
||||
),
|
||||
),
|
||||
SizedBox(width: 16),
|
||||
|
||||
// Reward Info - Cleaner layout
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(
|
||||
reward.name,
|
||||
style: AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppColor.textPrimary,
|
||||
),
|
||||
),
|
||||
),
|
||||
_buildStatusBadge(reward),
|
||||
],
|
||||
),
|
||||
SizedBox(height: 4),
|
||||
Text(
|
||||
reward.description,
|
||||
'Siap dipakai',
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
color: AppColor.textWhite.withOpacity(0.9),
|
||||
),
|
||||
),
|
||||
SizedBox(height: 8),
|
||||
Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.access_time,
|
||||
size: 12,
|
||||
color: AppColor.textLight,
|
||||
FittedBox(
|
||||
fit: BoxFit.scaleDown,
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Text(
|
||||
'${active.length} reward',
|
||||
style: AppStyle.h5.copyWith(
|
||||
color: AppColor.textWhite,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
SizedBox(width: 4),
|
||||
Text(
|
||||
_formatDate(reward.redeemedAt),
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: AppColor.textLight,
|
||||
),
|
||||
),
|
||||
Spacer(),
|
||||
Icon(Icons.stars, size: 14, color: AppColor.warning),
|
||||
SizedBox(width: 4),
|
||||
Text(
|
||||
"${reward.pointsUsed}",
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
Material(
|
||||
color: AppColor.white,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
child: InkWell(
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
onTap: () => context.router.push(const CoinRoute()),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 14,
|
||||
vertical: 8,
|
||||
),
|
||||
child: Text(
|
||||
'Tukar Poin',
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.primary,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
if (expiringSoon != null) ...[
|
||||
const SizedBox(height: 14),
|
||||
Material(
|
||||
color: AppColor.white.withOpacity(0.15),
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
child: InkWell(
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
onTap: () => RewardDetailSheet.show(context, expiringSoon),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 12,
|
||||
vertical: 10,
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
const Icon(
|
||||
Icons.schedule,
|
||||
size: 16,
|
||||
color: AppColor.textWhite,
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'${expiringSoon.name} · '
|
||||
'${rewardValidityLabel(expiringSoon).toLowerCase()}',
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.textWhite,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
const Icon(
|
||||
Icons.chevron_right,
|
||||
size: 18,
|
||||
color: AppColor.textWhite,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildEmpty() {
|
||||
final (String emoji, String message) = switch (_filter) {
|
||||
_RewardFilter.all => ('🎁', 'Belum ada reward'),
|
||||
_RewardFilter.active => ('🎯', 'Belum ada reward aktif'),
|
||||
_RewardFilter.used => ('✅', 'Belum ada reward yang dipakai'),
|
||||
_RewardFilter.expired => ('⏰', 'Tidak ada reward yang kedaluwarsa'),
|
||||
};
|
||||
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(32, 32, 32, 64),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Container(
|
||||
width: 96,
|
||||
height: 96,
|
||||
alignment: Alignment.center,
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.primary.withOpacity(0.06),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Text(emoji, style: const TextStyle(fontSize: 44)),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Text(
|
||||
message,
|
||||
textAlign: TextAlign.center,
|
||||
style: AppStyle.lg.copyWith(fontWeight: FontWeight.w700),
|
||||
),
|
||||
const SizedBox(height: 6),
|
||||
Text(
|
||||
'Tukar poin kamu untuk mendapatkan reward menarik',
|
||||
textAlign: TextAlign.center,
|
||||
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
if (_filter == _RewardFilter.all ||
|
||||
_filter == _RewardFilter.active) ...[
|
||||
const SizedBox(height: 20),
|
||||
ElevatedButton(
|
||||
onPressed: () => context.router.push(const CoinRoute()),
|
||||
style: ElevatedButton.styleFrom(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 24,
|
||||
vertical: 12,
|
||||
),
|
||||
),
|
||||
child: Text(
|
||||
'Tukar Poin Sekarang',
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.white,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _FilterHeaderDelegate extends SliverPersistentHeaderDelegate {
|
||||
_FilterHeaderDelegate({
|
||||
required this.selected,
|
||||
required this.countOf,
|
||||
required this.onSelected,
|
||||
});
|
||||
|
||||
final _RewardFilter selected;
|
||||
final int Function(_RewardFilter) countOf;
|
||||
final ValueChanged<_RewardFilter> onSelected;
|
||||
|
||||
static const double _height = 56;
|
||||
|
||||
@override
|
||||
double get minExtent => _height;
|
||||
|
||||
@override
|
||||
double get maxExtent => _height;
|
||||
|
||||
@override
|
||||
Widget build(
|
||||
BuildContext context,
|
||||
double shrinkOffset,
|
||||
bool overlapsContent,
|
||||
) {
|
||||
return Container(
|
||||
color: AppColor.background,
|
||||
child: ListView.separated(
|
||||
scrollDirection: Axis.horizontal,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10),
|
||||
itemCount: _RewardFilter.values.length,
|
||||
separatorBuilder: (_, _) => const SizedBox(width: 8),
|
||||
itemBuilder: (context, index) {
|
||||
final filter = _RewardFilter.values[index];
|
||||
return _FilterChip(
|
||||
label: filter.label,
|
||||
count: countOf(filter),
|
||||
isSelected: filter == selected,
|
||||
onTap: () => onSelected(filter),
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
bool shouldRebuild(covariant _FilterHeaderDelegate oldDelegate) =>
|
||||
oldDelegate.selected != selected;
|
||||
}
|
||||
|
||||
class _FilterChip extends StatelessWidget {
|
||||
const _FilterChip({
|
||||
required this.label,
|
||||
required this.count,
|
||||
required this.isSelected,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
final String label;
|
||||
final int count;
|
||||
final bool isSelected;
|
||||
final VoidCallback onTap;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final foreground = isSelected ? AppColor.textWhite : AppColor.textPrimary;
|
||||
|
||||
return Material(
|
||||
color: isSelected ? AppColor.primary : AppColor.white,
|
||||
shape: StadiumBorder(
|
||||
side: BorderSide(
|
||||
color: isSelected ? AppColor.primary : AppColor.border,
|
||||
),
|
||||
),
|
||||
child: InkWell(
|
||||
customBorder: const StadiumBorder(),
|
||||
onTap: onTap,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 14),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Text(
|
||||
label,
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: foreground,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 6),
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 1),
|
||||
decoration: BoxDecoration(
|
||||
color: isSelected
|
||||
? AppColor.white.withOpacity(0.2)
|
||||
: AppColor.primary.withOpacity(0.08),
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
),
|
||||
child: Text(
|
||||
'$count',
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: isSelected ? AppColor.textWhite : AppColor.primary,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
@@ -418,61 +405,4 @@ class _RewardPageState extends State<RewardPage>
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildStatusBadge(Reward reward) {
|
||||
return Container(
|
||||
padding: EdgeInsets.symmetric(horizontal: 8, vertical: 4),
|
||||
decoration: BoxDecoration(
|
||||
color: reward.statusColor.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(6),
|
||||
),
|
||||
child: Text(
|
||||
reward.statusText,
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: reward.statusColor,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
String _formatDate(DateTime date) {
|
||||
final months = [
|
||||
'',
|
||||
'Jan',
|
||||
'Feb',
|
||||
'Mar',
|
||||
'Apr',
|
||||
'Mei',
|
||||
'Jun',
|
||||
'Jul',
|
||||
'Agu',
|
||||
'Sep',
|
||||
'Okt',
|
||||
'Nov',
|
||||
'Des',
|
||||
];
|
||||
|
||||
final now = DateTime.now();
|
||||
final difference = now.difference(date);
|
||||
|
||||
if (difference.inDays == 0) {
|
||||
if (difference.inHours == 0) {
|
||||
return "${difference.inMinutes} menit lalu";
|
||||
}
|
||||
return "${difference.inHours} jam lalu";
|
||||
} else if (difference.inDays == 1) {
|
||||
return "Kemarin";
|
||||
} else if (difference.inDays < 7) {
|
||||
return "${difference.inDays} hari lalu";
|
||||
} else {
|
||||
return "${date.day} ${months[date.month]} ${date.year}";
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_tabController.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,98 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
|
||||
import '../../../common/theme/theme.dart';
|
||||
import '../../../sample/reward_sample_data.dart';
|
||||
|
||||
/// Reward aktif dengan sisa masa berlaku segini dianggap segera berakhir.
|
||||
const int rewardExpiringSoonDays = 7;
|
||||
|
||||
extension RewardStatusUi on RewardStatus {
|
||||
String get label => switch (this) {
|
||||
RewardStatus.active => 'Aktif',
|
||||
RewardStatus.used => 'Terpakai',
|
||||
RewardStatus.expired => 'Kedaluwarsa',
|
||||
};
|
||||
|
||||
Color get color => switch (this) {
|
||||
RewardStatus.active => AppColor.success,
|
||||
RewardStatus.used => AppColor.textSecondary,
|
||||
RewardStatus.expired => AppColor.error,
|
||||
};
|
||||
}
|
||||
|
||||
/// Tanggal pendek: "1 Okt 2026".
|
||||
String formatRewardDate(DateTime date) =>
|
||||
DateFormat('d MMM yyyy', 'id_ID').format(date);
|
||||
|
||||
/// Sisa hari kalender sampai [Reward.validUntil]; 0 berarti berakhir hari ini.
|
||||
int rewardDaysLeft(Reward reward) {
|
||||
final now = DateTime.now();
|
||||
final today = DateTime(now.year, now.month, now.day);
|
||||
final end = DateTime(
|
||||
reward.validUntil.year,
|
||||
reward.validUntil.month,
|
||||
reward.validUntil.day,
|
||||
);
|
||||
return end.difference(today).inDays;
|
||||
}
|
||||
|
||||
bool isRewardExpiringSoon(Reward reward) =>
|
||||
reward.status == RewardStatus.active &&
|
||||
rewardDaysLeft(reward) <= rewardExpiringSoonDays;
|
||||
|
||||
/// "Berakhir hari ini" / "Berakhir 3 hari lagi" / "Berlaku s/d 25 Okt 2026".
|
||||
String rewardValidityLabel(Reward reward) {
|
||||
final daysLeft = rewardDaysLeft(reward);
|
||||
if (daysLeft <= 0) return 'Berakhir hari ini';
|
||||
if (daysLeft <= rewardExpiringSoonDays) {
|
||||
return 'Berakhir $daysLeft hari lagi';
|
||||
}
|
||||
return 'Berlaku s/d ${formatRewardDate(reward.validUntil)}';
|
||||
}
|
||||
|
||||
class RewardStatusBadge extends StatelessWidget {
|
||||
const RewardStatusBadge({super.key, required this.status});
|
||||
|
||||
final RewardStatus status;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
|
||||
decoration: BoxDecoration(
|
||||
color: status.color.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
),
|
||||
child: Text(
|
||||
status.label,
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: status.color,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Emoji reward; abu-abu untuk reward yang sudah tidak bisa dipakai.
|
||||
class RewardEmoji extends StatelessWidget {
|
||||
const RewardEmoji({super.key, required this.reward, required this.size});
|
||||
|
||||
final Reward reward;
|
||||
final double size;
|
||||
|
||||
static const ColorFilter _greyscale = ColorFilter.matrix([
|
||||
0.2126, 0.7152, 0.0722, 0, 0, //
|
||||
0.2126, 0.7152, 0.0722, 0, 0, //
|
||||
0.2126, 0.7152, 0.0722, 0, 0, //
|
||||
0, 0, 0, 0.5, 0, //
|
||||
]);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final emoji = Text(reward.emoji, style: TextStyle(fontSize: size));
|
||||
if (reward.status == RewardStatus.active) return emoji;
|
||||
return ColorFiltered(colorFilter: _greyscale, child: emoji);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,249 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../../../../common/extension/extension.dart';
|
||||
import '../../../../common/theme/theme.dart';
|
||||
import '../../../../sample/reward_sample_data.dart';
|
||||
import '../reward_ui.dart';
|
||||
|
||||
/// Kartu reward berbentuk tiket: sobekan kiri (emoji + poin) dan isi kanan.
|
||||
class RewardCard extends StatelessWidget {
|
||||
const RewardCard({super.key, required this.reward, required this.onTap});
|
||||
|
||||
final Reward reward;
|
||||
final VoidCallback onTap;
|
||||
|
||||
static const double _stubWidth = 84;
|
||||
|
||||
bool get _isActive => reward.status == RewardStatus.active;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return PhysicalShape(
|
||||
clipper: const _TicketClipper(notchX: _stubWidth + 0.5),
|
||||
color: AppColor.white,
|
||||
elevation: 2,
|
||||
shadowColor: Colors.black.withOpacity(0.25),
|
||||
child: Material(
|
||||
type: MaterialType.transparency,
|
||||
child: InkWell(
|
||||
onTap: onTap,
|
||||
child: IntrinsicHeight(
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
_buildStub(),
|
||||
const Padding(
|
||||
padding: EdgeInsets.symmetric(vertical: 14),
|
||||
child: CustomPaint(
|
||||
size: Size(1, double.infinity),
|
||||
painter: _VerticalDashPainter(),
|
||||
),
|
||||
),
|
||||
Expanded(child: _buildBody()),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildStub() {
|
||||
return Container(
|
||||
width: _stubWidth,
|
||||
color: _isActive
|
||||
? AppColor.primary.withOpacity(0.06)
|
||||
: AppColor.background,
|
||||
padding: const EdgeInsets.symmetric(vertical: 16),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
RewardEmoji(reward: reward, size: 34),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
reward.pointsUsed.thousandFormat,
|
||||
style: AppStyle.md.copyWith(
|
||||
color: _isActive ? AppColor.primary : AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'poin',
|
||||
style: AppStyle.xs.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildBody() {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(14, 12, 14, 12),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(
|
||||
reward.categoryName.toUpperCase(),
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w700,
|
||||
letterSpacing: 0.6,
|
||||
),
|
||||
),
|
||||
),
|
||||
RewardStatusBadge(status: reward.status),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
reward.name,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: AppStyle.lg.copyWith(
|
||||
color: _isActive ? AppColor.textPrimary : AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 2),
|
||||
Text(
|
||||
reward.description,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
Row(
|
||||
children: [
|
||||
Expanded(child: _buildFootnote()),
|
||||
if (_isActive) ...[
|
||||
const SizedBox(width: 8),
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 14,
|
||||
vertical: 6,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.primary,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
),
|
||||
child: Text(
|
||||
'Pakai',
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.white,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildFootnote() {
|
||||
final (IconData icon, String text, Color color) = switch (reward.status) {
|
||||
RewardStatus.active => (
|
||||
Icons.schedule,
|
||||
rewardValidityLabel(reward),
|
||||
isRewardExpiringSoon(reward)
|
||||
? AppColor.warning
|
||||
: AppColor.textSecondary,
|
||||
),
|
||||
RewardStatus.used => (
|
||||
Icons.check_circle_outline,
|
||||
reward.usedAt == null
|
||||
? 'Sudah dipakai'
|
||||
: 'Dipakai ${formatRewardDate(reward.usedAt!)}',
|
||||
AppColor.textSecondary,
|
||||
),
|
||||
RewardStatus.expired => (
|
||||
Icons.event_busy_outlined,
|
||||
'Berakhir ${formatRewardDate(reward.validUntil)}',
|
||||
AppColor.textSecondary,
|
||||
),
|
||||
};
|
||||
|
||||
return Row(
|
||||
children: [
|
||||
Icon(icon, size: 14, color: color),
|
||||
const SizedBox(width: 4),
|
||||
Expanded(
|
||||
child: Text(
|
||||
text,
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: color,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Persegi panjang membulat dengan lekuk setengah lingkaran di atas dan
|
||||
/// bawah pada posisi [notchX], tempat garis sobekan tiket.
|
||||
class _TicketClipper extends CustomClipper<Path> {
|
||||
const _TicketClipper({required this.notchX});
|
||||
|
||||
final double notchX;
|
||||
|
||||
static const double _radius = 16;
|
||||
static const double _notchRadius = 8;
|
||||
|
||||
@override
|
||||
Path getClip(Size size) {
|
||||
final card = Path()
|
||||
..addRRect(
|
||||
RRect.fromRectAndRadius(
|
||||
Offset.zero & size,
|
||||
const Radius.circular(_radius),
|
||||
),
|
||||
);
|
||||
final notches = Path()
|
||||
..addOval(
|
||||
Rect.fromCircle(center: Offset(notchX, 0), radius: _notchRadius),
|
||||
)
|
||||
..addOval(
|
||||
Rect.fromCircle(
|
||||
center: Offset(notchX, size.height),
|
||||
radius: _notchRadius,
|
||||
),
|
||||
);
|
||||
return Path.combine(PathOperation.difference, card, notches);
|
||||
}
|
||||
|
||||
@override
|
||||
bool shouldReclip(covariant _TicketClipper oldClipper) =>
|
||||
oldClipper.notchX != notchX;
|
||||
}
|
||||
|
||||
class _VerticalDashPainter extends CustomPainter {
|
||||
const _VerticalDashPainter();
|
||||
|
||||
static const double _dash = 5;
|
||||
static const double _gap = 4;
|
||||
|
||||
@override
|
||||
void paint(Canvas canvas, Size size) {
|
||||
final paint = Paint()
|
||||
..color = AppColor.border
|
||||
..strokeWidth = size.width;
|
||||
final x = size.width / 2;
|
||||
|
||||
for (double y = 0; y < size.height; y += _dash + _gap) {
|
||||
final end = (y + _dash).clamp(0, size.height).toDouble();
|
||||
canvas.drawLine(Offset(x, y), Offset(x, end), paint);
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
bool shouldRepaint(covariant CustomPainter oldDelegate) => false;
|
||||
}
|
||||
@@ -0,0 +1,280 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:qr_flutter/qr_flutter.dart';
|
||||
|
||||
import '../../../../common/extension/extension.dart';
|
||||
import '../../../../common/theme/theme.dart';
|
||||
import '../../../../common/ui/painter/dashed_line_painter.dart';
|
||||
import '../../../../sample/reward_sample_data.dart';
|
||||
import '../../../components/toast/flushbar.dart';
|
||||
import '../reward_ui.dart';
|
||||
|
||||
class RewardDetailSheet extends StatelessWidget {
|
||||
const RewardDetailSheet({super.key, required this.reward});
|
||||
|
||||
final Reward reward;
|
||||
|
||||
static Future<void> show(BuildContext context, Reward reward) {
|
||||
return showModalBottomSheet<void>(
|
||||
context: context,
|
||||
isScrollControlled: true,
|
||||
backgroundColor: AppColor.white,
|
||||
shape: const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
|
||||
),
|
||||
builder: (_) => RewardDetailSheet(reward: reward),
|
||||
);
|
||||
}
|
||||
|
||||
bool get _isActive => reward.status == RewardStatus.active;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return ConstrainedBox(
|
||||
constraints: BoxConstraints(
|
||||
maxHeight: MediaQuery.sizeOf(context).height * 0.85,
|
||||
),
|
||||
child: SafeArea(
|
||||
top: false,
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.fromLTRB(20, 12, 20, 20),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Center(
|
||||
child: Container(
|
||||
width: 40,
|
||||
height: 4,
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.border,
|
||||
borderRadius: BorderRadius.circular(2),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
_buildHeader(),
|
||||
const SizedBox(height: 20),
|
||||
if (_isActive && reward.couponCode != null)
|
||||
_CouponBox(code: reward.couponCode!)
|
||||
else
|
||||
_buildInactiveNote(),
|
||||
const SizedBox(height: 20),
|
||||
_InfoRow(
|
||||
label: 'Ditukar pada',
|
||||
value: formatRewardDate(reward.redeemedAt),
|
||||
),
|
||||
_InfoRow(
|
||||
label: 'Berlaku sampai',
|
||||
value: formatRewardDate(reward.validUntil),
|
||||
valueColor: isRewardExpiringSoon(reward)
|
||||
? AppColor.warning
|
||||
: null,
|
||||
),
|
||||
if (reward.usedAt != null)
|
||||
_InfoRow(
|
||||
label: 'Dipakai pada',
|
||||
value: formatRewardDate(reward.usedAt!),
|
||||
),
|
||||
_InfoRow(
|
||||
label: 'Poin ditukar',
|
||||
value: '${reward.pointsUsed.thousandFormat} poin',
|
||||
),
|
||||
if (reward.termsAndConditions != null) ...[
|
||||
const SizedBox(height: 16),
|
||||
Text(
|
||||
'Syarat & Ketentuan',
|
||||
style: AppStyle.md.copyWith(fontWeight: FontWeight.w700),
|
||||
),
|
||||
const SizedBox(height: 6),
|
||||
Text(
|
||||
reward.termsAndConditions!,
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
height: 1.5,
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeader() {
|
||||
return Row(
|
||||
children: [
|
||||
Container(
|
||||
width: 56,
|
||||
height: 56,
|
||||
alignment: Alignment.center,
|
||||
decoration: BoxDecoration(
|
||||
color: _isActive
|
||||
? AppColor.primary.withOpacity(0.06)
|
||||
: AppColor.background,
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
),
|
||||
child: RewardEmoji(reward: reward, size: 28),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
reward.categoryName.toUpperCase(),
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w700,
|
||||
letterSpacing: 0.6,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 2),
|
||||
Text(
|
||||
reward.name,
|
||||
style: AppStyle.xl.copyWith(fontWeight: FontWeight.w700),
|
||||
),
|
||||
Text(
|
||||
reward.description,
|
||||
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
RewardStatusBadge(status: reward.status),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildInactiveNote() {
|
||||
final message = switch (reward.status) {
|
||||
RewardStatus.used =>
|
||||
reward.usedAt == null
|
||||
? 'Reward ini sudah dipakai.'
|
||||
: 'Reward ini sudah dipakai pada '
|
||||
'${formatRewardDate(reward.usedAt!)}.',
|
||||
_ =>
|
||||
'Masa berlaku reward ini sudah habis pada '
|
||||
'${formatRewardDate(reward.validUntil)}.',
|
||||
};
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(14),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.background,
|
||||
borderRadius: BorderRadius.circular(AppValue.borderRadius),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(Icons.info_outline, size: 20, color: reward.status.color),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
child: Text(
|
||||
message,
|
||||
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _CouponBox extends StatelessWidget {
|
||||
const _CouponBox({required this.code});
|
||||
|
||||
final String code;
|
||||
|
||||
Future<void> _copy(BuildContext context) async {
|
||||
await Clipboard.setData(ClipboardData(text: code));
|
||||
if (!context.mounted) return;
|
||||
AppFlushbar.showSuccess(context, 'Kode reward disalin');
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(color: AppColor.border),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
QrImageView(
|
||||
data: code,
|
||||
size: 168,
|
||||
padding: EdgeInsets.zero,
|
||||
backgroundColor: AppColor.white,
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
'Tunjukkan QR atau kode ini ke kasir',
|
||||
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
const SizedBox(height: 14),
|
||||
CustomPaint(
|
||||
size: const Size(double.infinity, 1),
|
||||
painter: DashedLinePainter(),
|
||||
),
|
||||
const SizedBox(height: 6),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Flexible(
|
||||
child: Text(
|
||||
code,
|
||||
style: AppStyle.xl.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
letterSpacing: 2,
|
||||
),
|
||||
),
|
||||
),
|
||||
IconButton(
|
||||
onPressed: () => _copy(context),
|
||||
tooltip: 'Salin kode',
|
||||
icon: const Icon(
|
||||
Icons.copy_rounded,
|
||||
size: 20,
|
||||
color: AppColor.primary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _InfoRow extends StatelessWidget {
|
||||
const _InfoRow({required this.label, required this.value, this.valueColor});
|
||||
|
||||
final String label;
|
||||
final String value;
|
||||
final Color? valueColor;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 6),
|
||||
child: Row(
|
||||
children: [
|
||||
Text(
|
||||
label,
|
||||
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
const Spacer(),
|
||||
Text(
|
||||
value,
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: valueColor ?? AppColor.textPrimary,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user