solyanka iz fix for payout page design, ledger wallet now clickable

This commit is contained in:
Arseni
2026-03-05 15:48:52 +03:00
parent a9b00b6871
commit d6a3a0cc5b
31 changed files with 596 additions and 370 deletions

View File

@@ -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),
),
],

View File

@@ -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,
),
],
),
],
),
),
),
);

View File

@@ -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) {

View File

@@ -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),

View File

@@ -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,
),

View File

@@ -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,

View File

@@ -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,
),
],
],
),
);