feat: profit loss
This commit is contained in:
efrilm
@@ -1,20 +1,33 @@
|
||||
import 'package:auto_route/auto_route.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
import 'package:line_icons/line_icons.dart';
|
||||
|
||||
import '../../../application/profit_loss/profit_loss_loader/profit_loss_loader_bloc.dart';
|
||||
import '../../../common/extension/extension.dart';
|
||||
import '../../../common/theme/theme.dart';
|
||||
import '../../../domain/analytic/analytic.dart';
|
||||
import '../../../injection.dart';
|
||||
import '../../components/appbar/appbar.dart';
|
||||
import 'widgets/cash_flow.dart';
|
||||
import 'widgets/category.dart';
|
||||
import 'widgets/product.dart';
|
||||
import 'widgets/profit_loss.dart';
|
||||
import 'widgets/summary_card.dart';
|
||||
|
||||
@RoutePage()
|
||||
class FinancePage extends StatefulWidget {
|
||||
class FinancePage extends StatefulWidget implements AutoRouteWrapper {
|
||||
const FinancePage({super.key});
|
||||
|
||||
@override
|
||||
State<FinancePage> createState() => _FinancePageState();
|
||||
|
||||
@override
|
||||
Widget wrappedRoute(BuildContext context) => BlocProvider(
|
||||
create: (_) =>
|
||||
getIt<ProfitLossLoaderBloc>()..add(ProfitLossLoaderEvent.fetched()),
|
||||
child: this,
|
||||
);
|
||||
}
|
||||
|
||||
class _FinancePageState extends State<FinancePage>
|
||||
@@ -90,69 +103,74 @@ class _FinancePageState extends State<FinancePage>
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: AppColor.background,
|
||||
body: CustomScrollView(
|
||||
slivers: [
|
||||
// SliverAppBar with animated background
|
||||
SliverAppBar(
|
||||
expandedHeight: 120,
|
||||
floating: false,
|
||||
pinned: true,
|
||||
backgroundColor: AppColor.primary,
|
||||
elevation: 0,
|
||||
flexibleSpace: CustomAppBar(title: 'Keuangan'),
|
||||
),
|
||||
body: BlocBuilder<ProfitLossLoaderBloc, ProfitLossLoaderState>(
|
||||
builder: (context, state) {
|
||||
return CustomScrollView(
|
||||
slivers: [
|
||||
// SliverAppBar with animated background
|
||||
SliverAppBar(
|
||||
expandedHeight: 120,
|
||||
floating: false,
|
||||
pinned: true,
|
||||
backgroundColor: AppColor.primary,
|
||||
elevation: 0,
|
||||
flexibleSpace: CustomAppBar(title: 'Keuangan'),
|
||||
),
|
||||
|
||||
// Header dengan filter periode
|
||||
SliverToBoxAdapter(
|
||||
child: FadeTransition(
|
||||
opacity: _fadeAnimation,
|
||||
child: _buildPeriodSelector(),
|
||||
),
|
||||
),
|
||||
// Header dengan filter periode
|
||||
SliverToBoxAdapter(
|
||||
child: FadeTransition(
|
||||
opacity: _fadeAnimation,
|
||||
child: _buildPeriodSelector(),
|
||||
),
|
||||
),
|
||||
|
||||
// Summary Cards
|
||||
SliverToBoxAdapter(
|
||||
child: SlideTransition(
|
||||
position: _slideAnimation,
|
||||
child: _buildSummaryCards(),
|
||||
),
|
||||
),
|
||||
// Summary Cards
|
||||
SliverToBoxAdapter(
|
||||
child: SlideTransition(
|
||||
position: _slideAnimation,
|
||||
child: _buildSummaryCards(state.profitLoss.summary),
|
||||
),
|
||||
),
|
||||
|
||||
// Cash Flow Analysis
|
||||
SliverToBoxAdapter(
|
||||
child: ScaleTransition(
|
||||
scale: _scaleAnimation,
|
||||
child: FinanceCashFlow(),
|
||||
),
|
||||
),
|
||||
// Cash Flow Analysis
|
||||
SliverToBoxAdapter(
|
||||
child: ScaleTransition(
|
||||
scale: _scaleAnimation,
|
||||
child: FinanceCashFlow(dailyData: state.profitLoss.data),
|
||||
),
|
||||
),
|
||||
|
||||
// Profit Loss Detail
|
||||
SliverToBoxAdapter(
|
||||
child: FadeTransition(
|
||||
opacity: _fadeAnimation,
|
||||
child: FinanceProfitLoss(),
|
||||
),
|
||||
),
|
||||
// Profit Loss Detail
|
||||
SliverToBoxAdapter(
|
||||
child: FadeTransition(
|
||||
opacity: _fadeAnimation,
|
||||
child: FinanceProfitLoss(data: state.profitLoss.summary),
|
||||
),
|
||||
),
|
||||
|
||||
// Transaction Categories
|
||||
SliverToBoxAdapter(
|
||||
child: SlideTransition(
|
||||
position: _slideAnimation,
|
||||
child: FinanceCategory(),
|
||||
),
|
||||
),
|
||||
SliverToBoxAdapter(
|
||||
child: SlideTransition(
|
||||
position: _slideAnimation,
|
||||
child: FinanceCategory(),
|
||||
),
|
||||
),
|
||||
|
||||
// Monthly Comparison
|
||||
SliverToBoxAdapter(
|
||||
child: ScaleTransition(
|
||||
scale: _scaleAnimation,
|
||||
child: _buildMonthlyComparison(),
|
||||
),
|
||||
),
|
||||
// Product Analysis Section
|
||||
SliverToBoxAdapter(
|
||||
child: SlideTransition(
|
||||
position: _slideAnimation,
|
||||
child: _buildProductAnalysis(state.profitLoss.productData),
|
||||
),
|
||||
),
|
||||
|
||||
// Bottom spacing
|
||||
const SliverToBoxAdapter(child: SizedBox(height: 100)),
|
||||
],
|
||||
// Transaction Categories
|
||||
|
||||
// Bottom spacing
|
||||
const SliverToBoxAdapter(child: SizedBox(height: 100)),
|
||||
],
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
@@ -210,7 +228,7 @@ class _FinancePageState extends State<FinancePage>
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSummaryCards() {
|
||||
Widget _buildSummaryCards(ProfitLossSummary summary) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
child: Column(
|
||||
@@ -220,10 +238,9 @@ class _FinancePageState extends State<FinancePage>
|
||||
Expanded(
|
||||
child: FinanceSummaryCard(
|
||||
title: 'Total Pendapatan',
|
||||
amount: 'Rp 25.840.000',
|
||||
amount: summary.totalRevenue.currencyFormatRp,
|
||||
icon: LineIcons.arrowUp,
|
||||
color: AppColor.success,
|
||||
change: '+12.5%',
|
||||
isPositive: true,
|
||||
),
|
||||
),
|
||||
@@ -231,10 +248,9 @@ class _FinancePageState extends State<FinancePage>
|
||||
Expanded(
|
||||
child: FinanceSummaryCard(
|
||||
title: 'Total Pengeluaran',
|
||||
amount: 'Rp 18.320.000',
|
||||
amount: summary.totalCost.currencyFormatRp,
|
||||
icon: LineIcons.arrowDown,
|
||||
color: AppColor.error,
|
||||
change: '+8.2%',
|
||||
isPositive: false,
|
||||
),
|
||||
),
|
||||
@@ -246,10 +262,9 @@ class _FinancePageState extends State<FinancePage>
|
||||
Expanded(
|
||||
child: FinanceSummaryCard(
|
||||
title: 'Keuntungan Bersih',
|
||||
amount: 'Rp 7.520.000',
|
||||
amount: summary.netProfit.currencyFormatRp,
|
||||
icon: LineIcons.lineChart,
|
||||
color: AppColor.info,
|
||||
change: '+15.3%',
|
||||
isPositive: true,
|
||||
),
|
||||
),
|
||||
@@ -257,10 +272,9 @@ class _FinancePageState extends State<FinancePage>
|
||||
Expanded(
|
||||
child: FinanceSummaryCard(
|
||||
title: 'Margin Profit',
|
||||
amount: '29.1%',
|
||||
amount: '${summary.profitabilityRatio.round()}%',
|
||||
icon: LineIcons.percent,
|
||||
color: AppColor.warning,
|
||||
change: '+2.1%',
|
||||
isPositive: true,
|
||||
),
|
||||
),
|
||||
@@ -271,7 +285,7 @@ class _FinancePageState extends State<FinancePage>
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildMonthlyComparison() {
|
||||
Widget _buildProductAnalysis(List<ProfitLossProductData> products) {
|
||||
return Container(
|
||||
margin: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(20),
|
||||
@@ -295,138 +309,41 @@ class _FinancePageState extends State<FinancePage>
|
||||
Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.warning.withOpacity(0.1),
|
||||
color: AppColor.info.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: const Icon(
|
||||
LineIcons.calendarCheck,
|
||||
color: AppColor.warning,
|
||||
LineIcons.shoppingBag,
|
||||
color: AppColor.info,
|
||||
size: 20,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Text(
|
||||
'Perbandingan Bulanan',
|
||||
'Analisis Produk',
|
||||
style: AppStyle.lg.copyWith(fontWeight: FontWeight.bold),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: _buildComparisonCard(
|
||||
'Bulan Ini',
|
||||
'Rp 7.52M',
|
||||
'+15.3%',
|
||||
true,
|
||||
AppColor.primary,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: _buildComparisonCard(
|
||||
'Bulan Lalu',
|
||||
'Rp 6.53M',
|
||||
'-2.1%',
|
||||
false,
|
||||
AppColor.textSecondary,
|
||||
const Spacer(),
|
||||
TextButton(
|
||||
onPressed: () {},
|
||||
child: Text(
|
||||
'Lihat Semua',
|
||||
style: AppStyle.sm.copyWith(color: AppColor.primary),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
|
||||
Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.success.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(color: AppColor.success.withOpacity(0.2)),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
const Icon(
|
||||
LineIcons.thumbsUp,
|
||||
color: AppColor.success,
|
||||
size: 20,
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Performa Bagus!',
|
||||
style: AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: AppColor.success,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'Keuntungan meningkat 15.3% dari bulan lalu',
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildComparisonCard(
|
||||
String period,
|
||||
String amount,
|
||||
String change,
|
||||
bool isPositive,
|
||||
Color color,
|
||||
) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: color.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(color: color.withOpacity(0.2)),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
period,
|
||||
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
amount,
|
||||
style: AppStyle.lg.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: color,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Row(
|
||||
children: [
|
||||
Icon(
|
||||
isPositive ? LineIcons.arrowUp : LineIcons.arrowDown,
|
||||
size: 14,
|
||||
color: isPositive ? AppColor.success : AppColor.error,
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
Text(
|
||||
change,
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: isPositive ? AppColor.success : AppColor.error,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
],
|
||||
// Product list
|
||||
ListView.separated(
|
||||
shrinkWrap: true,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
padding: const EdgeInsets.only(top: 12),
|
||||
itemCount: products.length,
|
||||
separatorBuilder: (context, index) => const SizedBox(height: 12),
|
||||
itemBuilder: (context, index) {
|
||||
final product = products[index];
|
||||
return ProfitLossProduct(product: product);
|
||||
},
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
Reference in New Issue
Block a user