- Alternate Pickup Contact Page

- fixing NominatimService village/town/city bug

Pages/AccountPage.razor

 @inject UserDataProvider UserDataProvider
 @inject IStringLocalizer<Resources> i18n
 @inject PageHistoryManager PageHistoryManager
+@inject ReportDataProvider ReportDataProvider
 
 
 <div class="row px-3 h-100">
     <div class="row no-gutters align-items-start w-100">
         <div class="row no-gutters align-items-center w-100" style="padding-top:2em">
             <div class="col-12">
-                <MatSelect Class="w-100" Label="@i18n["Salutation"]" Outlined="true"  @bind-Value="@Account.Salutation" Style="margin-bottom: 0.5rem">
+                <MatSelect Class="w-100" Label="@i18n["Salutation"]" Outlined="true" @bind-Value="@Account.Salutation" Style="margin-bottom: 0.5rem">
                     <MatOptionString Value="sir">@i18n["Man"]</MatOptionString>
                     <MatOptionString Value="madam">@i18n["Woman"]</MatOptionString>
-                </MatSelect>            
+                </MatSelect>
             </div>
         </div>
-        <div class="row no-gutters w-100" >
+        <div class="row no-gutters w-100">
             <div class="col-6" style="padding-right:0.5em">
                 <MatStringField Class="w-100" Label="@i18n["Firstname"]" Outlined="true" type="text" @bind-Value="@Account.Firstname"></MatStringField>
             </div>
 </div>
 
 
