From 20c9b5c524f6755187a8ea3ebca8d76ca8ab9520 Mon Sep 17 00:00:00 2001 From: denisdulici Date: Sat, 28 Dec 2019 22:30:10 +0300 Subject: [PATCH] refactored donuts --- app/Widgets/ExpensesByCategory.php | 155 ++++++++---------- app/Widgets/IncomesByCategory.php | 155 ++++++++---------- .../widgets/expenses_by_category.blade.php | 4 +- .../widgets/incomes_by_category.blade.php | 4 +- 4 files changed, 147 insertions(+), 171 deletions(-) diff --git a/app/Widgets/ExpensesByCategory.php b/app/Widgets/ExpensesByCategory.php index 53272119e..26cf33f53 100644 --- a/app/Widgets/ExpensesByCategory.php +++ b/app/Widgets/ExpensesByCategory.php @@ -9,7 +9,7 @@ use Date; class ExpensesByCategory extends AbstractWidget { - public $expense_donut = ['colors' => [], 'labels' => [], 'values' => []]; + public $donut = ['colors' => [], 'labels' => [], 'values' => []]; /** * The configuration array. @@ -17,7 +17,7 @@ class ExpensesByCategory extends AbstractWidget * @var array */ protected $config = [ - 'width' => 'col-md-6' + 'width' => 'col-md-6', ]; /** @@ -50,96 +50,39 @@ class ExpensesByCategory extends AbstractWidget $overdue_bill += $overdue; } - $this->addToExpenseDonut($category->color, $amount, $category->name); + $this->addToDonut($category->color, $amount, $category->name); } // Show donut prorated if there is no expense - if (array_sum($this->expense_donut['values']) == 0) { - foreach ($this->expense_donut['values'] as $key => $value) { - $this->expense_donut['values'][$key] = 1; + if (array_sum($this->donut['values']) == 0) { + foreach ($this->donut['values'] as $key => $value) { + $this->donut['values'][$key] = 1; } } // Get 6 categories by amount $colors = $labels = []; - $values = collect($this->expense_donut['values'])->sort()->reverse()->take(6)->all(); + $values = collect($this->donut['values'])->sort()->reverse()->take(6)->all(); + foreach ($values as $id => $val) { - $colors[$id] = $this->expense_donut['colors'][$id]; - $labels[$id] = $this->expense_donut['labels'][$id]; + $colors[$id] = $this->donut['colors'][$id]; + $labels[$id] = $this->donut['labels'][$id]; } - $options = [ - 'color' => $colors, + $chart = new Chartjs(); - 'cutoutPercentage' => 80, - - 'legend' => [ - 'position' => 'right' - ], - - 'tooltips' => [ - 'backgroundColor' => '#f5f5f5', - 'titleFontColor' => '#333', - 'bodyFontColor' => '#666', - 'bodySpacing' => 4, - 'xPadding' => 12, - 'mode' => 'nearest', - 'intersect' => 0, - 'position' => 'nearest' - ], - - 'scales' => [ - - 'yAxes' => [ - [ - 'display' => 0, - - 'ticks' => [ - 'display' => false - ], - - 'gridLines' => [ - 'drawBorder' => false, - 'zeroLineColor' => 'transparent', - 'color' => 'rgba(255,255,255,0.05)' - ] - ] - ], - - 'xAxes' => [ - [ - 'display' => 0, - - 'barPercentage' => 1.6, - - 'gridLines' => [ - 'drawBorder' => false, - 'color' => 'rgba(255,255,255,0.1)', - 'zeroLineColor' => 'transparent' - ], - - 'ticks' => [ - 'display' => false - ] - ] - ] - ] - ]; - - $donut_expenses = new Chartjs(); - - $donut_expenses->type('doughnut') + $chart->type('doughnut') ->width(0) ->height(160) - ->options($options) + ->options($this->getChartOptions($colors)) ->labels(array_values($labels)); - $donut_expenses->dataset(trans_choice('general.expenses', 2), 'doughnut', array_values($values)) + $chart->dataset(trans_choice('general.expenses', 2), 'doughnut', array_values($values)) ->backgroundColor(array_values($colors)); return view('widgets.expenses_by_category', [ 'config' => (object) $this->config, - 'donut_expenses' => $donut_expenses, + 'chart' => $chart, ]); } @@ -170,23 +113,23 @@ class ExpensesByCategory extends AbstractWidget $overdue_bill += $overdue; } - $this->addToExpenseDonut($category->color, $amount, $category->name); + $this->addToDonut($category->color, $amount, $category->name); } // Show donut prorated if there is no expense - if (array_sum($this->expense_donut['values']) == 0) { - foreach ($this->expense_donut['values'] as $key => $value) { - $this->expense_donut['values'][$key] = 1; + if (array_sum($this->donut['values']) == 0) { + foreach ($this->donut['values'] as $key => $value) { + $this->donut['values'][$key] = 1; } } // Get 6 categories by amount $colors = $labels = []; - $values = collect($this->expense_donut['values'])->sort()->reverse()->take(6)->all(); + $values = collect($this->donut['values'])->sort()->reverse()->take(6)->all(); foreach ($values as $id => $val) { - $colors[$id] = $this->expense_donut['colors'][$id]; - $labels[$id] = $this->expense_donut['labels'][$id]; + $colors[$id] = $this->donut['colors'][$id]; + $labels[$id] = $this->donut['labels'][$id]; } return [ @@ -224,10 +167,56 @@ class ExpensesByCategory extends AbstractWidget return [$open, $overdue]; } - private function addToExpenseDonut($color, $amount, $text) + private function addToDonut($color, $amount, $text) { - $this->expense_donut['colors'][] = $color; - $this->expense_donut['labels'][] = money($amount, setting('default.currency'), true)->format() . ' - ' . $text; - $this->expense_donut['values'][] = (int) $amount; + $this->donut['colors'][] = $color; + $this->donut['labels'][] = money($amount, setting('default.currency'), true)->format() . ' - ' . $text; + $this->donut['values'][] = (int) $amount; + } + + private function getChartOptions($colors) + { + return [ + 'color' => array_values($colors), + 'cutoutPercentage' => 80, + 'legend' => [ + 'position' => 'right', + ], + 'tooltips' => [ + 'backgroundColor' => '#f5f5f5', + 'titleFontColor' => '#333', + 'bodyFontColor' => '#666', + 'bodySpacing' => 4, + 'xPadding' => 12, + 'mode' => 'nearest', + 'intersect' => 0, + 'position' => 'nearest', + ], + 'scales' => [ + 'yAxes' => [ + 'display' => 0, + 'ticks' => [ + 'display' => false, + ], + 'gridLines' => [ + 'drawBorder' => false, + 'zeroLineColor' => 'transparent', + 'color' => 'rgba(255,255,255,0.05)', + ], + ], + 'xAxes' => [ + 'display' => 0, + 'barPercentage' => 1.6, + 'ticks' => [ + 'display' => false, + ], + 'gridLines' => [ + 'drawBorder' => false, + 'color' => 'rgba(255,255,255,0.1)', + 'zeroLineColor' => 'transparent', + ], + ], + ], + ]; } } diff --git a/app/Widgets/IncomesByCategory.php b/app/Widgets/IncomesByCategory.php index 299ea0a8c..ac675302b 100644 --- a/app/Widgets/IncomesByCategory.php +++ b/app/Widgets/IncomesByCategory.php @@ -9,7 +9,7 @@ use Date; class IncomesByCategory extends AbstractWidget { - public $income_donut = ['colors' => [], 'labels' => [], 'values' => []]; + public $donut = ['colors' => [], 'labels' => [], 'values' => []]; /** * The configuration array. @@ -17,7 +17,7 @@ class IncomesByCategory extends AbstractWidget * @var array */ protected $config = [ - 'width' => 'col-md-6' + 'width' => 'col-md-6', ]; /** @@ -26,7 +26,6 @@ class IncomesByCategory extends AbstractWidget */ public function run() { - // $incomes_amount = $open_invoice = $overdue_invoice = 0; // Get categories @@ -51,97 +50,39 @@ class IncomesByCategory extends AbstractWidget $overdue_invoice += $overdue; } - $this->addToIncomeDonut($category->color, $amount, $category->name); + $this->addToDonut($category->color, $amount, $category->name); } // Show donut prorated if there is no income - if (array_sum($this->income_donut['values']) == 0) { - foreach ($this->income_donut['values'] as $key => $value) { - $this->income_donut['values'][$key] = 1; + if (array_sum($this->donut['values']) == 0) { + foreach ($this->donut['values'] as $key => $value) { + $this->donut['values'][$key] = 1; } } // Get 6 categories by amount $colors = $labels = []; - $values = collect($this->income_donut['values'])->sort()->reverse()->take(6)->all(); + $values = collect($this->donut['values'])->sort()->reverse()->take(6)->all(); foreach ($values as $id => $val) { - $colors[$id] = $this->income_donut['colors'][$id]; - $labels[$id] = $this->income_donut['labels'][$id]; + $colors[$id] = $this->donut['colors'][$id]; + $labels[$id] = $this->donut['labels'][$id]; } - $options = [ - 'backgroudColor' => array_values($colors), + $chart = new Chartjs(); - 'cutoutPercentage' => 80, - - 'legend' => [ - 'position' => 'right' - ], - - 'tooltips' => [ - 'backgroundColor' => '#f5f5f5', - 'titleFontColor' => '#333', - 'bodyFontColor' => '#666', - 'bodySpacing' => 4, - 'xPadding' => 12, - 'mode' => 'nearest', - 'intersect' => 0, - 'position' => 'nearest' - ], - - 'scales' => [ - - 'yAxes' => [ - [ - 'display' => 0, - - 'ticks' => [ - 'display' => false - ], - - 'gridLines' => [ - 'drawBorder' => false, - 'zeroLineColor' => 'transparent', - 'color' => 'rgba(255,255,255,0.05)' - ] - ] - ], - - 'xAxes' => [ - [ - 'display' => 0, - - 'barPercentage' => 1.6, - - 'gridLines' => [ - 'drawBorder' => false, - 'color' => 'rgba(255,255,255,0.1)', - 'zeroLineColor' => 'transparent' - ], - - 'ticks' => [ - 'display' => false - ] - ] - ] - ] - ]; - - $donut_incomes = new Chartjs(); - - $donut_incomes->type('doughnut') + $chart->type('doughnut') ->width(0) ->height(160) - ->options($options) + ->options($this->getChartOptions($colors)) ->labels(array_values($labels)); - $donut_incomes->dataset(trans_choice('general.incomes', 2), 'doughnut', array_values($values)) + $chart->dataset(trans_choice('general.incomes', 2), 'doughnut', array_values($values)) ->backgroundColor(array_values($colors)); return view('widgets.incomes_by_category', [ 'config' => (object) $this->config, - 'donut_incomes' => $donut_incomes, + 'chart' => $chart, ]); } @@ -172,23 +113,23 @@ class IncomesByCategory extends AbstractWidget $overdue_invoice += $overdue; } - $this->addToIncomeDonut($category->color, $amount, $category->name); + $this->addToDonut($category->color, $amount, $category->name); } // Show donut prorated if there is no income - if (array_sum($this->income_donut['values']) == 0) { - foreach ($this->income_donut['values'] as $key => $value) { - $this->income_donut['values'][$key] = 1; + if (array_sum($this->donut['values']) == 0) { + foreach ($this->donut['values'] as $key => $value) { + $this->donut['values'][$key] = 1; } } // Get 6 categories by amount $colors = $labels = []; - $values = collect($this->income_donut['values'])->sort()->reverse()->take(6)->all(); + $values = collect($this->donut['values'])->sort()->reverse()->take(6)->all(); foreach ($values as $id => $val) { - $colors[$id] = $this->income_donut['colors'][$id]; - $labels[$id] = $this->income_donut['labels'][$id]; + $colors[$id] = $this->donut['colors'][$id]; + $labels[$id] = $this->donut['labels'][$id]; } return [ @@ -226,10 +167,56 @@ class IncomesByCategory extends AbstractWidget return [$open, $overdue]; } - private function addToIncomeDonut($color, $amount, $text) + private function addToDonut($color, $amount, $text) { - $this->income_donut['colors'][] = $color; - $this->income_donut['labels'][] = money($amount, setting('default.currency'), true)->format() . ' - ' . $text; - $this->income_donut['values'][] = (int) $amount; + $this->donut['colors'][] = $color; + $this->donut['labels'][] = money($amount, setting('default.currency'), true)->format() . ' - ' . $text; + $this->donut['values'][] = (int) $amount; + } + + private function getChartOptions($colors) + { + return [ + 'backgroudColor' => array_values($colors), + 'cutoutPercentage' => 80, + 'legend' => [ + 'position' => 'right', + ], + 'tooltips' => [ + 'backgroundColor' => '#f5f5f5', + 'titleFontColor' => '#333', + 'bodyFontColor' => '#666', + 'bodySpacing' => 4, + 'xPadding' => 12, + 'mode' => 'nearest', + 'intersect' => 0, + 'position' => 'nearest', + ], + 'scales' => [ + 'yAxes' => [ + 'display' => 0, + 'ticks' => [ + 'display' => false, + ], + 'gridLines' => [ + 'drawBorder' => false, + 'zeroLineColor' => 'transparent', + 'color' => 'rgba(255,255,255,0.05)', + ], + ], + 'xAxes' => [ + 'display' => 0, + 'barPercentage' => 1.6, + 'ticks' => [ + 'display' => false, + ], + 'gridLines' => [ + 'drawBorder' => false, + 'color' => 'rgba(255,255,255,0.1)', + 'zeroLineColor' => 'transparent', + ], + ], + ], + ]; } } diff --git a/resources/views/widgets/expenses_by_category.blade.php b/resources/views/widgets/expenses_by_category.blade.php index cb6d8af99..f4cf522e2 100644 --- a/resources/views/widgets/expenses_by_category.blade.php +++ b/resources/views/widgets/expenses_by_category.blade.php @@ -33,7 +33,7 @@
- {!! $donut_expenses->container() !!} + {!! $chart->container() !!}
@@ -48,5 +48,5 @@ @endpush @push('body_scripts') - {!! $donut_expenses->script() !!} + {!! $chart->script() !!} @endpush diff --git a/resources/views/widgets/incomes_by_category.blade.php b/resources/views/widgets/incomes_by_category.blade.php index f77148007..433f9092f 100644 --- a/resources/views/widgets/incomes_by_category.blade.php +++ b/resources/views/widgets/incomes_by_category.blade.php @@ -33,7 +33,7 @@
- {!! $donut_incomes->container() !!} + {!! $chart->container() !!}
@@ -48,5 +48,5 @@ @endpush @push('body_scripts') - {!! $donut_incomes->script() !!} + {!! $chart->script() !!} @endpush