From 2ac250c837f5170a87ef415803a130cb1b5fafc9 Mon Sep 17 00:00:00 2001 From: Thiemann96 Date: Fri, 6 Mar 2020 16:31:25 +0100 Subject: [PATCH] error alerts on wrong login --- src/app/app.module.ts | 9 +++-- src/pages/error/error.html | 35 ++++++++++++++++++++ src/pages/error/error.module.ts | 13 ++++++++ src/pages/error/error.scss | 3 ++ src/pages/error/error.ts | 33 ++++++++++++++++++ src/pages/login/login.ts | 22 +++++++++--- src/providers/LoginProvider/LoginProvider.ts | 14 ++------ 7 files changed, 110 insertions(+), 19 deletions(-) create mode 100644 src/pages/error/error.html create mode 100644 src/pages/error/error.module.ts create mode 100644 src/pages/error/error.scss create mode 100644 src/pages/error/error.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 43be734..ea5f3f0 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -18,7 +18,7 @@ import { MySenseBoxPage } from '../pages/my-sense-box/my-sense-box'; import { LoginProvider } from '../providers/LoginProvider/LoginProvider'; import { SensorsPage } from '../pages/sensors/sensors'; import { ConfigurationPage } from '../pages/configuration/configuration'; - +import {ErrorPage} from "../pages/error/error" // For AoT compilation (production builds) we need to have a factory for the loader of translation files. // @TODO: we possibly could optimize this by using a static loader in combination with webpack: // https://github.com/ngx-translate/http-loader#angular-cliwebpack-translateloader-example @@ -33,7 +33,8 @@ export function createTranslateLoader(http: HttpClient) { SensorDetailPage, MySenseBoxPage, SensorsPage, - ConfigurationPage + ConfigurationPage, + ErrorPage ], imports: [ HttpClientModule, @@ -56,7 +57,9 @@ export function createTranslateLoader(http: HttpClient) { SensorDetailPage, MySenseBoxPage, SensorsPage, - ConfigurationPage + ConfigurationPage, + ErrorPage + ], providers: [ StatusBar, diff --git a/src/pages/error/error.html b/src/pages/error/error.html new file mode 100644 index 0000000..e962de3 --- /dev/null +++ b/src/pages/error/error.html @@ -0,0 +1,35 @@ + + + + + Error ({{error.message}}) + + + + + + + + There was an error when trying to login. The error code is:{{error.message}}. + + +

{{errorMessages[error.message]}}

+ + + + + + + + + + + + \ No newline at end of file diff --git a/src/pages/error/error.module.ts b/src/pages/error/error.module.ts new file mode 100644 index 0000000..56227d7 --- /dev/null +++ b/src/pages/error/error.module.ts @@ -0,0 +1,13 @@ +import { NgModule } from '@angular/core'; +import { IonicPageModule } from 'ionic-angular'; +import { ErrorPage } from './error'; + +@NgModule({ + declarations: [ + ErrorPage, + ], + imports: [ + IonicPageModule.forChild(ErrorPage), + ], +}) +export class ErrorPageModule {} diff --git a/src/pages/error/error.scss b/src/pages/error/error.scss new file mode 100644 index 0000000..b00e4af --- /dev/null +++ b/src/pages/error/error.scss @@ -0,0 +1,3 @@ +page-error { + +} diff --git a/src/pages/error/error.ts b/src/pages/error/error.ts new file mode 100644 index 0000000..acc0635 --- /dev/null +++ b/src/pages/error/error.ts @@ -0,0 +1,33 @@ +import { Component } from '@angular/core'; +import { IonicPage, NavController, NavParams, ViewController } from 'ionic-angular'; + +/** + * Generated class for the ErrorPage page. + * + * See https://ionicframework.com/docs/components/#navigation for more info on + * Ionic pages and navigation. + */ + +@IonicPage() +@Component({ + selector: 'page-error', + templateUrl: 'error.html', +}) +export class ErrorPage { + public error = this.navParams.data + public errorMessages = { + 403:"Please check your username and password and try again! ", + 500:"There seems to be no connection to the OSeM" + } + + constructor(public navCtrl: NavController, public navParams: NavParams,public view: ViewController) { + } + dismissModal(){ + this.view.dismiss(); + } + ionViewDidLoad() { + console.log('ionViewDidLoad ErrorPage'); + console.log(this.navParams) + } + +} diff --git a/src/pages/login/login.ts b/src/pages/login/login.ts index 3cfdd43..c303441 100644 --- a/src/pages/login/login.ts +++ b/src/pages/login/login.ts @@ -1,7 +1,8 @@ import { Component } from '@angular/core'; -import { IonicPage, NavController, NavParams, LoadingController } from 'ionic-angular'; +import { IonicPage, NavController, NavParams, LoadingController, ModalController } from 'ionic-angular'; import { MySenseBoxPage } from "../my-sense-box/my-sense-box" import { LoginProvider } from "../../providers/LoginProvider/LoginProvider" +import { ErrorPage } from '../error/error'; /** * Generated class for the LoginPage page. @@ -21,13 +22,15 @@ export class LoginPage { private token: string private boxes: Object; public loading = false; + public error = false; public errorInput = false; constructor( public navCtrl: NavController, public navParams: NavParams, private loginProvider: LoginProvider, - public loadingController: LoadingController + public loadingController: LoadingController, + public modalCtrl : ModalController ) { } @@ -49,18 +52,29 @@ export class LoginPage { try { this.token = await this.loginProvider.login(form.value.email, form.value.password) this.boxes = await this.loginProvider.getUserBoxes(this.token); + this.navCtrl.push(MySenseBoxPage, [this.boxes, this.token]); + } catch (err) { - console.log(err.message) + console.log(err) + this.showModal(err); } loading.dismiss(); - this.navCtrl.push(MySenseBoxPage, [this.boxes, this.token]); } else { this.errorInput = true; } } + showModal(message){ + let modal = this.modalCtrl.create(ErrorPage,message); + + modal.onDidDismiss(()=>{ + + }) + + modal.present(); + } ionViewDidLoad() { console.log('ionViewDidLoad LoginPage'); diff --git a/src/providers/LoginProvider/LoginProvider.ts b/src/providers/LoginProvider/LoginProvider.ts index 2a761bc..43d3532 100644 --- a/src/providers/LoginProvider/LoginProvider.ts +++ b/src/providers/LoginProvider/LoginProvider.ts @@ -19,21 +19,11 @@ export class LoginProvider { .pipe(timeout(30000)) .toPromise() .catch(err => { - let msg = err.message + console.log(err); + let msg = err.status if (err.name === 'TimeoutError') msg = 'unable to contact api. are you online?' - try { - // attempt to extract the compilation error message and clean it up - console.error(err) - msg = JSON.parse(err.error.message) - if (msg.process) { - msg = `compilation error: ${msg.process.substr(msg.process.indexOf(' '))}` - msg = msg.substr(0, msg.indexOf('^')) - } - } catch (err2) { - console.error(err2) - } throw Error(msg) }) // download the resulting sketch binary