#10 Create period overview

WIP commit

financer-web-client/src/main/java/de/financer/controller/Function.java

@@ -34,6 +34,7 @@ public enum Function {
 
     P_GET_CURRENT_EXPENSE_PERIOD("periods/getCurrentExpensePeriod"),
     P_CLOSE_CURRENT_EXPENSE_PERIOD("periods/closeCurrentExpensePeriod"),
+    P_GET_PERIOD_OVERVIEW("periods/getPeriodOverview"),
 
     FILE_GET("file");
 

financer-web-client/src/main/java/de/financer/controller/PeriodController.java

@@ -1,13 +1,21 @@
 package de.financer.controller;
 
 import de.financer.config.FinancerConfig;
+import de.financer.dto.PeriodOverviewDto;
+import de.financer.dto.SearchTransactionsResponseDto;
+import de.financer.template.FinancerRestTemplate;
 import de.financer.template.StringTemplate;
+import de.financer.template.exception.FinancerRestException;
 import de.financer.util.ControllerUtils;
 import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.core.ParameterizedTypeReference;
 import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
 import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.util.UriComponentsBuilder;
 
+import java.util.List;
+
 @Controller
 public class PeriodController {
     @Autowired
@@ -22,4 +30,27 @@ public class PeriodController {
 
         return "redirect:/accountOverview";
     }
+
+    @GetMapping("/periodOverview")
+    public String periodOverview(Model model) {
+        final UriComponentsBuilder periodBuilder = UriComponentsBuilder
+                .fromHttpUrl(ControllerUtils.buildUrl(this.financerConfig, Function.P_GET_PERIOD_OVERVIEW));
+
+        try {
+            final List<PeriodOverviewDto> periodOverviews = FinancerRestTemplate.exchangeGet(periodBuilder,
+                    new ParameterizedTypeReference<List<PeriodOverviewDto>>() {
+                    });
+
+            model.addAttribute("periodOverviews", periodOverviews);
+        } catch (FinancerRestException e) {
+            // TODO
+            model.addAttribute("errorMessage", e.getResponseReason().name());
+        }
+
+        ControllerUtils.addVersionAttribute(model, this.financerConfig);
+        ControllerUtils.addCurrencySymbol(model, this.financerConfig);
+        ControllerUtils.addDarkMode(model, this.financerConfig);
+
+        return "period/periodOverview";
+    }
 }

financer-web-client/src/main/resources/i18n/message.properties

@@ -11,6 +11,7 @@ financer.account-overview.available-actions.create-account-group=Create new acco
 financer.account-overview.available-actions.select-chart=Generate a chart
 financer.account-overview.available-actions.close-current-period=Close the current expense period
 financer.account-overview.available-actions.recurring-transaction-calendar=Recurring transaction calendar
+financer.account-overview.available-actions.period-overview=Period overview
 financer.account-overview.status=Status\:
 financer.account-overview.status.recurring-transaction-due-today=Recurring transactions due today\:
 financer.account-overview.status.recurring-transaction-active=Active recurring transactions\:
@@ -172,6 +173,18 @@ financer.chart-config-account-expenses-for-period.label.from-date=From date\:
 financer.chart-config-account-expenses-for-period.label.to-date=To date\:
 financer.chart-config-account-expenses-for-period.submit=Generate
 
+financer.period-overview.title=Period overview
+financer.period-overview.table-header.id=ID
+financer.period-overview.table-header.type=Period type
+financer.period-overview.table-header.start=Start
+financer.period-overview.table-header.end=End
+financer.period-overview.table-header.income=Income
+financer.period-overview.table-header.expense=Expenses
+financer.period-overview.table-header.liability=Liabilities
+financer.period-overview.table-header.total=Total
+financer.period-overview.table-header.assets=Assets
+financer.period-overview.table-header.transactions=Transaction count
+
 financer.interval-type.DAILY=Daily
 financer.interval-type.WEEKLY=Weekly
 financer.interval-type.MONTHLY=Monthly
@@ -193,6 +206,10 @@ financer.account-type.START=Start
 financer.account-status.OPEN=Open
 financer.account-status.CLOSED=Closed
 
+financer.period-type.EXPENSE=Expense
+financer.period-type.EXPENSE_YEAR=Expense year
+financer.period-type.GRAND_TOTAL=Grand total
+
 financer.heading.transaction-new=financer\: create new transaction
 financer.heading.recurring-transaction-new=financer\: create new recurring transaction
 financer.heading.account-new=financer\: create new account
@@ -208,6 +225,7 @@ financer.heading.chart-config-account-group-expenses-for-period=financer\: confi
 financer.heading.chart-config-account-expenses-for-period=financer\: configure account expenses for period chart
 financer.heading.search-transactions=financer\: search transactions
 financer.heading.recurring-transaction-calendar=financer\: recurring transaction calendar
+financer.heading.period-overview=financer\: period overview
 
 financer.cancel-back-to-overview=Cancel and back to overview
 financer.back-to-overview=Back to overview

financer-web-client/src/main/resources/i18n/message_de_DE.properties

@@ -11,6 +11,7 @@ financer.account-overview.available-actions.create-account-group=Neue Konto-Grup
 financer.account-overview.available-actions.select-chart=Ein Diagramm erzeugen
 financer.account-overview.available-actions.close-current-period=Aktuelle Periode schlie\u00DFen
 financer.account-overview.available-actions.recurring-transaction-calendar=Kalender wiederkehrende Buchung
+financer.account-overview.available-actions.period-overview=Perioden\u00FCbersicht
 financer.account-overview.status=Status\:
 financer.account-overview.status.recurring-transaction-due-today=Wiederkehrende Buchungen heute f\u00E4llig\:
 financer.account-overview.status.recurring-transaction-active=Aktive wiederkehrende Buchungen\:
@@ -172,6 +173,18 @@ financer.chart-config-account-expenses-for-period.label.from-date=Von Datum\:
 financer.chart-config-account-expenses-for-period.label.to-date=Bis Datum\:
 financer.chart-config-account-expenses-for-period.submit=Erzeugen
 
+financer.period-overview.title=Perioden\u00FCbersicht
+financer.period-overview.table-header.id=ID
+financer.period-overview.table-header.type=Periodentyp
+financer.period-overview.table-header.start=Start
+financer.period-overview.table-header.end=Ende
+financer.period-overview.table-header.income=Einkommen
+financer.period-overview.table-header.expense=Ausgaben
+financer.period-overview.table-header.liability=Verbindlichkeiten
+financer.period-overview.table-header.total=Insgesamt
+financer.period-overview.table-header.assets=Umlaufverm\u00F6gen
+financer.period-overview.table-header.transactions=Anzahl Buchungen
+
 financer.interval-type.DAILY=T\u00E4glich
 financer.interval-type.WEEKLY=W\u00F6chentlich
 financer.interval-type.MONTHLY=Monatlich
@@ -193,6 +206,10 @@ financer.account-type.START=Anfangsbestand
 financer.account-status.OPEN=Offen
 financer.account-status.CLOSED=Geschlossen
 
+financer.period-type.EXPENSE=Ausgaben
+financer.period-type.EXPENSE_YEAR=Jahresausgaben
+financer.period-type.GRAND_TOTAL=Gesamtausgaben
+
 financer.heading.transaction-new=financer\: Neue Buchung erstellen
 financer.heading.recurring-transaction-new=financer\: Neue wiederkehrende Buchung erstellen
 financer.heading.account-new=financer\: Neues Konto erstellen
@@ -207,6 +224,7 @@ financer.heading.chart-select=financer\: Ein Diagramm zum Erzeugen ausw\u00E4hle
 financer.heading.chart-config-account-group-expenses-for-period=financer\: Konfigurieren von Ausgaben f\u00FCr Periode gruppiert nach Konto-Gruppe Diagramm
 financer.heading.search-transactions=financer\: Buchungen suchen
 financer.heading.recurring-transaction-calendar=financer\: Kalender wiederkehrende Buchung
+financer.heading.period-overview=financer\: Perioden\u00FCbersicht
 
 financer.cancel-back-to-overview=Abbrechen und zur\u00FCck zur \u00DCbersicht
 financer.back-to-overview=Zur\u00FCck zur \u00DCbersicht

financer-web-client/src/main/resources/static/css/main.css

@@ -34,7 +34,8 @@ a {
 
 #account-overview-table,
 #transaction-table,
-#recurring-transaction-list-table {
+#recurring-transaction-list-table,
+#period-overview-table {
     width: 100%;
     border-collapse: collapse;
     text-align: left;
@@ -47,7 +48,9 @@ a {
 #transaction-table th,
 #transaction-table td,
 #recurring-transaction-list-table th,
-#recurring-transaction-list-table td {
+#recurring-transaction-list-table td,
+#period-overview-table th,
+#period-overview-table td {
     border-bottom: 1px solid var(--border-color);
     padding: 0.3em;
     vertical-align: top;
@@ -55,7 +58,8 @@ a {
 
 #account-overview-table th,
 #transaction-table th,
-#recurring-transaction-list-table th {
+#recurring-transaction-list-table th,
+#period-overview-table th {
     position: sticky;
     top: 0px;
     background-color: var(--background-color);

financer-web-client/src/main/resources/templates/account/accountOverview.html

@@ -66,6 +66,8 @@
     <div id="action-container-sub-period">
         <a th:href="@{/closePeriod}"
            th:text="#{financer.account-overview.available-actions.close-current-period}"/>
+        <a th:href="@{/periodOverview}"
+           th:text="#{financer.account-overview.available-actions.period-overview}"/>
     </div>
     <div id="action-container-sub-reports">
         <a th:href="@{/selectChart}"

financer-web-client/src/main/resources/templates/period/periodOverview.html

@@ -0,0 +1,47 @@
+<!DOCTYPE HTML>
+<html xmlns:th="http://www.thymeleaf.org">
+<head>
+    <title th:text="#{financer.period-overview.title}"/>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link th:if="${darkMode}" rel="stylesheet" th:href="@{/css/darkModeColors.css}"/>
+    <link th:if="${!darkMode}" rel="stylesheet" th:href="@{/css/lightModeColors.css}"/>
+    <link rel="stylesheet" th:href="@{/css/main.css}">
+    <link rel="shortcut icon" th:href="@{/favicon.ico}"/>
+</head>
+<body>
+<h1 th:text="#{financer.heading.period-overview}"/>
+<span class="errorMessage" th:if="${errorMessage != null}" th:text="#{'financer.error-message.' + ${errorMessage}}"/>
+<a th:href="@{/accountOverview}" th:text="#{financer.cancel-back-to-overview}"/>
+<table id="period-overview-table">
+    <tr>
+        <th th:text="#{financer.period-overview.table-header.id}"/>
+        <th th:text="#{financer.period-overview.table-header.type}"/>
+        <th th:text="#{financer.period-overview.table-header.start}"/>
+        <th th:text="#{financer.period-overview.table-header.end}"/>
+        <th th:text="#{financer.period-overview.table-header.income}" />
+        <th th:text="#{financer.period-overview.table-header.expense}"/>
+        <th th:text="#{financer.period-overview.table-header.liability}"/>
+        <th th:text="#{financer.period-overview.table-header.total}"/>
+        <th th:text="#{financer.period-overview.table-header.assets}"/>
+        <th th:text="#{financer.period-overview.table-header.transactions}"/>
+    </tr>
+    <tr th:each="periodOverview : ${periodOverviews}">
+        <td th:text="${periodOverview.periodId}"/>
+        <td th:text="#{'financer.period-type.' + ${periodOverview.periodType}}"/>
+        <td th:text="${#temporals.format(periodOverview.periodStart)}"/>
+        <td th:text="${#temporals.format(periodOverview.periodEnd)}"/>
+        <td th:utext="${#numbers.formatDecimal(periodOverview.incomeSum/100D, 1, 'DEFAULT', 2, 'DEFAULT') + currencySymbol}"/>
+        <td th:utext="${#numbers.formatDecimal(periodOverview.expenseSum/100D, 1, 'DEFAULT', 2, 'DEFAULT') + currencySymbol}"/>
+        <td th:utext="${#numbers.formatDecimal(periodOverview.liabilitySum/100D, 1, 'DEFAULT', 2, 'DEFAULT') + currencySymbol}"/>
+        <td th:utext="${#numbers.formatDecimal(periodOverview.total/100D, 1, 'DEFAULT', 2, 'DEFAULT') + currencySymbol}"
+            th:classappend="${periodOverview.total > periodOverview.incomeSum} ? overspend"/>
+        <td th:if="${periodOverview.assetsSum != null}"
+            th:utext="${#numbers.formatDecimal(periodOverview.assetsSum/100D, 1, 'DEFAULT', 2, 'DEFAULT') + currencySymbol}"/>
+        <td th:if="${periodOverview.assetsSum == null}" />
+        <td th:text="${periodOverview.transactionCount}"/>
+    </tr>
+</table>
+<div th:replace="includes/footer :: footer"/>
+</body>
+</html>