diff --git a/lib/presentation/pages/main/pages/order/order_page.dart b/lib/presentation/pages/main/pages/order/order_page.dart index 8ee2bd3..e631034 100644 --- a/lib/presentation/pages/main/pages/order/order_page.dart +++ b/lib/presentation/pages/main/pages/order/order_page.dart @@ -144,7 +144,6 @@ class _OrderPageState extends State with TickerProviderStateMixin { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: AppColor.background, appBar: _buildAppBar(), body: Column( children: [ diff --git a/lib/presentation/pages/main/pages/order/widgets/order_card.dart b/lib/presentation/pages/main/pages/order/widgets/order_card.dart index f874667..0b14936 100644 --- a/lib/presentation/pages/main/pages/order/widgets/order_card.dart +++ b/lib/presentation/pages/main/pages/order/widgets/order_card.dart @@ -15,271 +15,80 @@ class OrderCard extends StatelessWidget { return GestureDetector( onTap: () => context.router.push(OrderDetailRoute(order: order)), child: Container( - margin: const EdgeInsets.only(bottom: 16), + padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 0), decoration: BoxDecoration( - color: AppColor.white, - borderRadius: BorderRadius.circular(16), - boxShadow: [ - BoxShadow( - color: AppColor.black.withOpacity(0.06), - blurRadius: 16, - offset: const Offset(0, 3), - ), - ], - ), - child: Padding( - padding: const EdgeInsets.all(18), - child: Column( - children: [ - _buildHeader(), - const SizedBox(height: 16), - _buildContent(), - const SizedBox(height: 16), - _buildFooter(), - ], - ), - ), - ), - ); - } - - Widget _buildHeader() { - return Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Expanded( - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Row( - children: [ - Container( - padding: const EdgeInsets.symmetric( - horizontal: 8, - vertical: 4, - ), - decoration: BoxDecoration( - color: AppColor.primary.withOpacity(0.1), - borderRadius: BorderRadius.circular(6), - ), - child: Text( - order.id, - style: AppStyle.sm.copyWith( - fontWeight: FontWeight.w600, - color: AppColor.primary, - ), - ), - ), - ], - ), - const SizedBox(height: 6), - Text( - DateFormat('dd MMM yyyy • HH:mm').format(order.orderDate), - style: AppStyle.sm.copyWith(color: AppColor.textSecondary), - ), - ], - ), - ), - _buildStatusChip(), - ], - ); - } - - Widget _buildStatusChip() { - return Container( - padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 6), - decoration: BoxDecoration( - color: _getStatusColor().withOpacity(0.1), - borderRadius: BorderRadius.circular(20), - border: Border.all(color: _getStatusColor().withOpacity(0.2), width: 1), - ), - child: Row( - mainAxisSize: MainAxisSize.min, - children: [ - Icon(_getStatusIcon(), size: 12, color: _getStatusColor()), - const SizedBox(width: 6), - Text( - _getStatusText(), - style: AppStyle.sm.copyWith( - color: _getStatusColor(), - fontWeight: FontWeight.w600, + border: Border( + bottom: BorderSide( + color: AppColor.border.withOpacity(0.3), + width: 1, ), ), - ], - ), - ); - } - - Widget _buildContent() { - return Container( - padding: const EdgeInsets.all(14), - decoration: BoxDecoration( - color: AppColor.background, - borderRadius: BorderRadius.circular(12), - ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Row( - children: [ - Icon( - Icons.restaurant_menu_outlined, - size: 16, - color: AppColor.textSecondary, - ), - const SizedBox(width: 6), - Text( - '${order.items.length} item pesanan', - style: AppStyle.sm.copyWith( - fontWeight: FontWeight.w500, - color: AppColor.textSecondary, - ), - ), - ], - ), - const SizedBox(height: 10), - ...order.items - .take(3) - .map( - (item) => Container( - margin: const EdgeInsets.only(bottom: 6), - child: Row( - children: [ - Container( - width: 20, - height: 20, - decoration: BoxDecoration( - color: AppColor.primary.withOpacity(0.1), - borderRadius: BorderRadius.circular(10), - ), - child: Center( - child: Text( - '${item.quantity}', - style: AppStyle.xs.copyWith( - fontWeight: FontWeight.w600, - color: AppColor.primary, - ), - ), - ), - ), - const SizedBox(width: 10), - Expanded( - child: Text( - item.name, - style: AppStyle.sm.copyWith( - color: AppColor.textPrimary, - fontWeight: FontWeight.w500, - ), - maxLines: 1, - overflow: TextOverflow.ellipsis, - ), - ), - Text( - 'Rp ${_formatCurrency(item.price * item.quantity)}', - style: AppStyle.sm.copyWith( - color: AppColor.textPrimary, - fontWeight: FontWeight.w600, - ), - ), - ], - ), - ), - ), - if (order.items.length > 3) ...[ - Container( - margin: const EdgeInsets.only(top: 4), - child: Text( - '+${order.items.length - 3} item lainnya', - style: AppStyle.xs.copyWith( - color: AppColor.textSecondary, - fontStyle: FontStyle.italic, - ), - ), - ), - ], - if (order.notes != null) ...[ - const SizedBox(height: 10), - Container( - padding: const EdgeInsets.all(10), - decoration: BoxDecoration( - color: AppColor.warning.withOpacity(0.05), - borderRadius: BorderRadius.circular(8), - border: Border.all(color: AppColor.warning.withOpacity(0.2)), - ), - child: Row( + ), + child: Row( + children: [ + // Left side - Order info + Expanded( + child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - Icon( - Icons.sticky_note_2_outlined, - size: 14, - color: AppColor.warning, - ), - const SizedBox(width: 6), - Expanded( - child: Text( - order.notes!, - style: AppStyle.xs.copyWith( - color: AppColor.textPrimary, - height: 1.3, - ), + // Order ID + Text( + order.id, + style: AppStyle.md.copyWith( + fontWeight: FontWeight.w600, + color: AppColor.textPrimary, ), ), + const SizedBox(height: 4), + // Order Date + Text( + DateFormat('dd MMM yyyy • HH:mm').format(order.orderDate), + style: AppStyle.sm.copyWith(color: AppColor.textSecondary), + ), ], ), ), - ], - ], - ), - ); - } - Widget _buildFooter() { - return Column( - children: [ - Container( - height: 1, - width: double.infinity, - color: AppColor.border.withOpacity(0.3), - ), - const SizedBox(height: 12), - Row( - children: [ - Icon( - order.address != null - ? Icons.location_on_outlined - : Icons.store_outlined, - size: 16, - color: AppColor.textSecondary, - ), - const SizedBox(width: 6), - Expanded( - child: Text( - order.address ?? 'Ambil di tempat', - style: AppStyle.sm.copyWith(color: AppColor.textSecondary), - maxLines: 1, - overflow: TextOverflow.ellipsis, - ), - ), - const SizedBox(width: 12), + // Right side - Status and Total Column( crossAxisAlignment: CrossAxisAlignment.end, children: [ - Text( - 'Total', - style: AppStyle.xs.copyWith(color: AppColor.textSecondary), + // Status + Container( + padding: const EdgeInsets.symmetric( + horizontal: 8, + vertical: 4, + ), + decoration: BoxDecoration( + color: _getStatusColor().withOpacity(0.1), + borderRadius: BorderRadius.circular(12), + border: Border.all( + color: _getStatusColor().withOpacity(0.2), + width: 1, + ), + ), + child: Text( + _getStatusText(), + style: AppStyle.xs.copyWith( + color: _getStatusColor(), + fontWeight: FontWeight.w600, + ), + ), ), + const SizedBox(height: 6), + // Total Amount Text( 'Rp ${_formatCurrency(order.totalAmount)}', - style: AppStyle.lg.copyWith( + style: AppStyle.md.copyWith( fontWeight: FontWeight.w700, - color: AppColor.primary, + color: AppColor.textPrimary, ), ), ], ), ], ), - ], + ), ); } @@ -309,19 +118,6 @@ class OrderCard extends StatelessWidget { } } - IconData _getStatusIcon() { - switch (order.status) { - case OrderStatus.pending: - return Icons.schedule; - case OrderStatus.processing: - return Icons.hourglass_empty; - case OrderStatus.completed: - return Icons.check_circle; - case OrderStatus.cancelled: - return Icons.cancel; - } - } - String _formatCurrency(double amount) { final formatter = NumberFormat('#,###'); return formatter.format(amount);