test
This commit is contained in:
@@ -1,74 +1,105 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/widgets.dart';
|
||||
import 'package:flutter_spinkit/flutter_spinkit.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:oc_front/core/services/auth.service.dart';
|
||||
import 'package:oc_front/main.dart';
|
||||
|
||||
class LoginWidget extends StatefulWidget {
|
||||
LoginWidget ({ Key? key }): super(key: key);
|
||||
@override LoginWidgetState createState() => LoginWidgetState();
|
||||
}
|
||||
class LoginWidgetState extends State<LoginWidget> {
|
||||
TextEditingController usernameCtrl = TextEditingController();
|
||||
TextEditingController passwordCtrl = TextEditingController();
|
||||
|
||||
String? error;
|
||||
bool loading = false;
|
||||
|
||||
@override Widget build(BuildContext context) {
|
||||
return AlertDialog(
|
||||
backgroundColor: Colors.white,
|
||||
shape: const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(0))),
|
||||
content: Padding(padding: const EdgeInsets.all(20), child: Column(mainAxisSize: MainAxisSize.min, children: [
|
||||
const Center(child: Padding( padding: EdgeInsets.only(bottom: 10),
|
||||
child: Icon(Icons.person_search, size: 80, color: Colors.grey,))),
|
||||
const Center(child: Text("WELCOME ON OPENCLOUD", style: TextStyle(fontSize: 25, fontWeight: FontWeight.w600,
|
||||
color: Color.fromRGBO(38, 166, 154, 1)),)),
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 20),
|
||||
decoration: BoxDecoration(border: Border(bottom: BorderSide(color: Colors.black))),
|
||||
),
|
||||
return Padding(padding: const EdgeInsets.all(50), child: Column(mainAxisSize: MainAxisSize.min, children: [
|
||||
const Center(child: Icon(Icons.person_search, size: 150, color: Colors.grey,)),
|
||||
Center(child: Padding( padding: const EdgeInsets.only(top: 5, bottom: 20),
|
||||
child: Text("WELCOME ON OPENCLOUD", style: TextStyle(fontSize: 25, fontWeight: FontWeight.w600,
|
||||
color: lightColor ) ))),
|
||||
Container( margin: const EdgeInsets.only(bottom: 10), child: Center(child: Row( mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Container(
|
||||
width: MediaQuery.of(context).size.width / 3,
|
||||
width: getMainWidth(context) / 3,
|
||||
alignment : Alignment.center,
|
||||
child: TextField(
|
||||
controller: usernameCtrl,
|
||||
onChanged: (v) => setState(() {}),
|
||||
decoration: InputDecoration(
|
||||
enabledBorder: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
|
||||
border: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
|
||||
focusedBorder: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
|
||||
enabledBorder: OutlineInputBorder(borderSide: BorderSide(color: midColor), borderRadius: BorderRadius.zero),
|
||||
border: OutlineInputBorder(borderSide: BorderSide(color: midColor), borderRadius: BorderRadius.zero),
|
||||
focusedBorder: OutlineInputBorder(borderSide: BorderSide(color: midColor), borderRadius: BorderRadius.zero),
|
||||
hintText: "username...",
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 20),
|
||||
fillColor: Colors.grey.shade300,
|
||||
fillColor: midColor,
|
||||
filled: true,
|
||||
hintStyle: const TextStyle(fontSize: 12.5, color: Colors.grey)),
|
||||
style: const TextStyle(fontSize: 12.5, color: Colors.grey)),),
|
||||
style: const TextStyle(fontSize: 12.5, color: Colors.black)),),
|
||||
Container(width: 50, height: 50, color: Colors.black, child: const Icon(Icons.person, color: Colors.white))
|
||||
]))),
|
||||
Container( margin: const EdgeInsets.only(bottom: 20), child: Center(child: Row( mainAxisAlignment: MainAxisAlignment.center,
|
||||
Center(child: Row( mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Container(
|
||||
width: MediaQuery.of(context).size.width / 3,
|
||||
width: getMainWidth(context) / 3,
|
||||
alignment : Alignment.center,
|
||||
child: TextField(
|
||||
controller: passwordCtrl,
|
||||
obscureText: true,
|
||||
onChanged: (value) {
|
||||
setState(() {});
|
||||
},
|
||||
decoration: InputDecoration(
|
||||
focusedBorder: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
|
||||
enabledBorder: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
|
||||
border: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
|
||||
focusedBorder: OutlineInputBorder(borderSide: BorderSide(color: midColor), borderRadius: BorderRadius.zero),
|
||||
enabledBorder: OutlineInputBorder(borderSide: BorderSide(color: midColor), borderRadius: BorderRadius.zero),
|
||||
border: OutlineInputBorder(borderSide: BorderSide(color: midColor), borderRadius: BorderRadius.zero),
|
||||
hintText: "password...",
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 20),
|
||||
fillColor: Colors.grey.shade300,
|
||||
fillColor: midColor,
|
||||
filled: true,
|
||||
hintStyle: const TextStyle(fontSize: 12.5, color: Colors.grey)),
|
||||
style: const TextStyle(fontSize: 12.5, color: Colors.grey)),),
|
||||
style: const TextStyle(fontSize: 12.5, color: Colors.black)),),
|
||||
Container(width: 50, height: 50, color: Colors.black, child: const Icon(Icons.password, color: Colors.white))
|
||||
]))),
|
||||
Row( mainAxisAlignment: MainAxisAlignment.center, children: [
|
||||
Padding( padding: const EdgeInsets.only(right: 10), child:
|
||||
InkWell(onTap: () { context.pop(); },
|
||||
mouseCursor: SystemMouseCursors.click,
|
||||
child: Container(
|
||||
margin: const EdgeInsets.only(top: 20),
|
||||
width: MediaQuery.of(context).size.width / 3,
|
||||
padding: const EdgeInsets.symmetric(vertical: 20),
|
||||
color: const Color.fromRGBO(38, 166, 154, 1),
|
||||
child: const Center( child: Text("LOGIN", style: TextStyle(color: Colors.white, fontSize: 15),))))),
|
||||
])
|
||||
],)));
|
||||
])),
|
||||
Column( children: [
|
||||
Center( child: Padding( padding: EdgeInsets.only(bottom: 10, top: error == null ? 27 : 10), child:
|
||||
error == null ? Container() : Text(error ?? "", style: TextStyle(color: redColor, fontSize: 12.5)))),
|
||||
Row( mainAxisAlignment: MainAxisAlignment.center, children: [
|
||||
Padding( padding: const EdgeInsets.only(right: 10, bottom: 30), child:
|
||||
InkWell(onTap: () async {
|
||||
if (usernameCtrl.text == "" || passwordCtrl.text == "") { return; }
|
||||
error = null;
|
||||
setState(() {
|
||||
loading = true;
|
||||
});
|
||||
await AuthService.login(usernameCtrl.text, passwordCtrl.text).catchError( (e) {
|
||||
setState(() {
|
||||
loading = false;
|
||||
error = "Invalid username or password";
|
||||
});
|
||||
});
|
||||
|
||||
if (error == null) {
|
||||
// ignore: use_build_context_synchronously
|
||||
setState(() {
|
||||
loading = true;
|
||||
});
|
||||
context.pop();
|
||||
}
|
||||
},
|
||||
mouseCursor: SystemMouseCursors.click,
|
||||
child: Container(
|
||||
width: getMainWidth(context) / 3,
|
||||
padding: const EdgeInsets.symmetric(vertical: 20),
|
||||
color: usernameCtrl.text == "" || passwordCtrl.text == "" ? Colors.grey : lightColor,
|
||||
child: Center( child: loading ? SpinKitWave(color: Colors.white, size: 20) : Text("LOGIN", style: TextStyle(
|
||||
color: usernameCtrl.text == "" || passwordCtrl.text == "" ? midColor :Colors.white,
|
||||
fontSize: 15) ))))),
|
||||
])
|
||||
]),
|
||||
],));
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user