apksel-dev/apskel-pos-flutter-v2
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refund

Browse Source
This commit is contained in:
efrilm
2025-11-01 16:17:45 +07:00
parent ef23839761
commit 069c2296de
24 changed files with 2670 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/presentation/pages/order/widgets/order_right_panel.dart
+3 -3
View File
@@ -89,9 +89,9 @@ class OrderRightPanel extends StatelessWidget {
if (state.selectedOrder?.isRefund == false)
AppElevatedButton.outlined(
onPressed: () {
// context.push(RefundPage(
// selectedOrder: orderDetail!,
// ));
context.router.push(
RefundRoute(order: state.selectedOrder!),
);
},
label: 'Refund',
icon: Icon(Icons.autorenew),
lib/presentation/pages/refund/pages/refund_success/refund_success_page.dart
+68
View File
@@ -0,0 +1,68 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../../../../application/order/order_loader/order_loader_bloc.dart';
import '../../../../../common/theme/theme.dart';
import '../../../../components/error/order_loader_error_state_widget.dart';
import '../../../../components/loader/loader_with_text.dart';
import 'widgets/refund_success_left_panel.dart';
import 'widgets/refund_success_right_panel.dart';
@RoutePage()
class RefundSuccessPage extends StatelessWidget implements AutoRouteWrapper {
final String orderId;
const RefundSuccessPage({super.key, required this.orderId});
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: AppColor.background,
body: SafeArea(
child: BlocBuilder<OrderLoaderBloc, OrderLoaderState>(
builder: (context, state) {
if (state.isFetchingById) {
return const Center(child: LoaderWithText());
}
return state.failureOptionGetById.fold(
() => Container(
padding: const EdgeInsets.all(24.0),
child: Row(
children: [
// Left Panel - Success Message & Order Info
Expanded(
flex: 35,
child: RefundSuccessLeftPanel(order: state.order),
),
const SizedBox(width: 16),
// Right Panel - Order Details
Expanded(
flex: 65,
child: RefundSuccessRightPanel(order: state.order),
),
],
),
),
(f) => OrderLoaderErrorStateWidget(
failure: f,
onRefresh: () {
context.read<OrderLoaderBloc>().add(
OrderLoaderEvent.getById(orderId),
);
},
),
);
},
),
),
);
}
@override
Widget wrappedRoute(BuildContext context) {
context.read<OrderLoaderBloc>().add(OrderLoaderEvent.getById(orderId));
return this;
}
}
lib/presentation/pages/refund/pages/refund_success/widgets/refund_success_left_panel.dart
+268
View File
@@ -0,0 +1,268 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import '../../../../../../common/extension/extension.dart';
import '../../../../../../common/theme/theme.dart';
import '../../../../../../domain/order/order.dart';
import '../../../../../components/button/button.dart';
import '../../../../../components/spaces/space.dart';
import '../../../../../router/app_router.gr.dart';
class RefundSuccessLeftPanel extends StatelessWidget {
final Order order;
const RefundSuccessLeftPanel({super.key, required this.order});
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(24),
),
child: Column(
children: [
Expanded(
child: SingleChildScrollView(
child: Column(
children: [
Container(
width: double.infinity,
padding: const EdgeInsets.all(32.0),
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
AppColor.primary.withOpacity(0.1),
AppColor.primary.withOpacity(0.05),
],
),
borderRadius: const BorderRadius.vertical(
top: Radius.circular(24),
),
),
child: Column(
children: [
Container(
padding: const EdgeInsets.all(20.0),
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
AppColor.primary,
AppColor.primary.withOpacity(0.8),
],
),
shape: BoxShape.circle,
boxShadow: [
BoxShadow(
color: AppColor.primary.withOpacity(0.3),
blurRadius: 20,
offset: const Offset(0, 10),
),
],
),
child: const Icon(
Icons.check_rounded,
size: 48,
color: Colors.white,
),
),
SpaceHeight(16),
Text(
'Refund Berhasil!',
style: AppStyle.h4.copyWith(
fontWeight: FontWeight.bold,
color: AppColor.primary,
),
),
],
),
),
Padding(
padding: const EdgeInsets.all(24.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Informasi Pesanan',
style: AppStyle.lg.copyWith(
fontWeight: FontWeight.bold,
),
),
SpaceHeight(24),
_buildInfoRow(
icon: Icons.person,
label: 'Pemesan',
value: order.metadata['customer_name'] ?? "-",
),
if (order.payments.isNotEmpty) ...[
const SpaceHeight(12),
_buildInfoRow(
icon: Icons.wallet_outlined,
label: 'Metode Pembayaran',
value: order.payments.first.paymentMethodName,
),
],
if (order.tableNumber != "") ...[
const SpaceHeight(12),
_buildInfoRow(
icon: Icons.table_restaurant_outlined,
label: 'No. Meja',
value: order.tableNumber,
),
],
const SpaceHeight(12),
_buildInfoRow(
icon: Icons.access_time_rounded,
label: 'Waktu',
value: (DateTime.now()).toFormattedDateTime(),
),
const SpaceHeight(12),
Container(
width: double.infinity,
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
AppColor.primary.withOpacity(0.1),
AppColor.primary.withOpacity(0.05),
],
),
borderRadius: BorderRadius.circular(12),
border: Border.all(
color: AppColor.primary.withOpacity(0.2),
width: 1,
),
),
child: Text(
order.refundReason,
style: AppStyle.md.copyWith(
color: AppColor.primary,
fontWeight: FontWeight.bold,
),
),
),
],
),
),
],
),
),
),
_buildBottomSection(context),
],
),
);
}
Widget _buildBottomSection(BuildContext context) {
return Container(
width: double.infinity,
padding: const EdgeInsets.all(24.0),
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Colors.grey.shade50, Colors.white],
),
borderRadius: const BorderRadius.vertical(bottom: Radius.circular(24)),
),
child: Column(
children: [
// Action Buttons with Modern Design
Row(
children: [
Expanded(
child: AppElevatedButton.outlined(
onPressed: () =>
context.router.replaceAll([const MainRoute()]),
label: "Kembali",
),
),
const SpaceWidth(16),
Expanded(
child: AppElevatedButton.filled(
onPressed: () {
// onPrintRecipt(
// context,
// order: widget.order,
// paymentMethod: widget.paymentMethod,
// nominalBayar: widget.paymentMethod == "Cash"
// ? widget.nominalBayar
// : widget.order.totalAmount ?? 0,
// kembalian: widget.nominalBayar -
// (widget.order.totalAmount ?? 0),
// productQuantity: widget.productQuantity,
// );
// onPrint(
// context,
// productQuantity: widget.productQuantity,
// order: widget.order,
// );
},
label: 'Cetak Struk',
icon: Icon(Icons.print_rounded, color: AppColor.white),
),
),
],
),
],
),
);
}
Widget _buildInfoRow({
required IconData icon,
required String label,
required String value,
Color? valueColor,
bool showBadge = false,
}) {
return Row(
children: [
Icon(icon, size: 18, color: AppColor.primary),
const SizedBox(width: 12),
Expanded(
child: Text(
label,
style: AppStyle.md.copyWith(color: AppColor.textSecondary),
),
),
if (showBadge && valueColor != null)
Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: valueColor.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(Icons.check_circle, size: 14, color: valueColor),
const SizedBox(width: 4),
Text(
value,
style: AppStyle.sm.copyWith(
fontWeight: FontWeight.bold,
color: valueColor,
),
),
],
),
)
else
Text(
value,
style: AppStyle.md.copyWith(
fontWeight: FontWeight.bold,
color: valueColor ?? AppColor.primary,
),
),
],
);
}
}
lib/presentation/pages/refund/pages/refund_success/widgets/refund_success_right_panel.dart
+352
View File
@@ -0,0 +1,352 @@
import 'package:flutter/material.dart';
import '../../../../../../common/extension/extension.dart';
import '../../../../../../common/theme/theme.dart';
import '../../../../../../domain/order/order.dart';
import '../../../../../components/spaces/space.dart';
class RefundSuccessRightPanel extends StatelessWidget {
final Order order;
const RefundSuccessRightPanel({super.key, required this.order});
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(24),
),
child: Column(
children: [
_header(),
Expanded(
child: ListView.separated(
padding: const EdgeInsets.all(24.0),
itemCount: order.orderItems.length,
separatorBuilder: (context, index) => const SizedBox(height: 12),
itemBuilder: (context, index) {
return _buildProductCard(index);
},
),
),
_buildSummaryFooter(),
],
),
);
}
Widget _buildSummaryFooter() {
return Container(
width: double.infinity,
padding: const EdgeInsets.all(24.0),
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Colors.grey.shade50, Colors.white],
),
borderRadius: const BorderRadius.vertical(bottom: Radius.circular(24)),
),
child: Column(
children: [
// Decorative Divider
Container(
height: 1,
margin: const EdgeInsets.only(bottom: 20),
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
Colors.transparent,
AppColor.primary.withOpacity(0.3),
Colors.transparent,
],
),
),
),
// Subtotal Row
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
Icon(
Icons.shopping_cart_outlined,
size: 16,
color: AppColor.textSecondary,
),
const SizedBox(width: 8),
Text(
'Subtotal (${order.orderItems.length} items)',
style: AppStyle.md.copyWith(
color: AppColor.textSecondary,
fontWeight: FontWeight.w500,
),
),
],
),
Text(
(order.totalAmount).toString().currencyFormatRpV2,
style: AppStyle.md.copyWith(fontWeight: FontWeight.w600),
),
],
),
const SpaceHeight(16),
// Total Payment Row with Enhanced Styling
Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
AppColor.primary.withOpacity(0.1),
AppColor.primary.withOpacity(0.05),
],
),
borderRadius: BorderRadius.circular(12),
border: Border.all(
color: AppColor.primary.withOpacity(0.2),
width: 1,
),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
Container(
padding: const EdgeInsets.all(6),
decoration: BoxDecoration(
color: AppColor.primary.withOpacity(0.2),
borderRadius: BorderRadius.circular(8),
),
child: Icon(
Icons.payments_rounded,
size: 16,
color: AppColor.primary,
),
),
SpaceWidth(12),
Text(
'Total Refund',
style: AppStyle.lg.copyWith(fontWeight: FontWeight.bold),
),
],
),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 6,
),
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
AppColor.primary,
AppColor.primary.withOpacity(0.8),
],
),
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: AppColor.primary.withOpacity(0.3),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Text(
(order.totalAmount).toString().currencyFormatRpV2,
style: AppStyle.xl.copyWith(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
),
],
),
),
],
),
);
}
Widget _buildProductCard(int index) {
final item = order.orderItems[index];
return Container(
padding: const EdgeInsets.all(16.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16.0),
border: Border.all(color: AppColor.border, width: 1),
),
child: Row(
children: [
// Enhanced Product Image
Container(
width: 70,
height: 70,
decoration: BoxDecoration(
color: AppColor.primaryWithOpacity(0.1),
borderRadius: BorderRadius.circular(16.0),
),
child: Icon(
Icons.restaurant_rounded,
color: AppColor.primary,
size: 28,
),
),
const SpaceWidth(16),
// Product Details
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item.productName,
style: AppStyle.lg.copyWith(fontWeight: FontWeight.bold),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
const SpaceHeight(6),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 8,
vertical: 4,
),
decoration: BoxDecoration(
color: Colors.grey.shade100,
borderRadius: BorderRadius.circular(8),
),
child: Text(
item.unitPrice.currencyFormatRpV2,
style: AppStyle.md.copyWith(
color: AppColor.textSecondary,
fontWeight: FontWeight.w500,
),
),
),
],
),
),
const SpaceWidth(16),
// Quantity and Total
Column(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 8,
),
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
AppColor.primary,
AppColor.primary.withOpacity(0.8),
],
),
borderRadius: BorderRadius.circular(12),
),
child: Text(
'${item.quantity}x',
style: AppStyle.md.copyWith(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
),
const SpaceHeight(8),
Text(
item.totalPrice.toString().currencyFormatRpV2,
style: AppStyle.lg.copyWith(
fontWeight: FontWeight.bold,
color: AppColor.primary,
),
),
],
),
],
),
);
}
Container _header() {
return Container(
width: double.infinity,
padding: const EdgeInsets.all(24.0),
decoration: BoxDecoration(
border: Border(bottom: BorderSide(color: AppColor.border)),
borderRadius: const BorderRadius.vertical(top: Radius.circular(24)),
),
child: Row(
children: [
Container(
padding: const EdgeInsets.all(12.0),
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
AppColor.primary.withOpacity(0.2),
AppColor.primary.withOpacity(0.1),
],
),
borderRadius: BorderRadius.circular(16.0),
),
child: Icon(
Icons.receipt_long_rounded,
color: AppColor.primary,
size: 28,
),
),
SpaceWidth(16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Detail Pesanan',
style: AppStyle.xxl.copyWith(fontWeight: FontWeight.bold),
),
SpaceHeight(4),
Text(
'Ringkasan item yang dipesan',
style: AppStyle.md.copyWith(color: Colors.grey.shade600),
),
],
),
),
Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10),
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [AppColor.primary, AppColor.primary.withOpacity(0.8)],
),
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
color: AppColor.primary.withOpacity(0.3),
blurRadius: 8,
offset: const Offset(0, 4),
),
],
),
child: Text(
'${order.orderItems.length} Items',
style: const TextStyle(
fontSize: 13,
color: Colors.white,
fontWeight: FontWeight.bold,
),
),
),
],
),
);
}
}
lib/presentation/pages/refund/refund_page.dart
+60
View File
@@ -0,0 +1,60 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../../application/refund/refund_form/refund_form_bloc.dart';
import '../../../common/theme/theme.dart';
import '../../../domain/order/order.dart';
import '../../../injection.dart';
import '../../components/toast/flushbar.dart';
import '../../router/app_router.gr.dart';
import 'widgets/refund_left_panel.dart';
import 'widgets/refund_right_panel.dart';
@RoutePage()
class RefundPage extends StatelessWidget implements AutoRouteWrapper {
final Order order;
const RefundPage({super.key, required this.order});
@override
Widget build(BuildContext context) {
return BlocListener<RefundFormBloc, RefundFormState>(
listenWhen: (p, c) => p.failureOrRefund != c.failureOrRefund,
listener: (context, state) {
state.failureOrRefund.fold(
() {},
(either) => either.fold(
(f) => AppFlushbar.showOrderFailureToast(context, f),
(data) {
if (context.mounted) {
context.router.replace(RefundSuccessRoute(orderId: order.id));
}
},
),
);
},
child: Scaffold(
backgroundColor: AppColor.background,
body: SafeArea(
child: BlocBuilder<RefundFormBloc, RefundFormState>(
builder: (context, state) {
return Row(
children: [
Expanded(flex: 2, child: RefundLeftPanel(state: state)),
Expanded(flex: 4, child: RefundRightPanel(state: state)),
],
);
},
),
),
),
);
}
@override
Widget wrappedRoute(BuildContext context) => BlocProvider(
create: (_) =>
getIt<RefundFormBloc>()..add(RefundFormEvent.setOrder(order)),
child: this,
);
}
lib/presentation/pages/refund/widgets/refund_left_panel.dart
+291
View File
@@ -0,0 +1,291 @@
import 'package:flutter/material.dart';
import '../../../../application/refund/refund_form/refund_form_bloc.dart';
import '../../../../common/extension/extension.dart';
import '../../../../common/theme/theme.dart';
import '../../../../domain/order/order.dart';
import '../../../components/border/dashed_border.dart';
import '../../../components/page/page_title.dart';
import '../../../components/spaces/space.dart';
class RefundLeftPanel extends StatelessWidget {
final RefundFormState state;
const RefundLeftPanel({super.key, required this.state});
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(color: AppColor.white),
child: Column(
children: [
PageTitle(title: 'Refund Pesanan', subtitle: state.order.orderNumber),
_buildInfo(),
Expanded(
child: ListView.builder(
padding: EdgeInsets.symmetric(horizontal: 16),
itemCount: state.order.orderItems.length,
itemBuilder: (context, index) {
return _buildOrderItem(state.order.orderItems[index]);
},
),
),
_buildFooterSummary(),
],
),
);
}
Widget _buildOrderItem(OrderItem item) {
return Container(
padding: EdgeInsets.symmetric(vertical: 12),
child: Column(
children: [
Row(
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item.productName,
style: AppStyle.lg.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.textPrimary,
),
),
if (item.productVariantName.isNotEmpty)
Text(
item.productVariantName,
style: AppStyle.md.copyWith(
color: AppColor.textSecondary,
fontStyle: FontStyle.italic,
),
),
Text(
'Qty: ${item.quantity} x Rp ${item.unitPrice.currencyFormatRpV2} ',
style: AppStyle.md.copyWith(
color: AppColor.textSecondary,
),
),
],
),
),
Text(
item.totalPrice.currencyFormatRpV2,
style: AppStyle.lg.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.textPrimary,
),
),
],
),
if ((item.paidQuantity) > 1) ...[
SpaceHeight(6),
Align(
alignment: Alignment.centerRight,
child: Container(
padding: const EdgeInsets.symmetric(
horizontal: 10,
vertical: 4,
),
decoration: BoxDecoration(
color: AppColor.primary.withOpacity(0.2),
borderRadius: BorderRadius.circular(8),
border: Border.all(color: AppColor.primary),
),
child: RichText(
text: TextSpan(
children: [
TextSpan(
text: '${item.paidQuantity} ',
style: AppStyle.sm.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.primary,
),
),
TextSpan(
text: 'dari ',
style: AppStyle.sm.copyWith(color: AppColor.primary),
),
TextSpan(
text: '${item.quantity} ',
style: AppStyle.sm.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.primary,
),
),
TextSpan(
text: 'kuantiti telah dibayar.',
style: AppStyle.sm.copyWith(color: AppColor.primary),
),
],
),
),
),
),
],
],
),
);
}
Container _buildInfo() {
return Container(
padding: const EdgeInsets.all(16.0),
decoration: BoxDecoration(
border: Border(bottom: BorderSide(color: AppColor.border)),
),
child: Column(
children: [
_buildInfoRow(
icon: Icons.person,
label: 'Pemesan',
value: state.order.metadata['customer_name'] ?? "-",
),
const SpaceHeight(4),
_buildInfoRow(
icon: Icons.restaurant_outlined,
label: 'Tipe Pesanan',
value: state.order.orderType,
),
if (state.order.payments.isNotEmpty) ...[
const SpaceHeight(4),
_buildInfoRow(
icon: Icons.wallet_outlined,
label: 'Metode Pembayaran',
value: state.order.payments.first.paymentMethodName,
),
],
if (state.order.tableNumber != "") ...[
const SpaceHeight(4),
_buildInfoRow(
icon: Icons.table_restaurant_outlined,
label: 'No. Meja',
value: state.order.tableNumber,
),
],
const SpaceHeight(4),
_buildInfoRow(
icon: Icons.access_time_rounded,
label: 'Waktu',
value: (state.order.createdAt).toFormattedDateTime(),
),
],
),
);
}
Container _buildFooterSummary() {
return Container(
padding: EdgeInsets.all(16),
decoration: BoxDecoration(
border: Border(top: BorderSide(color: AppColor.border)),
),
child: Column(
children: [
_buildSummaryItem(
title: 'Subtotal',
value: state.order.subtotal.currencyFormatRpV2,
),
SpaceHeight(4),
_buildSummaryItem(
title: 'Pajak',
value: state.order.taxAmount.currencyFormatRpV2,
),
SpaceHeight(4),
_buildSummaryItem(
title: 'Diskon',
value: state.order.discountAmount.currencyFormatRpV2,
),
SpaceHeight(8),
DashedDivider(color: AppColor.border),
SpaceHeight(8),
_buildSummaryItem(
title: 'Total Dibayar',
value: state.order.totalAmount.currencyFormatRpV2,
isTotal: true,
),
],
),
);
}
Widget _buildInfoRow({
required IconData icon,
required String label,
required String value,
Color? valueColor,
bool showBadge = false,
}) {
return Row(
children: [
Icon(icon, size: 18, color: AppColor.primary),
const SizedBox(width: 12),
Expanded(
child: Text(
label,
style: AppStyle.md.copyWith(color: AppColor.textPrimary),
),
),
if (showBadge && valueColor != null)
Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: valueColor.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(Icons.check_circle, size: 14, color: valueColor),
const SizedBox(width: 4),
Text(
value,
style: AppStyle.sm.copyWith(
fontWeight: FontWeight.bold,
color: valueColor,
),
),
],
),
)
else
Text(
value,
style: AppStyle.md.copyWith(
fontWeight: FontWeight.bold,
color: valueColor ?? AppColor.primary,
),
),
],
);
}
Row _buildSummaryItem({
required String title,
required String value,
bool isTotal = false,
}) {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
title,
style: AppStyle.md.copyWith(
fontSize: isTotal ? 16 : 14,
color: isTotal ? AppColor.primary : AppColor.textSecondary,
fontWeight: isTotal ? FontWeight.bold : FontWeight.w500,
),
),
Text(
value,
style: AppStyle.md.copyWith(
fontSize: isTotal ? 16 : 14,
color: isTotal ? AppColor.primary : AppColor.textSecondary,
fontWeight: isTotal ? FontWeight.bold : FontWeight.w600,
),
),
],
);
}
}
lib/presentation/pages/refund/widgets/refund_reasong_tile.dart
+54
View File
@@ -0,0 +1,54 @@
import 'package:flutter/material.dart';
import '../../../../common/data/refund_data.dart';
import '../../../components/spaces/space.dart';
class RefundReasonTile extends StatelessWidget {
final bool isSelected;
final RefundReason reason;
final Function() onTap;
const RefundReasonTile({
super.key,
required this.isSelected,
required this.reason,
required this.onTap,
});
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: onTap,
child: AnimatedContainer(
duration: Duration(milliseconds: 300),
decoration: BoxDecoration(
color: isSelected ? reason.color.withOpacity(0.2) : Colors.grey[100],
borderRadius: BorderRadius.circular(16),
border: Border.all(
color: isSelected ? reason.color : Colors.transparent,
width: 2,
),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
reason.icon,
color: isSelected ? reason.color : Colors.grey[600],
size: 20,
),
SpaceHeight(4),
Text(
reason.value,
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w600,
color: isSelected ? reason.color : Colors.grey[600],
),
textAlign: TextAlign.center,
),
],
),
),
);
}
}
lib/presentation/pages/refund/widgets/refund_right_panel.dart
+182
View File
@@ -0,0 +1,182 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../../../application/refund/refund_form/refund_form_bloc.dart';
import '../../../../common/data/refund_data.dart';
import '../../../../common/extension/extension.dart';
import '../../../../common/theme/theme.dart';
import '../../../components/border/dashed_border.dart';
import '../../../components/button/button.dart';
import '../../../components/field/field.dart';
import '../../../components/spaces/space.dart';
import '../../../components/toast/flushbar.dart';
import 'refund_reasong_tile.dart';
class RefundRightPanel extends StatefulWidget {
final RefundFormState state;
const RefundRightPanel({super.key, required this.state});
@override
State<RefundRightPanel> createState() => _RefundRightPanelState();
}
class _RefundRightPanelState extends State<RefundRightPanel> {
TextEditingController reasonController = TextEditingController();
@override
void initState() {
super.initState();
reasonController.addListener(() {
context.read<RefundFormBloc>().add(
RefundFormEvent.reasonChanged(reasonController.text),
);
});
}
@override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: SingleChildScrollView(
padding: EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Konfigurasi Refund',
style: AppStyle.h5.copyWith(
fontWeight: FontWeight.bold,
color: AppColor.textPrimary,
),
),
SpaceHeight(16),
Container(
width: context.deviceWidth,
padding: EdgeInsets.all(16),
decoration: BoxDecoration(
color: AppColor.white,
borderRadius: BorderRadius.circular(16),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Pilih Alasan Refund',
style: AppStyle.lg.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.primary,
),
),
SpaceHeight(8),
GridView.builder(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3,
crossAxisSpacing: 12,
mainAxisSpacing: 12,
childAspectRatio: 2.5,
),
itemCount: refundReasons.length,
itemBuilder: (context, index) {
final reason = refundReasons[index];
final isSelected =
widget.state.refundReason == reason;
return RefundReasonTile(
isSelected: isSelected,
reason: reason,
onTap: () {
context.read<RefundFormBloc>().add(
RefundFormEvent.refundReasonChanged(reason),
);
},
);
},
),
if (widget.state.refundReason != null &&
widget.state.refundReason!.value == 'Lainnya') ...[
SpaceHeight(8),
AppTextFormField(
label: 'Masukkan Alasan',
controller: reasonController,
showLabel: false,
maxLines: 3,
),
],
],
),
),
],
),
),
),
_buildBottom(),
],
);
}
Widget _buildBottom() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(color: AppColor.white),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Total Refund',
style: AppStyle.lg.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.primary,
),
),
Text(
widget.state.order.totalAmount.currencyFormatRpV2,
style: AppStyle.lg.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.primary,
),
),
],
),
SpaceHeight(8),
DashedDivider(color: AppColor.border),
SpaceHeight(16),
Row(
children: [
Expanded(
child: AppElevatedButton.outlined(
onPressed: () => context.router.maybePop(),
label: 'Batal',
),
),
SpaceWidth(16),
Expanded(
child: AppElevatedButton.filled(
onPressed: () {
if (widget.state.refundReason == null) {
AppFlushbar.showError(context, 'Pilih alasan refund');
return;
}
context.read<RefundFormBloc>().add(
const RefundFormEvent.submitted(),
);
},
isLoading: widget.state.isSubmitting,
label: 'Konfirmasi Refund',
),
),
],
),
],
),
);
}
}