#474 - Show diff in summary.

maraf · May 10, 2024 · 0b181d2 · 0b181d2
1 parent b76d4bd
commit 0b181d2
Show file tree

Hide file tree

Showing 8 changed files with 62 additions and 45 deletions.
diff --git a/src/Money.Blazor.Host/Pages/BalancesMonth.razor b/src/Money.Blazor.Host/Pages/BalancesMonth.razor
@@ -46,7 +46,7 @@ else
                             {
                                 var diff = model.IncomeSummary - model.ExpenseSummary;
                                 <small class="@(diff.Value > 0 ? "text-success" : "text-danger")">
-                                    @CurrencyFormatter.Format(diff)
+                                    @CurrencyFormatter.Format(diff, applyPlusForPositiveNumbers: true)
                                 </small>
                             }
                         </div>
@@ -66,7 +66,7 @@ else
                             {
                                 var diff = model.IncomeSummary - model.ExpenseSummary;
                                 <small class="@(diff.Value > 0 ? "text-success" : "text-danger")">
-                                    @CurrencyFormatter.Format(diff)
+                                    @CurrencyFormatter.Format(diff, applyPlusForPositiveNumbers: true)
                                 </small>
                             }
                         </div>

diff --git a/src/Money.Blazor.Host/Pages/Summary.razor b/src/Money.Blazor.Host/Pages/Summary.razor
@@ -15,14 +15,19 @@
 
     @if (SelectedPeriod != null)
     { 
-        <div class="mb-3">
-            <SortButton TType="SummarySortType" @bind-Current="@SortDescriptor" Changed="@OnSorted" />
-
-            <PeriodSelector Selected="SelectedPeriod" Previous="PeriodGuesses" ExactGetter="GetPeriodsAsync" LinkFactory="UrlSummary" />
-
-            <span class="pl-2">
-                <Loading Context="@CategoriesLoading" />
-            </span>
+        <div class="d-flex justify-content-between mb-3">
+            <div>
+                <PeriodSelector Selected="SelectedPeriod" Previous="PeriodGuesses" ExactGetter="GetPeriodsAsync" LinkFactory="UrlSummary" />
+                <span class="pl-2">
+                    <Loading Context="@CategoriesLoading" />
+                </span>
+            </div>
+            <div class="d-flex">
+                <EnumSelector Text="Display" TType="SummaryDisplayType" @bind-Current="@SelectedDisplayType" Changed="StateHasChanged" />
+                <span class="pl-2">
+                    <SortButton TType="SummarySortType" @bind-Current="@SortDescriptor" Changed="@OnSorted" />
+                </span>
+            </div>
         </div>
     }
 
@@ -44,16 +49,26 @@
 
                         <div class="value">
                             <div class="amount">
-                                @if (IncomeTotal != null)
+                                @if (SelectedDisplayType == SummaryDisplayType.Total)
                                 {
-                                    <span class="text-success mr-2" @onclick="@(() => OpenOverviewIncomes(SelectedPeriod))">
-                                        @FormatPrice(IncomeTotal)
+                                    @if (IncomeTotal != null)
+                                    {
+                                        <span class="text-success mr-2" @onclick="@(() => OpenOverviewIncomes(SelectedPeriod))">
+                                            @FormatPrice(IncomeTotal)
+                                        </span>
+                                    }
+
+                                    <span class="text-danger">
+                                        @FormatPrice(ExpenseTotal, CurrencyFormatter.FormatZero.Zero)
+                                    </span>
+                                }
+                                else
+                                {
+                                    var diff = (IncomeTotal ?? new Price(0, ExpenseTotal.Currency)) - ExpenseTotal;
+                                    <span class="@(diff.Value > 0 ? "text-success" : "text-danger")">
+                                        @FormatPrice(diff, applyPlusForPositiveNumbers: true)
                                     </span>
                                 }
-
-                                <span class="text-danger">
-                                    @FormatPrice(ExpenseTotal, CurrencyFormatter.FormatZero.Zero)
-                                </span>
                             </div>
                         </div>
                     </div>

diff --git a/src/Money.Blazor.Host/Pages/Summary.razor.cs b/src/Money.Blazor.Host/Pages/Summary.razor.cs
@@ -67,6 +67,7 @@ public partial class Summary<T> :
         protected LoadingContext CategoriesLoading { get; } = new LoadingContext();
         protected Price IncomeTotal { get; private set; }
         protected Price ExpenseTotal { get; private set; }
