From f3e6d49a271a5d0e8a57af0068cce74f0826276e Mon Sep 17 00:00:00 2001 From: efrilm Date: Fri, 1 Aug 2025 01:17:00 +0700 Subject: [PATCH] feat: type dialog --- lib/core/components/custom_modal_dialog.dart | 119 +++++++++--------- lib/core/constants/colors.dart | 2 +- lib/presentation/home/dialog/type_dialog.dart | 101 +++++++++++++++ .../home/widgets/home_right_title.dart | 9 +- 4 files changed, 172 insertions(+), 59 deletions(-) create mode 100644 lib/presentation/home/dialog/type_dialog.dart diff --git a/lib/core/components/custom_modal_dialog.dart b/lib/core/components/custom_modal_dialog.dart index f6cac75..99da382 100644 --- a/lib/core/components/custom_modal_dialog.dart +++ b/lib/core/components/custom_modal_dialog.dart @@ -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, + ], + ), ), ), ); diff --git a/lib/core/constants/colors.dart b/lib/core/constants/colors.dart index 9577a9b..1c83980 100644 --- a/lib/core/constants/colors.dart +++ b/lib/core/constants/colors.dart @@ -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); diff --git a/lib/presentation/home/dialog/type_dialog.dart b/lib/presentation/home/dialog/type_dialog.dart new file mode 100644 index 0000000..5fca75e --- /dev/null +++ b/lib/presentation/home/dialog/type_dialog.dart @@ -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 createState() => _TypeDialogState(); +} + +class _TypeDialogState extends State { + String selectedType = 'dine_in'; + + List> 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 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, + ), + ], + ), + ), + ); + } +} diff --git a/lib/presentation/home/widgets/home_right_title.dart b/lib/presentation/home/widgets/home_right_title.dart index b539f02..29ee4ef 100644 --- a/lib/presentation/home/widgets/home_right_title.dart +++ b/lib/presentation/home/widgets/home_right_title.dart @@ -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(