Pages/CaritasServiceFundVeloHistoryPage.razor

+@page "/fundvelo/{FromRoute}"
+
+@using cwebplusApp.Shared.Services;
+@using cwebplusApp.Shared.Models;
+
+@inject NavigationManager NavigationManager
+@inject PageHistoryManager PageHistoryManager
+@inject ReportDataProvider ReportDataProvider
+@inject ReportRepositoryService ReportRepositoryService
+@inject IStringLocalizer<Resources> i18n;
+@inject Toaster Toaster;
+@inject IMatDialogService MatDialogService;
+@inject ScrollLockRemover ScrollLockRemover;
+
+<div class="row px-3">
+    <div class="row no-gutters align-items-start justify-content-center w-100" style="padding-top:1em">
+        @if (FromRoute.Equals("history_found")) {
+            <h2>@i18n["HistoryFound"]</h2>
+        } else {
+            <h2>@i18n["HistoryMissing"]</h2>
+        }
+    </div>
+    <div class="row no-gutters align-items-start w-100">
+        <MatTable RowClass="ReportRepositoryItem" Items="transmittedReports" class="mat-elevation-z5" ShowPaging="false" UseSortHeaderRow="true"
+                  AllowSelection="true">
+            <MatTableHeader>
+                <th>Id</th>
+                <th>@i18n["Type"]</th>
+                <th>@i18n["Date"]</th>
+                @if (FromRoute.Equals("history_found")) {
+                    <th>@i18n["Address"]</th>
+                }
+                <th>@i18n["Picture"]</th>
+                <th style="width:2400px">@i18n["Action"]</th>
+            </MatTableHeader>
+            <MatTableRow>
+                <td>@context.ID</td>
+                <td style="@getTypeBackgroundStyle(context.ReportType)">@translateType(context.ReportType)</td>
+                <td style="white-space: nowrap">@ReportRepositoryService.GetCurrentDateTimeFromMillis(context.ID)</td>
+                @if (FromRoute.Equals("history_found")) {
+                    <td style="white-space: nowrap">@getAddress(context)</td>
+                }
+                <td>@getPicture(context)</td>
+                <td>
+                    <MatIconButton Icon="delete_forever" OnClick="@(_ => DeleteReport(context))"></MatIconButton>
+                </td>
+            </MatTableRow>
+        </MatTable>
+    </div>
+    <div class="row no-gutters justify-content-end w-100">
+        <MatRipple class="inputfile-mat-ripple" Color="@MatRippleColor.Default" @onclick="DeleteAll" Style="background: lightgrey; width: 64px; height: 64px; border-radius: 32px; align-items: flex-end; justify-content: center; display: inline-flex;">
+            <label>
+                <svg xmlns="http://www.w3.org/2000/svg" height="48px" viewBox="0 0 24 24" width="48px" fill="#000000">
+                    <path d="M0 0h24v24H0V0z" fill="none" />
+                    <path d="M5 10h6v8H5z" opacity=".3" />
+                    <path d="M15 16h4v2h-4zm0-8h7v2h-7zm0 4h6v2h-6zM3 18c0 1.1.9 2 2 2h6c1.1 0 2-.9 2-2V8H3v10zm2-8h6v8H5v-8zm5-6H6L5 5H2v2h12V5h-3z" />
+                </svg>
+            </label>
+        </MatRipple>
+    </div>
+</div>
+
+
+@code {
+    [Parameter]
+    public string FromRoute { get; set; }
+
+
+    private List<ReportRepositoryItem> transmittedReports = new();
+    private ReportRepositoryItem selectedReport;
+
+    protected override void OnInitialized() {
+        base.OnInitialized();
+        PageHistoryManager.AddPageToHistory(NavigationManager.Uri);
+        StateHasChanged();
+    }
+
+    protected async override void OnParametersSet() {
+        if (FromRoute.Equals("history_found")) {
+            transmittedReports.AddRange(await ReportRepositoryService.GetTransmittedFoundReports());
+        } else {
+            transmittedReports.AddRange(await ReportRepositoryService.GetTransmittedMissingReports());
+        }
+        StateHasChanged();
+    }
+
+    private string translateType(ReportRepositoryItem.Type type) {
+        return i18n.GetString("ReportType." + type);
+    }
+
+    private string getTypeBackgroundStyle(ReportRepositoryItem.Type type) {
+        return ReportRepositoryItem.Type.FOUND.Equals(type) ? "background: linear-gradient(45deg, darkseagreen, transparent)" : "background: linear-gradient(45deg, darksalmon, transparent)";
+    }
+
+
+    private string getAddress(ReportRepositoryItem item) {
+        if (ReportRepositoryItem.Type.FOUND.Equals(item.ReportType)) {
+            GeographicInfo geoInfo = ((FoundReportRepositoryItem)item).Report.GeographicInfo;
+            return geoInfo.Address + ", " + geoInfo.Postcode + " " + geoInfo.Town;
+        }
+        return "";
+    }
+
+    private string getPicture(ReportRepositoryItem item) {
+        string picData = ReportRepositoryItem.Type.FOUND.Equals(item.ReportType) ? ((FoundReportRepositoryItem)item).Report.FotoString : ((MissingReportRepositoryItem)item).Report.FotoString;
+        return "";
+    }
+
+    private async void DeleteReport(ReportRepositoryItem item, bool ask = true) {
+        string yes = i18n.GetString("Yes");
+        string no = i18n.GetString("No");
+        string result = ask ? await MatDialogService.AskAsync(i18n.GetString("Pending." + item.ReportType + ".Delete"), new string[] { yes, no }) : yes;
+        await ScrollLockRemover.removeScrollLockAsync();
+        if (result.Equals(yes)) {
+            try {
+                await ReportRepositoryService.DeleteReport(item);
+                transmittedReports.Remove(item);
+                StateHasChanged();
+                Toaster.ShowSuccess(i18n.GetString("Success.DeleteReport.Title"), i18n.GetString("Success.DeleteReport.Msg", item.ID));
+            } catch (Exception ex) {
+                Toaster.ShowWarning(i18n.GetString("Error.DeleteReport.Title"), i18n.GetString("Error.DeleteReport.Msg", item.ID));
+            }
+        }
+    }
+
+    private async void DeleteAll() {
+        string yes = i18n.GetString("Yes");
+        string no = i18n.GetString("No");
+        string result = await MatDialogService.AskAsync(i18n.GetString("History.DELETE"), new string[] { yes, no });
+        await ScrollLockRemover.removeScrollLockAsync();
+        if (result.Equals(yes)) {
+            foreach (ReportRepositoryItem item in transmittedReports) {
+                DeleteReport(item, false);
+            }
+        }
+    }
+}

Shared/Services/ScrollLockRemover.cs

+using Microsoft.JSInterop;
+using System.Threading.Tasks;
+
+namespace cwebplusApp.Shared.Services {
+
+    // This class is only needed to work around a bug in MatDialogService.AskAsync.
+    // It removes a class from body, which is erroneously left there after a call to AskAsync.
+    // See https://github.com/SamProf/MatBlazor/issues/829 . REMOVE AS SOON AS THE BUG IS FIXED!
+    public class ScrollLockRemover {
+
+        private readonly IJSRuntime jsRuntime;
+
+        public ScrollLockRemover(IJSRuntime _jsRuntime) {
+            jsRuntime = _jsRuntime;
+        }
+
+        public async Task removeScrollLockAsync() {
+            var reference = DotNetObjectReference.Create(this);
+            await jsRuntime.InvokeVoidAsync("RemoveScrollLock", reference);
+        }
+
+    }
+}