pahmiudahgede
/
MIF_E31222379_MOBILE
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update: improve login and verif otp screen

This commit is contained in:
pahmiudahgede 2025-05-16 22:17:45 +07:00
parent cbcb250be3
commit 1785fbceb7
2 changed files with 136 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

111
lib/features/auth/presentation/screen/login_screen.dart
View File

@ -1,4 +1,5 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:gap/gap.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:rijig_mobile/core/router.dart'; import 'package:rijig_mobile/core/router.dart';
import 'package:rijig_mobile/core/utils/guide.dart'; import 'package:rijig_mobile/core/utils/guide.dart';
@ -20,47 +21,77 @@ class LoginScreenState extends State<LoginScreen> {
return Scaffold( return Scaffold(
body: Consumer<LoginViewModel>( body: Consumer<LoginViewModel>(
builder: (context, viewModel, child) { builder: (context, viewModel, child) {
return Padding( return SafeArea(
padding: PaddingCustom().paddingHorizontalVertical(15, 40), child: Center(
child: Column( child: Padding(
crossAxisAlignment: CrossAxisAlignment.start, padding: PaddingCustom().paddingHorizontalVertical(15, 40),
children: [ child: Column(
FormFieldOne( mainAxisAlignment: MainAxisAlignment.spaceEvenly,
controllers: phoneController, children: [
hintText: 'Phone Number', Column(
isRequired: true, children: [
textInputAction: TextInputAction.done, Text(
keyboardType: TextInputType.phone, "Selamat datang di aplikasi",
onTap: () {}, style: Tulisan.subheading(),
onChanged: (value) {}, ),
fontSize: 14, Text(
fontSizeField: 16, "Rijig",
onFieldSubmitted: (value) {}, style: Tulisan.heading(color: primaryColor),
readOnly: false, ),
enabled: true, Gap(60),
Column(
children: [
FormFieldOne(
controllers: phoneController,
hintText: 'Masukkan nomor whatsapp anda!',
placeholder: "cth.62..",
isRequired: true,
textInputAction: TextInputAction.done,
keyboardType: TextInputType.phone,
onTap: () {},
onChanged: (value) {},
fontSize: 14,
fontSizeField: 16,
onFieldSubmitted: (value) {},
readOnly: false,
enabled: true,
),
SizedBox(height: 20),
CardButtonOne(
textButton:
viewModel.isLoading
? 'Sending OTP...'
: 'Send OTP',
fontSized: 16,
colorText: whiteColor,
color: primaryColor,
borderRadius: 10,
horizontal: double.infinity,
vertical: 50,
onTap: () async {
if (phoneController.text.isNotEmpty) {
debugPrint("send otp dipencet");
await viewModel.loginOrRegister(
phoneController.text,
);
if (viewModel.loginResponse != null) {
router.go(
"/verif-otp",
extra: phoneController.text,
);
}
}
},
loadingTrue: viewModel.isLoading,
usingRow: false,
),
],
),
],
),
],
), ),
SizedBox(height: 20), ),
CardButtonOne(
textButton:
viewModel.isLoading ? 'Sending OTP...' : 'Send OTP',
fontSized: 16,
colorText: whiteColor,
borderRadius: 10,
horizontal: double.infinity,
vertical: 50,
onTap: () async {
if (phoneController.text.isNotEmpty) {
debugPrint("send otp dipencet");
await viewModel.loginOrRegister(phoneController.text);
if (viewModel.loginResponse != null) {
router.go("/verif-otp", extra: phoneController.text);
}
}
},
loadingTrue: viewModel.isLoading,
usingRow: false,
),
],
), ),
); );
}, },

122
lib/features/auth/presentation/screen/otp_screen.dart
View File

@ -23,65 +23,73 @@ class VerifOtpScreenState extends State<VerifOtpScreen> {
return Scaffold( return Scaffold(
body: Consumer<OtpViewModel>( body: Consumer<OtpViewModel>(
builder: (context, viewModel, child) { builder: (context, viewModel, child) {
return Padding( return SafeArea(
padding: PaddingCustom().paddingHorizontalVertical(15, 40), child: Center(
child: Column( child: Padding(
children: [ padding: PaddingCustom().paddingHorizontalVertical(15, 40),
Text("OTP has been sent to ${widget.phoneNumber}"), child: Column(
SizedBox(height: 20), mainAxisAlignment: MainAxisAlignment.center,
children: [
Text("OTP has been sent to ${widget.phoneNumber}"),
SizedBox(height: 20),
PinCodeTextField( PinCodeTextField(
controller: _otpController, controller: _otpController,
appContext: context, appContext: context,
length: 4, length: 4,
obscureText: false, obscureText: false,
animationType: AnimationType.fade, animationType: AnimationType.fade,
pinTheme: PinTheme( pinTheme: PinTheme(
shape: PinCodeFieldShape.box, shape: PinCodeFieldShape.box,
borderRadius: BorderRadius.circular(5), borderRadius: BorderRadius.circular(5),
fieldHeight: 50, fieldHeight: 50,
fieldWidth: 50, fieldWidth: 50,
activeFillColor: Colors.white, activeFillColor: whiteColor,
inactiveFillColor: Colors.white, inactiveFillColor: whiteColor,
selectedFillColor: Colors.white, selectedFillColor: whiteColor,
activeColor: Colors.black, activeColor: blackNavyColor,
inactiveColor: Colors.black, inactiveColor: blackNavyColor,
selectedColor: Colors.blue, selectedColor: primaryColor,
), ),
onChanged: (value) {}, onChanged: (value) {},
onCompleted: (value) {}, onCompleted: (value) {},
),
SizedBox(height: 20),
CardButtonOne(
textButton:
viewModel.isLoading
? 'Verifying OTP...'
: 'Verify OTP',
fontSized: 16,
colorText: whiteColor,
color: primaryColor,
borderRadius: 10,
horizontal: double.infinity,
vertical: 50,
onTap: () async {
if (_otpController.text.isNotEmpty) {
await viewModel.verifyOtp(
widget.phoneNumber,
_otpController.text,
);
if (viewModel.authResponse != null) {
router.go("/navigasi");
}
}
},
loadingTrue: viewModel.isLoading,
usingRow: false,
),
if (viewModel.errorMessage != null)
Text(
viewModel.errorMessage!,
style: TextStyle(color: redColor),
),
],
), ),
SizedBox(height: 20), ),
CardButtonOne(
textButton:
viewModel.isLoading ? 'Verifying OTP...' : 'Verify OTP',
fontSized: 16,
colorText: Colors.white,
borderRadius: 10,
horizontal: double.infinity,
vertical: 50,
onTap: () async {
if (_otpController.text.isNotEmpty) {
await viewModel.verifyOtp(
widget.phoneNumber,
_otpController.text,
);
if (viewModel.authResponse != null) {
router.go("/navigasi");
}
}
},
loadingTrue: viewModel.isLoading,
usingRow: false,
),
if (viewModel.errorMessage != null)
Text(
viewModel.errorMessage!,
style: TextStyle(color: Colors.red),
),
],
), ),
); );
}, },