Update the amount, not yet the bar #2977

app/Http/Controllers/Json/BudgetController.php

@@ -0,0 +1,99 @@
+<?php
+declare(strict_types=1);
+/**
+ * BudgetController.php
+ * Copyright (c) 2020 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+namespace FireflyIII\Http\Controllers\Json;
+
+
+use Carbon\Carbon;
+use FireflyIII\Http\Controllers\Controller;
+use FireflyIII\Models\TransactionCurrency;
+use FireflyIII\Repositories\Budget\AvailableBudgetRepositoryInterface;
+use FireflyIII\Repositories\Budget\BudgetLimitRepositoryInterface;
+use FireflyIII\Repositories\Budget\BudgetRepositoryInterface;
+use FireflyIII\Repositories\Budget\OperationsRepositoryInterface;
+use FireflyIII\Repositories\Currency\CurrencyRepositoryInterface;
+use FireflyIII\Support\Http\Controllers\DateCalculation;
+use Illuminate\Http\JsonResponse;
+
+/**
+ * Class BudgetController
+ */
+class BudgetController extends Controller
+{
+    use DateCalculation;
+    /** @var AvailableBudgetRepositoryInterface */
+    private $abRepository;
+    /** @var BudgetLimitRepositoryInterface */
+    private $blRepository;
+    /** @var CurrencyRepositoryInterface */
+    private $currencyRepository;
+    /** @var OperationsRepositoryInterface */
+    private $opsRepository;
+    /** @var BudgetRepositoryInterface The budget repository */
+    private $repository;
+
+    /**
+     * IndexController constructor.
+     *
+     * @codeCoverageIgnore
+     */
+    public function __construct()
+    {
+        parent::__construct();
+
+        $this->middleware(
+            function ($request, $next) {
+                app('view')->share('title', (string) trans('firefly.budgets'));
+                app('view')->share('mainTitleIcon', 'fa-tasks');
+                $this->repository         = app(BudgetRepositoryInterface::class);
+                $this->opsRepository      = app(OperationsRepositoryInterface::class);
+                $this->abRepository       = app(AvailableBudgetRepositoryInterface::class);
+                $this->currencyRepository = app(CurrencyRepositoryInterface::class);
+                $this->blRepository       = app(BudgetLimitRepositoryInterface::class);
+                $this->repository->cleanupBudgets();
+
+                return $next($request);
+            }
+        );
+    }
+
+    /**
+     * @return JsonResponse
+     */
+    public function getBudgetInformation(TransactionCurrency $currency, Carbon $start, Carbon $end): JsonResponse
+    {
+        $budgeted = $this->blRepository->budgeted($start, $end, $currency,);
+
+        return response()->json(
+            [
+                'budgeted'                => $budgeted,
+                'budgeted_formatted'      => app('amount')->formatAnything($currency, $budgeted, true),
+                'currency_id'             => $currency->id,
+                'currency_code'           => $currency->code,
+                'currency_symbol'         => $currency->symbol,
+                'currency_name'           => $currency->name,
+                'currency_decimal_places' => $currency->decimal_places,
+            ]
+        );
+    }
+
+}

public/v1/js/ff/budgets/index.js

