solyanka iz fix for payout page design, ledger wallet now clickable
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/gestures.dart';
|
||||
|
||||
import 'package:pshared/models/ledger/account.dart';
|
||||
import 'package:pshared/models/payment/wallet.dart';
|
||||
|
||||
import 'package:pweb/pages/dashboard/buttons/balance/add/card.dart';
|
||||
@@ -10,13 +11,13 @@ import 'package:pweb/pages/dashboard/buttons/balance/config.dart';
|
||||
import 'package:pweb/pages/dashboard/buttons/balance/indicator.dart';
|
||||
import 'package:pweb/pages/dashboard/buttons/balance/ledger.dart';
|
||||
|
||||
|
||||
class BalanceCarousel extends StatefulWidget {
|
||||
final List<BalanceItem> items;
|
||||
final int currentIndex;
|
||||
final ValueChanged<int> onIndexChanged;
|
||||
final ValueChanged<Wallet> onTopUp;
|
||||
final ValueChanged<Wallet> onWalletTap;
|
||||
final ValueChanged<LedgerAccount> onLedgerTap;
|
||||
|
||||
const BalanceCarousel({
|
||||
super.key,
|
||||
@@ -25,6 +26,7 @@ class BalanceCarousel extends StatefulWidget {
|
||||
required this.onIndexChanged,
|
||||
required this.onTopUp,
|
||||
required this.onWalletTap,
|
||||
required this.onLedgerTap,
|
||||
});
|
||||
|
||||
@override
|
||||
@@ -105,7 +107,10 @@ class _BalanceCarouselState extends State<BalanceCarousel> {
|
||||
onTopUp: () => widget.onTopUp(item.wallet!),
|
||||
onTap: () => widget.onWalletTap(item.wallet!),
|
||||
),
|
||||
BalanceItemType.ledger => LedgerAccountCard(account: item.account!),
|
||||
BalanceItemType.ledger => LedgerAccountCard(
|
||||
account: item.account!,
|
||||
onTap: () => widget.onLedgerTap(item.account!),
|
||||
),
|
||||
BalanceItemType.addAction => const AddBalanceCard(),
|
||||
};
|
||||
|
||||
@@ -123,19 +128,16 @@ class _BalanceCarouselState extends State<BalanceCarousel> {
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: safeIndex > 0
|
||||
? () => _goToPage(safeIndex - 1)
|
||||
: null,
|
||||
onPressed: safeIndex > 0 ? () => _goToPage(safeIndex - 1) : null,
|
||||
icon: const Icon(Icons.arrow_back),
|
||||
),
|
||||
const SizedBox(width: 16),
|
||||
CarouselIndicator(
|
||||
itemCount: widget.items.length,
|
||||
index: safeIndex,
|
||||
),
|
||||
CarouselIndicator(itemCount: widget.items.length, index: safeIndex),
|
||||
const SizedBox(width: 16),
|
||||
IconButton(
|
||||
onPressed: safeIndex < widget.items.length - 1 ? () => _goToPage(safeIndex + 1) : null,
|
||||
onPressed: safeIndex < widget.items.length - 1
|
||||
? () => _goToPage(safeIndex + 1)
|
||||
: null,
|
||||
icon: const Icon(Icons.arrow_forward),
|
||||
),
|
||||
],
|
||||
|
||||
@@ -16,8 +16,9 @@ import 'package:pweb/generated/i18n/app_localizations.dart';
|
||||
|
||||
class LedgerAccountCard extends StatelessWidget {
|
||||
final LedgerAccount account;
|
||||
final VoidCallback? onTap;
|
||||
|
||||
const LedgerAccountCard({super.key, required this.account});
|
||||
const LedgerAccountCard({super.key, required this.account, this.onTap});
|
||||
|
||||
String _formatBalance() {
|
||||
final money = account.balance?.balance;
|
||||
@@ -73,50 +74,58 @@ class LedgerAccountCard extends StatelessWidget {
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(WalletCardConfig.borderRadius),
|
||||
),
|
||||
child: Padding(
|
||||
padding: WalletCardConfig.contentPadding,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
BalanceHeader(title: title, subtitle: subtitle, badge: badge),
|
||||
Row(
|
||||
children: [
|
||||
Consumer<LedgerBalanceMaskController>(
|
||||
builder: (context, controller, _) {
|
||||
final isMasked = controller.isBalanceMasked(
|
||||
account.ledgerAccountRef,
|
||||
);
|
||||
return Row(
|
||||
children: [
|
||||
Text(
|
||||
isMasked ? _formatMaskedBalance() : _formatBalance(),
|
||||
style: textTheme.headlineSmall?.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: colorScheme.onSurface,
|
||||
child: InkWell(
|
||||
borderRadius: BorderRadius.circular(WalletCardConfig.borderRadius),
|
||||
onTap: onTap,
|
||||
child: Padding(
|
||||
padding: WalletCardConfig.contentPadding,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
BalanceHeader(title: title, subtitle: subtitle, badge: badge),
|
||||
Row(
|
||||
children: [
|
||||
Consumer<LedgerBalanceMaskController>(
|
||||
builder: (context, controller, _) {
|
||||
final isMasked = controller.isBalanceMasked(
|
||||
account.ledgerAccountRef,
|
||||
);
|
||||
return Row(
|
||||
children: [
|
||||
Text(
|
||||
isMasked
|
||||
? _formatMaskedBalance()
|
||||
: _formatBalance(),
|
||||
style: textTheme.headlineSmall?.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: colorScheme.onSurface,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
GestureDetector(
|
||||
onTap: () => controller.toggleBalanceMask(
|
||||
account.ledgerAccountRef,
|
||||
const SizedBox(width: 12),
|
||||
GestureDetector(
|
||||
onTap: () => controller.toggleBalanceMask(
|
||||
account.ledgerAccountRef,
|
||||
),
|
||||
child: Icon(
|
||||
isMasked
|
||||
? Icons.visibility_off
|
||||
: Icons.visibility,
|
||||
size: 24,
|
||||
color: colorScheme.onSurface,
|
||||
),
|
||||
),
|
||||
child: Icon(
|
||||
isMasked ? Icons.visibility_off : Icons.visibility,
|
||||
size: 24,
|
||||
color: colorScheme.onSurface,
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
LedgerBalanceRefreshButton(
|
||||
ledgerAccountRef: account.ledgerAccountRef,
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
],
|
||||
);
|
||||
},
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
LedgerBalanceRefreshButton(
|
||||
ledgerAccountRef: account.ledgerAccountRef,
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import 'package:pshared/controllers/balance_mask/wallets.dart';
|
||||
import 'package:pshared/models/ledger/account.dart';
|
||||
import 'package:pshared/provider/ledger.dart';
|
||||
import 'package:pshared/models/payment/wallet.dart';
|
||||
|
||||
@@ -11,14 +12,17 @@ import 'package:pweb/pages/dashboard/buttons/balance/controller.dart';
|
||||
|
||||
import 'package:pweb/generated/i18n/app_localizations.dart';
|
||||
|
||||
|
||||
class BalanceWidget extends StatelessWidget {
|
||||
final ValueChanged<Wallet> onTopUp;
|
||||
final ValueChanged<Wallet> onWalletTap;
|
||||
final ValueChanged<LedgerAccount> onLedgerTap;
|
||||
|
||||
const BalanceWidget({
|
||||
super.key,
|
||||
required this.onTopUp,
|
||||
required this.onWalletTap,
|
||||
required this.onLedgerTap,
|
||||
});
|
||||
|
||||
@override
|
||||
@@ -46,6 +50,7 @@ class BalanceWidget extends StatelessWidget {
|
||||
onIndexChanged: carousel.onPageChanged,
|
||||
onTopUp: onTopUp,
|
||||
onWalletTap: onWalletTap,
|
||||
onLedgerTap: onLedgerTap,
|
||||
);
|
||||
|
||||
if (wallets.isEmpty && accounts.isEmpty) {
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:pshared/models/ledger/account.dart';
|
||||
import 'package:pshared/models/payment/type.dart';
|
||||
import 'package:pshared/models/recipient/recipient.dart';
|
||||
import 'package:pshared/models/payment/wallet.dart';
|
||||
@@ -15,6 +16,7 @@ import 'package:pweb/pages/loader.dart';
|
||||
|
||||
import 'package:pweb/generated/i18n/app_localizations.dart';
|
||||
|
||||
|
||||
class AppSpacing {
|
||||
static const double small = 10;
|
||||
static const double medium = 16;
|
||||
@@ -26,6 +28,7 @@ class DashboardPage extends StatefulWidget {
|
||||
final void Function(PaymentType type) onGoToPaymentWithoutRecipient;
|
||||
final ValueChanged<Wallet> onTopUp;
|
||||
final ValueChanged<Wallet> onWalletTap;
|
||||
final ValueChanged<LedgerAccount> onLedgerTap;
|
||||
|
||||
const DashboardPage({
|
||||
super.key,
|
||||
@@ -33,6 +36,7 @@ class DashboardPage extends StatefulWidget {
|
||||
required this.onGoToPaymentWithoutRecipient,
|
||||
required this.onTopUp,
|
||||
required this.onWalletTap,
|
||||
required this.onLedgerTap,
|
||||
});
|
||||
|
||||
@override
|
||||
@@ -87,6 +91,7 @@ class _DashboardPageState extends State<DashboardPage> {
|
||||
child: BalanceWidget(
|
||||
onTopUp: widget.onTopUp,
|
||||
onWalletTap: widget.onWalletTap,
|
||||
onLedgerTap: widget.onLedgerTap,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: AppSpacing.small),
|
||||
|
||||
@@ -10,6 +10,7 @@ import 'package:pweb/pages/dashboard/payouts/amount/mode/selector.dart';
|
||||
|
||||
import 'package:pweb/generated/i18n/app_localizations.dart';
|
||||
|
||||
|
||||
class PaymentAmountField extends StatelessWidget {
|
||||
const PaymentAmountField();
|
||||
|
||||
@@ -37,10 +38,6 @@ class PaymentAmountField extends StatelessWidget {
|
||||
labelText: loc.amount,
|
||||
border: const OutlineInputBorder(),
|
||||
prefixText: symbol == null ? null : '$symbol\u00A0',
|
||||
helperText: switch (ui.mode) {
|
||||
PaymentAmountMode.debit => loc.debitAmountLabel,
|
||||
PaymentAmountMode.settlement => loc.expectedSettlementAmountLabel,
|
||||
},
|
||||
),
|
||||
onChanged: ui.handleChanged,
|
||||
),
|
||||
|
||||
@@ -102,7 +102,7 @@ class PaymentFormWidget extends StatelessWidget {
|
||||
children: [
|
||||
detailsHeader,
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.end,
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 3,
|
||||
@@ -114,7 +114,7 @@ class PaymentFormWidget extends StatelessWidget {
|
||||
),
|
||||
const SizedBox(height: _smallSpacing),
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 3,
|
||||
|
||||
@@ -26,15 +26,18 @@ class QuoteStatusCard extends StatelessWidget {
|
||||
});
|
||||
|
||||
static const double _cardRadius = 12;
|
||||
static const double _cardSpacing = 12;
|
||||
static const double _cardSpacing = 8;
|
||||
static const double _iconSize = 18;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final loc = AppLocalizations.of(context)!;
|
||||
final foregroundColor = _resolveForegroundColor(theme, statusType);
|
||||
final elementColor = _resolveElementColor(theme, statusType);
|
||||
final statusStyle = theme.textTheme.bodyMedium?.copyWith(color: elementColor);
|
||||
final statusStyle = theme.textTheme.bodyMedium?.copyWith(
|
||||
color: elementColor,
|
||||
);
|
||||
final helperStyle = theme.textTheme.bodySmall?.copyWith(
|
||||
color: foregroundColor.withValues(alpha: 0.8),
|
||||
);
|
||||
@@ -44,12 +47,10 @@ class QuoteStatusCard extends StatelessWidget {
|
||||
decoration: BoxDecoration(
|
||||
color: _resolveCardColor(theme, statusType),
|
||||
borderRadius: BorderRadius.circular(_cardRadius),
|
||||
border: Border.all(
|
||||
color: elementColor.withValues(alpha: 0.5),
|
||||
),
|
||||
border: Border.all(color: elementColor.withValues(alpha: 0.5)),
|
||||
),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(top: 2),
|
||||
@@ -59,7 +60,9 @@ class QuoteStatusCard extends StatelessWidget {
|
||||
height: _iconSize,
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 2,
|
||||
valueColor: AlwaysStoppedAnimation<Color>(foregroundColor),
|
||||
valueColor: AlwaysStoppedAnimation<Color>(
|
||||
foregroundColor,
|
||||
),
|
||||
),
|
||||
)
|
||||
: Icon(
|
||||
@@ -81,19 +84,15 @@ class QuoteStatusCard extends StatelessWidget {
|
||||
],
|
||||
),
|
||||
),
|
||||
if (canRefresh)
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(left: _cardSpacing),
|
||||
child: showPrimaryRefresh
|
||||
? ElevatedButton(
|
||||
onPressed: canRefresh ? onRefresh : null,
|
||||
child: Text(AppLocalizations.of(context)!.quoteRefresh),
|
||||
)
|
||||
: TextButton(
|
||||
onPressed: canRefresh ? onRefresh : null,
|
||||
child: Text(AppLocalizations.of(context)!.quoteRefresh),
|
||||
),
|
||||
if (canRefresh) ...[
|
||||
const SizedBox(width: _cardSpacing),
|
||||
IconButton(
|
||||
onPressed: onRefresh,
|
||||
tooltip: loc.quoteRefresh,
|
||||
icon: const Icon(Icons.refresh),
|
||||
color: showPrimaryRefresh ? foregroundColor : elementColor,
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user