420 lines
19 KiB
Dart
420 lines
19 KiB
Dart
import 'package:flutter/material.dart';
|
||
import 'package:flutter_easyloading/flutter_easyloading.dart';
|
||
import 'package:flutter_feather_icons/flutter_feather_icons.dart';
|
||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||
import 'package:flutter_svg/svg.dart';
|
||
import 'package:mobile_pos/Const/api_config.dart';
|
||
import 'package:mobile_pos/GlobalComponents/button_global.dart';
|
||
import 'package:mobile_pos/GlobalComponents/glonal_popup.dart';
|
||
import 'package:mobile_pos/Screens/Authentication/Sign%20In/webview_login.dart';
|
||
import 'package:mobile_pos/generated/l10n.dart' as lang;
|
||
import 'package:shared_preferences/shared_preferences.dart';
|
||
|
||
import '../../../constant.dart';
|
||
import '../../../service/check_user_role_permission_provider.dart';
|
||
import '../Sign Up/sign_up_screen.dart';
|
||
import '../forgot password/forgot_password.dart';
|
||
import 'Repo/sign_in_repo.dart';
|
||
import '../../../Repository/check_addon_providers.dart';
|
||
|
||
class SignIn extends StatefulWidget {
|
||
const SignIn({super.key});
|
||
|
||
@override
|
||
State<SignIn> createState() => _SignInState();
|
||
}
|
||
|
||
class _SignInState extends State<SignIn> {
|
||
bool showPassword = true;
|
||
bool _isChecked = false;
|
||
|
||
///__________variables_____________
|
||
bool isClicked = false;
|
||
|
||
final key = GlobalKey<FormState>();
|
||
|
||
TextEditingController emailController = TextEditingController();
|
||
TextEditingController passwordController = TextEditingController();
|
||
|
||
@override
|
||
void initState() {
|
||
super.initState();
|
||
_loadUserCredentials();
|
||
}
|
||
|
||
@override
|
||
void dispose() {
|
||
super.dispose();
|
||
emailController.dispose();
|
||
passwordController.dispose();
|
||
}
|
||
|
||
void _loadUserCredentials() async {
|
||
SharedPreferences prefs = await SharedPreferences.getInstance();
|
||
setState(() {
|
||
_isChecked = prefs.getBool('remember_me') ?? false;
|
||
if (_isChecked) {
|
||
emailController.text = prefs.getString('email') ?? '';
|
||
passwordController.text = prefs.getString('password') ?? '';
|
||
}
|
||
});
|
||
}
|
||
|
||
void _saveUserCredentials() async {
|
||
SharedPreferences prefs = await SharedPreferences.getInstance();
|
||
prefs.setBool('remember_me', _isChecked);
|
||
if (_isChecked) {
|
||
prefs.setString('email', emailController.text);
|
||
prefs.setString('password', passwordController.text);
|
||
} else {
|
||
prefs.remove('email');
|
||
prefs.remove('password');
|
||
}
|
||
}
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
TextTheme textTheme = Theme.of(context).textTheme;
|
||
final _theme = Theme.of(context);
|
||
return GlobalPopup(
|
||
child: Consumer(
|
||
builder: (_, ref, watch) {
|
||
final socialNetworkProvider = ref.watch(socialLoginCheckProvider);
|
||
return Scaffold(
|
||
backgroundColor: kWhite,
|
||
appBar: AppBar(
|
||
surfaceTintColor: kWhite,
|
||
centerTitle: false,
|
||
automaticallyImplyLeading: false,
|
||
backgroundColor: kWhite,
|
||
titleSpacing: 16,
|
||
title: Text(
|
||
// 'Sign in',
|
||
lang.S.of(context).signIn,
|
||
),
|
||
),
|
||
body: SingleChildScrollView(
|
||
child: Padding(
|
||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
|
||
child: Form(
|
||
key: key,
|
||
child: Column(
|
||
crossAxisAlignment: CrossAxisAlignment.center,
|
||
children: [
|
||
const NameWithLogo(),
|
||
// const SizedBox(height: 24),
|
||
// Text(
|
||
// // 'Welcome back!',f
|
||
// lang.S.of(context).welcomeBack,
|
||
// style: textTheme.titleMedium?.copyWith(fontSize: 24.0, fontWeight: FontWeight.w600),
|
||
// ),
|
||
// Text(
|
||
// lang.S.of(context).pleaseEnterYourDetails,
|
||
// //'Please enter your details.',
|
||
// style: textTheme.bodyMedium?.copyWith(color: kGreyTextColor, fontSize: 16),
|
||
// ),
|
||
const SizedBox(height: 34.0),
|
||
TextFormField(
|
||
controller: emailController,
|
||
keyboardType: TextInputType.emailAddress,
|
||
decoration: InputDecoration(
|
||
floatingLabelBehavior: FloatingLabelBehavior.always,
|
||
// labelText: 'Email',
|
||
labelText: lang.S.of(context).lableEmail,
|
||
//hintText: 'Enter email address',
|
||
hintText: lang.S.of(context).hintEmail,
|
||
),
|
||
validator: (value) {
|
||
if (value == null || value.isEmpty) {
|
||
// return 'Email can\'t be empty';
|
||
return lang.S.of(context).emailCannotBeEmpty;
|
||
} else if (!value.contains('@')) {
|
||
//return 'Please enter a valid email';
|
||
return lang.S.of(context).pleaseEnterAValidEmail;
|
||
}
|
||
return null;
|
||
},
|
||
),
|
||
const SizedBox(height: 20.0),
|
||
TextFormField(
|
||
controller: passwordController,
|
||
keyboardType: TextInputType.text,
|
||
obscureText: showPassword,
|
||
decoration: InputDecoration(
|
||
//labelText: 'Password',
|
||
labelText: lang.S.of(context).lablePassword,
|
||
//hintText: 'Enter password',
|
||
hintText: lang.S.of(context).hintPassword,
|
||
suffixIcon: IconButton(
|
||
onPressed: () {
|
||
setState(() {
|
||
showPassword = !showPassword;
|
||
});
|
||
},
|
||
icon: Icon(
|
||
showPassword ? FeatherIcons.eyeOff : FeatherIcons.eye,
|
||
color: kGreyTextColor,
|
||
size: 18,
|
||
),
|
||
),
|
||
),
|
||
validator: (value) {
|
||
if (value == null || value.isEmpty) {
|
||
// return 'Password can\'t be empty';
|
||
return lang.S.of(context).passwordCannotBeEmpty;
|
||
} else if (value.length < 6) {
|
||
//return 'Please enter a bigger password';
|
||
return lang.S.of(context).pleaseEnterABiggerPassword;
|
||
}
|
||
return null;
|
||
},
|
||
),
|
||
const SizedBox(height: 4.0),
|
||
Row(
|
||
children: [
|
||
Checkbox(
|
||
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
|
||
checkColor: Colors.white,
|
||
activeColor: kMainColor,
|
||
shape: RoundedRectangleBorder(
|
||
borderRadius: BorderRadius.circular(3.0),
|
||
),
|
||
fillColor: WidgetStateProperty.all(_isChecked ? kMainColor : Colors.transparent),
|
||
visualDensity: const VisualDensity(horizontal: -4),
|
||
side: const BorderSide(color: kGreyTextColor),
|
||
value: _isChecked,
|
||
onChanged: (newValue) {
|
||
setState(() {
|
||
_isChecked = newValue!;
|
||
});
|
||
},
|
||
),
|
||
const SizedBox(width: 8.0),
|
||
Text(
|
||
lang.S.of(context).rememberMe,
|
||
//'Remember me',
|
||
style: textTheme.bodyMedium?.copyWith(color: kGreyTextColor),
|
||
),
|
||
const Spacer(),
|
||
TextButton(
|
||
style: ButtonStyle(
|
||
shape: WidgetStateProperty.all(
|
||
RoundedRectangleBorder(
|
||
borderRadius: BorderRadius.circular(6.0),
|
||
),
|
||
),
|
||
),
|
||
onPressed: () => Navigator.push(
|
||
context,
|
||
MaterialPageRoute(
|
||
builder: (context) => const ForgotPassword(),
|
||
),
|
||
),
|
||
child: Text(
|
||
lang.S.of(context).forgotPassword,
|
||
//'Forgot password?',
|
||
style: textTheme.bodyMedium?.copyWith(fontWeight: FontWeight.bold, fontSize: 14),
|
||
),
|
||
),
|
||
],
|
||
),
|
||
const SizedBox(height: 24.0),
|
||
ElevatedButton(
|
||
style: OutlinedButton.styleFrom(
|
||
maximumSize: const Size(double.infinity, 48),
|
||
minimumSize: const Size(double.infinity, 48),
|
||
disabledBackgroundColor: _theme.colorScheme.primary.withValues(alpha: 0.15),
|
||
),
|
||
onPressed: () async {
|
||
if (isClicked) {
|
||
return;
|
||
}
|
||
if (key.currentState?.validate() ?? false) {
|
||
isClicked = true;
|
||
EasyLoading.show();
|
||
LogInRepo repo = LogInRepo();
|
||
if (await repo.logIn(
|
||
email: emailController.text, password: passwordController.text, context: context)) {
|
||
_saveUserCredentials();
|
||
EasyLoading.showSuccess(lang.S.of(context).done);
|
||
} else {
|
||
isClicked = false;
|
||
}
|
||
}
|
||
},
|
||
child: Text(
|
||
lang.S.of(context).logIn,
|
||
maxLines: 1,
|
||
overflow: TextOverflow.ellipsis,
|
||
style: _theme.textTheme.bodyMedium?.copyWith(
|
||
color: _theme.colorScheme.primaryContainer,
|
||
fontWeight: FontWeight.w600,
|
||
fontSize: 16,
|
||
),
|
||
),
|
||
),
|
||
const SizedBox(height: 16),
|
||
Column(
|
||
mainAxisSize: MainAxisSize.min,
|
||
crossAxisAlignment: CrossAxisAlignment.center,
|
||
mainAxisAlignment: MainAxisAlignment.center,
|
||
children: [
|
||
InkWell(
|
||
highlightColor: kMainColor.withValues(alpha: 0.1),
|
||
borderRadius: BorderRadius.circular(3.0),
|
||
onTap: () {
|
||
Navigator.push(context, MaterialPageRoute(
|
||
builder: (context) {
|
||
return const SignUpScreen();
|
||
},
|
||
));
|
||
},
|
||
hoverColor: kMainColor.withValues(alpha: 0.1),
|
||
child: RichText(
|
||
text: TextSpan(
|
||
text: lang.S.of(context).donNotHaveAnAccount,
|
||
//'Don’t have an account? ',
|
||
style: textTheme.bodyMedium?.copyWith(color: kGreyTextColor),
|
||
children: [
|
||
TextSpan(
|
||
text: lang.S.of(context).signUp,
|
||
// text:'Sign Up',
|
||
style:
|
||
textTheme.bodyMedium?.copyWith(color: kMainColor, fontWeight: FontWeight.bold),
|
||
)
|
||
],
|
||
),
|
||
),
|
||
),
|
||
],
|
||
),
|
||
socialNetworkProvider.when(data: (isEnable) {
|
||
if (isEnable) {
|
||
return Column(
|
||
children: [
|
||
SizedBox(height: 20),
|
||
// Divider
|
||
SizedBox(
|
||
height: 28,
|
||
child: Row(
|
||
mainAxisAlignment: MainAxisAlignment.center,
|
||
spacing: 6,
|
||
children: [
|
||
Expanded(child: Divider()),
|
||
Text(
|
||
lang.S.of(context).orContinueWith,
|
||
style: _theme.textTheme.bodyLarge,
|
||
),
|
||
Expanded(child: Divider()),
|
||
],
|
||
),
|
||
),
|
||
const SizedBox.square(dimension: 30),
|
||
// Social Login
|
||
Row(
|
||
spacing: 16,
|
||
children: [
|
||
// Facebook
|
||
Expanded(
|
||
child: OutlinedButton.icon(
|
||
onPressed: () {
|
||
///_________-This is a _ repo________________________
|
||
Navigator.push(
|
||
context,
|
||
MaterialPageRoute(
|
||
builder: (context) => WebViewLogin(
|
||
loginUrl: "${APIConfig.domain}login/x?platform=app",
|
||
),
|
||
),
|
||
);
|
||
},
|
||
style: ElevatedButton.styleFrom(
|
||
padding: EdgeInsets.symmetric(horizontal: 8),
|
||
minimumSize: Size(double.infinity, 48),
|
||
side: const BorderSide(color: kBorder),
|
||
foregroundColor: _theme.colorScheme.onPrimaryContainer,
|
||
),
|
||
label: Text(
|
||
lang.S.of(context).loginX,
|
||
textAlign: TextAlign.center,
|
||
style: _theme.textTheme.titleMedium?.copyWith(
|
||
fontWeight: FontWeight.w600,
|
||
),
|
||
),
|
||
icon: Container(
|
||
height: 26,
|
||
width: 26,
|
||
decoration: BoxDecoration(
|
||
shape: BoxShape.circle,
|
||
image:
|
||
DecorationImage(fit: BoxFit.cover, image: AssetImage('images/x.png'))),
|
||
),
|
||
),
|
||
),
|
||
|
||
// Google
|
||
Expanded(
|
||
child: OutlinedButton.icon(
|
||
onPressed: () {
|
||
Navigator.push(
|
||
context,
|
||
MaterialPageRoute(
|
||
builder: (context) => WebViewLogin(
|
||
loginUrl: "${APIConfig.domain}login/google?platform=app",
|
||
),
|
||
),
|
||
);
|
||
},
|
||
style: ElevatedButton.styleFrom(
|
||
padding: EdgeInsets.symmetric(
|
||
horizontal: 8,
|
||
),
|
||
minimumSize: Size(double.infinity, 48),
|
||
side: const BorderSide(color: kBorder),
|
||
foregroundColor: _theme.colorScheme.onPrimaryContainer,
|
||
),
|
||
label: Text(
|
||
lang.S.of(context).loginGoogle,
|
||
textAlign: TextAlign.center,
|
||
style: _theme.textTheme.titleMedium?.copyWith(
|
||
color: Colors.black,
|
||
fontWeight: FontWeight.w600,
|
||
),
|
||
),
|
||
icon: SvgPicture.asset(
|
||
'assets/google.svg',
|
||
width: 26,
|
||
),
|
||
),
|
||
),
|
||
],
|
||
),
|
||
],
|
||
);
|
||
} else {
|
||
return SizedBox.shrink();
|
||
}
|
||
}, error: (e, stack) {
|
||
return Center(
|
||
child: Text(e.toString()),
|
||
);
|
||
}, loading: () {
|
||
return Center(
|
||
child: Padding(
|
||
padding: const EdgeInsets.all(20.0),
|
||
child: CircularProgressIndicator(),
|
||
),
|
||
);
|
||
}),
|
||
],
|
||
),
|
||
),
|
||
),
|
||
),
|
||
);
|
||
},
|
||
),
|
||
);
|
||
}
|
||
}
|