log out screen

REMEMBER.txt

@@ -22,6 +22,8 @@ ionic generate component suggestedlist
 
 ionic generate component familypending
 
+ionic generate page logout
+
 
 npm install angularx-qrcode@14.0.0 --save
 

src/app/app-routing.module.ts

@@ -230,6 +230,10 @@ const routes: Routes = [
     path: 'playground',
     loadChildren: () => import('./pages-family/playground/playground.module').then(m => m.PlaygroundPageModule)
   },
+  {
+    path: 'logout',
+    loadChildren: () => import('./pages/logout/logout.module').then(m => m.LogoutPageModule)
+  },
 
 ];
 @NgModule({

src/app/pages/logout/logout-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { LogoutPage } from './logout.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: LogoutPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class LogoutPageRoutingModule {}

src/app/pages/logout/logout.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { LogoutPageRoutingModule } from './logout-routing.module';
+
+import { LogoutPage } from './logout.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    LogoutPageRoutingModule
+  ],
+  declarations: [LogoutPage]
+})
+export class LogoutPageModule {}

src/app/pages/logout/logout.page.html

@@ -0,0 +1,24 @@
+<ion-content class="full-page">
+  <ion-card>
+    <div class="page_logo">
+      <img alt="WrenchBoard" src="/assets/images/wrenchboard-line.png" />
+    </div>
+    <img alt="WrenchBoard" src="https://www.wrenchboard.com/assets/images/apps/log-out.png" />
+    <ion-card-header>
+<!--      <ion-card-title>Card Title</ion-card-title>-->
+      <ion-card-subtitle>Thanks for visiting
+      </ion-card-subtitle>
+    </ion-card-header>
+
+    <ion-card-content>
+      You are now logged out of your account.
+    </ion-card-content>
+  </ion-card>
+</ion-content>
+<ion-footer>
+  <ion-toolbar>
+    <div class="button" (click)="onBack()">
+      <ion-label class="text">Login</ion-label>
+    </div>
+  </ion-toolbar>
+</ion-footer>

src/app/pages/logout/logout.page.scss

@@ -0,0 +1,37 @@
+ion-content{
+  --background: white;
+  ion-card{
+    margin-right: 0px;
+    margin-left: 0px;
+    margin: 0px;
+  }
+}
+
+ion-footer {
+  --background: white;
+
+  ion-toolbar {
+    --border-width: 0px;
+    padding: 10px;
+    align-items: center;
+
+    ion-icon {
+      color: white;
+      font-size: 25px;
+    }
+
+    .button {
+      background-color: var(--ion-color-primary);
+      display: flex;
+      align-items: center;
+      justify-content: space-around;
+      border-radius: 30px;
+      padding: 12px 0;
+
+      .text {
+        color: white;
+      }
+    }
+  }
+}
+

src/app/pages/logout/logout.page.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { LogoutPage } from './logout.page';
+
+describe('LogoutPage', () => {
+  let component: LogoutPage;
+  let fixture: ComponentFixture<LogoutPage>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ LogoutPage ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(LogoutPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/pages/logout/logout.page.ts

@@ -0,0 +1,23 @@
+import { Component, OnInit } from '@angular/core';
+import {NavController} from "@ionic/angular";
+import {Router} from "@angular/router";
+
+@Component({
+  selector: 'app-logout',
+  templateUrl: './logout.page.html',
+  styleUrls: ['./logout.page.scss'],
+})
+export class LogoutPage implements OnInit {
+
+  constructor(
+      private navctr: NavController,
+      private router: Router
+  ) { }
+
+  ngOnInit() {
+  }
+
+  onBack() {
+    this.router.navigate(['login']);
+  }
+}

src/app/pages/profile/profile.page.ts

@@ -87,7 +87,7 @@ export class ProfilePage implements OnInit {
           text: "Log out",
           handler: () => {
             this.sessionDataProviderService.DestroySessionOnLogout();
-            this.router.navigate(['login']);
+            this.router.navigate(['logout']);
           },
         },
       ],
@@ -95,27 +95,27 @@ export class ProfilePage implements OnInit {
     await alert.present();
   }
 
-  async requestLogout() {
-    const alert = await this.alertController.create({
-      header: "Log out",
-      message: "Confirm you are ready to log out now.",
-      buttons: [
-        {
-          text: "Cancel",
-          role: "cancel",
-          handler: () => {
-           // this.getMyOffersData();
-          },
-        },
-        {
-          text: "Log out",
-          handler: () => {
-            this.sessionDataProviderService.DestroySessionOnLogout();
-            this.router.navigate(['login']);
-          },
-        },
-      ],
-    });
-    await alert.present();
-  }
+  // async requestLogout() {
+  //   const alert = await this.alertController.create({
+  //     header: "Log out",
+  //     message: "Confirm you are ready to log out now.",
+  //     buttons: [
+  //       {
+  //         text: "Cancel",
+  //         role: "cancel",
+  //         handler: () => {
+  //          // this.getMyOffersData();
+  //         },
+  //       },
+  //       {
+  //         text: "Log out",
+  //         handler: () => {
+  //           this.sessionDataProviderService.DestroySessionOnLogout();
+  //           this.router.navigate(['logout']);
+  //         },
+  //       },
+  //     ],
+  //   });
+  //   await alert.present();
+  // }
 }