feat: customer page

This commit is contained in:
efrilm
2025-08-15 16:31:29 +07:00
parent c9e5c8d178
commit 8c2afc4880
8 changed files with 643 additions and 75 deletions
@@ -0,0 +1,96 @@
import 'package:flutter/material.dart';
import '../../../../common/theme/theme.dart';
class CustomerAppbar extends StatelessWidget {
final Animation<double> rotationAnimation;
const CustomerAppbar({super.key, required this.rotationAnimation});
@override
Widget build(BuildContext context) {
return FlexibleSpaceBar(
titlePadding: const EdgeInsets.only(left: 50, bottom: 16),
title: Text(
'Customer',
style: AppStyle.xl.copyWith(
color: AppColor.textWhite,
fontSize: 18,
fontWeight: FontWeight.w600,
),
),
background: Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
colors: AppColor.primaryGradient,
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
),
),
child: Stack(
children: [
Positioned(
right: -20,
top: -20,
child: AnimatedBuilder(
animation: rotationAnimation,
builder: (context, child) {
return Transform.rotate(
angle: rotationAnimation.value,
child: Container(
width: 100,
height: 100,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: AppColor.white.withOpacity(0.1),
),
),
);
},
),
),
Positioned(
left: -30,
bottom: -30,
child: AnimatedBuilder(
animation: rotationAnimation,
builder: (context, child) {
return Transform.rotate(
angle: -rotationAnimation.value * 0.5,
child: Container(
width: 80,
height: 80,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: AppColor.white.withOpacity(0.05),
),
),
);
},
),
),
Positioned(
right: 80,
bottom: 30,
child: AnimatedBuilder(
animation: rotationAnimation,
builder: (context, child) {
return Transform.rotate(
angle: -rotationAnimation.value * 0.2,
child: Container(
width: 40,
height: 40,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
color: AppColor.white.withOpacity(0.08),
),
),
);
},
),
),
],
),
),
);
}
}
@@ -0,0 +1,89 @@
import 'package:flutter/material.dart';
import '../../../../common/theme/theme.dart';
import '../../../components/spacer/spacer.dart';
import '../customer_page.dart';
class CustomerCard extends StatelessWidget {
final Customer customer;
const CustomerCard({super.key, required this.customer});
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
color: AppColor.white,
borderRadius: BorderRadius.circular(16),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 10,
offset: Offset(0, 4),
),
],
),
child: InkWell(
onTap: () {},
borderRadius: BorderRadius.circular(16),
child: Padding(
padding: EdgeInsets.all(16),
child: Column(
children: [
CircleAvatar(
backgroundColor: _getMembershipColor(customer.membershipLevel),
radius: 30,
child: Text(
customer.name[0].toUpperCase(),
style: AppStyle.xxl.copyWith(
color: AppColor.white,
fontWeight: FontWeight.bold,
),
),
),
SpaceHeight(12),
Text(
customer.name,
style: AppStyle.lg.copyWith(fontWeight: FontWeight.bold),
textAlign: TextAlign.center,
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
SizedBox(height: 8),
Container(
padding: EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: _getMembershipColor(
customer.membershipLevel,
).withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: Text(
customer.membershipLevel,
style: AppStyle.sm.copyWith(
color: _getMembershipColor(customer.membershipLevel),
fontWeight: FontWeight.bold,
),
),
),
],
),
),
),
);
}
Color _getMembershipColor(String level) {
switch (level) {
case 'Platinum':
return Color(0xFF9C27B0);
case 'Gold':
return Color(0xFFFF9800);
case 'Silver':
return Color(0xFF607D8B);
case 'Bronze':
return Color(0xFF795548);
default:
return AppColor.primary;
}
}
}
@@ -0,0 +1,127 @@
import 'package:flutter/material.dart';
import '../../../../common/theme/theme.dart';
import '../../../components/spacer/spacer.dart';
import '../customer_page.dart';
class CustomerTile extends StatelessWidget {
final Customer customer;
const CustomerTile({super.key, required this.customer});
@override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.symmetric(horizontal: AppValue.margin, vertical: 6),
decoration: BoxDecoration(
color: AppColor.white,
borderRadius: BorderRadius.circular(12),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 10,
offset: Offset(0, 2),
),
],
),
child: ListTile(
contentPadding: EdgeInsets.all(16),
leading: CircleAvatar(
backgroundColor: _getMembershipColor(customer.membershipLevel),
child: Text(
customer.name[0].toUpperCase(),
style: AppStyle.sm.copyWith(
color: AppColor.white,
fontWeight: FontWeight.bold,
),
),
),
title: Text(
customer.name,
style: AppStyle.lg.copyWith(fontWeight: FontWeight.bold),
),
subtitle: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SpaceHeight(4),
Text(customer.email),
SpaceHeight(2),
Text(customer.phone),
SpaceHeight(4),
Row(
children: [
Container(
padding: EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: _getMembershipColor(
customer.membershipLevel,
).withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: Text(
customer.membershipLevel,
style: AppStyle.sm.copyWith(
color: _getMembershipColor(customer.membershipLevel),
fontWeight: FontWeight.bold,
),
),
),
SpaceWidth(8),
Container(
padding: EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: customer.isActive
? AppColor.success.withOpacity(0.1)
: AppColor.error.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: Text(
customer.isActive ? 'Active' : 'Inactive',
style: AppStyle.sm.copyWith(
color: customer.isActive
? AppColor.success
: AppColor.error,
fontWeight: FontWeight.bold,
),
),
),
],
),
],
),
trailing: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Text(
'Rp ${customer.totalPurchases.toStringAsFixed(0)}',
style: AppStyle.md.copyWith(
fontWeight: FontWeight.bold,
color: AppColor.primary,
),
),
Text(
'${customer.totalOrders} orders',
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
),
],
),
onTap: () {},
),
);
}
Color _getMembershipColor(String level) {
switch (level) {
case 'Platinum':
return Color(0xFF9C27B0);
case 'Gold':
return Color(0xFFFF9800);
case 'Silver':
return Color(0xFF607D8B);
case 'Bronze':
return Color(0xFF795548);
default:
return AppColor.primary;
}
}
}