proxibuy/lib/presentation/pages/login_page.dart

201 lines
7.1 KiB
Dart

// lib/presentation/pages/login_page.dart
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:country_picker/country_picker.dart';
import 'package:proxibuy/presentation/auth/bloc/auth_bloc.dart';
import 'package:proxibuy/presentation/pages/otp_page.dart';
import '../../core/config/app_colors.dart';
import '../../core/gen/assets.gen.dart';
class LoginPage extends StatefulWidget {
const LoginPage({super.key});
@override
State<LoginPage> createState() => _LoginPageState();
}
class _LoginPageState extends State<LoginPage> {
final TextEditingController _phoneController = TextEditingController();
Country _selectedCountry = Country.parse('IR');
bool _keepSignedIn = false;
@override
void dispose() {
_phoneController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
final textTheme = Theme.of(context).textTheme;
return Directionality(
textDirection: TextDirection.rtl,
child: Scaffold(
backgroundColor: Colors.white,
body: SafeArea(
child: SingleChildScrollView(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 32),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Center(child: Assets.icons.logo.svg(height: 160)),
const SizedBox(height: 48),
Text(
"ورود",
style: textTheme.headlineMedium?.copyWith(
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 48),
TextField(
readOnly: true,
controller: TextEditingController(
text: _selectedCountry.name,
),
onTap: _showCountryPicker,
decoration: InputDecoration(
labelText: "کشور",
prefixIcon: Padding(
padding: const EdgeInsets.only(
left: 12.0,
right: 8.0,
top: 7,
),
child: Text(
_selectedCountry.flagEmoji,
style: const TextStyle(fontSize: 24),
),
),
suffixIcon: const Icon(Icons.keyboard_arrow_down_rounded),
),
),
const SizedBox(height: 16),
TextField(
controller: _phoneController,
keyboardType: TextInputType.phone,
textDirection: TextDirection.ltr,
textAlign: TextAlign.left,
decoration: InputDecoration(
labelText: "شماره موبایل",
hintText: "- - - - - - - - - -",
suffix: Padding(
padding: const EdgeInsets.symmetric(horizontal: 2.0),
child: Text(
_selectedCountry.phoneCode,
style: textTheme.bodyLarge?.copyWith(
color: Colors.black,
),
),
),
),
),
const SizedBox(height: 16),
Row(
children: [
Checkbox(
value: _keepSignedIn,
onChanged: (value) =>
setState(() => _keepSignedIn = value ?? false),
activeColor: AppColors.primary,
),
Text("مرا به خاطر بسپار", style: textTheme.bodyMedium),
],
),
const SizedBox(height: 24),
BlocConsumer<AuthBloc, AuthState>(
listener: (context, state) {
if (state is AuthFailure) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(state.message),
backgroundColor: Colors.red,
),
);
}
if (state is AuthCodeSentSuccess) {
final fullPhoneNumber = "0${_phoneController.text}";
Navigator.push(
context,
MaterialPageRoute(
builder: (_) =>
OtpPage(phoneNumber: fullPhoneNumber)));
}
},
builder: (context, state) {
if (state is AuthLoading) {
return const Center(child: CircularProgressIndicator());
}
return SizedBox(
width: double.infinity,
child: ElevatedButton(
onPressed: _sendOtp,
child: const Text("کد یکبار مصرف"),
),
);
},
),
const SizedBox(height: 32),
Row(
children: [
const Expanded(child: Divider()),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Text(
"یا ادامه با",
style: textTheme.bodyMedium?.copyWith(
color: Colors.grey,
),
),
),
const Expanded(child: Divider()),
],
),
const SizedBox(height: 32),
SizedBox(
width: double.infinity,
child: OutlinedButton.icon(
icon: Assets.icons.googleSvg.svg(width: 24),
label: const Text(
"ورود با حساب گوگل",
style: TextStyle(color: Colors.black),
),
onPressed: () {
// TODO: Implement Google Sign-in
},
),
),
],
),
),
),
),
);
}
void _showCountryPicker() {
showCountryPicker(
context: context,
countryListTheme: CountryListThemeData(
bottomSheetHeight: 500,
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(20),
),
inputDecoration: InputDecoration(
labelText: 'جستجو',
hintText: 'کشور مورد نظر را جستجو کنید',
prefixIcon: const Icon(Icons.search),
),
),
onSelect: (Country country) => setState(() => _selectedCountry = country),
);
}
void _sendOtp() {
context
.read<AuthBloc>()
.add(SendOTPEvent(phoneNumber: _phoneController.text));
}
}