Initial commit
This commit is contained in:
33
lib/payments/view/screens/account_created_screen.dart
Normal file
33
lib/payments/view/screens/account_created_screen.dart
Normal file
@@ -0,0 +1,33 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:sf_app_platform/payments/view/screens/dashboard_screen.dart';
|
||||
|
||||
class AccountCreatedScreen extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final email = "usuario@example.com";
|
||||
final fullName = "Carlos Pérez Cruz";
|
||||
|
||||
return Scaffold(body: Expanded(child: Center(
|
||||
child: Column(
|
||||
spacing: 20,
|
||||
children: [
|
||||
Spacer(),
|
||||
Icon(Icons.check, color: Color(0xFF329e95), size: 50,),
|
||||
Text("Cuenta creada", style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold)),
|
||||
Text.rich(TextSpan(text:"Has creado la cuenta para:\n",
|
||||
children: [TextSpan(text: fullName, style: TextStyle(fontWeight: FontWeight.bold))])),
|
||||
Text.rich(TextSpan(text:"Hemos enviado un email de verificación a:\n",
|
||||
children: [TextSpan(text: email, style: TextStyle(fontWeight: FontWeight.bold))])),
|
||||
Text("Crea la cuenta de tu peque e ingresa su primera paga para utilizarla con su reloj"),
|
||||
FilledButton(onPressed: ()=>{
|
||||
Navigator.pushReplacement(context, MaterialPageRoute(builder: (_)=>DashboardScreen()))
|
||||
}, child: Text("Continuar")),
|
||||
Spacer()
|
||||
],
|
||||
),
|
||||
)));
|
||||
}
|
||||
|
||||
}
|
||||
203
lib/payments/view/screens/dashboard_screen.dart
Normal file
203
lib/payments/view/screens/dashboard_screen.dart
Normal file
@@ -0,0 +1,203 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutter_svg/flutter_svg.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import 'package:sf_app_platform/payments/view/screens/kid_wallet_screen.dart';
|
||||
|
||||
import '../../domain/entities/kid.dart';
|
||||
import '../../domain/ports/theme_port.dart';
|
||||
|
||||
class DashboardScreen extends StatefulWidget {
|
||||
const DashboardScreen({super.key});
|
||||
|
||||
@override
|
||||
State<DashboardScreen> createState() => _DashboardScreenState();
|
||||
}
|
||||
|
||||
class _DashboardScreenState extends State<DashboardScreen>{
|
||||
|
||||
int currentPageIndex = 0;
|
||||
|
||||
final String name = "Juan";
|
||||
final double total = 100;
|
||||
final List<Kid> kids = [
|
||||
Kid(name:"Ana", balance:25),
|
||||
Kid(name:"Carlos", balance:25),
|
||||
];
|
||||
late final double available = kids.fold(total, (t, e) => t - e.balance);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
|
||||
return Scaffold(
|
||||
bottomNavigationBar: NavigationBar(
|
||||
|
||||
onDestinationSelected: (int index) {
|
||||
setState(() {
|
||||
currentPageIndex = index;
|
||||
});
|
||||
},
|
||||
selectedIndex: currentPageIndex,
|
||||
destinations: [
|
||||
NavigationDestination(icon: Icon(Icons.home_outlined), label: "Inicio"),
|
||||
NavigationDestination(icon: Icon(Icons.person_outline_outlined), label: "Mi perfil"),
|
||||
NavigationDestination(icon: Icon(Icons.watch_outlined), label: "Movimientos"),
|
||||
NavigationDestination(icon: Icon(Icons.notifications_outlined), label: "Alertas"),
|
||||
],),
|
||||
body: <Widget>[
|
||||
Container(
|
||||
margin: EdgeInsets.all(30),
|
||||
child: Column(
|
||||
children: [
|
||||
Text.rich(
|
||||
TextSpan(
|
||||
text: 'Hola, ',
|
||||
style: TextStyle(),
|
||||
children: <TextSpan>[
|
||||
TextSpan(text: name, style: TextStyle(fontWeight: FontWeight.bold)),
|
||||
],
|
||||
),
|
||||
),
|
||||
walletsList(context, kids),
|
||||
TextButton(onPressed: ()=>{}, child: Text("+ Añdir otro peque", style: TextStyle(fontWeight: FontWeight.bold))),
|
||||
Container(
|
||||
padding: EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(color: Colors.white, borderRadius: BorderRadius.all(Radius.circular(20))),
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Text("Wallet", style: TextStyle(fontWeight: FontWeight.bold),),
|
||||
Spacer(),
|
||||
Text("$total€ total")
|
||||
]
|
||||
),
|
||||
Stack(
|
||||
children: [
|
||||
LinearProgressIndicator(
|
||||
value: available/total,
|
||||
minHeight: 70,
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
),
|
||||
Center(child: Text(available.toString())),
|
||||
],
|
||||
),
|
||||
Center(child: Text("Disponible"))
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
padding: EdgeInsets.all(20),
|
||||
child: Column(
|
||||
children: [
|
||||
Text("Ingresar dinero en la cuenta"),
|
||||
TextField(
|
||||
decoration: InputDecoration(labelText: "Cantidad", hintText: "0€"),
|
||||
keyboardType: TextInputType.number,
|
||||
inputFormatters: [
|
||||
FilteringTextInputFormatter.digitsOnly
|
||||
],
|
||||
),
|
||||
Row(
|
||||
children: [
|
||||
|
||||
FilledButton(onPressed: ()=>{}, child: Text("Ingresar"))
|
||||
],
|
||||
),
|
||||
Text("Máximo que puedes añadir: ${150 - total}€"),
|
||||
],
|
||||
),
|
||||
)
|
||||
]
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Center(
|
||||
child: Text("Perfil")
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Center(
|
||||
child: Text("Movimientos")
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Center(
|
||||
child: Text("Alertas")
|
||||
),
|
||||
)
|
||||
][currentPageIndex],
|
||||
);
|
||||
}
|
||||
|
||||
Widget walletsList(BuildContext context, List<Kid> kids) {
|
||||
return Column(
|
||||
spacing: 20,
|
||||
children: List<Widget>.generate(kids.length, (int index) {
|
||||
return
|
||||
GestureDetector(
|
||||
onTap: ()=>{Navigator.push(context, MaterialPageRoute(builder: (_)=>KidWalletScreen(kid: kids[index])))},
|
||||
child: ClipRRect(
|
||||
borderRadius: const BorderRadius.all(Radius.circular(16.0)),
|
||||
child: Container(
|
||||
padding: EdgeInsets.fromLTRB(20, 20, 20, 5),
|
||||
decoration: const BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: <Color>[
|
||||
Color(0xFFFA5C9F),
|
||||
Color(0xFFEB2579),
|
||||
Color(0xFFE60866),
|
||||
]
|
||||
)
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
Text(kids[index].name, style: TextStyle(fontWeight: FontWeight.bold, fontSize: 25, color: Colors.white)),
|
||||
Row(
|
||||
spacing: 10,
|
||||
children: [
|
||||
SizedBox(
|
||||
height: 60,
|
||||
width: 60,
|
||||
child: SvgPicture.asset("assets/images/ui/face.svg"),
|
||||
),
|
||||
Spacer(),
|
||||
Text.rich(
|
||||
TextSpan(
|
||||
text:kids[index].balance.toString(),
|
||||
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 25, color: Colors.white),
|
||||
children: [
|
||||
TextSpan(
|
||||
text:"€\nen su hucha",
|
||||
style: TextStyle(fontWeight: FontWeight.normal, fontSize: 16),
|
||||
),
|
||||
]
|
||||
)
|
||||
)
|
||||
]
|
||||
),
|
||||
Row(
|
||||
children: [
|
||||
TextButton(onPressed: ()=>{},
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(Icons.edit),
|
||||
Text("Editar")
|
||||
]
|
||||
)
|
||||
),
|
||||
Spacer(),
|
||||
FilledButton(onPressed: ()=>{}, child: Text("+ Añadir dinero"))
|
||||
],
|
||||
)
|
||||
]
|
||||
),
|
||||
)
|
||||
)
|
||||
);
|
||||
})
|
||||
);
|
||||
}
|
||||
}
|
||||
181
lib/payments/view/screens/kid_wallet_screen.dart
Normal file
181
lib/payments/view/screens/kid_wallet_screen.dart
Normal file
@@ -0,0 +1,181 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_svg/svg.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../../domain/entities/kid.dart';
|
||||
import '../../domain/ports/theme_port.dart';
|
||||
|
||||
class KidWalletScreen extends StatefulWidget{
|
||||
final Kid kid;
|
||||
|
||||
const KidWalletScreen({super.key, required this.kid});
|
||||
|
||||
@override
|
||||
State<KidWalletScreen> createState() => _KidWalletScreenState();
|
||||
}
|
||||
|
||||
class _KidWalletScreenState extends State<KidWalletScreen> {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
|
||||
final theme = context.read<ThemePort>();
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: Color(0xE6FFFFFF),
|
||||
body: Stack(
|
||||
children: [
|
||||
DecoratedBox(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: const BorderRadius.all(Radius.circular(30)),
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: theme.getCardColorFor(0)
|
||||
),
|
||||
),
|
||||
child: SizedBox(width: double.infinity, height: 300),
|
||||
),
|
||||
Container(
|
||||
margin: EdgeInsets.symmetric(vertical: 50, horizontal: 20),
|
||||
child: Column(
|
||||
spacing: 15,
|
||||
children: [
|
||||
Row(
|
||||
spacing: 7,
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: ()=>Navigator.pop(context),
|
||||
icon: Icon(Icons.arrow_back_ios_new_outlined, color: Color(0xFFFFFFFF),)
|
||||
),
|
||||
SizedBox(height: 50, child: SvgPicture.asset("assets/images/ui/face.svg")),
|
||||
Text(widget.kid.name,
|
||||
style: TextStyle(
|
||||
color: Color(0xFFFFFFFF),
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 20
|
||||
)
|
||||
),
|
||||
Spacer()
|
||||
],
|
||||
),
|
||||
Text("${widget.kid.balance.toString()}€",
|
||||
style: TextStyle(color: Color(0xFFFFFFFF), fontSize: 35, fontWeight: FontWeight.bold)),
|
||||
Text("Saldo disponible", style: TextStyle(color: Color(0xFFFFFFFF))),
|
||||
LinearProgressIndicator(
|
||||
value: 0.7,
|
||||
color: Color(0xFFFFFFFF),
|
||||
backgroundColor: Color(0xFFFFFFFF).withAlpha(0x4C),
|
||||
minHeight: 10,
|
||||
borderRadius: BorderRadius.all(Radius.circular(5)),
|
||||
),
|
||||
//Spacer(),
|
||||
Center( child: Container(
|
||||
padding: EdgeInsets.all(8),
|
||||
margin: EdgeInsets.only(top: 30),
|
||||
decoration: const BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.all(Radius.circular(20)),
|
||||
), child: Row(
|
||||
spacing: 10,
|
||||
children: [
|
||||
TextButton(onPressed: ()=>{},
|
||||
child: Column(
|
||||
spacing: 10,
|
||||
children: [
|
||||
Icon(Icons.add_circle_outline),
|
||||
Text("Añadir")
|
||||
]
|
||||
)
|
||||
),
|
||||
TextButton(onPressed: ()=>{},
|
||||
child: Column(
|
||||
spacing: 10,
|
||||
children: [
|
||||
Icon(Icons.account_balance_wallet_outlined),
|
||||
Text("Paga")
|
||||
]
|
||||
)
|
||||
),
|
||||
TextButton(onPressed: ()=>{},
|
||||
child: Column(
|
||||
spacing: 10,
|
||||
children: [
|
||||
Icon(Icons.list_alt_outlined),
|
||||
Text("Límites")
|
||||
]
|
||||
)
|
||||
),
|
||||
TextButton(onPressed: ()=>{},
|
||||
child: Column(
|
||||
spacing: 10,
|
||||
children: [
|
||||
Icon(Icons.emoji_events_outlined),
|
||||
Text("Metas")
|
||||
]
|
||||
)
|
||||
)
|
||||
],
|
||||
))
|
||||
),
|
||||
Container(
|
||||
padding: EdgeInsets.all(15),
|
||||
height: 400,
|
||||
decoration: const BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.all(Radius.circular(20)),
|
||||
), child: Column(
|
||||
children: [
|
||||
Text("Últimos movimientos"),
|
||||
activityList(),
|
||||
TextButton(onPressed: ()=>{}, child: Text("Ver todos"))
|
||||
],
|
||||
)
|
||||
)
|
||||
],
|
||||
)
|
||||
)
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget activityList(){
|
||||
final activity = [{"date": "10/05", "payments": [1, 2, 3]}, {"date": "10/04", "payments":[1, 2]}, {"date": "10/02", "payments":[1]}];
|
||||
|
||||
return Align(alignment: Alignment.topLeft, child: SingleChildScrollView(child: Column(
|
||||
children: List<Widget>.generate(activity.length, (int index) {
|
||||
return Column(
|
||||
spacing: 20,
|
||||
children: [
|
||||
Text(activity[index]["date"].toString()),
|
||||
Column(
|
||||
spacing: 15,
|
||||
children: List<Widget>.generate((activity[index]["payments"] as List<Object>).length, (int i) {
|
||||
var a = (activity[index]["payments"] as List<Object>)[i];
|
||||
return Row(
|
||||
spacing: 5,
|
||||
children: [
|
||||
Container(
|
||||
padding: EdgeInsets.all(9),
|
||||
color: Color(0xFF329e95).withAlpha(0x1A),
|
||||
child: Icon(Icons.local_pizza_outlined, color: Color(0xFF329e95)),
|
||||
),
|
||||
Column(
|
||||
children: [
|
||||
Text("Vips", style: TextStyle(fontWeight: FontWeight.bold)),
|
||||
Text("20:15"),
|
||||
],
|
||||
),
|
||||
Spacer(),
|
||||
Text("5.1€", style: TextStyle(fontWeight: FontWeight.bold))
|
||||
],
|
||||
);
|
||||
}))
|
||||
],
|
||||
);
|
||||
})
|
||||
)));
|
||||
}
|
||||
}
|
||||
49
lib/payments/view/screens/link_phone_screen.dart
Normal file
49
lib/payments/view/screens/link_phone_screen.dart
Normal file
@@ -0,0 +1,49 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:sf_app_platform/payments/view/screens/phone_code_screen.dart';
|
||||
|
||||
class LinkPhoneScreen extends StatelessWidget{
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
TextEditingController phoneController = TextEditingController();
|
||||
String? phone;
|
||||
|
||||
return Scaffold(
|
||||
body: Container(
|
||||
margin: EdgeInsets.symmetric(horizontal: 20),
|
||||
child: Center(child: Expanded(
|
||||
child: Column(
|
||||
spacing: 10,
|
||||
children: [
|
||||
Text("¡Nos alegra mucho tenerte por aquí!", style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold)),
|
||||
Text("Para poder entrar de forma segura, te vamos a enviar un código al teléfono"),
|
||||
Row(children: [
|
||||
DropdownMenu(
|
||||
initialSelection: "es",
|
||||
dropdownMenuEntries: List<DropdownMenuEntry>.generate(3, (int index){
|
||||
return DropdownMenuEntry(labelWidget: Icon(Icons.outlined_flag), label: "es", value: "es");
|
||||
})
|
||||
),
|
||||
Expanded(child: TextField(
|
||||
onSubmitted: (String value){phone=value;},
|
||||
controller: phoneController,
|
||||
decoration: InputDecoration(labelText: "Teléfono móvil", hintText: "Teléfono"),
|
||||
keyboardType: TextInputType.number)
|
||||
)
|
||||
]),
|
||||
FilledButton(
|
||||
onPressed: ()=>{
|
||||
if (phone != null)
|
||||
Navigator.push(context, MaterialPageRoute(builder: (_)=>PhoneCodeScreen(phone: phone!)))
|
||||
},
|
||||
child: Text("Siguiente")
|
||||
)
|
||||
]
|
||||
)
|
||||
))
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
22
lib/payments/view/screens/loading_screen.dart
Normal file
22
lib/payments/view/screens/loading_screen.dart
Normal file
@@ -0,0 +1,22 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class LoadingScreen extends StatelessWidget{
|
||||
const LoadingScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
body: Expanded(
|
||||
child: Center(
|
||||
child: Column(
|
||||
spacing: 50,
|
||||
children: [
|
||||
Image.asset("assets/images/ui/logo.jpg"),
|
||||
CircularProgressIndicator()
|
||||
],
|
||||
),
|
||||
)
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
3
lib/payments/view/screens/logs/log_screen.dart
Normal file
3
lib/payments/view/screens/logs/log_screen.dart
Normal file
@@ -0,0 +1,3 @@
|
||||
abstract class LogScreen {
|
||||
|
||||
}
|
||||
55
lib/payments/view/screens/phone_code_screen.dart
Normal file
55
lib/payments/view/screens/phone_code_screen.dart
Normal file
@@ -0,0 +1,55 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:sf_app_platform/payments/view/screens/dashboard_screen.dart';
|
||||
|
||||
class PhoneCodeScreen extends StatefulWidget {
|
||||
final String phone;
|
||||
|
||||
const PhoneCodeScreen({super.key, required this.phone});
|
||||
|
||||
@override
|
||||
State<PhoneCodeScreen> createState() => PhoneCodeScreenState();
|
||||
|
||||
}
|
||||
|
||||
class PhoneCodeScreenState extends State<PhoneCodeScreen> {
|
||||
final focusNodes = List<FocusNode>.generate(6, (int i){
|
||||
return FocusNode();
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
body: Expanded(child: Center(
|
||||
child: Column(
|
||||
spacing: 15,
|
||||
children: [
|
||||
Text("Conéctate", style: TextStyle(fontWeight: FontWeight.bold, fontSize: 30)),
|
||||
Text.rich(TextSpan(text: "Hemos enviado el código al ",
|
||||
children: [TextSpan(
|
||||
text: widget.phone, style: TextStyle(fontWeight: FontWeight.bold))]
|
||||
)),
|
||||
Text("Introduce el código aquí"),
|
||||
Row(
|
||||
children: List<Widget>.generate(6, (int i){
|
||||
return Expanded(child: TextField(
|
||||
focusNode: focusNodes[i],
|
||||
keyboardType: TextInputType.number,
|
||||
decoration: InputDecoration(hintText: "0"),
|
||||
maxLength: 1,
|
||||
onChanged: (String value)=>{value!="" ? focusNodes[i+1].requestFocus() : focusNodes[i-1].requestFocus()},
|
||||
));
|
||||
}),
|
||||
),
|
||||
FilledButton(onPressed: ()=>{Navigator.pushReplacement(context, MaterialPageRoute(builder: (_)=>DashboardScreen()))}, child: Text("Entrar")),
|
||||
Text("¿No lo has recibido?"),
|
||||
TextButton(onPressed: ()=>{},
|
||||
child: Text("Volver a intentarlo", style: TextStyle(fontWeight: FontWeight.bold))
|
||||
)
|
||||
]
|
||||
),
|
||||
)),
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
33
lib/payments/view/screens/server_error_screen.dart
Normal file
33
lib/payments/view/screens/server_error_screen.dart
Normal file
@@ -0,0 +1,33 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class ServerErrorScreen extends StatelessWidget{
|
||||
|
||||
const ServerErrorScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
//backgroundColor: ,
|
||||
body: Center(
|
||||
child: Column(
|
||||
children: [
|
||||
Spacer(),
|
||||
Text.rich(
|
||||
TextSpan(
|
||||
text: "Estamos mejorando el servicio",
|
||||
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 25)
|
||||
)
|
||||
),
|
||||
Spacer(),
|
||||
Image.asset("assets/images/ui/server_error.jpg"),
|
||||
Text("El sistema está en mantenimiento. \nInténtalo de nuevo en unos minutos"),
|
||||
Spacer(),
|
||||
FilledButton(onPressed: ()=>{}, child: Text("Notificarme")),
|
||||
TextButton(onPressed: ()=>{}, child: Text("Reintentar")),
|
||||
Spacer()
|
||||
]
|
||||
),
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
206
lib/payments/view/screens/signup_screen.dart
Normal file
206
lib/payments/view/screens/signup_screen.dart
Normal file
@@ -0,0 +1,206 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:sf_app_platform/payments/view/screens/account_created_screen.dart';
|
||||
|
||||
class SignupScreen extends StatefulWidget {
|
||||
const SignupScreen({super.key});
|
||||
|
||||
@override
|
||||
_SignupScreenState createState() => _SignupScreenState();
|
||||
}
|
||||
|
||||
class _SignupScreenState extends State<SignupScreen> {
|
||||
int currentStep = 0;
|
||||
bool passwordVisible=false;
|
||||
|
||||
@override
|
||||
void initState(){
|
||||
super.initState();
|
||||
passwordVisible=true;
|
||||
}
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return MaterialApp(
|
||||
home: Scaffold(
|
||||
body: Center(child: Container(
|
||||
padding: const EdgeInsets.all(20),
|
||||
child: SizedBox(
|
||||
child: Stepper(
|
||||
controlsBuilder: (BuildContext context, ControlsDetails controls) {
|
||||
return Row(
|
||||
children: <Widget>[
|
||||
OutlinedButton(
|
||||
onPressed: controls.onStepCancel,
|
||||
child: const Text('Atrás'),
|
||||
),
|
||||
FilledButton(
|
||||
onPressed: controls.onStepContinue,
|
||||
child: const Text('Siguiente'),
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
type: StepperType.horizontal,
|
||||
currentStep: currentStep,
|
||||
onStepCancel: () => currentStep == 0
|
||||
? null
|
||||
: setState(() {
|
||||
currentStep -= 1;
|
||||
}),
|
||||
onStepContinue: () {
|
||||
bool isLastStep = (currentStep == getSteps().length - 1);
|
||||
if (isLastStep) {
|
||||
Navigator.pushReplacement(context, MaterialPageRoute(
|
||||
builder: (_) => AccountCreatedScreen(),
|
||||
));
|
||||
} else {
|
||||
setState(() {
|
||||
currentStep += 1;
|
||||
});
|
||||
}
|
||||
},
|
||||
steps: getSteps(),
|
||||
)
|
||||
)),
|
||||
)),
|
||||
);
|
||||
}
|
||||
|
||||
List<Step> getSteps() {
|
||||
return <Step>[
|
||||
Step(
|
||||
state: currentStep > 0 ? StepState.complete : StepState.indexed,
|
||||
isActive: currentStep >= 0,
|
||||
stepStyle: currentStep >= 0? StepStyle(connectorThickness: 0, color: Color(0xFF329e95), indexStyle: TextStyle(color: Colors.transparent)) : StepStyle(connectorThickness: 0, color: Colors.transparent, boxShadow: BoxShadow(spreadRadius: 5), indexStyle: TextStyle(color: Colors.transparent)),
|
||||
title: const Text(""),
|
||||
content: Column(
|
||||
spacing: 30,
|
||||
children: [
|
||||
Text("Datos personales"),
|
||||
Text("Identifícate"),
|
||||
Text("Nos aseguraremos de que la cuenta está a nombre del adulto responsable"),
|
||||
TextField(decoration: InputDecoration(labelText: "Nombre", hintText: "Nombre")),
|
||||
TextField(decoration: InputDecoration(labelText: "Apellidos", hintText: "Apellidos")),
|
||||
Row(
|
||||
children: [
|
||||
Expanded( child: TextField(
|
||||
decoration: InputDecoration(label: Text("Fecha de nacimiento"), hintText: "DD"),
|
||||
keyboardType: TextInputType.number,
|
||||
inputFormatters: [FilteringTextInputFormatter.digitsOnly],
|
||||
)),
|
||||
Expanded( child: TextField(
|
||||
decoration: InputDecoration(hintText: "MM"),
|
||||
keyboardType: TextInputType.number,
|
||||
inputFormatters: [FilteringTextInputFormatter.digitsOnly],
|
||||
)),
|
||||
Expanded( child: TextField(
|
||||
decoration: InputDecoration(hintText: "AAAA"),
|
||||
keyboardType: TextInputType.number,
|
||||
inputFormatters: [FilteringTextInputFormatter.digitsOnly],
|
||||
)),
|
||||
],
|
||||
),
|
||||
DropdownMenu(
|
||||
width: double.infinity,
|
||||
label: Text("¿Qué familiar eres?"),
|
||||
dropdownMenuEntries: [
|
||||
DropdownMenuEntry(label: "Padre", value: "Padre"),
|
||||
DropdownMenuEntry(label: "Madre", value: "Madre"),
|
||||
DropdownMenuEntry(label: "Tutor", value: "Tutor"),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
Step(
|
||||
state: currentStep > 1 ? StepState.complete : StepState.indexed,
|
||||
isActive: currentStep >= 1,
|
||||
stepStyle: currentStep >= 1? StepStyle(connectorThickness: 0, color: Color(0xFF329e95), indexStyle: TextStyle(color: Colors.transparent)) : StepStyle(connectorThickness: 0, color: Colors.white, boxShadow: BoxShadow(spreadRadius: 1), indexStyle: TextStyle(color: Colors.transparent)),
|
||||
title: const Text(""),
|
||||
content: Column(
|
||||
spacing: 30,
|
||||
children: [
|
||||
Text("Domicilio"),
|
||||
Text("Tu dirección", style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
|
||||
Text("Tu dirección nos ayuda a verificar y mantener la seguridad de tu cuenta"),
|
||||
TextField(decoration: InputDecoration(hintText: "Dirección completa")),
|
||||
TextField(decoration: InputDecoration(hintText: "Ciudad")),
|
||||
DropdownMenu(
|
||||
dropdownMenuEntries: List<DropdownMenuEntry>.generate(3, (int index) {
|
||||
return DropdownMenuEntry(value: "España", label: "España");
|
||||
}),
|
||||
hintText: "País",
|
||||
width: double.infinity,
|
||||
),
|
||||
TextField(decoration: InputDecoration(hintText: "Nacionalidad"))
|
||||
],
|
||||
),
|
||||
),
|
||||
Step(
|
||||
state: currentStep > 2 ? StepState.complete : StepState.indexed,
|
||||
isActive: currentStep >= 2,
|
||||
stepStyle: currentStep >= 2? StepStyle(connectorThickness: 0, color: Color(0xFF329e95), indexStyle: TextStyle(color: Colors.transparent)) : StepStyle(connectorThickness: 0, color: Colors.white, boxShadow: BoxShadow(spreadRadius: 1), indexStyle: TextStyle(color: Colors.transparent)),
|
||||
title: const Text(""),
|
||||
content: Column(
|
||||
spacing: 30,
|
||||
children: [
|
||||
Text("Usuario y contacto"),
|
||||
Text("Crea tu usuario", style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
|
||||
Text("Con tu email y tu número podremos mantenerte siempre informado"),
|
||||
TextField(decoration: InputDecoration(labelText: "Correo electrónico", hintText: "Correo electrónico")),
|
||||
Row(children: [
|
||||
DropdownMenu(
|
||||
initialSelection: "es",
|
||||
dropdownMenuEntries: List<DropdownMenuEntry>.generate(3, (int index){
|
||||
return DropdownMenuEntry(labelWidget: Icon(Icons.outlined_flag), label: "es", value: "es");
|
||||
})
|
||||
),
|
||||
Expanded(child: TextField(
|
||||
decoration: InputDecoration(labelText: "Teléfono móvil", hintText: "Teléfono"),
|
||||
keyboardType: TextInputType.number)
|
||||
)
|
||||
],
|
||||
),
|
||||
TextField(
|
||||
obscureText: passwordVisible,
|
||||
enableSuggestions: false,
|
||||
autocorrect: false,
|
||||
decoration: InputDecoration(
|
||||
labelText: "Contraseña",
|
||||
hintText: "********",
|
||||
suffixIcon: IconButton(
|
||||
icon: Icon(passwordVisible
|
||||
? Icons.visibility
|
||||
: Icons.visibility_off),
|
||||
onPressed: () {
|
||||
setState(() {
|
||||
passwordVisible = !passwordVisible;
|
||||
});
|
||||
},
|
||||
),
|
||||
)
|
||||
),
|
||||
TextField(obscureText: passwordVisible,
|
||||
enableSuggestions: false,
|
||||
autocorrect: false,
|
||||
decoration: InputDecoration(
|
||||
labelText: "Repetir contraseña",
|
||||
hintText: "*******",
|
||||
suffixIcon: IconButton(
|
||||
icon: Icon(passwordVisible
|
||||
? Icons.visibility
|
||||
: Icons.visibility_off),
|
||||
onPressed: () {
|
||||
setState(() {
|
||||
passwordVisible = !passwordVisible;
|
||||
});
|
||||
},
|
||||
),
|
||||
)
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
];
|
||||
}
|
||||
}
|
||||
69
lib/payments/view/screens/welcome_screen.dart
Normal file
69
lib/payments/view/screens/welcome_screen.dart
Normal file
@@ -0,0 +1,69 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_svg/svg.dart';
|
||||
import 'package:sf_app_platform/payments/view/screens/link_phone_screen.dart';
|
||||
import 'package:sf_app_platform/payments/view/screens/signup_screen.dart';
|
||||
|
||||
import 'dashboard_screen.dart';
|
||||
|
||||
class WelcomeScreen extends StatelessWidget {
|
||||
const WelcomeScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold( body: Center(
|
||||
child:Column(
|
||||
children:[
|
||||
Spacer(),
|
||||
Expanded(
|
||||
child: CarouselView(
|
||||
scrollDirection: Axis.horizontal,
|
||||
itemExtent: double.infinity,
|
||||
itemSnapping: true,
|
||||
shrinkExtent: 400,
|
||||
children: generateSteps(),
|
||||
)
|
||||
),
|
||||
FilledButton(onPressed: ()=>{jumpToNext(context)}, child: const Text('Continuar')),
|
||||
Spacer()
|
||||
]
|
||||
),
|
||||
));
|
||||
}
|
||||
|
||||
void jumpToNext(BuildContext context){
|
||||
Navigator.pushReplacement(
|
||||
context,
|
||||
MaterialPageRoute(
|
||||
builder: (_) => LinkPhoneScreen(),
|
||||
),
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
List<Widget> generateSteps(){
|
||||
return [
|
||||
Column(
|
||||
spacing: 30,
|
||||
children: [
|
||||
SvgPicture.asset("assets/images/ui/bienvenida_paso1.svg"),
|
||||
Text("Aprende a gestionar su dinero", style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),),
|
||||
Text("Tu peque crea hábitos y se divierte mientras lo hace")
|
||||
]
|
||||
),
|
||||
Column(
|
||||
children: [
|
||||
SvgPicture.asset("assets/images/ui/bienvenida_paso2.svg"),
|
||||
Text("Tranquilidad en cada pago que hacen"),
|
||||
Text("Supervisa gastos, fija límites y acompáñalos en cada paso")
|
||||
]
|
||||
),
|
||||
Column(
|
||||
children: [
|
||||
SvgPicture.asset("assets/images/ui/bienvenida_paso3.svg"),
|
||||
Text("Pagos fáciles y seguros en sus manos"),
|
||||
Text("Podrá pagar desde su reloj.\n Sin móvil ni efectivo")
|
||||
]
|
||||
),
|
||||
];
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user