adding spinner when redirected back after hello login
adding empty dashboard view.
This commit is contained in:
parent
bcb3f58d6e
commit
1cb848d724
|
@ -3,16 +3,24 @@
|
||||||
<h1 class="az-logo">fasten</h1>
|
<h1 class="az-logo">fasten</h1>
|
||||||
<div class="az-signin-header">
|
<div class="az-signin-header">
|
||||||
<h2>{{showExternalIdP ? "Welcome!" : "Welcome back!"}}</h2>
|
<h2>{{showExternalIdP ? "Welcome!" : "Welcome back!"}}</h2>
|
||||||
<h4>Please sign in to continue</h4>
|
<h4 *ngIf="!loading">Please sign in to continue</h4>
|
||||||
|
|
||||||
<form *ngIf="showExternalIdP">
|
<form *ngIf="showExternalIdP">
|
||||||
<div class="pt-4 pb-3">
|
<div class="pt-4 pb-3" *ngIf="!loading else isLoadingTemplate">
|
||||||
<p class="pb-3">You can use the button below to create an account or signin to your existing Fasten account.</p>
|
<p class="pb-3">You can use the button below to create an account or signin to your existing Fasten account.</p>
|
||||||
<div class="hello-container">
|
<div class="hello-container">
|
||||||
<button (click)="idpConnectHello($event)" class="hello-btn"></button>
|
<button (click)="idpConnectHello($event)" class="hello-btn"></button>
|
||||||
<button class="hello-about"></button>
|
<button class="hello-about"></button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<ng-template #isLoadingTemplate>
|
||||||
|
<div class="text-center">
|
||||||
|
<p class="pb-3">Please wait, connecting account...</p>
|
||||||
|
<div class="spinner-border" role="status">
|
||||||
|
<span class="sr-only">Loading...</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</ng-template>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<form *ngIf="!showExternalIdP" (ngSubmit)="signinSubmit()" #userForm="ngForm">
|
<form *ngIf="!showExternalIdP" (ngSubmit)="signinSubmit()" #userForm="ngForm">
|
||||||
|
|
|
@ -19,6 +19,8 @@ export class AuthSigninComponent implements OnInit {
|
||||||
errorMsg: string = ""
|
errorMsg: string = ""
|
||||||
showExternalIdP: boolean = environment.is_cloud
|
showExternalIdP: boolean = environment.is_cloud
|
||||||
|
|
||||||
|
loading: boolean = false
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private fastenDb: FastenDbService,
|
private fastenDb: FastenDbService,
|
||||||
private authService: AuthService,
|
private authService: AuthService,
|
||||||
|
@ -32,6 +34,7 @@ export class AuthSigninComponent implements OnInit {
|
||||||
|
|
||||||
let idpType = this.route.snapshot.paramMap.get('idp_type')
|
let idpType = this.route.snapshot.paramMap.get('idp_type')
|
||||||
if(idpType){
|
if(idpType){
|
||||||
|
this.loading = true
|
||||||
let params = new URLSearchParams(window.location.hash.substring(1))
|
let params = new URLSearchParams(window.location.hash.substring(1))
|
||||||
let code = params.get('code') // eyJhbGciOiJSUzI1...rest_of_ID_Token
|
let code = params.get('code') // eyJhbGciOiJSUzI1...rest_of_ID_Token
|
||||||
let state = params.get('state') // eyJhbGciOiJSUzI1...rest_of_ID_Token
|
let state = params.get('state') // eyJhbGciOiJSUzI1...rest_of_ID_Token
|
||||||
|
|
|
@ -135,7 +135,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="table-responsive">
|
<div *ngIf="!sources else emptyDashboard" class="table-responsive">
|
||||||
<table class="table mg-b-0">
|
<table class="table mg-b-0">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr *ngFor="let source of sources" (click)="selectSource(source)" class="alert cursor-pointer" role="alert">
|
<tr *ngFor="let source of sources" (click)="selectSource(source)" class="alert cursor-pointer" role="alert">
|
||||||
|
@ -159,14 +159,25 @@
|
||||||
<td class="align-middle"><p><small class="tx-gray-600">expires:</small><br/> <span [ngbTooltip]="source.expires_at | amFromUnix | date">{{source.expires_at | amFromUnix | amTimeAgo}}</span></p></td>
|
<td class="align-middle"><p><small class="tx-gray-600">expires:</small><br/> <span [ngbTooltip]="source.expires_at | amFromUnix | date">{{source.expires_at | amFromUnix | amTimeAgo}}</span></p></td>
|
||||||
<td class="align-middle"><p><i class="fas fa-chevron-right"></i></td>
|
<td class="align-middle"><p><i class="fas fa-chevron-right"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
|
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div><!-- table-responsive -->
|
</div><!-- table-responsive -->
|
||||||
|
|
||||||
|
<ng-template #emptyDashboard>
|
||||||
|
<div class="modal-body tx-center pd-y-20 pd-x-20">
|
||||||
|
<h4 class="tx-purple mg-b-20">No Sources Connected!</h4>
|
||||||
|
<p class="mg-b-20 mg-x-20">
|
||||||
|
Fasten securely connects your healthcare providers together, creating a single location to access your entire medical history.
|
||||||
|
</p>
|
||||||
|
<p class="mg-b-20 mg-x-20">
|
||||||
|
Click below to add a new healthcare provider to Fasten.
|
||||||
|
</p>
|
||||||
|
<button [routerLink]="'/sources'" type="button" class="btn btn-purple pd-x-25">Add Source</button>
|
||||||
|
</div><!-- modal-body -->
|
||||||
|
</ng-template>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- az-content-body -->
|
</div><!-- az-content-body -->
|
||||||
|
|
Loading…
Reference in New Issue