apksel-dev/apskel-pos-flutter-v2
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

login

Browse Source
This commit is contained in:
efrilm
2025-10-24 01:16:50 +07:00
parent 5d9197c986
commit ca5d2a58e7
45 changed files with 3820 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/presentation/components/button/button.dart
+7
View File
@@ -0,0 +1,7 @@
import 'package:flutter/material.dart';
import 'package:flutter_spinkit/flutter_spinkit.dart';
import '../../../common/theme/theme.dart';
import '../spaces/space.dart';
part 'elevated_button.dart';
lib/presentation/components/button/elevated_button.dart
+180
View File
@@ -0,0 +1,180 @@
part of 'button.dart';
enum ButtonStyle { filled, outlined }
class AppElevatedButton extends StatelessWidget {
const AppElevatedButton.filled({
super.key,
required this.onPressed,
required this.label,
this.style = ButtonStyle.filled,
this.color = AppColor.primary,
this.textColor = Colors.white,
this.width,
this.height = 40.0,
this.borderRadius = 16.0,
this.icon,
this.disabled = false,
this.fontSize = 16.0,
this.elevation,
this.labelStyle,
this.mainAxisAlignment = MainAxisAlignment.center,
this.crossAxisAlignment = CrossAxisAlignment.center,
this.isLoading = false,
});
const AppElevatedButton.outlined({
super.key,
required this.onPressed,
required this.label,
this.style = ButtonStyle.outlined,
this.color = Colors.transparent,
this.textColor = AppColor.primary,
this.width,
this.height = 40.0,
this.borderRadius = 16.0,
this.icon,
this.disabled = false,
this.fontSize = 16.0,
this.elevation,
this.labelStyle,
this.mainAxisAlignment = MainAxisAlignment.center,
this.crossAxisAlignment = CrossAxisAlignment.center,
this.isLoading = false,
});
final Function()? onPressed;
final String label;
final ButtonStyle style;
final Color color;
final Color textColor;
final double? width;
final double height;
final double borderRadius;
final double? elevation;
final Widget? icon;
final bool disabled;
final double fontSize;
final TextStyle? labelStyle;
final MainAxisAlignment mainAxisAlignment;
final CrossAxisAlignment crossAxisAlignment;
final bool isLoading;
@override
Widget build(BuildContext context) {
return SizedBox(
height: height,
width: width,
child: style == ButtonStyle.filled
? ElevatedButton(
onPressed: disabled ? null : onPressed,
style: ElevatedButton.styleFrom(
backgroundColor: color,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(borderRadius),
),
elevation: elevation,
padding: const EdgeInsets.symmetric(horizontal: 16.0),
),
child: isLoading
? Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SpinKitFadingCircle(color: textColor, size: fontSize),
const SpaceWidth(10.0),
Text(
'Loading...',
style:
labelStyle ??
TextStyle(
color: disabled ? Colors.grey : textColor,
fontSize: fontSize,
fontWeight: FontWeight.bold,
),
),
],
)
: Row(
mainAxisAlignment: mainAxisAlignment,
crossAxisAlignment: crossAxisAlignment,
children: [
icon ?? const SizedBox.shrink(),
if (icon != null) const SizedBox(width: 10.0),
Flexible(
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
label,
style:
labelStyle ??
TextStyle(
color: disabled ? Colors.grey : textColor,
fontSize: fontSize,
fontWeight: FontWeight.bold,
),
textAlign: TextAlign.center,
),
),
),
],
),
)
: OutlinedButton(
onPressed: disabled ? null : onPressed,
style: OutlinedButton.styleFrom(
backgroundColor: color,
side: const BorderSide(color: AppColor.primary),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(borderRadius),
),
padding: const EdgeInsets.symmetric(horizontal: 16.0),
),
child: isLoading
? Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SpinKitFadingCircle(color: textColor, size: fontSize),
const SpaceWidth(10.0),
Text(
'Loading...',
style:
labelStyle ??
TextStyle(
color: disabled ? Colors.grey : textColor,
fontSize: fontSize,
fontWeight: FontWeight.bold,
),
),
],
)
: Row(
mainAxisAlignment: mainAxisAlignment,
crossAxisAlignment: crossAxisAlignment,
mainAxisSize: MainAxisSize.min,
children: [
icon ?? const SizedBox.shrink(),
if (icon != null) const SizedBox(width: 10.0),
Flexible(
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
label,
style:
labelStyle ??
TextStyle(
color: disabled ? Colors.grey : textColor,
fontSize: fontSize,
fontWeight: FontWeight.w600,
),
textAlign: TextAlign.center,
),
),
),
],
),
),
);
}
}
lib/presentation/components/field/field.dart
+7
View File
@@ -0,0 +1,7 @@
import 'package:flutter/material.dart';
import '../../../common/theme/theme.dart';
import '../spaces/space.dart';
part 'password_text_field.dart';
part 'text_field.dart';
lib/presentation/components/field/password_text_field.dart
+100
View File
@@ -0,0 +1,100 @@
part of 'field.dart';
class AppPasswordTextFormField extends StatefulWidget {
final TextEditingController? controller;
final String label;
final Function(String value)? onChanged;
final TextInputType? keyboardType;
final TextInputAction? textInputAction;
final TextCapitalization? textCapitalization;
final bool showLabel;
final Widget? prefixIcon;
final Widget? suffixIcon;
final bool readOnly;
final int maxLines;
final String? Function(String?)? validator;
const AppPasswordTextFormField({
super.key,
this.controller,
required this.label,
this.onChanged,
this.keyboardType,
this.textInputAction,
this.textCapitalization,
this.showLabel = true,
this.prefixIcon,
this.suffixIcon,
this.readOnly = false,
this.maxLines = 1,
this.validator,
});
@override
State<AppPasswordTextFormField> createState() =>
_AppPasswordTextFormFieldState();
}
class _AppPasswordTextFormFieldState extends State<AppPasswordTextFormField> {
bool isPasswordVisible = true;
@override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (widget.showLabel) ...[
Text(
widget.label,
style: AppStyle.md.copyWith(fontWeight: FontWeight.w700),
),
const SpaceHeight(12.0),
],
TextFormField(
controller: widget.controller,
onChanged: widget.onChanged,
obscureText: isPasswordVisible,
keyboardType: widget.keyboardType,
textInputAction: widget.textInputAction,
textCapitalization:
widget.textCapitalization ?? TextCapitalization.none,
readOnly: widget.readOnly,
maxLines: widget.maxLines,
validator: widget.validator,
decoration: InputDecoration(
prefixIcon: widget.prefixIcon,
suffixIcon: isPasswordVisible
? IconButton(
icon: Icon(
Icons.visibility,
color: AppColor.textSecondary,
size: 20,
),
constraints: const BoxConstraints(),
padding: const EdgeInsets.all(8),
onPressed: () {
setState(() {
isPasswordVisible = !isPasswordVisible;
});
},
)
: IconButton(
icon: Icon(
Icons.visibility_off,
color: AppColor.textSecondary,
size: 20,
),
constraints: const BoxConstraints(),
padding: const EdgeInsets.all(8),
onPressed: () {
setState(() {
isPasswordVisible = !isPasswordVisible;
});
},
),
hintText: widget.label,
),
),
],
);
}
}
lib/presentation/components/field/text_field.dart
+63
View File
@@ -0,0 +1,63 @@
part of 'field.dart';
class AppTextFormField extends StatelessWidget {
final TextEditingController? controller;
final String label;
final Function(String value)? onChanged;
final bool obscureText;
final TextInputType? keyboardType;
final TextInputAction? textInputAction;
final TextCapitalization? textCapitalization;
final bool showLabel;
final Widget? prefixIcon;
final Widget? suffixIcon;
final bool readOnly;
final int maxLines;
final String? Function(String?)? validator;
const AppTextFormField({
super.key,
this.controller,
required this.label,
this.onChanged,
this.obscureText = false,
this.keyboardType,
this.textInputAction,
this.textCapitalization,
this.showLabel = true,
this.prefixIcon,
this.suffixIcon,
this.readOnly = false,
this.maxLines = 1,
this.validator,
});
@override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (showLabel) ...[
Text(label, style: AppStyle.md.copyWith(fontWeight: FontWeight.w700)),
const SpaceHeight(12.0),
],
TextFormField(
controller: controller,
onChanged: onChanged,
obscureText: obscureText,
keyboardType: keyboardType,
textInputAction: textInputAction,
textCapitalization: textCapitalization ?? TextCapitalization.none,
readOnly: readOnly,
maxLines: maxLines,
validator: validator,
decoration: InputDecoration(
prefixIcon: prefixIcon,
suffixIcon: suffixIcon,
hintText: label,
),
),
],
);
}
}
lib/presentation/components/spaces/space.dart
+17
View File
@@ -0,0 +1,17 @@
import 'package:flutter/material.dart';
class SpaceHeight extends StatelessWidget {
final double height;
const SpaceHeight(this.height, {super.key});
@override
Widget build(BuildContext context) => SizedBox(height: height);
}
class SpaceWidth extends StatelessWidget {
final double width;
const SpaceWidth(this.width, {super.key});
@override
Widget build(BuildContext context) => SizedBox(width: width);
}
lib/presentation/components/toast/flushbar.dart
+53
View File
@@ -0,0 +1,53 @@
import 'package:another_flushbar/flushbar.dart';
import 'package:flutter/material.dart';
import '../../../common/theme/theme.dart';
import '../../../domain/auth/auth.dart';
class AppFlushbar {
static void showSuccess(BuildContext context, String message) {
Flushbar(
messageText: Text(
message,
style: AppStyle.md.copyWith(
color: Colors.white,
fontWeight: FontWeight.w700,
),
),
icon: const Icon(Icons.check_circle, color: Colors.white),
duration: const Duration(seconds: 2),
flushbarPosition: FlushbarPosition.BOTTOM,
backgroundColor: AppColor.success,
borderRadius: BorderRadius.circular(12),
margin: const EdgeInsets.all(12),
).show(context);
}
static void showError(BuildContext context, String message) {
Flushbar(
messageText: Text(
message,
style: AppStyle.md.copyWith(
color: Colors.white,
fontWeight: FontWeight.w700,
),
),
icon: const Icon(Icons.error, color: Colors.white),
duration: const Duration(seconds: 3),
flushbarPosition: FlushbarPosition.BOTTOM,
backgroundColor: AppColor.error,
borderRadius: BorderRadius.circular(12),
margin: const EdgeInsets.all(12),
).show(context);
}
static void showAuthFailureToast(BuildContext context, AuthFailure failure) =>
showError(
context,
failure.map(
serverError: (value) => value.failure.toStringFormatted(context),
dynamicErrorMessage: (value) => value.erroMessage,
unexpectedError: (value) => 'Terjadi kesalahan, silahkan coba lagi',
),
);
}
lib/presentation/pages/auth/login/login_page.dart
+106
View File
@@ -0,0 +1,106 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../../../application/auth/bloc/login_form_bloc.dart';
import '../../../../common/constant/app_constant.dart';
import '../../../../common/theme/theme.dart';
import '../../../../injection.dart';
import '../../../components/assets/assets.gen.dart';
import '../../../components/button/button.dart';
import '../../../components/spaces/space.dart';
import '../../../components/toast/flushbar.dart';
import 'widgets/email_field.dart';
import 'widgets/password_field.dart';
@RoutePage()
class LoginPage extends StatelessWidget implements AutoRouteWrapper {
const LoginPage({super.key});
@override
Widget build(BuildContext context) {
return BlocListener<LoginFormBloc, LoginFormState>(
listenWhen: (previous, current) =>
previous.failureOrLoginOption != current.failureOrLoginOption,
listener: (context, state) {
state.failureOrLoginOption.fold(
() => null,
(either) => either.fold(
(f) => AppFlushbar.showAuthFailureToast(context, f),
(data) {
if (context.mounted) {
AppFlushbar.showSuccess(
context,
'Login berhasil! Selamat datang, ${data.user.name}.',
);
// context.read<AuthBloc>().add(AuthEvent.fetchCurrentUser());
// context.router.replace(const MainRoute());
}
},
),
);
},
child: Scaffold(
body: BlocBuilder<LoginFormBloc, LoginFormState>(
builder: (context, state) {
return Form(
autovalidateMode: state.showErrorMessages
? AutovalidateMode.always
: AutovalidateMode.disabled,
child: ListView(
padding: const EdgeInsets.symmetric(
horizontal: 260.0,
vertical: 20.0,
),
children: [
const SpaceHeight(60.0),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 130.0),
child: Assets.images.logo.image(width: 100, height: 100),
),
const SpaceHeight(16.0),
Center(
child: Text(
AppConstant.appName,
style: AppStyle.lg.copyWith(fontWeight: FontWeight.w700),
),
),
const SpaceHeight(8.0),
Center(
child: Text(
'Akses Login Kasir Resto',
style: AppStyle.sm.copyWith(
color: AppColor.textSecondary,
),
),
),
const SpaceHeight(20.0),
LoginEmailField(),
const SpaceHeight(12.0),
LoginPasswordField(),
const SpaceHeight(24.0),
AppElevatedButton.filled(
onPressed: state.isSubmitting
? null
: () => context.read<LoginFormBloc>().add(
LoginFormEvent.submitted(),
),
textColor: state.isSubmitting
? AppColor.primary
: Colors.white,
label: 'Masuk',
isLoading: state.isSubmitting,
),
],
),
);
},
),
),
);
}
@override
Widget wrappedRoute(BuildContext context) =>
BlocProvider(create: (context) => getIt<LoginFormBloc>(), child: this);
}
lib/presentation/pages/auth/login/widgets/email_field.dart
+23
View File
@@ -0,0 +1,23 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../../../../application/auth/bloc/login_form_bloc.dart';
import '../../../../../common/validator/validator.dart';
import '../../../../components/field/field.dart';
class LoginEmailField extends StatelessWidget {
const LoginEmailField({super.key});
@override
Widget build(BuildContext context) {
return AppTextFormField(
label: 'Email',
keyboardType: TextInputType.emailAddress,
textInputAction: TextInputAction.next,
validator: (value) =>
AppValidator.validateEmail(context.read<LoginFormBloc>().state.email),
onChanged: (value) =>
context.read<LoginFormBloc>().add(LoginFormEvent.emailChanged(value)),
);
}
}
lib/presentation/pages/auth/login/widgets/password_field.dart
+25
View File
@@ -0,0 +1,25 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../../../../application/auth/bloc/login_form_bloc.dart';
import '../../../../../common/validator/validator.dart';
import '../../../../components/field/field.dart';
class LoginPasswordField extends StatelessWidget {
const LoginPasswordField({super.key});
@override
Widget build(BuildContext context) {
return AppPasswordTextFormField(
label: 'Password',
keyboardType: TextInputType.visiblePassword,
textInputAction: TextInputAction.done,
validator: (value) => AppValidator.validatePassword(
context.read<LoginFormBloc>().state.password,
),
onChanged: (value) => context.read<LoginFormBloc>().add(
LoginFormEvent.passwordChanged(value),
),
);
}
}
lib/presentation/pages/splash/splash_page.dart
+25 -1
View File
@@ -1,6 +1,9 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import '../../components/assets/assets.gen.dart';
import '../../router/app_router.gr.dart';
@RoutePage()
class SplashPage extends StatefulWidget {
const SplashPage({super.key});
@@ -10,8 +13,29 @@ class SplashPage extends StatefulWidget {
}
class _SplashPageState extends State<SplashPage> {
_startDelay() => Future.delayed(const Duration(seconds: 2), _goNext);
_goNext() => context.router.replace(const LoginRoute());
@override
void initState() {
_startDelay();
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(body: Center(child: Text("Splash Page")));
return Scaffold(
body: Center(
child: Padding(
padding: const EdgeInsets.all(20),
child: Assets.images.logo.image(
width: 100,
height: 100,
fit: BoxFit.contain,
),
),
),
);
}
}
lib/presentation/router/app_router.dart
+6 -3
View File
@@ -5,7 +5,10 @@ import 'app_router.gr.dart';
class AppRouter extends RootStackRouter {
@override
List<AutoRoute> get routes => [
// Splash
AutoRoute(page: SplashRoute.page, initial: true),
];
// Splash
AutoRoute(page: SplashRoute.page, initial: true),
// Router
AutoRoute(page: LoginRoute.page),
];
}
lib/presentation/router/app_router.gr.dart
+25 -7
View File
@@ -9,22 +9,40 @@
// coverage:ignore-file
// ignore_for_file: no_leading_underscores_for_library_prefixes
import 'package:apskel_pos_flutter_v2/presentation/pages/splash/splash_page.dart'
import 'package:apskel_pos_flutter_v2/presentation/pages/auth/login/login_page.dart'
as _i1;
import 'package:auto_route/auto_route.dart' as _i2;
import 'package:apskel_pos_flutter_v2/presentation/pages/splash/splash_page.dart'
as _i2;
import 'package:auto_route/auto_route.dart' as _i3;
/// generated route for
/// [_i1.SplashPage]
class SplashRoute extends _i2.PageRouteInfo<void> {
const SplashRoute({List<_i2.PageRouteInfo>? children})
/// [_i1.LoginPage]
class LoginRoute extends _i3.PageRouteInfo<void> {
const LoginRoute({List<_i3.PageRouteInfo>? children})
: super(LoginRoute.name, initialChildren: children);
static const String name = 'LoginRoute';
static _i3.PageInfo page = _i3.PageInfo(
name,
builder: (data) {
return const _i1.LoginPage();
},
);
}
/// generated route for
/// [_i2.SplashPage]
class SplashRoute extends _i3.PageRouteInfo<void> {
const SplashRoute({List<_i3.PageRouteInfo>? children})
: super(SplashRoute.name, initialChildren: children);
static const String name = 'SplashRoute';
static _i2.PageInfo page = _i2.PageInfo(
static _i3.PageInfo page = _i3.PageInfo(
name,
builder: (data) {
return const _i1.SplashPage();
return const _i2.SplashPage();
},
);
}