Appli Flutter se connecte bien à l'API.
This commit is contained in:
DahoudG
@@ -6,7 +6,6 @@ import '../../../../core/auth/bloc/auth_event.dart';
|
||||
import '../../../../core/auth/models/auth_state.dart';
|
||||
import '../../../../core/auth/models/login_request.dart';
|
||||
import '../../../../shared/theme/app_theme.dart';
|
||||
import '../../../../shared/widgets/buttons/buttons.dart';
|
||||
import '../widgets/login_form.dart';
|
||||
import '../widgets/login_header.dart';
|
||||
import '../widgets/login_footer.dart';
|
||||
@@ -48,12 +47,12 @@ class _LoginPageState extends State<LoginPage>
|
||||
duration: const Duration(milliseconds: 1200),
|
||||
vsync: this,
|
||||
);
|
||||
|
||||
|
||||
_shakeController = AnimationController(
|
||||
duration: const Duration(milliseconds: 600),
|
||||
vsync: this,
|
||||
);
|
||||
|
||||
|
||||
_fadeAnimation = Tween<double>(
|
||||
begin: 0.0,
|
||||
end: 1.0,
|
||||
@@ -61,7 +60,7 @@ class _LoginPageState extends State<LoginPage>
|
||||
parent: _animationController,
|
||||
curve: const Interval(0.0, 0.6, curve: Curves.easeOut),
|
||||
));
|
||||
|
||||
|
||||
_slideAnimation = Tween<double>(
|
||||
begin: 50.0,
|
||||
end: 0.0,
|
||||
@@ -69,22 +68,23 @@ class _LoginPageState extends State<LoginPage>
|
||||
parent: _animationController,
|
||||
curve: const Interval(0.2, 0.8, curve: Curves.easeOut),
|
||||
));
|
||||
|
||||
|
||||
_shakeAnimation = Tween<double>(
|
||||
begin: 0.0,
|
||||
end: 1.0,
|
||||
).animate(CurvedAnimation(
|
||||
parent: _shakeController,
|
||||
curve: Curves.elasticInOut,
|
||||
curve: Curves.elasticIn,
|
||||
));
|
||||
}
|
||||
|
||||
void _startEntryAnimation() {
|
||||
Future.delayed(const Duration(milliseconds: 100), () {
|
||||
if (mounted) {
|
||||
_animationController.forward();
|
||||
}
|
||||
});
|
||||
_animationController.forward();
|
||||
}
|
||||
|
||||
void _startShakeAnimation() {
|
||||
_shakeController.reset();
|
||||
_shakeController.forward();
|
||||
}
|
||||
|
||||
@override
|
||||
@@ -100,170 +100,187 @@ class _LoginPageState extends State<LoginPage>
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: AppTheme.backgroundLight,
|
||||
body: BlocListener<AuthBloc, AuthState>(
|
||||
listener: _handleAuthStateChange,
|
||||
child: SafeArea(
|
||||
child: AnimatedBuilder(
|
||||
animation: _animationController,
|
||||
builder: (context, child) {
|
||||
return FadeTransition(
|
||||
opacity: _fadeAnimation,
|
||||
child: Transform.translate(
|
||||
offset: Offset(0, _slideAnimation.value),
|
||||
child: _buildLoginContent(),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
body: BlocConsumer<AuthBloc, AuthState>(
|
||||
listener: (context, state) {
|
||||
setState(() {
|
||||
_isLoading = state.status == AuthStatus.checking;
|
||||
});
|
||||
|
||||
if (state.status == AuthStatus.error) {
|
||||
_startShakeAnimation();
|
||||
_showErrorSnackBar(state.errorMessage ?? 'Erreur de connexion');
|
||||
} else if (state.status == AuthStatus.authenticated) {
|
||||
_showSuccessSnackBar('Connexion réussie !');
|
||||
}
|
||||
},
|
||||
builder: (context, state) {
|
||||
return SafeArea(
|
||||
child: _buildLoginContent(),
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildLoginContent() {
|
||||
return SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(24),
|
||||
child: Column(
|
||||
children: [
|
||||
const SizedBox(height: 60),
|
||||
|
||||
// Header avec logo et titre
|
||||
LoginHeader(
|
||||
onAnimationComplete: () {},
|
||||
),
|
||||
|
||||
const SizedBox(height: 60),
|
||||
|
||||
// Formulaire de connexion
|
||||
AnimatedBuilder(
|
||||
animation: _shakeAnimation,
|
||||
builder: (context, child) {
|
||||
return Transform.translate(
|
||||
offset: Offset(
|
||||
_shakeAnimation.value * 10 *
|
||||
(1 - _shakeAnimation.value) *
|
||||
(1 - _shakeAnimation.value),
|
||||
0,
|
||||
),
|
||||
child: LoginForm(
|
||||
formKey: _formKey,
|
||||
emailController: _emailController,
|
||||
passwordController: _passwordController,
|
||||
obscurePassword: _obscurePassword,
|
||||
rememberMe: _rememberMe,
|
||||
isLoading: _isLoading,
|
||||
onObscureToggle: () {
|
||||
setState(() {
|
||||
_obscurePassword = !_obscurePassword;
|
||||
});
|
||||
HapticFeedback.selectionClick();
|
||||
},
|
||||
onRememberMeToggle: (value) {
|
||||
setState(() {
|
||||
_rememberMe = value;
|
||||
});
|
||||
HapticFeedback.selectionClick();
|
||||
},
|
||||
onSubmit: _handleLogin,
|
||||
),
|
||||
return AnimatedBuilder(
|
||||
animation: _animationController,
|
||||
builder: (context, child) {
|
||||
return Transform.translate(
|
||||
offset: Offset(0, _slideAnimation.value),
|
||||
child: Opacity(
|
||||
opacity: _fadeAnimation.value,
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 24),
|
||||
child: Column(
|
||||
children: [
|
||||
const SizedBox(height: 60),
|
||||
|
||||
// Header avec logo et titre
|
||||
const LoginHeader(),
|
||||
|
||||
const SizedBox(height: 40),
|
||||
|
||||
// Formulaire de connexion
|
||||
AnimatedBuilder(
|
||||
animation: _shakeAnimation,
|
||||
builder: (context, child) {
|
||||
return Transform.translate(
|
||||
offset: Offset(
|
||||
_shakeAnimation.value * 10 *
|
||||
(1 - _shakeAnimation.value) *
|
||||
((_shakeAnimation.value * 10).round() % 2 == 0 ? 1 : -1),
|
||||
0,
|
||||
),
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.1),
|
||||
blurRadius: 20,
|
||||
offset: const Offset(0, 10),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(24),
|
||||
child: LoginForm(
|
||||
formKey: _formKey,
|
||||
emailController: _emailController,
|
||||
passwordController: _passwordController,
|
||||
obscurePassword: _obscurePassword,
|
||||
rememberMe: _rememberMe,
|
||||
isLoading: _isLoading,
|
||||
onObscureToggle: () {
|
||||
setState(() {
|
||||
_obscurePassword = !_obscurePassword;
|
||||
});
|
||||
HapticFeedback.selectionClick();
|
||||
},
|
||||
onRememberMeToggle: (value) {
|
||||
setState(() {
|
||||
_rememberMe = value;
|
||||
});
|
||||
HapticFeedback.selectionClick();
|
||||
},
|
||||
onSubmit: _handleLogin,
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
|
||||
const SizedBox(height: 40),
|
||||
|
||||
// Footer avec liens et informations
|
||||
const LoginFooter(),
|
||||
|
||||
const SizedBox(height: 20),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 40),
|
||||
|
||||
// Footer avec liens et informations
|
||||
const LoginFooter(),
|
||||
|
||||
const SizedBox(height: 20),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
void _handleAuthStateChange(BuildContext context, AuthState state) {
|
||||
setState(() {
|
||||
_isLoading = state.isLoading;
|
||||
});
|
||||
|
||||
if (state.status == AuthStatus.authenticated) {
|
||||
// Connexion réussie - navigation gérée par l'app principal
|
||||
_showSuccessMessage();
|
||||
HapticFeedback.heavyImpact();
|
||||
|
||||
} else if (state.status == AuthStatus.error) {
|
||||
// Erreur de connexion
|
||||
_handleLoginError(state.errorMessage ?? 'Erreur inconnue');
|
||||
|
||||
} else if (state.status == AuthStatus.unauthenticated && state.errorMessage != null) {
|
||||
// Échec de connexion
|
||||
_handleLoginError(state.errorMessage!);
|
||||
}
|
||||
}
|
||||
|
||||
void _handleLogin() {
|
||||
if (!_formKey.currentState!.validate()) {
|
||||
_triggerShakeAnimation();
|
||||
HapticFeedback.mediumImpact();
|
||||
_startShakeAnimation();
|
||||
return;
|
||||
}
|
||||
|
||||
final email = _emailController.text.trim();
|
||||
final password = _passwordController.text;
|
||||
|
||||
if (email.isEmpty || password.isEmpty) {
|
||||
_showErrorMessage('Veuillez remplir tous les champs');
|
||||
_triggerShakeAnimation();
|
||||
return;
|
||||
}
|
||||
|
||||
// Déclencher la connexion
|
||||
HapticFeedback.lightImpact();
|
||||
|
||||
final loginRequest = LoginRequest(
|
||||
email: email,
|
||||
password: password,
|
||||
email: _emailController.text.trim(),
|
||||
password: _passwordController.text,
|
||||
rememberMe: _rememberMe,
|
||||
);
|
||||
|
||||
context.read<AuthBloc>().add(AuthLoginRequested(loginRequest));
|
||||
|
||||
// Feedback haptique
|
||||
HapticFeedback.lightImpact();
|
||||
}
|
||||
|
||||
void _handleLoginError(String errorMessage) {
|
||||
_showErrorMessage(errorMessage);
|
||||
_triggerShakeAnimation();
|
||||
HapticFeedback.mediumImpact();
|
||||
|
||||
// Effacer l'erreur après affichage
|
||||
Future.delayed(const Duration(seconds: 3), () {
|
||||
if (mounted) {
|
||||
context.read<AuthBloc>().add(const AuthErrorCleared());
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
void _triggerShakeAnimation() {
|
||||
_shakeController.reset();
|
||||
_shakeController.forward();
|
||||
}
|
||||
|
||||
void _showSuccessMessage() {
|
||||
void _showErrorSnackBar(String message) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(
|
||||
content: Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.check_circle,
|
||||
const Icon(
|
||||
Icons.error_outline,
|
||||
color: Colors.white,
|
||||
size: 24,
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
const Text(
|
||||
'Connexion réussie !',
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.w600,
|
||||
fontSize: 16,
|
||||
Expanded(
|
||||
child: Text(
|
||||
message,
|
||||
style: const TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
backgroundColor: AppTheme.errorColor,
|
||||
behavior: SnackBarBehavior.floating,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
margin: const EdgeInsets.all(16),
|
||||
duration: const Duration(seconds: 4),
|
||||
action: SnackBarAction(
|
||||
label: 'Fermer',
|
||||
textColor: Colors.white,
|
||||
onPressed: () {
|
||||
ScaffoldMessenger.of(context).hideCurrentSnackBar();
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
void _showSuccessSnackBar(String message) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(
|
||||
content: Row(
|
||||
children: [
|
||||
const Icon(
|
||||
Icons.check_circle_outline,
|
||||
color: Colors.white,
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Text(
|
||||
message,
|
||||
style: const TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
@@ -278,44 +295,4 @@ class _LoginPageState extends State<LoginPage>
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
void _showErrorMessage(String message) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(
|
||||
content: Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.error_outline,
|
||||
color: Colors.white,
|
||||
size: 24,
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Text(
|
||||
message,
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.w600,
|
||||
fontSize: 14,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
backgroundColor: AppTheme.errorColor,
|
||||
behavior: SnackBarBehavior.floating,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
margin: const EdgeInsets.all(16),
|
||||
duration: const Duration(seconds: 4),
|
||||
action: SnackBarAction(
|
||||
label: 'OK',
|
||||
textColor: Colors.white,
|
||||
onPressed: () {
|
||||
ScaffoldMessenger.of(context).hideCurrentSnackBar();
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user