Routing of pages completed

CaritasPWA.csproj

@@ -26,6 +26,8 @@
   </ItemGroup>
 
   <ItemGroup>
+    <PackageReference Include="BlazorAnimate" Version="3.0.0" />
+    <PackageReference Include="BlazorColorPicker" Version="1.1.2" />
     <PackageReference Include="BuildWebCompiler" Version="1.12.394" />
     <PackageReference Include="MatBlazor" Version="2.8.0" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="3.2.1" />

Pages/AccountPage.razor

@@ -1,4 +1,5 @@
 @page "/account"
+@page "/account/{FromRoute}"
 @inject NavigationManager NavigationManager
 @inject UserDataProvider UserDataProvider
 
@@ -36,9 +37,21 @@
             </div>
         </div>
     </div>
-    <div class="row no-gutters align-items-end justify-content-center w-100" style="padding-bottom:2em">
-        <MatButton Class="w-100" Raised="true" @onclick="SaveUserData">Speichern</MatButton>
-    </div>
+
+    @if (string.IsNullOrEmpty(FromRoute)) {
+        <div class="row no-gutters align-items-end justify-content-center w-100" style="padding-bottom:2em">
+            <MatButton Class="w-100" Raised="true" @onclick="SaveUserData">Speichern</MatButton>
+        </div>
+    } else {
+        <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">Abbrechen</MatButton>
+            </div>
+            <div class="col" style="padding-left:0.5em">
+                <MatButton Class="w-100" Raised="true" @onclick="Next">Absenden</MatButton>
+            </div>
+        </div>
+    }
 </div>
 
 
@@ -46,12 +59,16 @@
 
 @code {
 
+    [Parameter]
+    public string FromRoute { get; set; }
+
     protected async override void OnInitialized() {
         await GetUserData();
     }
 
     private async void SaveUserData() {
         await UserDataProvider.Save();
+        NavigationManager.NavigateTo("caritas_services");
     }
 
     private async Task GetUserData() {
@@ -59,12 +76,23 @@
             await UserDataProvider.Get();
             StateHasChanged();
         });
+    }
 
+    private UserData Account {
+        get => UserDataProvider.Data;
     }
 
-    private UserData  Account {
-            get => UserDataProvider.Data;
+    private void Next() {
+        if ("Found".Equals(FromRoute)) {
+            NavigationManager.NavigateTo("conclusion_found/");
+        } else {
+            NavigationManager.NavigateTo("conclusion_missing/");
         }
+    }
+
+    private void Cancel() {
+        NavigationManager.NavigateTo("caritas_services");
+    }
+}
 
-  }
 

Pages/CaritasServiceFundVeloFoundConclusion.razor

@@ -0,0 +1,30 @@
+@page "/conclusion_found"
+@inject NavigationManager NavigationManager
+
+<div class="row px-3 h-100">
+    <div class="row no-gutters align-items-start justify-content-center w-100">
+        <MatHeadline3 Style="font-family:Ubuntu;padding-top:1em">Bestätigung</MatHeadline3>
+        <MatHeadline6 Style="font-family:Ubuntu">Hier kommen Informationen zum Ende des "Gefunden"-Meldeprozesses</MatHeadline6>
+
+        <Animate Animation="Animations.ZoomIn" Delay="TimeSpan.FromSeconds(0.5)" Duration="TimeSpan.FromSeconds(2.5)">
+            <Animate Animation="Animations.FadeIn" Delay="TimeSpan.FromSeconds(0.5)" Duration="TimeSpan.FromSeconds(2.5)">
+                <DoneImage></DoneImage>
+            </Animate>
+        </Animate>
+
+    </div>
+    <div class="row no-gutters align-items-end justify-content-center w-100" style="padding-bottom:2em;padding-top:2em">
+        <div class="col w-100 text-center">
+            <MatButton Class="w-50" Raised="true" @onclick="Finished">Fertig</MatButton>
+        </div>
+    </div>
+</div>
+
+
+@code {
+
+    private void Finished() {
+        NavigationManager.NavigateTo("caritas_services");
+    }
+
+}

