feat: product scroll infinity and product category

This commit is contained in:
efrilm
2025-08-17 19:29:46 +07:00
parent 6b1e56a46b
commit beb9ead4da
8 changed files with 575 additions and 183 deletions
@@ -0,0 +1,117 @@
import 'package:flutter/material.dart';
import '../../../../common/extension/extension.dart';
import '../../../../common/theme/theme.dart';
import '../../../../domain/product/product.dart';
import '../../../components/image/image.dart';
class ProductCard extends StatelessWidget {
const ProductCard({super.key, required this.product, this.onTap});
final Product product;
final VoidCallback? onTap;
@override
Widget build(BuildContext context) {
return Container(
margin: const EdgeInsets.only(bottom: 12.0),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.1),
spreadRadius: 1,
blurRadius: 6,
offset: const Offset(0, 2),
),
],
),
child: InkWell(
onTap: onTap,
borderRadius: BorderRadius.circular(12),
child: Padding(
padding: const EdgeInsets.all(12.0),
child: Row(
children: [
// Product Image
_buildProductImage(),
const SizedBox(width: 12),
// Product Info
Expanded(child: _buildProductInfo()),
],
),
),
),
);
}
Widget _buildProductImage() {
return Container(
width: 80,
height: 80,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
color: AppColor.background,
),
child: ClipRRect(
borderRadius: BorderRadius.circular(8),
child: AppNetworkImage(url: product.imageUrl, fit: BoxFit.cover),
),
);
}
Widget _buildProductInfo() {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
product.name,
style: const TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
const SizedBox(height: 4),
Text(
product.description,
style: TextStyle(fontSize: 12, color: AppColor.textLight),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
const SizedBox(height: 8),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
product.price.currencyFormatRp,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: AppColor.primary,
),
),
Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: _getStatusColor().withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: Text(
product.isActive ? 'AKTIF' : 'NONAKTIF',
style: TextStyle(
fontSize: 12,
color: _getStatusColor(),
fontWeight: FontWeight.w500,
),
),
),
],
),
],
);
}
Color _getStatusColor() {
return product.isActive ? Colors.green : Colors.red;
}
}
@@ -1,7 +1,9 @@
import 'package:flutter/material.dart';
import '../../../../common/extension/extension.dart';
import '../../../../common/theme/theme.dart';
import '../../../../domain/product/product.dart';
import '../../../components/image/image.dart';
import '../../../components/spacer/spacer.dart';
class ProductTile extends StatelessWidget {
@@ -90,7 +92,7 @@ class ProductTile extends StatelessWidget {
Widget _buildProductImage() {
return Expanded(
flex: 2,
flex: 3,
child: Container(
width: double.infinity,
decoration: const BoxDecoration(
@@ -100,12 +102,12 @@ class ProductTile extends StatelessWidget {
topRight: Radius.circular(12.0),
),
),
child: Stack(
children: [
Center(
child: Icon(Icons.image, size: 32, color: AppColor.textLight),
),
],
child: ClipRRect(
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(12.0),
topRight: Radius.circular(12.0),
),
child: AppNetworkImage(url: product.imageUrl, fit: BoxFit.cover),
),
),
);
@@ -133,7 +135,7 @@ class ProductTile extends StatelessWidget {
),
const SizedBox(height: 2),
Text(
_formatPrice(product.price),
product.price.currencyFormatRp,
style: AppStyle.xs.copyWith(
color: product.isActive
? AppColor.primary
@@ -151,30 +153,20 @@ class ProductTile extends StatelessWidget {
Widget _buildBottomInfo() {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Flexible(
child: Text(
'Stok: ',
style: AppStyle.xs.copyWith(
color: AppColor.textSecondary,
fontSize: 9,
),
overflow: TextOverflow.ellipsis,
),
),
Container(
padding: const EdgeInsets.symmetric(horizontal: 4, vertical: 1),
decoration: BoxDecoration(
color: AppColor.primaryLight.withOpacity(0.1),
color: _getPrinterTypeColor().withOpacity(0.1),
borderRadius: BorderRadius.circular(3.0),
),
child: Text(
'',
product.printerType.toUpperCase(),
style: AppStyle.xs.copyWith(
color: product.isActive
? AppColor.primary
? _getPrinterTypeColor()
: AppColor.textSecondary,
fontSize: 8,
fontWeight: FontWeight.w500,
@@ -185,7 +177,16 @@ class ProductTile extends StatelessWidget {
);
}
String _formatPrice(int price) {
return 'Rp ${price.toString().replaceAllMapped(RegExp(r'(\d{1,3})(?=(\d{3})+(?!\d))'), (Match m) => '${m[1]}.')}';
Color _getPrinterTypeColor() {
switch (product.printerType.toLowerCase()) {
case 'kitchen':
return Colors.orange;
case 'bar':
return Colors.blue;
case 'receipt':
return AppColor.primary;
default:
return AppColor.primary;
}
}
}