aitorarana
62ffc9ef7c
- created extract, goals and block card screen. - generated tests for design system components. - updated restore password and home screens to 17/11 design.
381 lines
16 KiB
Dart
381 lines
16 KiB
Dart
import 'package:design_system/design_system.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:flutter_svg/svg.dart';
|
|
import 'package:home/src/presentation/deposit_screen.dart';
|
|
import 'package:home/src/presentation/extract_screen.dart';
|
|
import 'package:home/src/presentation/goals_screen.dart';
|
|
import 'package:home/src/presentation/lock_card_screen.dart';
|
|
import 'package:sf_shared/sf_shared.dart';
|
|
import 'package:home/src/presentation/limits_screen.dart';
|
|
import 'package:home/src/presentation/wage_screen.dart';
|
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
|
|
|
class KidWalletScreen extends ConsumerWidget {
|
|
final Kid kid;
|
|
|
|
const KidWalletScreen({super.key, required this.kid});
|
|
|
|
@override
|
|
Widget build(BuildContext context, WidgetRef ref) {
|
|
final theme = ref.watch(themePortProvider);
|
|
final bool locked = false;
|
|
|
|
return Scaffold(
|
|
backgroundColor: theme.getColorFor(ThemeCode.backgroundSecondary),
|
|
body: Stack(
|
|
children: [
|
|
DecoratedBox(
|
|
decoration: BoxDecoration(
|
|
borderRadius: const BorderRadius.only(bottomRight: Radius.circular(24), bottomLeft: Radius.circular(24)),
|
|
gradient: LinearGradient(
|
|
begin: Alignment.topLeft,
|
|
end: Alignment.bottomRight,
|
|
colors: locked? theme.getDisabledCardColors() : theme.getCardColorFor(0)
|
|
)
|
|
),
|
|
child: SizedBox(width: double.infinity, height: 420)
|
|
),
|
|
Container(
|
|
margin: EdgeInsets.symmetric(vertical: 50, horizontal: 20),
|
|
child: Column(
|
|
spacing: 24,
|
|
children: [
|
|
Row(
|
|
spacing: 7,
|
|
children: [
|
|
IconButton(
|
|
onPressed: () => Navigator.pop(context),
|
|
icon: Icon(
|
|
Icons.arrow_back_ios_new_outlined,
|
|
color: theme.getColorFor(ThemeCode.backgroundPrimary),
|
|
size: 24
|
|
)
|
|
),
|
|
SizedBox(
|
|
height: 50,
|
|
child: SvgPicture.asset("assets/images/ui/face.svg")
|
|
),
|
|
Text(
|
|
kid.name,
|
|
style: TextStyle(
|
|
color: theme.getColorFor(ThemeCode.backgroundPrimary),
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 20
|
|
)
|
|
),
|
|
Spacer(),
|
|
SizedBox(
|
|
height: 30,
|
|
child: SvgPicture.asset("assets/images/ui/face.svg")
|
|
)
|
|
]
|
|
),
|
|
Column(
|
|
spacing: 16,
|
|
children: [
|
|
MoneyText(
|
|
text: "${kid.balance.toString()}€",
|
|
size: 60,
|
|
secondarySize: 24,
|
|
color: theme.getColorFor(ThemeCode.textSecondary)
|
|
),
|
|
Text(
|
|
"Saldo disponible",
|
|
style: TextStyle(
|
|
color: theme.getColorFor(ThemeCode.backgroundPrimary)
|
|
)
|
|
),
|
|
LinearProgressIndicator(
|
|
value: 0.7,
|
|
color: theme.getColorFor(ThemeCode.backgroundPrimary),
|
|
backgroundColor: theme
|
|
.getColorFor(ThemeCode.backgroundPrimary)
|
|
.withAlpha(0x4C),
|
|
minHeight: 10,
|
|
borderRadius: BorderRadius.all(Radius.circular(5)),
|
|
),
|
|
TextButton(
|
|
style: ButtonStyle(padding: WidgetStatePropertyAll(EdgeInsets.all(0))),
|
|
onPressed: () => Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => LockCardScreen(kid: kid)
|
|
)
|
|
),
|
|
child: Row(
|
|
spacing: 10,
|
|
children: [
|
|
Icon(Icons.lock_outline, size: 24, color: theme.getColorFor(ThemeCode.textSecondary)),
|
|
locked ?
|
|
Text("Desbloquear tarjeta", style: TextStyle(fontWeight: FontWeight.w500, fontSize: 16, color: theme.getColorFor(ThemeCode.textSecondary))) :
|
|
Text("Bloquear tarjeta", style: TextStyle(fontWeight: FontWeight.w500, fontSize: 16, color: theme.getColorFor(ThemeCode.textSecondary)))
|
|
]
|
|
)
|
|
)
|
|
]
|
|
),
|
|
Column(
|
|
spacing: 16,
|
|
children: [
|
|
Container(
|
|
padding: EdgeInsets.all(16),
|
|
margin: EdgeInsets.only(top: 30),
|
|
decoration: BoxDecoration(
|
|
color: theme.getColorFor(ThemeCode.backgroundPrimary),
|
|
borderRadius: BorderRadius.all(Radius.circular(20))
|
|
),
|
|
child: Expanded(
|
|
child: Center(
|
|
child: Row(
|
|
children: [
|
|
TextButton(
|
|
style: ButtonStyle(padding: WidgetStatePropertyAll(EdgeInsets.all(0))),
|
|
onPressed: () => Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => DepositScreen(kid: kid)
|
|
)
|
|
),
|
|
child: Column(
|
|
spacing: 8,
|
|
children: [
|
|
Icon(
|
|
Icons.add_circle_outline,
|
|
color: theme.getColorFor(
|
|
ThemeCode.textPrimary,
|
|
)
|
|
),
|
|
Text(
|
|
"Añadir",
|
|
style: TextStyle(
|
|
color: theme.getColorFor(
|
|
ThemeCode.textPrimary
|
|
)
|
|
)
|
|
)
|
|
]
|
|
)
|
|
),
|
|
Spacer(),
|
|
TextButton(
|
|
style: ButtonStyle(padding: WidgetStatePropertyAll(EdgeInsets.all(0))),
|
|
onPressed: () => Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => WageScreen(kid: kid),
|
|
),
|
|
),
|
|
child: Column(
|
|
spacing: 10,
|
|
children: [
|
|
Icon(
|
|
Icons.account_balance_wallet_outlined,
|
|
color: theme.getColorFor(
|
|
ThemeCode.textPrimary,
|
|
),
|
|
),
|
|
Text(
|
|
"Paga",
|
|
style: TextStyle(
|
|
color: theme.getColorFor(
|
|
ThemeCode.textPrimary,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
Spacer(),
|
|
TextButton(
|
|
style: ButtonStyle(padding: WidgetStatePropertyAll(EdgeInsets.all(0))),
|
|
onPressed: () => Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => LimitsScreen(kid: kid),
|
|
),
|
|
),
|
|
child: Column(
|
|
spacing: 10,
|
|
children: [
|
|
Icon(
|
|
Icons.list_alt_outlined,
|
|
color: theme.getColorFor(
|
|
ThemeCode.textPrimary,
|
|
),
|
|
),
|
|
Text(
|
|
"Límites",
|
|
style: TextStyle(
|
|
color: theme.getColorFor(
|
|
ThemeCode.textPrimary,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
Spacer(),
|
|
TextButton(
|
|
style: ButtonStyle(padding: WidgetStatePropertyAll(EdgeInsets.all(0))),
|
|
onPressed: () => Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => GoalsScreen(kid: kid)
|
|
)
|
|
),
|
|
child: Column(
|
|
spacing: 10,
|
|
children: [
|
|
Icon(
|
|
Icons.emoji_events_outlined,
|
|
color: theme.getColorFor(
|
|
ThemeCode.textPrimary,
|
|
),
|
|
),
|
|
Text(
|
|
"Metas",
|
|
style: TextStyle(
|
|
color: theme.getColorFor(
|
|
ThemeCode.textPrimary,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
Spacer(),
|
|
TextButton(
|
|
style: ButtonStyle(padding: WidgetStatePropertyAll(EdgeInsets.all(0))),
|
|
onPressed: () => Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => ExtractScreen(kid: kid)
|
|
)
|
|
),
|
|
child: Column(
|
|
spacing: 10,
|
|
children: [
|
|
Icon(
|
|
Icons.cancel_outlined,
|
|
color: theme.getColorFor(
|
|
ThemeCode.textPrimary,
|
|
),
|
|
),
|
|
Text(
|
|
"Quitar",
|
|
style: TextStyle(
|
|
color: theme.getColorFor(
|
|
ThemeCode.textPrimary,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Container(
|
|
padding: EdgeInsets.all(15),
|
|
height: 300,
|
|
decoration: BoxDecoration(
|
|
color: theme.getColorFor(ThemeCode.backgroundPrimary),
|
|
borderRadius: BorderRadius.all(Radius.circular(20))
|
|
),
|
|
child: Expanded(child: Column(
|
|
//spacing: 24,
|
|
children: [
|
|
Text("Últimos movimientos", style: TextStyle(fontSize: 20, fontWeight: FontWeight.w500)),
|
|
activityList(context, theme)
|
|
]
|
|
))
|
|
)
|
|
]
|
|
)
|
|
]
|
|
)
|
|
)
|
|
]
|
|
)
|
|
);
|
|
}
|
|
|
|
Widget activityList(BuildContext context, theme) {
|
|
final activity = [
|
|
{
|
|
"date": "10/05",
|
|
"payments": [1, 2, 3],
|
|
},
|
|
{
|
|
"date": "10/04",
|
|
"payments": [1, 2],
|
|
},
|
|
{
|
|
"date": "10/02",
|
|
"payments": [1, 2, 3, 4],
|
|
},
|
|
];
|
|
|
|
return Expanded(
|
|
child: ListView(
|
|
padding: EdgeInsets.symmetric(vertical: 0),
|
|
children: [
|
|
...List<Widget>.generate(activity.length, (int index) {
|
|
return Container(padding: EdgeInsets.only(top: 24),
|
|
child: Column(
|
|
spacing: 8,
|
|
children: [
|
|
Align(alignment: Alignment.bottomLeft, child: Text(activity[index]["date"].toString(), style: TextStyle(fontSize: 18, height: 1.5))),
|
|
Column(
|
|
spacing: 16,
|
|
children: List<Widget>.generate(
|
|
(activity[index]["payments"] as List<Object>).length,
|
|
(int i) {
|
|
return Row(
|
|
spacing: 12,
|
|
children: [
|
|
Container(
|
|
padding: EdgeInsets.all(9),
|
|
decoration: BoxDecoration(
|
|
color: theme.getColorFor(
|
|
ThemeCode.backgroundTertiary,
|
|
),
|
|
borderRadius: BorderRadius.all(Radius.circular(16))
|
|
),
|
|
child: Icon(
|
|
Icons.local_pizza_outlined,
|
|
color: theme.getColorFor(ThemeCode.buttonPrimary)
|
|
)
|
|
),
|
|
Column(
|
|
children: [
|
|
Text(
|
|
"Vips",
|
|
style: TextStyle(fontWeight: FontWeight.bold)
|
|
),
|
|
Text("20:15")
|
|
]
|
|
),
|
|
Spacer(),
|
|
MoneyText(
|
|
text: "5.1€",
|
|
size: 16,
|
|
secondarySize: 12,
|
|
color: theme.getColorFor(ThemeCode.textPrimary),
|
|
)
|
|
]
|
|
);
|
|
}
|
|
)
|
|
)
|
|
]
|
|
));
|
|
}),
|
|
TextButton(onPressed: () => {}, child: Align(alignment: Alignment.bottomLeft, child: Text("Ver todos"))),
|
|
]
|
|
)
|
|
);
|
|
}
|
|
} |