This commit is contained in:
Juan Felipe Duarte
2023-04-16 17:34:18 -05:00
parent 86e3b47693
commit a22d17b199
16 changed files with 1132 additions and 407 deletions
+101 -151
View File
@@ -1,6 +1,9 @@
import 'package:flutter/material.dart';
import 'package:flutter_otp_text_field/flutter_otp_text_field.dart';
import 'package:get/get.dart';
import 'package:prosappco/src/components/bottom_sheet.dart';
import 'package:prosappco/src/components/column_padding.dart';
import 'package:prosappco/src/components/primary_btn.dart';
import 'package:prosappco/src/controllers/otp_controller.dart';
import 'package:prosappco/src/controllers/phone_auth_controller.dart';
@@ -14,160 +17,107 @@ class CodeValidationScreen extends StatelessWidget {
Widget build(BuildContext context) {
var otp;
return SafeArea(
child: Scaffold(
backgroundColor: const Color(0xFFD6F4FF),
body: SingleChildScrollView(
reverse: true,
child: Stack(
children: [
Container(
margin: const EdgeInsets.only(top: 280),
width: double.infinity,
height: MediaQuery.of(context).size.height / 1.5,
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topRight: Radius.circular(50),
topLeft: Radius.circular(50))),
return BottomSheetExpanded(
horizontalPadding: 10,
children: [
Row(
children: [
IconButton(
icon: const Icon(
Icons.arrow_back,
size: 30,
),
Container(
margin: const EdgeInsets.only(top: 120, left: 70, right: 70),
child:
const Image(image: AssetImage('images/logo_prosapp.png')),
onPressed: () {
Navigator.pop(context);
},
),
const Text(
'Validar código',
style: TextStyle(
color: Color(0xFF262626),
fontSize: 38.0,
fontWeight: FontWeight.bold,
),
Container(
padding:
const EdgeInsets.symmetric(horizontal: 0, vertical: 20),
margin: const EdgeInsets.only(top: 280, left: 25),
child: Row(
children: <Widget>[
IconButton(
icon: Icon(
Icons.arrow_back,
size: 30,
),
onPressed: () {
Navigator.pop(context);
},
),
Text(
'Validar código',
style: TextStyle(
color: Color(0xFF262626),
fontSize: 38.0,
fontWeight: FontWeight.bold,
),
textAlign: TextAlign.right,
),
],
),
),
Container(
padding:
const EdgeInsets.symmetric(horizontal: 0, vertical: 20),
margin: const EdgeInsets.only(top: 350, left: 50, right: 50),
child: Column(
children: [
const Padding(
padding: EdgeInsets.only(bottom: 5),
child: Align(
alignment: Alignment.topLeft,
child: Text('Numero de celular',
style: TextStyle(
fontSize: 18.0, color: Color(0xFF65676B))),
)),
Padding(
padding: EdgeInsets.only(bottom: 20),
child: Row(
children: [
Expanded(
child: TextField(
onChanged: (value) {
phoneNumber = value;
},
controller: TextEditingController(
text: phoneNumber ?? ''),
decoration: InputDecoration(
border: InputBorder.none,
hintText: '',
suffixIcon: Icon(Icons.edit),
),
),
),
TextButton(
child: Text('Reenviar código'),
onPressed: () {
if (phoneNumber!.isNotEmpty) {
PhoneAuthController.instance
.phoneAuthentication(
phoneNumber!,
);
}
},
),
],
),
),
Align(
alignment: Alignment.topLeft,
child: Padding(
padding: const EdgeInsets.only(bottom: 5),
child: Text('Codigo',
textAlign: TextAlign.left,
style: TextStyle(
fontSize: 18.0, color: Color(0xFF65676B))),
),
),
Padding(
padding: EdgeInsets.only(bottom: 20),
child: OtpTextField(
numberOfFields: 6,
focusedBorderColor: Colors.blue,
fillColor: Colors.black.withOpacity(0.1),
filled: true,
keyboardType: TextInputType.number,
onSubmit: (code) {
otp = code;
OTPController.instance.verifyOTP(otp);
},
),
),
Padding(
padding: EdgeInsets.only(bottom: 40),
child: Center(
child: ElevatedButton(
onPressed: () {
OTPController.instance.verifyOTP(otp);
},
child: Text(
'Validar código',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 18,
),
),
style: ElevatedButton.styleFrom(
primary: Color(0xFF2BA4EC), // Color del botón
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
50), // Bordes redondeados
),
elevation: 0,
minimumSize:
Size(230, 60), // Tamaño mínimo del botón
),
),
),
),
],
),
),
],
),
),
],
),
),
ColumnPadding(
padding: const EdgeInsets.symmetric(horizontal: 25),
children: [
const SizedBox(height: 10),
const SizedBox(
width: double.infinity,
child: Text(
'Numero de celular',
style: TextStyle(
fontSize: 18.0,
color: Color(0xFF65676B),
),
),
),
const SizedBox(height: 10),
Row(
children: [
Expanded(
child: TextField(
onChanged: (value) {
phoneNumber = value;
},
controller: TextEditingController(text: phoneNumber ?? ''),
decoration: const InputDecoration(
border: InputBorder.none,
hintText: '',
suffixIcon: Icon(Icons.edit),
),
),
),
TextButton(
child: const Text('Reenviar código'),
onPressed: () {
if (phoneNumber!.isNotEmpty) {
PhoneAuthController.instance.phoneAuthentication(
phoneNumber!,
);
}
},
),
],
),
const SizedBox(height: 10),
const SizedBox(
width: double.infinity,
child: Text(
'Codigo',
textAlign: TextAlign.left,
style: TextStyle(
fontSize: 18.0,
color: Color(0xFF65676B),
),
),
),
const SizedBox(height: 10),
OtpTextField(
numberOfFields: 6,
focusedBorderColor: Colors.blue,
fillColor: Colors.black.withOpacity(0.1),
filled: true,
keyboardType: TextInputType.number,
onSubmit: (code) {
otp = code;
OTPController.instance.verifyOTP(otp);
},
),
const SizedBox(height: 40),
PrimaryButtom(
onPressed: () {
OTPController.instance.verifyOTP(otp);
},
label: 'Validar código',
),
const SizedBox(height: 30),
],
),
],
);
}
}