report page
This commit is contained in:
efrilm
@@ -5,3 +5,4 @@ import '../../../common/theme/theme.dart';
|
||||
import '../spaces/space.dart';
|
||||
|
||||
part 'elevated_button.dart';
|
||||
part 'icon_button.dart';
|
||||
|
||||
@@ -0,0 +1,22 @@
|
||||
part of 'button.dart';
|
||||
|
||||
class AppIconButton extends StatelessWidget {
|
||||
final IconData icons;
|
||||
final Function()? onTap;
|
||||
const AppIconButton({super.key, required this.icons, required this.onTap});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return InkWell(
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
padding: EdgeInsets.symmetric(horizontal: 12.0, vertical: 8.0),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(6.0),
|
||||
border: Border.all(color: AppColor.border),
|
||||
),
|
||||
child: Icon(icons, color: AppColor.primary, size: 28),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
|
||||
import 'package:syncfusion_flutter_datepicker/datepicker.dart';
|
||||
|
||||
import '../../../common/theme/theme.dart';
|
||||
import '../spaces/space.dart';
|
||||
|
||||
class DateRangePickerModal {
|
||||
static Future<DateRangePickerSelectionChangedArgs?> show({
|
||||
@@ -217,42 +218,7 @@ class _DateRangePickerDialogState extends State<_DateRangePickerDialog>
|
||||
child: SingleChildScrollView(
|
||||
child: Column(
|
||||
children: [
|
||||
// Selection Info
|
||||
Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.all(12),
|
||||
margin: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: widget.primaryColor.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(
|
||||
color: widget.primaryColor.withOpacity(0.2),
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Tanggal Terpilih:',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: widget.primaryColor,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
_getSelectionText(),
|
||||
style: const TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.black87,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
SpaceHeight(16),
|
||||
// Date Picker
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
@@ -320,6 +286,41 @@ class _DateRangePickerDialogState extends State<_DateRangePickerDialog>
|
||||
),
|
||||
),
|
||||
),
|
||||
// Selection Info
|
||||
Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.all(12),
|
||||
margin: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: widget.primaryColor.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(
|
||||
color: widget.primaryColor.withOpacity(0.2),
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Tanggal Terpilih:',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: widget.primaryColor,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
_getSelectionText(),
|
||||
style: const TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.black87,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
@@ -1,12 +1,123 @@
|
||||
import 'package:auto_route/auto_route.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
|
||||
import '../../../../../application/report/report_bloc.dart';
|
||||
import '../../../../../common/data/report_menu.dart';
|
||||
import '../../../../../common/theme/theme.dart';
|
||||
import '../../../../../injection.dart';
|
||||
import '../../../../components/button/button.dart';
|
||||
import '../../../../components/page/page_title.dart';
|
||||
import '../../../../components/picker/date_range_picker.dart';
|
||||
import '../../../../components/spaces/space.dart';
|
||||
import '../../../../router/app_router.gr.dart';
|
||||
import 'widgets/report_menu_card.dart';
|
||||
|
||||
@RoutePage()
|
||||
class ReportPage extends StatelessWidget {
|
||||
class ReportPage extends StatelessWidget implements AutoRouteWrapper {
|
||||
const ReportPage({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return const Center(child: Text('Report Page'));
|
||||
return Scaffold(
|
||||
backgroundColor: AppColor.white,
|
||||
body: SafeArea(
|
||||
child: BlocBuilder<ReportBloc, ReportState>(
|
||||
builder: (context, state) {
|
||||
return Column(
|
||||
children: [
|
||||
PageTitle(
|
||||
title: 'Report',
|
||||
subtitle: state.rangeDateFormatted,
|
||||
actionWidget: [
|
||||
AppIconButton(
|
||||
icons: Icons.calendar_month_outlined,
|
||||
onTap: () {
|
||||
DateRangePickerModal.show(
|
||||
context: context,
|
||||
initialEndDate: state.endDate,
|
||||
initialStartDate: state.startDate,
|
||||
primaryColor: AppColor.primary,
|
||||
onChanged: (startDate, endDate) {
|
||||
context.read<ReportBloc>().add(
|
||||
ReportEvent.dateChanged(
|
||||
startDate: startDate!,
|
||||
endDate: endDate!,
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
},
|
||||
),
|
||||
SpaceWidth(8),
|
||||
AppIconButton(icons: Icons.download_outlined, onTap: () {}),
|
||||
],
|
||||
),
|
||||
Expanded(
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 2,
|
||||
child: Material(
|
||||
color: AppColor.white,
|
||||
child: SingleChildScrollView(
|
||||
child: Column(
|
||||
children: List.generate(
|
||||
reportMenus.length,
|
||||
(index) => ReportMenuCard(
|
||||
menu: reportMenus[index],
|
||||
isActive:
|
||||
reportMenus[index].index ==
|
||||
state.selectedMenu,
|
||||
onTap: () {
|
||||
if (reportMenus[index].index == 1) {
|
||||
context.router.push(
|
||||
OrderRoute(status: 'completed'),
|
||||
);
|
||||
} else {
|
||||
context.read<ReportBloc>().add(
|
||||
ReportEvent.menuChanged(
|
||||
index: index,
|
||||
title: reportMenus[index].title,
|
||||
),
|
||||
);
|
||||
}
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: Material(
|
||||
color: AppColor.background,
|
||||
child: switch (state.selectedMenu) {
|
||||
0 => Text(state.title),
|
||||
1 => Text(state.title),
|
||||
2 => Text(state.title),
|
||||
3 => Text(state.title),
|
||||
4 => Text(state.title),
|
||||
5 => Text(state.title),
|
||||
6 => Text(state.title),
|
||||
7 => Text(state.title),
|
||||
_ => Container(),
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget wrappedRoute(BuildContext context) =>
|
||||
BlocProvider(create: (context) => getIt<ReportBloc>(), child: this);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,61 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../../../../../../common/data/report_menu.dart';
|
||||
import '../../../../../../common/theme/theme.dart';
|
||||
import '../../../../../components/spaces/space.dart';
|
||||
|
||||
class ReportMenuCard extends StatelessWidget {
|
||||
final ReportMenu menu;
|
||||
final bool isActive;
|
||||
final Function() onTap;
|
||||
const ReportMenuCard({
|
||||
super.key,
|
||||
required this.menu,
|
||||
required this.isActive,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
decoration: BoxDecoration(
|
||||
border: Border(
|
||||
right: BorderSide(
|
||||
color: isActive ? AppColor.primary : Colors.transparent,
|
||||
width: 4.0,
|
||||
),
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(
|
||||
menu.icons,
|
||||
size: 24.0,
|
||||
color: isActive ? AppColor.primary : AppColor.textSecondary,
|
||||
),
|
||||
const SpaceWidth(12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
menu.title,
|
||||
style: AppStyle.lg.copyWith(fontWeight: FontWeight.bold),
|
||||
),
|
||||
SpaceHeight(4.0),
|
||||
Text(
|
||||
menu.subtitle,
|
||||
style: AppStyle.md.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -336,7 +336,7 @@ class ReportRoute extends _i20.PageRouteInfo<void> {
|
||||
static _i20.PageInfo page = _i20.PageInfo(
|
||||
name,
|
||||
builder: (data) {
|
||||
return const _i10.ReportPage();
|
||||
return _i20.WrappedRoute(child: const _i10.ReportPage());
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user