-
-
 @code {
 
     [Parameter]
     protected async override void OnInitialized() {
         PageHistoryManager.AddPageToHistory(NavigationManager.Uri);
         base.OnInitialized();
-        await GetUserData();
+        if (NavigationManager.Uri.EndsWith("/account")) {
+            await GetUserData();
+        }
     }
 
     private async void SaveUserData() {
     }
 
     private async Task GetUserData() {
-        await InvokeAsync(async () => {
-            await UserDataProvider.Get();
-            StateHasChanged();
-        });
+        await UserDataProvider.Get();
+        StateHasChanged();
     }
 
     private UserData Account {

Pages/AlternatePickupContactPage.razor

+@page "/fundvelo/alternate_pickup"
+
+@using cwebplusApp.Shared.Models;
+@using cwebplusApp.Shared.Services;
+
+@inject NavigationManager NavigationManager
+@inject UserDataProvider UserDataProvider
+@inject IStringLocalizer<Resources> i18n
+@inject PageHistoryManager PageHistoryManager
+@inject ReportDataProvider ReportDataProvider
+
+
+<div class="row px-3 h-100">
+    @*<div class="row no-gutters align-items-start justify-content-center w-100">
+        <MatHeadline4 Style="font-family:Ubuntu;padding-top:1em">@i18n["PickupContact"]</MatHeadline4>
+    </div>*@
+
+    <div class="row no-gutters align-items-center justify-content-center w-100" style="padding-top:1em">
+        <h2>@i18n["PickupContact"]</h2>
+    </div>
+
+    <div class="row no-gutters align-items-start w-100">
+        <div class="row no-gutters w-100" >
+            <div class="col-12">
+                <MatSelect Class="w-100" Label="@i18n["Salutation"]" Outlined="true" @bind-Value="@Account.Salutation" Style="margin-bottom: 0.5rem">
+                    <MatOptionString Value="sir">@i18n["Man"]</MatOptionString>
+                    <MatOptionString Value="madam">@i18n["Woman"]</MatOptionString>
+                </MatSelect>
+            </div>
+        </div>
+        <div class="row no-gutters w-100">
+            <div class="col-6" style="padding-right:0.5em">
+                <MatStringField Class="w-100" Label="@i18n["Firstname"]" Outlined="true" type="text" @bind-Value="@Account.Firstname"></MatStringField>
+            </div>
+            <div class="col-6" style="padding-left:0.5em">
+                <MatStringField Class="w-100" Label="@i18n["Lastname"]" Outlined="true" type="text" @bind-Value="@Account.Lastname"></MatStringField>
+            </div>
+        </div>
+        <div class="row no-gutters align-items-center w-100">
+            <div class="col-12">
+                <MatStringField Class="w-100" Label="@i18n["Address"]" Outlined="true" type="text" @bind-Value="@Account.Address"></MatStringField>
+            </div>
+        </div>
+        <div class="row no-gutters align-items-center w-100">
+            <div class="col-4" style="padding-right:0.5em">
+                <MatStringField Class="w-100" Label="@i18n["Zip"]" Outlined="true" type="text" @bind-Value="@Account.Zip"></MatStringField>
+            </div>
+            <div class="col-8" style="padding-left:0.5em">
+                <MatStringField Class="w-100" Label="@i18n["City"]" Outlined="true" type="text" @bind-Value="@Account.City"></MatStringField>
+            </div>
+        </div>
+        <div class="row no-gutters align-items-center w-100">
+            <div class="col-12">
+                <MatStringField Class="w-100" Label="@i18n["Mobile"]" Outlined="true" type="text" @bind-Value="@Account.Phone"></MatStringField>
+            </div>
+        </div>
+        <div class="row no-gutters align-items-center w-100">
+            <div class="col-12">
+                <MatStringField Class="w-100" Label="@i18n[" Phone"]" Outlined="true" type="text" @bind-Value="@Account.Phone"></MatStringField>
+            </div>
+        </div>
+        <div class="row no-gutters align-items-center w-100">
+            <div class="col-12">
+                <MatStringField Class="w-100" Label="@i18n["Mail"]" Outlined="true" type="text" @bind-Value="@Account.Email"></MatStringField>
+            </div>
+        </div>
+    </div>
+
+    <div class="row no-gutters align-items-end justify-content-center w-100" style="padding-bottom:2em">
+        <div class="col" style="padding-right:0.5em">
+            <MatButton Class="w-100" Outlined="true" @onclick="Cancel">@i18n["Cancel"]</MatButton>
+        </div>
+        <div class="col" style="padding-left:0.5em">
+            <MatButton Class="w-100" Raised="true" @onclick="Next">@i18n["Continue"]</MatButton>
+        </div>
+    </div>
+</div>
+
+
+@code {
+
+    protected async override void OnInitialized() {
+        PageHistoryManager.AddPageToHistory(NavigationManager.Uri);
+        base.OnInitialized();
+    }
+
+    private UserData Account {
+        get => UserDataProvider.Data;
+    }
+
+    private void Next() {
+        NavigationManager.NavigateTo("fundvelo/account/Found");
+    }
+
+    private void Cancel() {
+        NavigationManager.NavigateTo("caritas_services");
+    }
+
+}
+
+

Pages/CaritasServiceFundVeloFoundKeyDataPage.razor

+@page "/fundvelo/keydata/Found"
+
+@inherits CaritasServiceFundVeloKeyDataPageBase
+
+@using cwebplusApp.Shared.Models;
+@using cwebplusApp.Shared.Services;
+@using System.Globalization;
+@using Microsoft.AspNetCore.Components.Forms;
+@using System.IO;
+
+@inject NavigationManager NavigationManager
+@inject IStringLocalizer<Resources> i18n
+@inject PageHistoryManager PageHistoryManager
+@inject MasterDataService MasterDataService
+@inject Toaster Toaster
+@inject IJSRuntime JS
+@inject ReportDataProvider ReportDataProvider
+
+<div class="row px-3 h-100">
+    <div class="row no-gutters align-items-center justify-content-center w-100" style="padding-top:1em">
+        <h2>@i18n["FoundBike"]</h2>
+    </div>
+    <div class="row no-gutters align-items-center justify-content-center w-100">
+
+        <div class="mat-layout-grid w-100">
+            <div class="mat-layout-grid-inner">
+                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-1 justify-content-center" style="text-align: center">
+                    <div>
+                        <InputFile class="inputFile" id="camera" type="file" name="camera" accept="image/*" capture="environment" OnChange="@OnGatheringPicture" />
+                        <MatRipple class="inputfile-mat-ripple" Color="@MatRippleColor.Default">
+                            <label for="camera">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="48px" height="48px" viewBox="0 0 24 24" fill="#000000">
+                                    <path d="M0 0h21v21H0V0z" fill="none" />
+                                    <path d="M20 6h-4.05l-1.83-2H9.88L8.05 6H4v12h16V6zm-8 11c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z" opacity=".3" />
+                                    <path d="M4 20h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2zM4 6h4.05l1.83-2h4.24l1.83 2H20v12H4V6zm8 1c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0 8c-1.65 0-3-1.35-3-3s1.35-3 3-3 3 1.35 3 3-1.35 3-3 3z" />
+                                </svg>
+                            </label>
+                        </MatRipple>
+                    </div>
+                    <div style="margin-top:1rem">
+                        <InputFile class="inputFile" id="file" type="file" name="file" accept="image/x-png,image/jpeg,image/gif" OnChange="@OnGatheringPicture" />
+                        <MatRipple class="inputfile-mat-ripple" Color="@MatRippleColor.Default">
+                            <label for="file">
+                                <svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" width="48px" height="48px" viewBox="0 0 24 24" fill="#000000">
+                                    <g><rect fill="none" height="24" width="24" /></g>
+                                    <g>
+                                        <g>
+                                            <path d="M13,4H6v16h12V9h-5V4z M16,15h-3v4h-2v-4H8l4.01-4L16,15z" opacity=".3" />
+                                            <path d="M14,2H6C4.9,2,4.01,2.9,4.01,4L4,20c0,1.1,0.89,2,1.99,2H18c1.1,0,2-0.9,2-2V8L14,2z M18,20H6V4h7v5h5V20z" />
+                                            <polygon points="8,15 11,15 11,19 13,19 13,15 16,15 12.01,11" />
+                                        </g>
+                                    </g>
+                                </svg>
+                            </label>
+                        </MatRipple>
+                    </div>
+                </div>
+                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-3">
+                    <div>
+                        <MatCard Id="bikePic" Class="fv-mat-card">
+                            <MatCardContent>
+                                <MatCardMedia Square="true" Class="" ImageUrl="@imgUrl">
+                                    @if (loading) {
+                                        <MatProgressCircle Indeterminate="true" Size="MatProgressCircleSize.Medium" />
+                                    }
+                                </MatCardMedia>
+                            </MatCardContent>
+                        </MatCard>
+                    </div>
+                </div>
+                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-1 justify-content-center" style="text-align: center">
+                    <MatRipple class="inputfile-mat-ripple" Color="@MatRippleColor.Default" @onclick="InitializeMapPosition">
+                        <label>
+                            <svg xmlns="http://www.w3.org/2000/svg" height="48px" width="48px" viewBox="0 0 24 24" fill="#000000">
+                                <path d="M0 0h24v24H0V0z" fill="none" />
+                                <path d="M13 3.06V1h-2v2.06C6.83 3.52 3.52 6.83 3.06 11H1v2h2.06c.46 4.17 3.77 7.48 7.94 7.94V23h2v-2.06c4.17-.46 7.48-3.77 7.94-7.94H23v-2h-2.06c-.46-4.17-3.77-7.48-7.94-7.94zM12 19c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z" />
+                                <circle cx="12" cy="12" opacity=".3" r="2" />
+                                <path d="M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z" />
+                            </svg>
+                        </label>
+                    </MatRipple>
+                </div>
+                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-3">
+                    <div class="w-100 fv-osm-tile map-wrapper">
+                        <Map @ref="mapRef" MapOptions="@mapOptions"></Map>
+                    </div>
+                </div>
+                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-4-desktop">
+                    <div class="mat-layout-grid-inner">
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
+                            <MatStringField Class="w-100 form-check-label" Label="@getAddressLbl()" Outlined="true" Required="true" type="text" @bind-Value="@bicycleGeoPosition.Address"></MatStringField>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
+                            <MatStringField Class="w-100 form-check-label" Label="@i18n["PlaceOfDiscovery"]" Outlined="true" Required="true" type="text" @bind-Value="@bicycleGeoPosition.City"></MatStringField>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
+                            <MatTextField Class="w-100 form-check-label italic" Label="@i18n["Latitude"]" Outlined="true" ReadOnly="true" @bind-Value="@bicycleGeoPosition.Latitude"></MatTextField>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
+                            <MatTextField Class="w-100 form-check-label italic" Label="@i18n["Longitude"]" Outlined="true" ReadOnly="true" @bind-Value="@bicycleGeoPosition.Longitude"></MatTextField>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
+                    <div class="mat-layout-grid-inner">
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
+                            <MatSelectValue FullWidth="true" Outlined="true" Label="@i18n["Color"]" @bind-Value="selectedColor" Items="@Colors" ValueSelector="@(i=>i)">
+                                <ItemTemplate>
+                                    <div>
+                                        <span class="btn-sm" style="background-color:@context.Code;
+                                                                    display:initial;
+                                                                    border:1px solid black;
+                                                                    box-shadow:0.2em 0.2em 0.3em 0.025em #3f4244" />
+                                        <span class="btn">@context?.Bezeichnung</span>
+                                    </div>
+                                </ItemTemplate>
+                            </MatSelectValue>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
+                            <div class="outlined">
+                                <MatAutocompleteList TItem="Brand" FullWidth="true" Label="@i18n["Brand"]" Items="@Brands" OnTextChanged="setBrandValue" @bind-Value="SelectedBrand" CustomStringSelector="@(i => i?.Bezeichnung)">
+                                    <ItemTemplate>
+                                        <div>
+                                            <span>@context?.Bezeichnung</span>
+                                        </div>
+                                    </ItemTemplate>
+                                </MatAutocompleteList>
+                            </div>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
+                            <MatSelectValue FullWidth="true" Outlined="true" Label="@i18n["Type"]" @bind-Value="selectedBcType" Items="@BicycleTypes" ValueSelector="@(i=>i)">
+                                <ItemTemplate>
+                                    <div>
+                                        <span>@context?.Bezeichnung</span>
+                                    </div>
+                                </ItemTemplate>
+                            </MatSelectValue>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
+                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
+                                <MatStringField Class="w-100 form-check-label" Label="@i18n["FrameNumber"]" Outlined="true" type="text"></MatStringField>
+                            </div>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
+                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
+                                <MatStringField Class="w-100 form-check-label" Label="@i18n["Remark"]" Outlined="true" type="text"></MatStringField>
+                            </div>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
+                            <div>
+                                <MatCheckbox @bind-Value="@abholadresseIsNotContact" Label="@i18n["AlternatePickupContact"]"></MatCheckbox>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <div class="row no-gutters align-items-end justify-content-center w-100" style="padding-bottom:2em;padding-top:2em">
+        <div class="col" style="padding-right:0.5em">
+            <MatButton Class="w-100" Outlined="true" @onclick="Cancel">@i18n["Cancel"]</MatButton>
+        </div>
+        <div class="col" style="padding-left:0.5em">
+            <MatButton Class="w-100" Raised="true" @onclick="Next">@i18n["Continue"]</MatButton>
+        </div>
+    </div>
+</div>
+
+
+@code {
+    private static long MAX_FILE_SIZE = 3145728;  //3MB
+
+    private string imgUrl = string.Empty;
+    private Boolean loading = false;
+    private ColorItem selectedColor;
+    private BicycleType selectedBcType;
+    private string brandStringValue;
+    private Brand selectedBrand;
+    private Brand SelectedBrand {
+        get { return selectedBrand; }
+        set { selectedBrand = (value != null) ? value : new Brand(-999, brandStringValue); }
+    }
+    private void setBrandValue(string value) {
+        brandStringValue = value;
+        selectedBrand = null;
+    }
+    private bool abholadresseIsNotContact;
+
+    protected async override void OnInitialized() {
+        await GetColors();
+        await GetBicycleTypes();
+        await GetBrands();
+        PageHistoryManager.AddPageToHistory(NavigationManager.Uri);
+        base.OnInitialized();
+        StateHasChanged();
+    }
+
+    private Brand getBrand(Brand brand) {
+        return brand != null ? brand : new Brand(-999, "Test");
+    }
+
+    private async Task GetColors() {
+        await MasterDataService.GetColors();
+    }
+
+    private async Task GetBicycleTypes() {
+        await MasterDataService.GetBicycleTypes();
+    }
+
+    private async Task GetBrands() {
+        await MasterDataService.GetBrands();
+    }
+
+    private ColorItem[] Colors {
+        get => MasterDataService.Colors;
+    }
+
+    private BicycleType[] BicycleTypes {
+        get => MasterDataService.BicycleTypes;
+    }
+
+    private Brand[] Brands {
+        get => MasterDataService.Brands;
+    }
+
+    private void Next() {
+        if (abholadresseIsNotContact) {
+            NavigationManager.NavigateTo("fundvelo/alternate_pickup");
+        } else {
+            NavigationManager.NavigateTo("fundvelo/account/Found");
+        }
+    }
+
+    private void Cancel() {
+        NavigationManager.NavigateTo("caritas_services");
+    }
+
+
+    private string getAddressLbl() {
+        return i18n.GetString("Address") + " (" + i18n.GetString("PlaceOfDiscovery") + ")";
+    }
+
+    private async Task OnGatheringPicture(InputFileChangeEventArgs e) {
+        IBrowserFile imgFile = e.File;
+        var buffer = new byte[imgFile.Size];
+        imgUrl = string.Empty;
+        loading = true;
+        StateHasChanged();
+        try {
+            using (var stream = imgFile.OpenReadStream(MAX_FILE_SIZE)) {
+                await stream.ReadAsync(buffer);
+                imgUrl = $"data:{imgFile.ContentType};base64,{Convert.ToBase64String(buffer)}";
+                await stream.DisposeAsync();
+            }
+        } catch (IOException ex) {
+            Console.WriteLine("Ex.Message is: {0}.", ex.Message);
+            if (ex.Message.Contains("exceeds the maximum of")) {
+                Toaster.ShowError(i18n.GetString("Error.PhotoOrPictureToBig.Title"), i18n.GetString("Error.PhotoOrPictureToBig.Msg", MAX_FILE_SIZE / (1024 * 1024)));
+            } else {
+                Toaster.ShowError(i18n.GetString("Error.IOException.Title"), i18n.GetString("Error.IOException.Msg"));
+            }
+        } catch (JSException ex) {
+            Console.WriteLine("Ex.Message is: {0}.", ex.Message);
+        } finally {
+            Array.Clear(buffer, 0, buffer.Length);
+            buffer = null;
+            loading = false;
+            StateHasChanged();
+        }
+    }
+
+}

Pages/CaritasServiceFundVeloKeyDataPage.razor.cs → Pages/CaritasServiceFundVeloFoundKeyDataPage.razor.cs

         private static string GetFormattedAddressZipAndTown(NominatimReverseAddress addressDto) {
             string country_code = addressDto.address.country_code;
             string zip = addressDto.address.postcode.Split("-", StringSplitOptions.RemoveEmptyEntries | StringSplitOptions.TrimEntries)[0];
-            string town = addressDto.address.town;
+            string town = addressDto.address.village ?? addressDto.address.town ?? addressDto.address.city;
 
             return !String.IsNullOrEmpty(country_code) ? country_code.ToUpper() + "-" + zip + " " + town : zip + " " + town;
         }

Pages/CaritasServiceFundVeloKeyDataPage.razor

-@page "/fundvelo/keydata/{FromRoute}"
-
-@inherits CaritasServiceFundVeloKeyDataPageBase
-
-@using cwebplusApp.Shared.Models;
-@using cwebplusApp.Shared.Services;
-@using System.Globalization;
-@using Microsoft.AspNetCore.Components.Forms;
-@using System.IO;
-
-@inject NavigationManager NavigationManager
-@inject IStringLocalizer<Resources> i18n
-@inject PageHistoryManager PageHistoryManager
-@inject MasterDataService MasterDataService
-@inject Toaster Toaster
-@inject IJSRuntime JS
-
-<div class="row px-3 h-100">
-    <div class="row no-gutters align-items-center justify-content-center w-100" style="padding-top:1em">
-        @if ("Found".Equals(FromRoute)) {
-            <h2>@i18n["FoundBike"]</h2>
-        } else {
-            <h2>@i18n["MissingBike"]</h2>
-        }
-    </div>
-    <div class="row no-gutters align-items-center justify-content-center w-100">
-
-        <div class="mat-layout-grid w-100">
-            <div class="mat-layout-grid-inner">
-                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-1 justify-content-center" style="text-align: center">
-                    <div>
-                        <InputFile class="inputFile" id="camera" type="file" name="camera" accept="image/*" capture="environment" OnChange="@OnGatheringPicture" />
-                        <MatRipple class="inputfile-mat-ripple" Color="@MatRippleColor.Default">
-                            <label for="camera">
-                                <svg xmlns="http://www.w3.org/2000/svg" width="48px" height="48px" viewBox="0 0 24 24" fill="#000000">
-                                    <path d="M0 0h21v21H0V0z" fill="none" />
-                                    <path d="M20 6h-4.05l-1.83-2H9.88L8.05 6H4v12h16V6zm-8 11c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z" opacity=".3" />
-                                    <path d="M4 20h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2zM4 6h4.05l1.83-2h4.24l1.83 2H20v12H4V6zm8 1c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0 8c-1.65 0-3-1.35-3-3s1.35-3 3-3 3 1.35 3 3-1.35 3-3 3z" />
-                                </svg>
-                            </label>
-                        </MatRipple>
-                    </div>
-                    <div style="margin-top:1rem">
-                        <InputFile class="inputFile" id="file" type="file" name="file" accept="image/x-png,image/jpeg,image/gif" OnChange="@OnGatheringPicture" />
-                        <MatRipple class="inputfile-mat-ripple" Color="@MatRippleColor.Default">
-                            <label for="file">
-                                <svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" width="48px" height="48px" viewBox="0 0 24 24" fill="#000000">
-                                    <g><rect fill="none" height="24" width="24" /></g>
-                                    <g>
-                                        <g>
-                                            <path d="M13,4H6v16h12V9h-5V4z M16,15h-3v4h-2v-4H8l4.01-4L16,15z" opacity=".3" />
-                                            <path d="M14,2H6C4.9,2,4.01,2.9,4.01,4L4,20c0,1.1,0.89,2,1.99,2H18c1.1,0,2-0.9,2-2V8L14,2z M18,20H6V4h7v5h5V20z" />
-                                            <polygon points="8,15 11,15 11,19 13,19 13,15 16,15 12.01,11" />
-                                        </g>
-                                    </g>
-                                </svg>
-                            </label>
-                        </MatRipple>
-                    </div>
-                </div>
-                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-3">
-                    <div>
-                        <MatCard Id="bikePic" Class="fv-mat-card">
-                            <MatCardContent>
-                                <MatCardMedia Square="true" Class="" ImageUrl="@imgUrl">
-                                    @if (loading) {
-                                        <MatProgressCircle Indeterminate="true" Size="MatProgressCircleSize.Medium" />
-                                    }
-                                </MatCardMedia>
-                            </MatCardContent>
-                        </MatCard>
-                    </div>
-                </div>
-                @if ("Found".Equals(FromRoute)) {<!-- Gefundenes Velo-->
-                    <div class="mat-layout-grid-cell mat-layout-grid-cell-span-1 justify-content-center" style="text-align: center">
-                        <MatRipple class="inputfile-mat-ripple" Color="@MatRippleColor.Default" @onclick="InitializeMapPosition">
-                            <label>
-                                <svg xmlns="http://www.w3.org/2000/svg" height="48px" width="48px" viewBox="0 0 24 24" fill="#000000">
-                                    <path d="M0 0h24v24H0V0z" fill="none" />
-                                    <path d="M13 3.06V1h-2v2.06C6.83 3.52 3.52 6.83 3.06 11H1v2h2.06c.46 4.17 3.77 7.48 7.94 7.94V23h2v-2.06c4.17-.46 7.48-3.77 7.94-7.94H23v-2h-2.06c-.46-4.17-3.77-7.48-7.94-7.94zM12 19c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z" />
-                                    <circle cx="12" cy="12" opacity=".3" r="2" />
-                                    <path d="M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z" />
-                                </svg>
-                            </label>
-                        </MatRipple>
-                    </div>
-                    <div class="mat-layout-grid-cell mat-layout-grid-cell-span-3">
-                        <div class="w-100 fv-osm-tile map-wrapper">
-                            <Map @ref="mapRef" MapOptions="@mapOptions"></Map>
-                        </div>
-                    </div>
-                    <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-4-desktop">
-                        <div class="mat-layout-grid-inner">
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
-                                <MatStringField Class="w-100 form-check-label" Label="@getAddressLbl()" Outlined="true" Required="true" type="text" @bind-Value="@bicycleGeoPosition.Address"></MatStringField>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
-                                <MatStringField Class="w-100 form-check-label" Label="@getPlaceLbl()" Outlined="true" Required="true" type="text" @bind-Value="@bicycleGeoPosition.City"></MatStringField>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
-                                <MatTextField Class="w-100 form-check-label italic" Label="@i18n["Latitude"]" Outlined="true" ReadOnly="true" @bind-Value="@bicycleGeoPosition.Latitude"></MatTextField>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
-                                <MatTextField Class="w-100 form-check-label italic" Label="@i18n["Longitude"]" Outlined="true" ReadOnly="true" @bind-Value="@bicycleGeoPosition.Longitude"></MatTextField>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
-                        <div class="mat-layout-grid-inner">
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
-                                <MatSelectValue FullWidth="true" Outlined="true" Label="@i18n["Color"]" @bind-Value="selectedColor" Items="@Colors" ValueSelector="@(i=>i)">
-                                    <ItemTemplate>
-                                        <div>
-                                            <span class="btn-sm" style="background-color:@context.Code;
-                                                                    display:initial;
-                                                                    border:1px solid black;
-                                                                    box-shadow:0.2em 0.2em 0.3em 0.025em #3f4244" />
-                                            <span class="btn">@context?.Bezeichnung</span>
-                                        </div>
-                                    </ItemTemplate>
-                                </MatSelectValue>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
-                                <div class="outlined">
-                                    <MatAutocompleteList TItem="Brand" FullWidth="true" Label="@i18n["Brand"]" Items="@Brands" OnTextChanged="setBrandValue" @bind-Value="SelectedBrand" CustomStringSelector="@(i => i?.Bezeichnung)">
-                                        <ItemTemplate>
-                                            <div>
-                                                <span>@context?.Bezeichnung</span>
-                                            </div>
-                                        </ItemTemplate>
-                                    </MatAutocompleteList>
-                                </div>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
-                                <MatSelectValue FullWidth="true" Outlined="true" Label="@i18n["Type"]" @bind-Value="selectedBcType" Items="@BicycleTypes" ValueSelector="@(i=>i)">
-                                    <ItemTemplate>
-                                        <div>
-                                            <span>@context?.Bezeichnung</span>
-                                        </div>
-                                    </ItemTemplate>
-                                </MatSelectValue>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
-                                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
-                                    <MatStringField Class="w-100 form-check-label" Label="@i18n["FrameNumber"]" Outlined="true" type="text"></MatStringField>
-                                </div>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
-                                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
-                                    <MatStringField Class="w-100 form-check-label" Label="@i18n["Remark"]" Outlined="true" type="text"></MatStringField>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                } else { <!-- Vermisstes Velo-->
-                    <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
-                        <div class="mat-layout-grid-inner">
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
-                                <MatSelectValue FullWidth="true" Outlined="true" Label="@i18n["Color"]" @bind-Value="selectedColor" Items="@Colors" ValueSelector="@(i=>i)">
-                                    <ItemTemplate>
-                                        <div>
-                                            <span class="btn-sm" style="background-color:@context.Code;
-                                                                    display:initial;
-                                                                    border:1px solid black;
-                                                                    box-shadow:0.2em 0.2em 0.3em 0.025em #3f4244" />
-                                            <span class="btn">@context?.Bezeichnung</span>
-                                        </div>
-                                    </ItemTemplate>
-                                </MatSelectValue>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
-                                <div class="outlined">
-                                    <MatAutocompleteList TItem="Brand" FullWidth="true" Label="@i18n["Brand"]" Items="@Brands" OnTextChanged="setBrandValue" @bind-Value="SelectedBrand" CustomStringSelector="@(i => i?.Bezeichnung)">
-                                        <ItemTemplate>
-                                            <div>
-                                                <span>@context?.Bezeichnung</span>
-                                            </div>
-                                        </ItemTemplate>
-                                    </MatAutocompleteList>
-                                </div>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
-                                <MatSelectValue FullWidth="true" Outlined="true" Label="@i18n["Type"]" @bind-Value="selectedBcType" Items="@BicycleTypes" ValueSelector="@(i=>i)">
-                                    <ItemTemplate>
-                                        <div>
-                                            <span>@context?.Bezeichnung</span>
-                                        </div>
-                                    </ItemTemplate>
-                                </MatSelectValue>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
-                                <MatStringField Class="w-100 form-check-label" Label="@i18n["FrameNumber"]" Outlined="true" type="text"></MatStringField>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-4-desktop">
-                        <div class="mat-layout-grid-inner">
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
-                                <MatStringField Class="w-100 form-check-label" Label="@i18n["Age"]" Outlined="true" type="text"></MatStringField>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
-                                <MatStringField Class="w-100 form-check-label" Label="@i18n["Price"]" Outlined="true" type="text"></MatStringField>
-                            </div>
-                            <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
-                                <MatStringField Class="w-100 form-check-label" Label="@i18n["Remark"]" Outlined="true" type="text"></MatStringField>
-                            </div>
-                        </div>
-                    </div>
-                }
-            </div>
-        </div>
-    </div>
-
-    <div class="row no-gutters align-items-end justify-content-center w-100" style="padding-bottom:2em;padding-top:2em">
-        <div class="col" style="padding-right:0.5em">
-            <MatButton Class="w-100" Outlined="true" @onclick="Cancel">@i18n["Cancel"]</MatButton>
-        </div>
-        <div class="col" style="padding-left:0.5em">
-            <MatButton Class="w-100" Raised="true" @onclick="Next">@i18n["Continue"]</MatButton>
-        </div>
-    </div>
-</div>
-
-
-@code {
-    [Parameter]
-    public string FromRoute { get; set; }
-
-    private static long MAX_FILE_SIZE = 3145728;  //3MB
-
-    private string imgUrl = string.Empty;
-    private Boolean loading = false;
-    private ColorItem selectedColor;
-    private BicycleType selectedBcType;
-    private string brandStringValue;
-    private Brand selectedBrand;
-    private Brand SelectedBrand {
-        get { return selectedBrand; }
-        set { selectedBrand = (value != null) ? value : new Brand(-999, brandStringValue); }
-    }
-    private void setBrandValue(string value) {
-        brandStringValue = value;
-        selectedBrand = null;
-    }
-
-    protected async override void OnInitialized() {
-        await GetColors();
-        await GetBicycleTypes();
-        await GetBrands();
-        PageHistoryManager.AddPageToHistory(NavigationManager.Uri);
-        base.OnInitialized();
-    }
-
-    private Brand getBrand(Brand brand) {
-        return brand != null ? brand : new Brand(-999, "Test");
-    }
-
-    private async Task GetColors() {
-        await MasterDataService.GetColors();
-        StateHasChanged();
-    }
-
-    private async Task GetBicycleTypes() {
-        await MasterDataService.GetBicycleTypes();
-        StateHasChanged();
-    }
-
-    private async Task GetBrands() {
-        await MasterDataService.GetBrands();
-        StateHasChanged();
-    }
-
-    private ColorItem[] Colors {
-        get => MasterDataService.Colors;
-    }
-
-    private BicycleType[] BicycleTypes {
-        get => MasterDataService.BicycleTypes;
-    }
-
-    private Brand[] Brands {
-        get => MasterDataService.Brands;
-    }
-
-    private void Next() {
-        NavigationManager.NavigateTo("fundvelo/account/" + @FromRoute);
-    }
-
-    private void Cancel() {
-        NavigationManager.NavigateTo("caritas_services");
-    }
-
-
-    private string getAddressLbl() {
-        return i18n.GetString("Address") + " (" + getPlaceLbl() + ")";
-    }
-
-    private string getPlaceLbl() {
-        return @FromRoute == "Found" ? i18n.GetString("PlaceOfDiscovery") : i18n.GetString("PlaceOfLoss");
-    }
-
-    private async Task OnGatheringPicture(InputFileChangeEventArgs e) {
-        IBrowserFile imgFile = e.File;
-        var buffer = new byte[imgFile.Size];
-        imgUrl = string.Empty;
-        loading = true;
-        StateHasChanged();
-        try {
-            using (var stream = imgFile.OpenReadStream(MAX_FILE_SIZE)) {
-                await stream.ReadAsync(buffer);
-                imgUrl = $"data:{imgFile.ContentType};base64,{Convert.ToBase64String(buffer)}";
-                await stream.DisposeAsync();
-            }
-        } catch (IOException ex) {
-            Console.WriteLine("Ex.Message is: {0}.", ex.Message);
-            if (ex.Message.Contains("exceeds the maximum of")) {
-                Toaster.ShowError(i18n.GetString("Error.PhotoOrPictureToBig.Title"), i18n.GetString("Error.PhotoOrPictureToBig.Msg", MAX_FILE_SIZE / (1024 * 1024)));
-            } else {
-                Toaster.ShowError(i18n.GetString("Error.IOException.Title"), i18n.GetString("Error.IOException.Msg"));
-            }
-        } catch (JSException ex) {
-            Console.WriteLine("Ex.Message is: {0}.", ex.Message);
-        } finally {
-            Array.Clear(buffer, 0, buffer.Length);
-            buffer = null;
-            loading = false;
-            StateHasChanged();
-        }
-    }
-
-}

Pages/CaritasServiceFundVeloLostFoundPage.razor

 
     private void Found() {
         ReportDataProvider.Report = new FoundReport();
-        NavigationManager.NavigateTo("fundvelo/keydata/Found/");
+        NavigationManager.NavigateTo("fundvelo/keydata/Found");
     }
 
     private void Missing() {

Pages/CaritasServiceFundVeloMissingKeyDataPage.razor

+@page "/fundvelo/keydata/Missing"
+
+@inherits CaritasServiceFundVeloKeyDataPageBase
+
+@using cwebplusApp.Shared.Models;
+@using cwebplusApp.Shared.Services;
+@using System.Globalization;
+@using Microsoft.AspNetCore.Components.Forms;
+@using System.IO;
+
+@inject NavigationManager NavigationManager
+@inject IStringLocalizer<Resources> i18n
+@inject PageHistoryManager PageHistoryManager
+@inject MasterDataService MasterDataService
+@inject Toaster Toaster
+@inject IJSRuntime JS
+@inject ReportDataProvider ReportDataProvider
+
+<div class="row px-3 h-100">
+    <div class="row no-gutters align-items-center justify-content-center w-100" style="padding-top:1em">
+        <h2>@i18n["MissingBike"]</h2>
+    </div>
+    <div class="row no-gutters align-items-center justify-content-center w-100">
+        <div class="mat-layout-grid w-100">
+            <div class="mat-layout-grid-inner">
+                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-1 justify-content-center" style="text-align: center">
+                    <div>
+                        <InputFile class="inputFile" id="camera" type="file" name="camera" accept="image/*" capture="environment" OnChange="@OnGatheringPicture" />
+                        <MatRipple class="inputfile-mat-ripple" Color="@MatRippleColor.Default">
+                            <label for="camera">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="48px" height="48px" viewBox="0 0 24 24" fill="#000000">
+                                    <path d="M0 0h21v21H0V0z" fill="none" />
+                                    <path d="M20 6h-4.05l-1.83-2H9.88L8.05 6H4v12h16V6zm-8 11c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z" opacity=".3" />
+                                    <path d="M4 20h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2zM4 6h4.05l1.83-2h4.24l1.83 2H20v12H4V6zm8 1c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0 8c-1.65 0-3-1.35-3-3s1.35-3 3-3 3 1.35 3 3-1.35 3-3 3z" />
+                                </svg>
+                            </label>
+                        </MatRipple>
+                    </div>
+                    <div style="margin-top:1rem">
+                        <InputFile class="inputFile" id="file" type="file" name="file" accept="image/x-png,image/jpeg,image/gif" OnChange="@OnGatheringPicture" />
+                        <MatRipple class="inputfile-mat-ripple" Color="@MatRippleColor.Default">
+                            <label for="file">
+                                <svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" width="48px" height="48px" viewBox="0 0 24 24" fill="#000000">
+                                    <g><rect fill="none" height="24" width="24" /></g>
+                                    <g>
+                                        <g>
+                                            <path d="M13,4H6v16h12V9h-5V4z M16,15h-3v4h-2v-4H8l4.01-4L16,15z" opacity=".3" />
+                                            <path d="M14,2H6C4.9,2,4.01,2.9,4.01,4L4,20c0,1.1,0.89,2,1.99,2H18c1.1,0,2-0.9,2-2V8L14,2z M18,20H6V4h7v5h5V20z" />
+                                            <polygon points="8,15 11,15 11,19 13,19 13,15 16,15 12.01,11" />
+                                        </g>
+                                    </g>
+                                </svg>
+                            </label>
+                        </MatRipple>
+                    </div>
+                </div>
+                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-3">
+                    <div>
+                        <MatCard Id="bikePic" Class="fv-mat-card">
+                            <MatCardContent>
+                                <MatCardMedia Square="true" Class="" ImageUrl="@imgUrl">
+                                    @if (loading) {
+                                        <MatProgressCircle Indeterminate="true" Size="MatProgressCircleSize.Medium" />
+                                    }
+                                </MatCardMedia>
+                            </MatCardContent>
+                        </MatCard>
+                    </div>
+                </div>
+                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
+                    <div class="mat-layout-grid-inner">
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
+                            <MatSelectValue FullWidth="true" Outlined="true" Label="@i18n["Color"]" @bind-Value="selectedColor" Items="@Colors" ValueSelector="@(i=>i)">
+                                <ItemTemplate>
+                                    <div>
+                                        <span class="btn-sm" style="background-color:@context.Code;
+                                                                    display:initial;
+                                                                    border:1px solid black;
+                                                                    box-shadow:0.2em 0.2em 0.3em 0.025em #3f4244" />
+                                        <span class="btn">@context?.Bezeichnung</span>
+                                    </div>
+                                </ItemTemplate>
+                            </MatSelectValue>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
+                            <div class="outlined">
+                                <MatAutocompleteList TItem="Brand" FullWidth="true" Label="@i18n["Brand"]" Items="@Brands" OnTextChanged="setBrandValue" @bind-Value="SelectedBrand" CustomStringSelector="@(i => i?.Bezeichnung)">
+                                    <ItemTemplate>
+                                        <div>
+                                            <span>@context?.Bezeichnung</span>
+                                        </div>
+                                    </ItemTemplate>
+                                </MatAutocompleteList>
+                            </div>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
+                            <MatSelectValue FullWidth="true" Outlined="true" Label="@i18n["Type"]" @bind-Value="selectedBcType" Items="@BicycleTypes" ValueSelector="@(i=>i)">
+                                <ItemTemplate>
+                                    <div>
+                                        <span>@context?.Bezeichnung</span>
+                                    </div>
+                                </ItemTemplate>
+                            </MatSelectValue>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
+                            <MatStringField Class="w-100 form-check-label" Label="@i18n["FrameNumber"]" Outlined="true" type="text"></MatStringField>
+                        </div>
+                    </div>
+                </div>
+                <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-4-desktop">
+                    <div class="mat-layout-grid-inner">
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
+                            <MatStringField Class="w-100 form-check-label" Label="@i18n["Age"]" Outlined="true" type="text"></MatStringField>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
+                            <MatStringField Class="w-100 form-check-label" Label="@i18n["Price"]" Outlined="true" type="text"></MatStringField>
+                        </div>
+                        <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
+                            <MatStringField Class="w-100 form-check-label" Label="@i18n["Remark"]" Outlined="true" type="text"></MatStringField>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <div class="row no-gutters align-items-end justify-content-center w-100" style="padding-bottom:2em;padding-top:2em">
+        <div class="col" style="padding-right:0.5em">
+            <MatButton Class="w-100" Outlined="true" @onclick="Cancel">@i18n["Cancel"]</MatButton>
+        </div>
+        <div class="col" style="padding-left:0.5em">
+            <MatButton Class="w-100" Raised="true" @onclick="Next">@i18n["Continue"]</MatButton>
+        </div>
+    </div>
+</div>
+
+
+@code {
+    [Parameter]
+    public string FromRoute { get; set; }
+
+    private static long MAX_FILE_SIZE = 3145728;  //3MB
+
+    private string imgUrl = string.Empty;
+    private Boolean loading = false;
+    private ColorItem selectedColor;
+    private BicycleType selectedBcType;
+    private string brandStringValue;
+    private Brand selectedBrand;
+    private Brand SelectedBrand {
+        get { return selectedBrand; }
+        set { selectedBrand = (value != null) ? value : new Brand(-999, brandStringValue); }
+    }
+    private void setBrandValue(string value) {
+        brandStringValue = value;
+        selectedBrand = null;
+    }
+
+    protected async override void OnInitialized() {
+        await GetColors();
+        await GetBicycleTypes();
+        await GetBrands();
+        PageHistoryManager.AddPageToHistory(NavigationManager.Uri);
+        base.OnInitialized();
+        StateHasChanged();
+    }
+
+    private Brand getBrand(Brand brand) {
+        return brand != null ? brand : new Brand(-999, "Test");
+    }
+
+    private async Task GetColors() {
+        await MasterDataService.GetColors();
+    }
+
+    private async Task GetBicycleTypes() {
+        await MasterDataService.GetBicycleTypes();
+    }
+
+    private async Task GetBrands() {
+        await MasterDataService.GetBrands();
+    }
+
+    private ColorItem[] Colors {
+        get => MasterDataService.Colors;
+    }
+
+    private BicycleType[] BicycleTypes {
+        get => MasterDataService.BicycleTypes;
+    }
+
+    private Brand[] Brands {
+        get => MasterDataService.Brands;
+    }
+
+    private void Next() {
+        NavigationManager.NavigateTo("fundvelo/account/Missing");
+    }
+
+    private void Cancel() {
+        NavigationManager.NavigateTo("caritas_services");
+    }
+           
+    private async Task OnGatheringPicture(InputFileChangeEventArgs e) {
+        IBrowserFile imgFile = e.File;
+        var buffer = new byte[imgFile.Size];
+        imgUrl = string.Empty;
+        loading = true;
+        StateHasChanged();
+        try {
+            using (var stream = imgFile.OpenReadStream(MAX_FILE_SIZE)) {
+                await stream.ReadAsync(buffer);
+                imgUrl = $"data:{imgFile.ContentType};base64,{Convert.ToBase64String(buffer)}";
+                await stream.DisposeAsync();
+            }
+        } catch (IOException ex) {
+            Console.WriteLine("Ex.Message is: {0}.", ex.Message);
+            if (ex.Message.Contains("exceeds the maximum of")) {
+                Toaster.ShowError(i18n.GetString("Error.PhotoOrPictureToBig.Title"), i18n.GetString("Error.PhotoOrPictureToBig.Msg", MAX_FILE_SIZE / (1024 * 1024)));
+            } else {
+                Toaster.ShowError(i18n.GetString("Error.IOException.Title"), i18n.GetString("Error.IOException.Msg"));
+            }
+        } catch (JSException ex) {
+            Console.WriteLine("Ex.Message is: {0}.", ex.Message);
+        } finally {
+            Array.Clear(buffer, 0, buffer.Length);
+            buffer = null;
+            loading = false;
+            StateHasChanged();
+        }
+    }
+
+}

Shared/Models/FoundReport.cs

 namespace cwebplusApp.Shared.Models {
     public class FoundReport : Report {
-        public string Anrede { get; set; }                  // required
-        public string Vorname { get; set; }                 // required
-        public string Nachname { get; set; }                // required
         public bool AbholadresseIstKontakt { get; set; }    // required
-        public int TypId { get; set; }                      // required
-        public int MarkeId { get; set; }                    // required
-        public int FarbeId { get; set; }                    // required
-        public string Bemerkung { get; set; }
-        public string Mobil { get; set; }
         public string NeueMarke { get; set; }
-        public string Rahmennummer { get; set; }
-        public string Telefon { get; set; }
-        public string Foto { get; set; }
         public GeographicInfo GeographicInfo { get; set; }  // required
 
         public string AbholAnrede { get; set; }             // required when AbholadresseIstKontakt = false

Shared/Models/MissingReport.cs

 namespace cwebplusApp.Shared.Models {
     public class MissingReport : Report {
-        public string Anrede { get; set; }      // required
-        public string Vorname { get; set; }     // required
-        public string Nachname { get; set; }    // required
         public string Mail { get; set; }        // required
         public string PersonPLZ { get; set; }   // required
         public string PersonOrt { get; set; }   // required
         public string PersonStrasse { get; set; } // required
-        public int TypId { get; set; }          // required
-        public int MarkeId { get; set; }        // required
-        public int FarbeId { get; set; }        // required
         public int Alter { get; set; }
         public double Preis { get; set; }
-        public string Foto { get; set; }
-        public string RahmenNummer { get; set; }
         public string NeueMarke { get; set; }
-        public string Telefon { get; set; }
-        public string Mobil { get; set; }
         public string Zusatz { get; set; }
         public string Postfach { get; set; }
-        public string Bemerkung { get; set; }
         public int SuchDienstId { get; set; }
         public string SuchDienstNr { get; set; }
 

Shared/Models/OSM/BicycleGeoPosition.cs

 namespace cwebplusApp.Shared.Models {
     public class BicycleGeoPosition {
 
-        public BicycleGeoPosition() {
-            Latitude = 0.0;
-            Longitude = 0.0;
-            Address = "";
-            City = "";
-        }
 
         public double Latitude { get; set; }
         public double Longitude { get; set; }
         public string Address { get; set; }
         public string City { get; set; }
 
+        public BicycleGeoPosition() {
+            Latitude = 0.0;
+            Longitude = 0.0;
+            Address = "";
+            City = "";
+        }
     }
 }

Shared/Models/OSM/NominatimReverseAddress.cs

         public class Address {
             public string house_number;
             public string road;
+            public string village;
             public string town;
+            public string city;
             public string state;
             public string postcode;
             public string country;

Shared/Models/Report.cs

-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Threading.Tasks;
-
-namespace cwebplusApp.Shared.Models {
+namespace cwebplusApp.Shared.Models {
     public abstract class Report {
 
+        public string Anrede { get; set; }                  // required
+        public string Vorname { get; set; }                 // required
+        public string Nachname { get; set; }                // required
+        public string Mobil { get; set; }
+        public string Telefon { get; set; }
+        public int TypId { get; set; }                      // required
+        public int MarkeId { get; set; }                    // required
+        public int FarbeId { get; set; }                    // required
+        public string RahmenNummer { get; set; }
+        public string Bemerkung { get; set; }
+        public string Foto { get; set; }
+
     }
 }

Shared/ResourceFiles/Resources.de.resx

   <data name="Age" xml:space="preserve">
     <value>Alter</value>
   </data>
+  <data name="AlternatePickupContact" xml:space="preserve">
+    <value>Abweichender Abholkontakt</value>
+  </data>
   <data name="Bike.Child_Bycicle" xml:space="preserve">
     <value>Kindervelo</value>
   </data>
   <data name="fundvelo/account/Missing" xml:space="preserve">
     <value>Fundvelo &gt; Vermisst &gt; Melderdaten</value>
   </data>
+  <data name="fundvelo/alternate_pickup" xml:space="preserve">
+    <value>Fundvelo &gt; Gefunden &gt; Abholkontakt</value>
+  </data>
   <data name="fundvelo/conclusion_found" xml:space="preserve">
     <value>Fundvelo &gt; Gefunden &gt; Bestätigung</value>
   </data>
   <data name="MissingBike" xml:space="preserve">
     <value>Vermisstes Velo</value>
   </data>
+  <data name="Mobile" xml:space="preserve">
+    <value>Mobile</value>
+  </data>
   <data name="Password" xml:space="preserve">
     <value>Passwort</value>
   </data>
   <data name="Phone" xml:space="preserve">
     <value>Telefon</value>
   </data>
+  <data name="PickupContact" xml:space="preserve">
+    <value>Abholkontakt</value>
+  </data>
   <data name="PlaceOfDiscovery" xml:space="preserve">
     <value>Fundort</value>
   </data>

Shared/ResourceFiles/Resources.fr.resx

   <data name="Age" xml:space="preserve">
     <value>Âge</value>
   </data>
+  <data name="AlternatePickupContact" xml:space="preserve">
+    <value>Contact de ramassage déviant</value>
+  </data>
   <data name="Bike.Child_Bycicle" xml:space="preserve">
     <value>Vélo pour enfants</value>
   </data>
   <data name="fundvelo/account/Missing" xml:space="preserve">
     <value>Velo &gt;Perdue &gt; Data trouver</value>
   </data>
+  <data name="fundvelo/alternate_pickup" xml:space="preserve">
+    <value>Velo &gt;Trouvé &gt; Contact de ramassage</value>
+  </data>
   <data name="fundvelo/conclusion_found" xml:space="preserve">
     <value>Velo &gt;Trouvé &gt; Confirmation</value>
   </data>
   <data name="MissingBike" xml:space="preserve">
     <value>Velo perdù</value>
   </data>
+  <data name="Mobile" xml:space="preserve">
+    <value>Mobile</value>
+  </data>
   <data name="Password" xml:space="preserve">
     <value>Mot de passe</value>
   </data>
   <data name="Phone" xml:space="preserve">
     <value>Téléphone</value>
   </data>
+  <data name="PickupContact" xml:space="preserve">
+    <value>Contact de ramassage</value>
+  </data>
   <data name="PlaceOfDiscovery" xml:space="preserve">
     <value>Lieu de découverte</value>
   </data>

Shared/ResourceFiles/Resources.it.resx

   <data name="Age" xml:space="preserve">
     <value>Età</value>
   </data>
+  <data name="AlternatePickupContact" xml:space="preserve">
+    <value>Contatto di prelievo deviante</value>
+  </data>
   <data name="Bike.Child_Bycicle" xml:space="preserve">
     <value>Bicicletta per bambino</value>
   </data>
   <data name="fundvelo/account/Missing" xml:space="preserve">
     <value>Bicicletta &gt; Perduta &gt; Dati richiedente</value>
   </data>
+  <data name="fundvelo/alternate_pickup" xml:space="preserve">
+    <value>Bicicletta &gt; Trovata &gt; Contatto di prelievo</value>
+  </data>
   <data name="fundvelo/conclusion_found" xml:space="preserve">
     <value>Bicicletta &gt; Trovata &gt; Conferma</value>
   </data>
   <data name="MissingBike" xml:space="preserve">
     <value>Bicicletta dispersa</value>
   </data>
+  <data name="Mobile" xml:space="preserve">
+    <value>Cellulare</value>
+  </data>
   <data name="Password" xml:space="preserve">
     <value>Password</value>
   </data>
   <data name="Phone" xml:space="preserve">
     <value>Telefono</value>
   </data>
+  <data name="PickupContact" xml:space="preserve">
+    <value>Contatto di prelievo</value>
+  </data>
   <data name="PlaceOfDiscovery" xml:space="preserve">
     <value>Luogo del ritrovamento</value>
   </data>

Shared/ResourceFiles/Resources.resx

   <data name="Age" xml:space="preserve">
     <value>Age</value>
   </data>
+  <data name="AlternatePickupContact" xml:space="preserve">
+    <value>Alternate Pickup Contact</value>
+  </data>
   <data name="Bike.Child_Bycicle" xml:space="preserve">
     <value>Children Bycicle</value>
   </data>
   <data name="fundvelo/account/Missing" xml:space="preserve">
     <value>Bicycle &gt; Missing &gt; Reporter data</value>
   </data>
+  <data name="fundvelo/alternate_pickup" xml:space="preserve">
+    <value>Bicycle &gt; Found &gt; Pickup Contact</value>
+  </data>
   <data name="fundvelo/conclusion_found" xml:space="preserve">
     <value>Bicycle &gt; Found &gt; Confirmation</value>
   </data>
   <data name="MissingBike" xml:space="preserve">
     <value>Missing Bike</value>
   </data>
+  <data name="Mobile" xml:space="preserve">
+    <value>Mobile</value>
+  </data>
   <data name="Password" xml:space="preserve">
     <value>Password</value>
   </data>
   <data name="Phone" xml:space="preserve">
     <value>Phone</value>
   </data>
+  <data name="PickupContact" xml:space="preserve">
+    <value>Pickup Contact</value>
+  </data>
   <data name="PlaceOfDiscovery" xml:space="preserve">
     <value>Place Of Discovery</value>
   </data>

Shared/Services/OSM/NominatimService.cs

 
             HttpClient httpClient = new() { BaseAddress = new Uri("https://nominatim.openstreetmap.org/") };
             try {
-                HttpResponseMessage httpResult = await httpClient.GetAsync(string.Format("reverse?format=json&lat={0}&lon={1}", lat, lng));
-
+                HttpResponseMessage httpResult = await httpClient.GetAsync(string.Format("reverse?format=json&accept-language={0}&lat={1}&lon={2}",
+                                                                           CultureInfo.CurrentCulture.Name, lat, lng));
                 if (httpResult.StatusCode == System.Net.HttpStatusCode.OK) {
                     NominatimReverseAddress addressDto = JsonNet.Deserialize<NominatimReverseAddress>(await httpResult.Content.ReadAsStringAsync());
                     return addressDto;

Shared/Services/ReportDataProvider.cs

 using cwebplusApp.Shared.Models;
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Threading.Tasks;
 
 namespace cwebplusApp.Shared.Services {
     public class ReportDataProvider {

Shared/Services/UserDataProvider.cs

                 Changed?.Invoke(this, EventArgs.Empty);
             }
         }
+
+        public static UserData map(Report report) {
+            UserData userData = new();
+            userData.Salutation = report.Anrede;
+            userData.Firstname = report.Vorname;
+
+
+            return userData;
+        }
     }
 }

wwwroot/css/app.css

 
 label.italic input.mat-text-field-input {
     font-style: italic;
+}
+
+.mdc-form-field > label {
+    margin-bottom: 0;
+    font-size: initial;
+    color: rgb(0 0 0 / 62%);
+}
+
+div.mdc-checkbox {
+    margin-left: -11px; 
 }