feat: type dialog
This commit is contained in:
parent
74460c921b
commit
f3e6d49a27
@ -1,5 +1,6 @@
|
||||
import 'package:enaklo_pos/core/components/spaces.dart';
|
||||
import 'package:enaklo_pos/core/constants/colors.dart';
|
||||
import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class CustomModalDialog extends StatelessWidget {
|
||||
@ -24,71 +25,75 @@ class CustomModalDialog extends StatelessWidget {
|
||||
),
|
||||
child: ConstrainedBox(
|
||||
constraints: BoxConstraints(
|
||||
minWidth: 200,
|
||||
maxWidth: 600,
|
||||
minHeight: 200,
|
||||
maxHeight: 600,
|
||||
minWidth: context.deviceWidth * 0.3,
|
||||
maxWidth: context.deviceWidth * 0.8,
|
||||
minHeight: context.deviceHeight * 0.3,
|
||||
maxHeight: context.deviceHeight * 0.8,
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
width: double.infinity,
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: [
|
||||
AppColors.primary,
|
||||
const Color.fromARGB(255, 67, 69, 195)
|
||||
],
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
child: IntrinsicWidth(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
width: double.infinity,
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: [
|
||||
const Color.fromARGB(255, 81, 40, 134),
|
||||
AppColors.primary,
|
||||
],
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
),
|
||||
borderRadius: BorderRadius.vertical(
|
||||
top: Radius.circular(16),
|
||||
),
|
||||
),
|
||||
borderRadius: BorderRadius.vertical(
|
||||
top: Radius.circular(16),
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
title,
|
||||
style: TextStyle(
|
||||
color: AppColors.white,
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
if (subtitle != null)
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
subtitle ?? '',
|
||||
title,
|
||||
style: TextStyle(
|
||||
color: AppColors.grey,
|
||||
fontSize: 16,
|
||||
color: AppColors.white,
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
],
|
||||
if (subtitle != null)
|
||||
Text(
|
||||
subtitle ?? '',
|
||||
style: TextStyle(
|
||||
color: AppColors.grey,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
SpaceWidth(12),
|
||||
IconButton(
|
||||
icon: Icon(Icons.close, color: AppColors.white),
|
||||
onPressed: () {
|
||||
if (onClose != null) {
|
||||
onClose!();
|
||||
} else {
|
||||
Navigator.of(context).pop();
|
||||
}
|
||||
},
|
||||
),
|
||||
],
|
||||
SpaceWidth(12),
|
||||
IconButton(
|
||||
icon: Icon(Icons.close, color: AppColors.white),
|
||||
onPressed: () {
|
||||
if (onClose != null) {
|
||||
onClose!();
|
||||
} else {
|
||||
Navigator.of(context).pop();
|
||||
}
|
||||
},
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
child,
|
||||
],
|
||||
child,
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
@ -3,7 +3,6 @@ import 'package:flutter/material.dart';
|
||||
class AppColors {
|
||||
/// primary = #3949AB
|
||||
static const Color primary = Color(0xff36175e);
|
||||
static const Color secondary = Color(0xfff1eaf9);
|
||||
|
||||
/// grey = #B7B7B7
|
||||
static const Color grey = Color(0xffB7B7B7);
|
||||
@ -19,6 +18,7 @@ class AppColors {
|
||||
|
||||
/// white = #FFFFFF
|
||||
static const Color white = Color(0xffFFFFFF);
|
||||
static const Color whiteText = Color(0xfff1eaf9);
|
||||
|
||||
/// green = #50C474
|
||||
static const Color green = Color(0xff50C474);
|
||||
|
||||
101
lib/presentation/home/dialog/type_dialog.dart
Normal file
101
lib/presentation/home/dialog/type_dialog.dart
Normal file
@ -0,0 +1,101 @@
|
||||
import 'package:enaklo_pos/core/components/custom_modal_dialog.dart';
|
||||
import 'package:enaklo_pos/core/components/spaces.dart';
|
||||
import 'package:enaklo_pos/core/constants/colors.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class TypeDialog extends StatefulWidget {
|
||||
const TypeDialog({super.key});
|
||||
|
||||
@override
|
||||
State<TypeDialog> createState() => _TypeDialogState();
|
||||
}
|
||||
|
||||
class _TypeDialogState extends State<TypeDialog> {
|
||||
String selectedType = 'dine_in';
|
||||
|
||||
List<Map<String, dynamic>> types = [
|
||||
{'value': 'dine_in', 'label': 'Dine In', 'icon': Icons.restaurant_outlined},
|
||||
{
|
||||
'value': 'take_away',
|
||||
'label': 'Take Away',
|
||||
'icon': Icons.takeout_dining_outlined
|
||||
},
|
||||
{
|
||||
'value': 'delivery',
|
||||
'label': 'Delivery',
|
||||
'icon': Icons.delivery_dining_outlined
|
||||
},
|
||||
];
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return CustomModalDialog(
|
||||
title: 'Pilih Tipe',
|
||||
subtitle: 'Silahkan pilih tipe yang sesuai',
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: Column(
|
||||
children: List.generate(types.length, (index) {
|
||||
return _buildItem(context, types[index]);
|
||||
}),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildItem(BuildContext context, Map<String, dynamic> type) {
|
||||
return GestureDetector(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
selectedType = type['value']!;
|
||||
});
|
||||
},
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 12.0, horizontal: 16.0),
|
||||
margin: const EdgeInsets.only(bottom: 8.0),
|
||||
decoration: BoxDecoration(
|
||||
color: selectedType == type['value']
|
||||
? AppColors.primary
|
||||
: AppColors.white,
|
||||
borderRadius: BorderRadius.circular(8.0),
|
||||
border: Border.all(
|
||||
color: selectedType == type['value']
|
||||
? AppColors.primary
|
||||
: AppColors.grey,
|
||||
width: 1.0,
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(type['icon'],
|
||||
color: selectedType == type['value']
|
||||
? AppColors.white
|
||||
: AppColors.black),
|
||||
SpaceWidth(12.0),
|
||||
Expanded(
|
||||
child: Text(
|
||||
type['label']!,
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
color: selectedType == type['value']
|
||||
? AppColors.white
|
||||
: AppColors.black,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
),
|
||||
SpaceWidth(12.0),
|
||||
Icon(
|
||||
Icons.check_circle,
|
||||
color: selectedType == type['value']
|
||||
? AppColors.green
|
||||
: Colors.transparent,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -2,6 +2,7 @@ import 'package:enaklo_pos/core/components/buttons.dart';
|
||||
import 'package:enaklo_pos/core/constants/colors.dart';
|
||||
import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
|
||||
import 'package:enaklo_pos/data/models/response/table_model.dart';
|
||||
import 'package:enaklo_pos/presentation/home/dialog/type_dialog.dart';
|
||||
import 'package:enaklo_pos/presentation/home/pages/dashboard_page.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
@ -74,7 +75,13 @@ class HomeRightTitle extends StatelessWidget {
|
||||
width: 180.0,
|
||||
height: 40,
|
||||
elevation: 0,
|
||||
onPressed: () {},
|
||||
onPressed: () {
|
||||
showDialog(
|
||||
context: context,
|
||||
builder: (context) {
|
||||
return TypeDialog();
|
||||
});
|
||||
},
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
icon: Icon(
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user