Pages/CaritasServiceFundVeloKeyDataPage.razor

@@ -5,21 +5,27 @@
     <div class="row no-gutters align-items-center justify-content-center w-100">
         <h1>@FromRoute</h1>
     </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">Abbrechen</MatButton>
+        </div>
+        <div class="col" style="padding-left:0.5em">
+            <MatButton Class="w-100" Raised="true" @onclick="Next">Weiter</MatButton>
+        </div>
+    </div>
 </div>
 
 
 @code {
+    [Parameter]
+    public string FromRoute { get; set; }
 
-    private void Found() {
-        //NavigationManager.NavigateTo("keydata/found");
+    private void Next() {
+        NavigationManager.NavigateTo("account/" + @FromRoute);
     }
 
-    private void Lost() {
-        //NavigationManager.NavigateTo("keydata/lost");
+    private void Cancel() {
+        NavigationManager.NavigateTo("caritas_services");
     }
 
-    @code {
-        [Parameter]
-        public string FromRoute { get; set; }
-    }
 }

Pages/CaritasServiceFundVeloMissingConclusion.razor

@@ -0,0 +1,23 @@
+@page "/conclusion_missing"
+@inject NavigationManager NavigationManager
+
+<div class="row px-3 h-100">
+    <div class="row no-gutters align-items-start justify-content-center w-100">
+        <MatHeadline3 Style="font-family:Ubuntu;padding-top:1em">Info</MatHeadline3>
+        <MatHeadline6 Style="font-family:Ubuntu">Hier kommen Informationen zum Ende des "Vermisst"-Meldeprozesses</MatHeadline6>
+    </div>
+    <div class="row no-gutters align-items-end justify-content-center w-100" style="padding-bottom:2em;padding-top:2em">
+        <div class="col w-100 text-center">
+            <MatButton Class="w-50" Raised="true" @onclick="Finished">Fertig</MatButton>
+        </div>
+    </div>
+</div>
+
+
+@code {
+
+    private void Finished() {
+        NavigationManager.NavigateTo("caritas_services");
+    }
+
+}

Pages/DoneImage.razor

@@ -0,0 +1,9 @@
+@page "/doneimage"
+
+<div class="text-center">
+    <img src="/images/done.png" class="w-50" />
+</div>
+
+@code {
+
+}

Shared/NavMenu.razor

@@ -86,8 +86,6 @@
 
 
     void LocationChanged(object sender, LocationChangedEventArgs e) {
-        string navigationMethod = e.IsNavigationIntercepted ? "HTML" : "code";
-        System.Diagnostics.Debug.WriteLine($"Notified of navigation via {navigationMethod} to {e.Location}");
         if (e.Location.Contains("caritas_services")) {
             Index = 1;
         } else if(e.Location.Contains("account")) {

_Imports.razor

@@ -8,3 +8,5 @@
 @using CaritasPWA
 @using CaritasPWA.Shared
 @using MatBlazor
+@using BlazorAnimate
+@using BlazorColorPicker

wwwroot/css/app.css

@@ -69,6 +69,10 @@ a, .btn-link {
 .bg-primary-color {
     background-color: var(--primary);
 }
+
+.demo-mat-card {
+    border-radius:20px;
+}
 /*
 .content {
     padding-top: 1.1rem;
@@ -87,7 +91,6 @@ a, .btn-link {
 }
 
 */
-
 .fullscreen {
     width: 100vw;
     height: 100vh;

wwwroot/index.html

@@ -6,6 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
     <title>CaritasPWA</title>
     <base href="/" />
+    <script src="_content/BlazorAnimate/blazorAnimateInterop.js"></script>
     <script src="_content/MatBlazor/dist/matBlazor.js"></script>
     <link href="_content/MatBlazor/dist/matBlazor.css" rel="stylesheet" />
     <link href="css/united/bootstrap.min.css" rel="stylesheet" />