renolation/worker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update gen qr

Browse Source
This commit is contained in:
Phuoc Nguyen
2025-11-21 17:31:49 +07:00
parent 4913a4e04b
commit 06b0834822
8 changed files with 192 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
lib/features/orders/presentation/pages/payment_qr_page.dart
View File

@@ -17,9 +17,11 @@ import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:go_router/go_router.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:qr_flutter/qr_flutter.dart';
import 'package:worker/core/constants/ui_constants.dart';
import 'package:worker/core/theme/colors.dart';
import 'package:worker/features/orders/presentation/providers/order_repository_provider.dart';
/// Payment QR Page
///
@@ -28,14 +30,43 @@ class PaymentQrPage extends HookConsumerWidget {
final String orderId;
final double amount;
const PaymentQrPage({super.key, required this.orderId, required this.amount});
const PaymentQrPage({
super.key,
required this.orderId,
required this.amount,
});
@override
Widget build(BuildContext context, WidgetRef ref) {
// QR code data state
final qrCodeData = useState<Map<String, dynamic>?>(null);
final isLoadingQr = useState<bool>(true);
final qrError = useState<String?>(null);
// Countdown timer (15 minutes = 900 seconds)
final remainingSeconds = useState<int>(900);
final timer = useRef<Timer?>(null);
// Fetch QR code data
useEffect(() {
Future<void> fetchQrCode() async {
try {
isLoadingQr.value = true;
qrError.value = null;
final repository = await ref.read(orderRepositoryProvider.future);
final data = await repository.generateQrCode(orderId);
qrCodeData.value = data;
} catch (e) {
qrError.value = e.toString();
} finally {
isLoadingQr.value = false;
}
}
fetchQrCode();
return null;
}, [orderId]);
// Start countdown timer
useEffect(() {
timer.value = Timer.periodic(const Duration(seconds: 1), (t) {
@@ -94,12 +125,24 @@ class PaymentQrPage extends HookConsumerWidget {
const SizedBox(height: AppSpacing.md),
// QR Code Card
_buildQrCodeCard(amount, orderId),
_buildQrCodeCard(
amount,
orderId,
qrCodeData.value?['qr_code'] as String?,
isLoadingQr.value,
),
const SizedBox(height: AppSpacing.md),
// Bank Transfer Info Card
_buildBankInfoCard(context, orderId),
_buildBankInfoCard(
context,
orderId,
qrCodeData.value?['bank_info']?['bank_name'] as String?,
qrCodeData.value?['bank_info']?['account_no'] as String?,
qrCodeData.value?['bank_info']?['account_name'] as String?,
isLoadingQr.value,
),
const SizedBox(height: AppSpacing.md),
@@ -180,14 +223,12 @@ class PaymentQrPage extends HookConsumerWidget {
}
/// Build QR code card
Widget _buildQrCodeCard(double amount, String orderId) {
// Generate QR code data URL
final qrData = Uri.encodeComponent(
'https://eurotile.com/payment/$orderId?amount=$amount',
);
final qrUrl =
'https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=$qrData';
Widget _buildQrCodeCard(
double amount,
String orderId,
String? qrCodeData,
bool isLoading,
) {
return Container(
margin: const EdgeInsets.symmetric(horizontal: AppSpacing.md),
padding: const EdgeInsets.all(AppSpacing.md),
@@ -222,23 +263,29 @@ class PaymentQrPage extends HookConsumerWidget {
borderRadius: BorderRadius.circular(AppRadius.card),
border: Border.all(color: const Color(0xFFE2E8F0)),
),
child: Image.network(
qrUrl,
fit: BoxFit.contain,
errorBuilder: (context, error, stackTrace) {
return const Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
FaIcon(FontAwesomeIcons.qrcode, size: 80, color: AppColors.grey500),
SizedBox(height: 8),
Text(
'Không thể tải mã QR',
style: TextStyle(fontSize: 12, color: AppColors.grey500),
),
],
);
},
),
child: isLoading
? const Center(
child: CircularProgressIndicator(),
)
: qrCodeData != null && qrCodeData.isNotEmpty
? QrImageView(
data: qrCodeData,
version: QrVersions.auto,
size: 200.0,
backgroundColor: Colors.white,
errorCorrectionLevel: QrErrorCorrectLevel.M,
)
: const Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
FaIcon(FontAwesomeIcons.qrcode, size: 80, color: AppColors.grey500),
SizedBox(height: 8),
Text(
'Không thể tải mã QR',
style: TextStyle(fontSize: 12, color: AppColors.grey500),
),
],
),
),
const SizedBox(height: AppSpacing.md),
const Text(
@@ -252,7 +299,14 @@ class PaymentQrPage extends HookConsumerWidget {
}
/// Build bank transfer info card
Widget _buildBankInfoCard(BuildContext context, String orderId) {
Widget _buildBankInfoCard(
BuildContext context,
String orderId,
String? bankName,
String? accountNo,
String? accountName,
bool isLoading,
) {
return Container(
margin: const EdgeInsets.symmetric(horizontal: AppSpacing.md),
padding: const EdgeInsets.all(AppSpacing.md),
@@ -281,7 +335,11 @@ class PaymentQrPage extends HookConsumerWidget {
const SizedBox(height: AppSpacing.md),
// Bank Name
_buildInfoRow(context: context, label: 'Ngân hàng:', value: 'BIDV'),
_buildInfoRow(
context: context,
label: 'Ngân hàng:',
value: bankName ?? 'BIDV',
),
const Divider(height: 24),
@@ -289,7 +347,7 @@ class PaymentQrPage extends HookConsumerWidget {
_buildInfoRow(
context: context,
label: 'Số tài khoản:',
value: '19036810704016',
value: accountNo ?? '19036810704016',
),
const Divider(height: 24),
@@ -298,7 +356,7 @@ class PaymentQrPage extends HookConsumerWidget {
_buildInfoRow(
context: context,
label: 'Chủ tài khoản:',
value: 'CÔNG TY EUROTILE',
value: accountName ?? 'CÔNG TY EUROTILE',
),
const Divider(height: 24),
@@ -307,7 +365,7 @@ class PaymentQrPage extends HookConsumerWidget {
_buildInfoRow(
context: context,
label: 'Nội dung:',
value: '$orderId La Nguyen Quynh',
value: orderId,
),
const SizedBox(height: AppSpacing.md),