add account, checkout page

2025-11-03 15:54:51 +07:00
parent d8e3ca4c46
commit c689f967d5
16 changed files with 2319 additions and 8 deletions
--- a/lib/features/cart/presentation/widgets/payment_method_section.dart
+++ b/lib/features/cart/presentation/widgets/payment_method_section.dart
@@ -0,0 +1,134 @@
+/// Payment Method Section Widget
+///
+/// Payment method selection (Bank Transfer or COD).
+library;
+
+import 'package:flutter/material.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
+import 'package:worker/core/constants/ui_constants.dart';
+import 'package:worker/core/theme/colors.dart';
+
+/// Payment Method Section
+///
+/// Allows user to select payment method between bank transfer and COD.
+class PaymentMethodSection extends HookWidget {
+  final ValueNotifier<String> paymentMethod;
+
+  const PaymentMethodSection({
+    super.key,
+    required this.paymentMethod,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      margin: const EdgeInsets.symmetric(horizontal: AppSpacing.md),
+      padding: const EdgeInsets.all(AppSpacing.md),
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.circular(AppRadius.card),
+        boxShadow: [
+          BoxShadow(
+            color: Colors.black.withValues(alpha: 0.05),
+            blurRadius: 8,
+            offset: const Offset(0, 2),
+          ),
+        ],
+      ),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          // Section Title
+          const Text(
+            'Phương thức thanh toán',
+            style: TextStyle(
+              fontSize: 18,
+              fontWeight: FontWeight.bold,
+              color: Color(0xFF212121),
+            ),
+          ),
+
+          const SizedBox(height: AppSpacing.md),
+
+          // Bank Transfer Option
+          InkWell(
+            onTap: () => paymentMethod.value = 'bank_transfer',
+            child: Padding(
+              padding: const EdgeInsets.symmetric(vertical: 8),
+              child: Row(
+                children: [
+                  Radio<String>(
+                    value: 'bank_transfer',
+                    groupValue: paymentMethod.value,
+                    onChanged: (value) {
+                      paymentMethod.value = value!;
+                    },
+                    activeColor: AppColors.primaryBlue,
+                  ),
+                  const Expanded(
+                    child: Column(
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        Text(
+                          'Chuyển khoản ngân hàng',
+                          style: TextStyle(
+                              fontSize: 15, fontWeight: FontWeight.w500),
+                        ),
+                        SizedBox(height: 4),
+                        Text(
+                          'Thanh toán qua chuyển khoản',
+                          style:
+                              TextStyle(fontSize: 13, color: AppColors.grey500),
+                        ),
+                      ],
+                    ),
+                  ),
+                ],
+              ),
+            ),
+          ),
+
+          const Divider(height: 1),
+
+          // COD Option
+          InkWell(
+            onTap: () => paymentMethod.value = 'cod',
+            child: Padding(
+              padding: const EdgeInsets.symmetric(vertical: 8),
+              child: Row(
+                children: [
+                  Radio<String>(
+                    value: 'cod',
+                    groupValue: paymentMethod.value,
+                    onChanged: (value) {
+                      paymentMethod.value = value!;
+                    },
+                    activeColor: AppColors.primaryBlue,
+                  ),
+                  const Expanded(
+                    child: Column(
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        Text(
+                          'Thanh toán khi nhận hàng (COD)',
+                          style: TextStyle(
+                              fontSize: 15, fontWeight: FontWeight.w500),
+                        ),
+                        SizedBox(height: 4),
+                        Text(
+                          'Thanh toán bằng tiền mặt khi nhận hàng',
+                          style:
+                              TextStyle(fontSize: 13, color: AppColors.grey500),
+                        ),
+                      ],
+                    ),
+                  ),
+                ],
+              ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}