+        protected SummaryDisplayType SelectedDisplayType { get; set; }
         protected List<CategoryWithAmountModel> Categories { get; private set; }
 
         protected SortDescriptor<SummarySortType> SortDescriptor { get; set; }
@@ -191,8 +192,8 @@ protected string GetPercentualValue(CategoryWithAmountModel category)
             return percentage.ToString("0.##", CultureInfo.InvariantCulture);
         }
 
-        protected string FormatPrice(Price price, CurrencyFormatter.FormatZero formatZero = CurrencyFormatter.FormatZero.Empty)
-            => formatter.Format(price, formatZero);
+        protected string FormatPrice(Price price, CurrencyFormatter.FormatZero formatZero = CurrencyFormatter.FormatZero.Empty, bool applyPlusForPositiveNumbers = false)
+            => formatter.Format(price, formatZero, applyPlusForPositiveNumbers: applyPlusForPositiveNumbers);
 
         public void Dispose()
             => UnBindEvents();

diff --git a/src/Money.Blazor.Host/Pages/SummaryDisplayType.cs b/src/Money.Blazor.Host/Pages/SummaryDisplayType.cs
@@ -0,0 +1,17 @@
+using System;
+using System.Collections.Generic;
+using System.ComponentModel;
+using System.IO;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace Money.Pages;
+
+public enum SummaryDisplayType
+{
+    [Description("Total")]
+    Total,
+    [Description("Diff")]
+    Diff
+}
diff --git a/src/Money.Blazor.Host/Services/CurrencyFormatter.cs b/src/Money.Blazor.Host/Services/CurrencyFormatter.cs
@@ -48,7 +48,7 @@ private void EnsureCurrencies()
             }
         }
 
-        public string Format(Price price, FormatZero zero = FormatZero.Zero, bool applyUserDigits = true)
+        public string Format(Price price, FormatZero zero = FormatZero.Zero, bool applyUserDigits = true, bool applyPlusForPositiveNumbers = false)
         {
             if (price == null || price.Value == 0)
             {
@@ -60,10 +60,10 @@ public string Format(Price price, FormatZero zero = FormatZero.Zero, bool applyU
                 };
             }
 
-            return FormatInternal(price, applyUserDigits);
+            return FormatInternal(price, applyUserDigits, applyPlusForPositiveNumbers);
         }
 
-        private string FormatInternal(Price price, bool applyUserDigits = true) 
+        private string FormatInternal(Price price, bool applyUserDigits = true, bool applyPlusForPositiveNumbers = false) 
         {
             Ensure.NotNull(price, "price");
 
@@ -83,7 +83,12 @@ private string FormatInternal(Price price, bool applyUserDigits = true)
                 modifiedCulture.NumberFormat.CurrencySymbol = currency.Symbol;
             }
 
-            return price.Value.ToString("C", modifiedCulture ?? culture);
+            string value = price.Value.ToString("C", modifiedCulture ?? culture);
+            if (applyPlusForPositiveNumbers && price.Value > 0)
+                value = $"+{value}";
+
+            Console.WriteLine($"DEBUG {value} {applyPlusForPositiveNumbers}");
+            return value;
         }
 
         public enum FormatZero

diff --git a/src/Money.Blazor.Host/wwwroot/css/site.css b/src/Money.Blazor.Host/wwwroot/css/site.css
@@ -343,16 +343,6 @@ h4 {
   cursor: pointer;
 }
 
-.summary {
-  position: relative;
-}
-.summary .sort {
-  position: absolute;
-  right: 0;
-}
-.summary .sort .btn {
-  border-color: transparent;
-}
 .summary .months {
   padding-right: 70px;
 }

diff --git a/src/Money.Blazor.Host/wwwroot/css/site.min.css b/src/Money.Blazor.Host/wwwroot/css/site.min.css
diff --git a/src/Money.Blazor.Host/wwwroot/css/site.scss b/src/Money.Blazor.Host/wwwroot/css/site.scss
@@ -394,17 +394,6 @@ h4 {
 
 
 .summary {
-    position: relative;
-
-    .sort {
-        position: absolute;
-        right: 0;
-
-        .btn {
-            border-color: transparent;
-        }
-    }
-
     .months {
         padding-right: 70px;
     }