@@ -23,16 +23,10 @@
  */
 $(function () {
     "use strict";
-
-    //$('.updateIncome').on('click', updateIncome);
-
     /*
      On start, fill the "spent"-bar using the content from the page.
      */
-    //drawSpentBar();
     drawSpentBars();
-    //drawBudgetedBar();
-
     drawBudgetedBars();
 
     $('.update_ab').on('click', updateAvailableBudget);
@@ -45,8 +39,6 @@ $(function () {
     /*
      When the input changes, update the percentages for the budgeted bar:
      */
-    //$('input[type="number"]').on('change', updateBudgetedAmounts);
-
     $('.selectPeriod').change(function (e) {
         var selected = $(e.currentTarget);
         if (selected.find(":selected").val() !== "x") {
@@ -107,7 +99,8 @@ function updateBudgetedAmount(e) {
             if (data.left_per_day > 0) {
                 $('.left_span[data-limit="0"][data-id="' + budgetId + '"]').html(data.left_formatted + '(' + data.left_per_day_formatted + ')');
             }
-            //$('.left_span[data-limit="0"][data-id="' + budgetId + '"]').text('XXXXX');
+            // update budgeted amount
+            updateTotalBudgetedAmount(data.transaction_currency_id);
 
         }).fail(function () {
             alert('I failed :(');
@@ -118,10 +111,12 @@ function updateBudgetedAmount(e) {
             amount: input.val(),
         }).done(function (data) {
             input.prop('disabled', false);
-            $('.left_span[data-limit="'+budgetLimitId+'"]').html(data.left_formatted);
+            $('.left_span[data-limit="' + budgetLimitId + '"]').html(data.left_formatted);
             if (data.left_per_day > 0) {
-                $('.left_span[data-limit="'+budgetLimitId+'"]').html(data.left_formatted + '(' + data.left_per_day_formatted + ')');
+                $('.left_span[data-limit="' + budgetLimitId + '"]').html(data.left_formatted + '(' + data.left_per_day_formatted + ')');
             }
+            updateTotalBudgetedAmount(data.transaction_currency_id);
+            // update budgeted amount
 
         }).fail(function () {
             alert('I failed :(');
@@ -129,6 +124,22 @@ function updateBudgetedAmount(e) {
     }
 }
 
+function updateTotalBudgetedAmount(currencyId) {
+    // fade info away:
+    $('span.budgeted_amount[data-currency="' + currencyId + '"]')
+        .fadeTo(100, 0.1, function () {
+            //$(this).fadeTo(500, 1.0);
+        });
+
+    // get new amount:
+    $.get(totalBudgetedUri.replace('REPLACEME',currencyId)).done(function (data) {
+        $('span.budgeted_amount[data-currency="' + currencyId + '"]')
+            .html(data.budgeted_formatted)
+            // fade back:
+            .fadeTo(300, 1.0);
+    });
+}
+
 var fixHelper = function (e, tr) {
     "use strict";
     var $originals = tr.children();

resources/views/v1/budgets/index.twig

@@ -65,7 +65,7 @@
                             {# info about the amount budgeted #}
                             <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
                                 <small>{{ 'budgeted'|_ }} ({{ 'see_below'|_ }}):
-                                    <span class="budgeted_amount" data-value="{{ budgeted }}" data-id="0">
+                                    <span class="budgeted_amount" data-value="{{ budgeted }}" data-id="0" data-currency="{{ defaultCurrency.id }}">
                                         {{ formatAmountBySymbol(budgeted, defaultCurrency.symbol, defaultCurrency.decimal_places) }}
                                     </span>
                                 </small>
@@ -75,7 +75,7 @@
                                 <small class="available_bar"
                                        data-id="0">{{ trans('firefly.available_between', {start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat) }) }}
                                     :
-                                    <span class="available_amount" data-id="0" data-value="0"
+                                    <span class="available_amount" data-id="0" data-value="0" data-currency="{{ defaultCurrency.id }}"
                                           data-value="0">{{ formatAmountBySymbol(0, defaultCurrency.symbol, defaultCurrency.decimal_places, true) }}</span>
                                     <a href="#" data-id="0" class="update_ab btn btn-default btn-xs"><i class="fa fa-pencil"></i></a>
                                 </small>
@@ -124,7 +124,7 @@
                                 {# info about the amount budgeted #}
                                 <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
                                     <small>{{ 'budgeted'|_ }}:
-                                        <span class="text-success budgeted_amount" data-id="{{ budget.id }}">
+                                        <span class="text-success budgeted_amount" data-id="{{ budget.id }}" data-currency="{{ budget.transaction_currency.id }}">
                                         {{ formatAmountBySymbol(budget.budgeted, budget.transaction_currency.symbol, budget.transaction_currency.decimal_places, false) }}
                                     </span>
                                     </small>
@@ -429,7 +429,7 @@
         var createBudgetLimitUri = "{{ route('budget-limits.create', ['REPLACEME', start.format('Y-m-d'), end.format('Y-m-d')]) }}";
         var storeBudgetLimitUri = "{{ route('budget-limits.store') }}";
         var updateBudgetLimitUri = "{{ route('budget-limits.update', ['REPLACEME']) }}";
-
+        var totalBudgetedUri = "{{ route('json.budget.total-budgeted', ['REPLACEME', start.format('Y-m-d'), end.format('Y-m-d')]) }}";
         {#var budgetAmountUri = "{{ route('budgets.amount','REPLACE') }}";#}
         {#var updateIncomeUri = "{{ route('budgets.income',[start.format('Y-m-d'),end.format('Y-m-d')]) }}";#}
         var periodStart = "{{ start.format('Y-m-d') }}";

routes/web.php

@@ -626,9 +626,12 @@ Route::group(
         Route::get('transaction-journals/all', ['uses' => 'Json\AutoCompleteController@allJournals', 'as' => 'autocomplete.all-journals']);
         Route::get('transaction-journals/with-id', ['uses' => 'Json\AutoCompleteController@allJournalsWithID', 'as' => 'autocomplete.all-journals-with-id']);
         Route::get('currency-names', ['uses' => 'Json\AutoCompleteController@currencyNames', 'as' => 'autocomplete.currency-names']);
-
         Route::get('transaction-types', ['uses' => 'Json\AutoCompleteController@transactionTypes', 'as' => 'transaction-types']);
 
+        // budgets:
+        Route::get('budget/total-budgeted/{currency}/{start_date}/{end_date}', ['uses' => 'Json\BudgetController@getBudgetInformation', 'as' => 'budget.total-budgeted']);
+
+
         // boxes
         Route::get('box/balance', ['uses' => 'Json\BoxController@balance', 'as' => 'box.balance']);
         Route::get('box/bills', ['uses' => 'Json\BoxController@bills', 'as' => 'box.bills']);