progress on batches
This commit is contained in:
478
lib/screens/groups/batch_create_screen.dart
Normal file
478
lib/screens/groups/batch_create_screen.dart
Normal file
@@ -0,0 +1,478 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:qpay/screens/groups/models/group_batch_model.dart';
|
||||
import 'package:qpay/screens/groups/models/recipient_group_model.dart';
|
||||
import 'package:qpay/models/responsive_policy.dart';
|
||||
import 'package:qpay/screens/groups/controllers/batch_controller.dart';
|
||||
import 'package:qpay/screens/home/home_controller.dart';
|
||||
import 'package:qpay/screens/pay/pay_controller.dart';
|
||||
import 'package:shared_preferences/shared_preferences.dart';
|
||||
|
||||
class BatchCreateScreen extends StatefulWidget {
|
||||
final RecipientGroup group;
|
||||
|
||||
const BatchCreateScreen({super.key, required this.group});
|
||||
|
||||
@override
|
||||
State<BatchCreateScreen> createState() => _BatchCreateScreenState();
|
||||
}
|
||||
|
||||
class _BatchCreateScreenState extends State<BatchCreateScreen> {
|
||||
late BatchController controller;
|
||||
final _formKey = GlobalKey<FormState>();
|
||||
final _descriptionController = TextEditingController();
|
||||
final _amountController = TextEditingController();
|
||||
final _debitPhoneController = TextEditingController();
|
||||
String _currency = 'USD';
|
||||
bool _loadingDropdowns = true;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
controller = BatchController(context);
|
||||
_init();
|
||||
}
|
||||
|
||||
Future<void> _init() async {
|
||||
final prefs = await SharedPreferences.getInstance();
|
||||
if (prefs.containsKey('phone')) {
|
||||
_debitPhoneController.text = prefs.getString('phone')!;
|
||||
}
|
||||
await Future.wait([controller.loadProviders()]);
|
||||
if (mounted) setState(() => _loadingDropdowns = false);
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
controller.dispose();
|
||||
_descriptionController.dispose();
|
||||
_amountController.dispose();
|
||||
_debitPhoneController.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
Future<void> _submit() async {
|
||||
if (!_formKey.currentState!.validate()) return;
|
||||
|
||||
final selectedProvider = controller.model.selectedProvider;
|
||||
|
||||
if (selectedProvider == null) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(content: Text('Please select a bill provider.')),
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
final amount = double.tryParse(_amountController.text.trim());
|
||||
if (amount == null || amount <= 0) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(content: Text('Please enter a valid amount.')),
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
final prefs = await SharedPreferences.getInstance();
|
||||
final userId = prefs.getString('userId') ?? '';
|
||||
|
||||
final transactionTemplate = <String, dynamic>{
|
||||
'type': 'CONFIRM',
|
||||
'billClientId': selectedProvider.clientId,
|
||||
'debitPhone': _debitPhoneController.text.trim(),
|
||||
'debitRef': 'Velocity',
|
||||
'debitCurrency': _currency,
|
||||
'billName': selectedProvider.name,
|
||||
'providerImage': selectedProvider.image,
|
||||
'providerLabel': selectedProvider.label,
|
||||
'creditName': '',
|
||||
'creditEmail': '',
|
||||
'productUid': '',
|
||||
'billProductName': '',
|
||||
'region': 'ZW',
|
||||
};
|
||||
|
||||
final req = CreateBatchRequest(
|
||||
recipientGroupId: widget.group.id ?? '',
|
||||
userId: userId,
|
||||
currency: _currency,
|
||||
description: _descriptionController.text.trim(),
|
||||
amount: amount,
|
||||
transactionTemplate: transactionTemplate,
|
||||
);
|
||||
|
||||
final result = await controller.createBatch(req);
|
||||
if (!mounted) return;
|
||||
|
||||
if (result.isSuccess) {
|
||||
final batch = result.data!;
|
||||
context.pushReplacement('/groups/${widget.group.id}/batches/${batch.id}');
|
||||
} else {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(content: Text(result.error ?? 'Failed to create batch.')),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
appBar: AppBar(title: const Text('New Batch'), centerTitle: true),
|
||||
body: ListenableBuilder(
|
||||
listenable: controller,
|
||||
builder: (context, _) {
|
||||
if (_loadingDropdowns) {
|
||||
return const Center(child: CircularProgressIndicator());
|
||||
}
|
||||
return Center(
|
||||
child: LayoutBuilder(
|
||||
builder: (context, constraints) {
|
||||
final width = constraints.maxWidth > ResponsivePolicy.md
|
||||
? ResponsivePolicy.md.toDouble()
|
||||
: constraints.maxWidth;
|
||||
return SizedBox(
|
||||
width: width,
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(20),
|
||||
child: Form(
|
||||
key: _formKey,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
_buildSectionLabel('Bill Provider'),
|
||||
const SizedBox(height: 8),
|
||||
_buildProviderGrid(constraints),
|
||||
const SizedBox(height: 16),
|
||||
TextFormField(
|
||||
controller: _descriptionController,
|
||||
textInputAction: TextInputAction.next,
|
||||
decoration: InputDecoration(
|
||||
labelText: 'Description (optional)',
|
||||
hintText: 'e.g. Monthly salaries for January',
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 2,
|
||||
child: TextFormField(
|
||||
controller: _amountController,
|
||||
keyboardType:
|
||||
const TextInputType.numberWithOptions(
|
||||
decimal: true,
|
||||
),
|
||||
textInputAction: TextInputAction.next,
|
||||
decoration: InputDecoration(
|
||||
labelText:
|
||||
'Amount each recipient will receive',
|
||||
hintText: 'Amount',
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
),
|
||||
validator: (v) =>
|
||||
(v == null || v.trim().isEmpty)
|
||||
? 'Required'
|
||||
: null,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: DropdownButtonFormField<String>(
|
||||
value: _currency,
|
||||
decoration: InputDecoration(
|
||||
labelText: 'Currency',
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
),
|
||||
items: const [
|
||||
DropdownMenuItem(
|
||||
value: 'USD',
|
||||
child: Text('USD'),
|
||||
),
|
||||
DropdownMenuItem(
|
||||
value: 'ZWG',
|
||||
child: Text('ZWG'),
|
||||
),
|
||||
],
|
||||
onChanged: (v) {
|
||||
if (v != null)
|
||||
setState(() => _currency = v);
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
TextFormField(
|
||||
controller: _debitPhoneController,
|
||||
keyboardType: TextInputType.phone,
|
||||
textInputAction: TextInputAction.done,
|
||||
decoration: InputDecoration(
|
||||
labelText: 'Your Phone Number',
|
||||
hintText: '263773000000',
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
),
|
||||
validator: (v) => (v == null || v.trim().isEmpty)
|
||||
? 'Phone number is required'
|
||||
: null,
|
||||
),
|
||||
const SizedBox(height: 32),
|
||||
ElevatedButton(
|
||||
onPressed: controller.model.isActing
|
||||
? null
|
||||
: _submit,
|
||||
style: ElevatedButton.styleFrom(
|
||||
padding: const EdgeInsets.symmetric(vertical: 16),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
),
|
||||
child: controller.model.isActing
|
||||
? const SizedBox(
|
||||
height: 20,
|
||||
width: 20,
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 2,
|
||||
color: Colors.white,
|
||||
),
|
||||
)
|
||||
: const Text(
|
||||
'Create Batch',
|
||||
style: TextStyle(fontSize: 16),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSectionLabel(String text) {
|
||||
return Text(
|
||||
text,
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.grey.shade700,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
static const Map<String, Color> _categoryColorMap = {
|
||||
'ECONET': Color(0xFF1A73E8),
|
||||
'NETONE': Color.fromARGB(255, 230, 127, 0),
|
||||
'TELECEL': Color(0xFF7B1FA2),
|
||||
'ZESA': Color.fromARGB(255, 230, 58, 0),
|
||||
};
|
||||
|
||||
Color _resolveProviderColor(BillProvider provider) {
|
||||
final exact = _categoryColorMap[provider.category.toUpperCase()];
|
||||
if (exact != null) return exact;
|
||||
|
||||
final labelMatch = _categoryColorMap[provider.label.toUpperCase()];
|
||||
if (labelMatch != null) return labelMatch;
|
||||
|
||||
final name = provider.name.toUpperCase();
|
||||
for (final entry in _categoryColorMap.entries) {
|
||||
if (name.contains(entry.key)) return entry.value;
|
||||
}
|
||||
|
||||
final hash = provider.clientId.hashCode;
|
||||
final hue = (hash % 360).toDouble();
|
||||
return HSVColor.fromAHSV(1.0, hue, 0.75, 0.85).toColor();
|
||||
}
|
||||
|
||||
Widget _buildProviderGrid(BoxConstraints constraints) {
|
||||
if (controller.model.providers.isEmpty) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(color: Colors.black26),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Text(
|
||||
'No providers available',
|
||||
style: TextStyle(color: Colors.grey.shade600),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
final isDark = Theme.of(context).brightness == Brightness.dark;
|
||||
|
||||
return LayoutBuilder(
|
||||
builder: (context, gridConstraints) {
|
||||
// gridConstraints.maxWidth reflects the actual rendered width of this widget
|
||||
// 3-column grid: subtract 2 gaps (10*2 = 20), then divide by 3
|
||||
final cardWidth = (gridConstraints.maxWidth - 20) / 3;
|
||||
|
||||
return Wrap(
|
||||
spacing: 10,
|
||||
runSpacing: 10,
|
||||
children: controller.model.providers
|
||||
.map(
|
||||
(provider) => _buildProviderCard(provider, isDark, cardWidth),
|
||||
)
|
||||
.toList(),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildProviderCard(BillProvider provider, bool isDark, double width) {
|
||||
final isSelected =
|
||||
controller.model.selectedProvider?.clientId == provider.clientId;
|
||||
final accent = _resolveProviderColor(provider);
|
||||
|
||||
return SizedBox(
|
||||
width: width,
|
||||
child: Material(
|
||||
color: Colors.transparent,
|
||||
child: InkWell(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
onTap: () => controller.selectProvider(provider),
|
||||
child: AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 200),
|
||||
padding: const EdgeInsets.all(10),
|
||||
decoration: BoxDecoration(
|
||||
color: isDark ? const Color(0xFF1E1E1E) : Colors.white,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(
|
||||
color: isSelected
|
||||
? accent
|
||||
: isDark
|
||||
? Colors.white.withValues(alpha: 0.1)
|
||||
: Colors.black.withValues(alpha: 0.06),
|
||||
width: isSelected ? 1.5 : 1,
|
||||
),
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
width: 28,
|
||||
height: 28,
|
||||
padding: const EdgeInsets.all(2),
|
||||
decoration: BoxDecoration(
|
||||
color: accent.withValues(alpha: 0.12),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Image(
|
||||
image: AssetImage("assets/${provider.image}"),
|
||||
errorBuilder: (_, __, ___) => Icon(
|
||||
Icons.payment_rounded,
|
||||
size: 14,
|
||||
color: accent,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
provider.name,
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: isDark ? Colors.white : Colors.black87,
|
||||
),
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
const SizedBox(height: 2),
|
||||
Text(
|
||||
provider.description,
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.w400,
|
||||
color: isDark ? Colors.white54 : Colors.grey.shade500,
|
||||
height: 1.3,
|
||||
),
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
],
|
||||
),
|
||||
if (isSelected)
|
||||
Positioned(
|
||||
top: -2,
|
||||
right: -2,
|
||||
child: Container(
|
||||
width: 18,
|
||||
height: 18,
|
||||
decoration: BoxDecoration(
|
||||
color: accent,
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(
|
||||
color: isDark
|
||||
? const Color(0xFF1E1E1E)
|
||||
: Colors.white,
|
||||
width: 1.5,
|
||||
),
|
||||
),
|
||||
child: const Icon(
|
||||
Icons.check_rounded,
|
||||
size: 11,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildProcessorDropdown() {
|
||||
if (controller.model.processors.isEmpty) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(color: Colors.black26),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Text(
|
||||
'No processors available',
|
||||
style: TextStyle(color: Colors.grey.shade600),
|
||||
),
|
||||
);
|
||||
}
|
||||
return DropdownButtonFormField<PaymentProcessor>(
|
||||
value: controller.model.selectedProcessor,
|
||||
isExpanded: true,
|
||||
decoration: InputDecoration(
|
||||
border: OutlineInputBorder(borderRadius: BorderRadius.circular(12)),
|
||||
),
|
||||
items: controller.model.processors
|
||||
.map(
|
||||
(p) => DropdownMenuItem(
|
||||
value: p,
|
||||
child: Text(p.name, overflow: TextOverflow.ellipsis),
|
||||
),
|
||||
)
|
||||
.toList(),
|
||||
onChanged: (p) {
|
||||
if (p != null) controller.selectProcessor(p);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user