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

feat: update home page

Browse Source
This commit is contained in:
efrilm
2025-07-31 23:22:34 +07:00
parent 805673755b
commit 8767f02109
11 changed files with 552 additions and 797 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/presentation/home/widgets/custom_tab_bar.dart
+5 -7
View File
@@ -105,17 +105,15 @@ class CustomTabBarV2 extends StatelessWidget {
child: TabBar(
isScrollable: true,
tabAlignment: TabAlignment.start,
labelColor: Colors.white,
labelColor: AppColors.primary,
labelStyle: TextStyle(
fontWeight: FontWeight.bold,
),
dividerColor: Colors.transparent,
dividerColor: AppColors.primary,
unselectedLabelColor: AppColors.primary,
indicator: BoxDecoration(
color: AppColors.primary, // Warna button saat aktif
borderRadius: BorderRadius.circular(8),
),
indicatorColor: Colors.transparent,
indicatorSize: TabBarIndicatorSize.label,
indicatorWeight: 4,
indicatorColor: AppColors.primary,
tabs: tabTitles
.map((title) => Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
lib/presentation/home/widgets/home_right_title.dart
+84 -28
View File
@@ -22,36 +22,92 @@ class HomeRightTitle extends StatelessWidget {
),
),
),
child: Row(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Expanded(
child: Button.filled(
width: 180.0,
height: context.deviceHeight,
elevation: 0,
onPressed: () {},
label: 'List Order',
),
Row(
children: [
Expanded(
child: Button.filled(
width: 180.0,
height: 40,
elevation: 0,
onPressed: () {},
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
icon: Icon(
Icons.list,
color: Colors.white,
size: 24,
),
label: 'Daftar Pesanan',
),
),
Expanded(
child: Button.filled(
width: 180.0,
height: 40,
elevation: 0,
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
icon: Icon(
Icons.person_outline,
color: Colors.white,
size: 24,
),
onPressed: () {
if (table == null) {
context.push(DashboardPage(
index: 1,
));
}
},
label: 'Pelanggan',
),
),
],
),
Container(
width: 1,
height: context.deviceHeight,
color: Colors.white,
),
Expanded(
child: Button.filled(
width: 180.0,
height: context.deviceHeight,
elevation: 0,
onPressed: () {
if (table == null) {
context.push(DashboardPage(
index: 1,
));
}
},
label: table == null ? 'Pilih Meja' : '${table!.id}',
),
Row(
children: [
Expanded(
child: Button.filled(
width: 180.0,
height: 40,
elevation: 0,
onPressed: () {},
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
icon: Icon(
Icons.dinner_dining_outlined,
color: Colors.white,
size: 24,
),
label: 'Dine In',
),
),
Expanded(
child: Button.filled(
width: 180.0,
height: 40,
elevation: 0,
icon: Icon(
Icons.table_restaurant_outlined,
color: Colors.white,
size: 24,
),
onPressed: () {
if (table == null) {
context.push(DashboardPage(
index: 1,
));
}
},
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
label: table == null ? 'Pilih Meja' : '${table!.id}',
),
),
],
),
],
),
lib/presentation/home/widgets/home_title.dart
+8 -28
View File
@@ -1,6 +1,5 @@
import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
import 'package:flutter/material.dart';
import 'package:enaklo_pos/core/extensions/date_time_ext.dart';
import '../../../core/components/search_input.dart';
import '../../../core/constants/colors.dart';
@@ -21,37 +20,18 @@ class HomeTitle extends StatelessWidget {
height: context.deviceHeight * 0.1,
padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 12.0),
decoration: BoxDecoration(
color: AppColors.primary,
color: AppColors.white,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Icon(Icons.store, color: AppColors.white, size: 32.0),
SizedBox(width: 12),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Enaklo POS',
style: TextStyle(
color: AppColors.white,
fontSize: 22,
fontWeight: FontWeight.w600,
),
),
Text(
DateTime.now().toFormattedDate(),
style: TextStyle(
color: Colors.grey.shade300,
fontSize: 16,
),
),
],
),
],
const Text(
'DEFAULT OUTLET',
style: TextStyle(
color: AppColors.primary,
fontSize: 28,
fontWeight: FontWeight.w600,
),
),
SizedBox(
width: 300.0,
lib/presentation/home/widgets/order_menu.dart
+71 -203
View File
@@ -6,174 +6,41 @@ import 'package:enaklo_pos/core/extensions/int_ext.dart';
import 'package:enaklo_pos/core/extensions/string_ext.dart';
import 'package:enaklo_pos/presentation/home/bloc/checkout/checkout_bloc.dart';
import 'package:enaklo_pos/presentation/home/models/product_quantity.dart';
import 'package:enaklo_pos/presentation/home/widgets/item_notes_dialog.dart';
import '../../../core/components/spaces.dart';
import '../../../core/constants/colors.dart';
class OrderMenu extends StatelessWidget {
class OrderMenu extends StatefulWidget {
final ProductQuantity data;
const OrderMenu({super.key, required this.data});
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.all(16.0),
margin: EdgeInsets.only(bottom: 8.0),
decoration: BoxDecoration(
color: AppColors.primary.withOpacity(0.1),
borderRadius: BorderRadius.circular(8.0),
),
child: Column(
children: [
Row(
children: [
Expanded(
child: Text(
data.product.name ?? "_",
overflow: TextOverflow.ellipsis,
maxLines: 2,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
),
SizedBox(width: 12.0),
_buildIconButton(
onTap: () {
showDialog(
context: context,
builder: (context) => ItemNotesDialog(item: data),
);
},
icon: Icons.edit_note,
),
SizedBox(width: 8.0),
_buildIconButton(
onTap: () {},
icon: Icons.delete_outline,
iconColor: AppColors.red,
),
],
),
const SpaceHeight(12.0),
Row(
children: [
Expanded(
child: Text(
(data.product.price!.toIntegerFromText * data.quantity)
.currencyFormatRp,
overflow: TextOverflow.ellipsis,
maxLines: 2,
style: const TextStyle(
color: AppColors.primary,
fontWeight: FontWeight.bold,
),
),
),
SpaceWidth(16),
Container(
padding: const EdgeInsets.all(4),
decoration: BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.circular(50.0),
),
child: Row(
children: [
_buildIconButton(
onTap: () {
context
.read<CheckoutBloc>()
.add(CheckoutEvent.removeItem(data.product));
},
icon: Icons.remove,
iconColor: AppColors.primary,
bgColor: Colors.grey.shade300,
),
SizedBox(
width: 30.0,
child: Center(
child: Text(
data.quantity.toString(),
style: const TextStyle(
fontWeight: FontWeight.bold,
),
),
),
),
_buildIconButton(
onTap: () {
context
.read<CheckoutBloc>()
.add(CheckoutEvent.addItem(data.product));
},
icon: Icons.add,
iconColor: AppColors.white,
bgColor: AppColors.primary,
),
],
),
),
],
),
if (data.notes.isNotEmpty) ...[
SpaceHeight(8.0),
Divider(),
SpaceHeight(8.0),
Container(
width: double.infinity,
padding: const EdgeInsets.symmetric(
horizontal: 8.0,
vertical: 4.0,
),
decoration: BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.circular(8.0),
),
child: Text(
'Notes: ${data.notes}',
style: const TextStyle(
fontSize: 14,
color: AppColors.black,
fontWeight: FontWeight.w500,
fontStyle: FontStyle.italic,
),
),
),
],
],
),
);
}
GestureDetector _buildIconButton({
required Function()? onTap,
Color iconColor = AppColors.black,
Color bgColor = AppColors.white,
required IconData icon,
}) {
return GestureDetector(
onTap: onTap,
child: Container(
padding: const EdgeInsets.all(4.0),
decoration: BoxDecoration(
color: bgColor,
shape: BoxShape.circle,
),
child: Icon(
icon,
size: 20,
color: iconColor,
),
),
);
}
State<OrderMenu> createState() => _OrderMenuState();
}
class OrderMenuOld extends StatelessWidget {
final ProductQuantity data;
const OrderMenuOld({super.key, required this.data});
class _OrderMenuState extends State<OrderMenu> {
final _controller = TextEditingController();
@override
void initState() {
super.initState();
_controller.text = widget.data.notes;
_controller.addListener(() {
context.read<CheckoutBloc>().add(
CheckoutEvent.updateItemNotes(
widget.data.product,
_controller.text,
),
);
});
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
@@ -193,9 +60,9 @@ class OrderMenuOld extends StatelessWidget {
// color: AppColors.primary,
// ),
CachedNetworkImage(
imageUrl: data.product.image!.contains('http')
? data.product.image!
: '${Variables.baseUrl}/${data.product.image}',
imageUrl: widget.data.product.image!.contains('http')
? widget.data.product.image!
: '${Variables.baseUrl}/${widget.data.product.image}',
width: 50.0,
height: 50.0,
fit: BoxFit.cover,
@@ -206,55 +73,21 @@ class OrderMenuOld extends StatelessWidget {
title: Row(
children: [
Expanded(
child: Text(data.product.name ?? "-",
maxLines: 2,
child: Text(widget.data.product.name ?? "-",
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
fontSize: 14,
fontWeight: FontWeight.bold,
)),
),
GestureDetector(
onTap: () {
showDialog(
context: context,
builder: (context) => ItemNotesDialog(item: data),
);
},
child: const Icon(
Icons.edit_note,
size: 20,
color: AppColors.primary,
),
),
],
),
subtitle: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
data.product.price!.toIntegerFromText.currencyFormatRp),
if (data.notes.isNotEmpty) ...[
const SpaceHeight(4.0),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 8.0,
vertical: 4.0,
),
decoration: BoxDecoration(
color: AppColors.primary.withOpacity(0.1),
borderRadius: BorderRadius.circular(4.0),
),
child: Text(
'Notes: ${data.notes}',
style: const TextStyle(
fontSize: 12,
color: AppColors.primary,
fontStyle: FontStyle.italic,
),
),
),
],
Text(widget.data.product.price!.toIntegerFromText
.currencyFormatRp),
],
),
),
@@ -265,7 +98,7 @@ class OrderMenuOld extends StatelessWidget {
onTap: () {
context
.read<CheckoutBloc>()
.add(CheckoutEvent.removeItem(data.product));
.add(CheckoutEvent.removeItem(widget.data.product));
},
child: Container(
width: 30,
@@ -281,14 +114,14 @@ class OrderMenuOld extends StatelessWidget {
width: 30.0,
child: Center(
child: Text(
data.quantity.toString(),
widget.data.quantity.toString(),
)),
),
GestureDetector(
onTap: () {
context
.read<CheckoutBloc>()
.add(CheckoutEvent.addItem(data.product));
.add(CheckoutEvent.addItem(widget.data.product));
},
child: Container(
width: 30,
@@ -306,7 +139,8 @@ class OrderMenuOld extends StatelessWidget {
SizedBox(
width: 80.0,
child: Text(
(data.product.price!.toIntegerFromText * data.quantity)
(widget.data.product.price!.toIntegerFromText *
widget.data.quantity)
.currencyFormatRp,
textAlign: TextAlign.right,
style: const TextStyle(
@@ -317,6 +151,40 @@ class OrderMenuOld extends StatelessWidget {
),
],
),
SpaceHeight(8.0),
SizedBox(
height: 40,
child: Row(
children: [
Flexible(
child: TextFormField(
cursorColor: AppColors.primary,
controller: _controller,
style: const TextStyle(
fontSize: 12,
color: AppColors.black,
),
decoration: InputDecoration(
hintText: 'Catatan Pesanan',
),
),
),
const SpaceWidth(16.0),
Container(
height: 40,
width: 40,
decoration: BoxDecoration(
color: AppColors.primary,
borderRadius: BorderRadius.circular(8.0),
),
child: Icon(
Icons.delete_outline,
color: AppColors.white,
),
),
],
),
)
],
);
}
lib/presentation/home/widgets/product_card.dart
+27 -133
View File
@@ -1,5 +1,4 @@
import 'package:cached_network_image/cached_network_image.dart';
import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:enaklo_pos/core/constants/variables.dart';
@@ -8,97 +7,14 @@ import 'package:enaklo_pos/core/extensions/string_ext.dart';
import 'package:enaklo_pos/data/models/response/product_response_model.dart';
import 'package:enaklo_pos/presentation/home/bloc/checkout/checkout_bloc.dart';
import '../../../core/assets/assets.gen.dart';
import '../../../core/components/spaces.dart';
import '../../../core/constants/colors.dart';
class ProductCard extends StatelessWidget {
final Product data;
final VoidCallback onCartButton;
const ProductCard(
{super.key, required this.data, required this.onCartButton});
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
context.read<CheckoutBloc>().add(CheckoutEvent.addItem(data));
},
child: Container(
padding: const EdgeInsets.all(8.0),
decoration: BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.circular(12.0),
),
child: Column(
children: [
AspectRatio(
aspectRatio: 1.2,
child: ClipRRect(
borderRadius: BorderRadius.circular(12),
child: CachedNetworkImage(
imageUrl: data.image!.contains('http')
? data.image!
: '${Variables.baseUrl}/${data.image}',
width: double.infinity,
height: context.deviceHeight * 0.18,
fit: BoxFit.cover,
errorWidget: (context, url, error) => Container(
width: double.infinity,
height: context.deviceHeight * 0.18,
decoration: BoxDecoration(
color: AppColors.grey.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: const Icon(
Icons.image_outlined,
color: AppColors.grey,
size: 40,
),
),
),
),
),
const SpaceHeight(8.0),
Row(
children: [
Expanded(
child: Text(
"${data.name}",
style: const TextStyle(
fontSize: 14,
fontWeight: FontWeight.w700,
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
),
],
),
Spacer(),
const SpaceHeight(4.0),
Align(
alignment: Alignment.centerRight,
child: Text(
data.price!.toIntegerFromText.currencyFormatRp,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 13,
color: AppColors.primary,
),
),
),
],
),
));
}
}
class ProductCardOld extends StatelessWidget {
final Product data;
final VoidCallback onCartButton;
const ProductCardOld({
const ProductCard({
super.key,
required this.data,
required this.onCartButton,
@@ -115,6 +31,9 @@ class ProductCardOld extends StatelessWidget {
decoration: BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.circular(12.0),
border: Border.all(
color: AppColors.disabled,
),
),
child: Stack(
children: [
@@ -160,28 +79,29 @@ class ProductCardOld extends StatelessWidget {
overflow: TextOverflow.ellipsis,
),
const Spacer(),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Flexible(
child: Text(
data.category?.name ?? '-',
style: const TextStyle(
color: AppColors.grey,
fontSize: 12,
),
),
Align(
alignment: Alignment.center,
child: Text(
data.category?.name ?? '-',
style: const TextStyle(
fontSize: 14,
color: AppColors.grey,
fontWeight: FontWeight.w500,
),
Flexible(
child: Text(
data.price!.toIntegerFromText.currencyFormatRp,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 13,
),
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
),
const Spacer(),
Align(
alignment: Alignment.center,
child: Text(
data.price!.toIntegerFromText.currencyFormatRp,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 13,
),
],
),
),
const Spacer(),
],
@@ -232,34 +152,8 @@ class ProductCardOld extends StatelessWidget {
),
),
)
: Align(
alignment: Alignment.topRight,
child: Container(
width: 36,
height: 36,
padding: const EdgeInsets.all(6),
decoration: const BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(9.0)),
color: AppColors.primary,
),
child: Assets.icons.shoppingBasket.svg(),
),
)
: Align(
alignment: Alignment.topRight,
child: Container(
width: 36,
height: 36,
padding: const EdgeInsets.all(6),
decoration: const BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(9.0)),
color: AppColors.primary,
),
child: Assets.icons.shoppingBasket.svg(),
),
);
: SizedBox.shrink()
: SizedBox.shrink();
},
);
},