auth move

src/app/app.module.ts

@@ -23,6 +23,8 @@ import { appFuseConfig } from './app.fuse';
 
 import { LayoutModule } from './layout/layout.module';
 
+import { AuthModule } from 'src/shared/auth/auth.module';
+
 import { from } from 'rxjs';
 @NgModule({
   imports: [
@@ -51,6 +53,7 @@ import { from } from 'rxjs';
     AppProviderModule,
     LayoutModule,
 
+    AuthModule.forRoot(),
   ],
   declarations: [AppComponent],
   providers: [],

src/app/pages/accounts/accounts.module.ts

@@ -1,8 +1,7 @@
-import { NgModule, ModuleWithProviders } from '@angular/core';
+import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { TranslateModule } from '@ngx-translate/core';
 
-import { AccountsStoreModule } from './accounts-store.module';
 import { MatButtonModule } from '@angular/material/button';
 import { MatCheckboxModule } from '@angular/material/checkbox';
 import { MatFormFieldModule } from '@angular/material/form-field';
@@ -13,13 +12,7 @@ import { FuseSharedModule } from 'src/@fuse/shared.module';
 import { AccountsRoutingPageModule } from './accounts-routing.page.module';
 
 import { COMPONENTS } from './component';
-import { SERVICES } from './service';
 
-@NgModule({
-  imports: [AccountsStoreModule],
-  exports: []
-})
-export class AccountsRootModule {}
 
 @NgModule({
   imports: [
@@ -41,10 +34,4 @@ export class AccountsRootModule {}
   exports: [...COMPONENTS]
 })
 export class AccountsModule {
-  public static forRoot(): ModuleWithProviders<AccountsRootModule> {
-    return {
-      ngModule: AccountsRootModule,
-      providers: [...SERVICES]
-    };
-  }
 }

src/app/pages/accounts/component/authentication/authentication.component.html

@@ -10,7 +10,7 @@
 
       <div class="title">LOGIN TO YOUR ACCOUNT</div>
 
-      <form name="loginForm" [formGroup]="loginForm" (submit)="onSignin()" novalidate>
+      <form name="loginForm" [formGroup]="loginForm" (ngSubmit)="onSubmit()" novalidate>
 
         <mat-form-field appearance="outline">
           <mat-label>username</mat-label>

src/app/pages/accounts/component/authentication/authentication.component.ts

@@ -1,9 +1,13 @@
 import { Component, OnInit, ViewEncapsulation } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 
+import { take } from 'rxjs/operators';
+
 import { FuseConfigService } from 'src/@fuse/services/config.service';
 import { fuseAnimations } from 'src/@fuse/animations';
 
+import { AuthService } from 'src/shared/auth/service/auth.service';
+
 @Component({
   selector: 'authentication',
   templateUrl: './authentication.component.html',
@@ -23,7 +27,8 @@ export class AuthenticationComponent implements OnInit {
    */
   constructor(
     private _fuseConfigService: FuseConfigService,
-    private _formBuilder: FormBuilder
+    private _formBuilder: FormBuilder,
+    private _authService: AuthService
   ) {
     // Configure the layout
     this._fuseConfigService.config = {
@@ -58,11 +63,20 @@ export class AuthenticationComponent implements OnInit {
     });
   }
 
-  onSignin(): void {
+  onSubmit(): void {
     let userName = this.loginForm.get('username').value;
     let password = this.loginForm.get('password').value;
 
-
+    this._authService.login(userName, password)
+      .pipe(take(1))
+      .subscribe(
+        res => {
+          console.log(res);
+        },
+        err => {
+          console.log(err);
+        }
+      );
   }
 
 }

src/app/pages/accounts/service/accounts.service.ts

@@ -1,65 +0,0 @@
-import { Injectable, Inject } from '@angular/core';
-import { HttpClient } from '@angular/common/http';
-
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
-
-import { CookieService } from 'ngx-cookie-service';
-import { environment } from '../../../../environments/environment';
-import { User } from '../../../../shared/user/model/user.model';
-import { API_BASE_URL } from 'src/shared/common/type/injection-token.type';
-
-@Injectable()
-export class AccountsService {
-  public constructor(
-    private httpClient: HttpClient,
-    private cookieService: CookieService,
-    @Inject(API_BASE_URL) private apiBaseUrl: string
-  ) {}
-
-  // public authenticate(oauthType: string, params?: Map<string, string>) {
-  //   const query = this.getQueryParams(params);
-
-  //   const externalUrl = new URL(`${environment.oauth[oauthType].authenticateURL}?${query}`);
-
-  //   window.open(externalUrl.href, '_self');
-  // }
-
-  // public authenticateOneall(oauthType: string, params?: Map<string, string>) {
-  //   const callbackUri = `${environment.oauth.oneall.callbackURL}?${this.getQueryParams(params)}`;
-
-  //   let query = '';
-  //   query += `service=social_login`;
-  //   query += `&callback_uri=${callbackUri}`;
-
-  //   const externalUrl = new URL(`${environment.oauth.oneall.authenticateURL}/${oauthType}/?${query}`);
-
-  //   window.open(externalUrl.href, '_self');
-  // }
-
-  protected getQueryParams(params?: Map<string, string>): string {
-    let query = '';
-
-    if (!params || 0 === params.size) {
-      return query;
-    }
-
-    params.forEach((value, key) => {
-      if ('' !== query) {
-        query += '&';
-      }
-      query += `${key}=${value}`;
-    });
-
-    return query;
-  }
-
-  public login(username: string, password: string): Observable<User> {
-    const model = {
-      username,
-      password
-    };
-
-    return this.httpClient.post<User>(`${this.apiBaseUrl}/auth/signin`, model);
-  }
-}

src/app/pages/accounts/service/index.ts

@@ -1,3 +0,0 @@
-import { AccountsService } from './accounts.service';
-
-export const SERVICES = [AccountsService];

src/shared/auth/auth-store.module.ts

@@ -13,5 +13,5 @@ import {
     EffectsModule.forFeature(EFFECTS),
   ],
 })
-export class AccountsStoreModule {
+export class AuthStoreModule {
 }

src/shared/auth/auth.module.ts

@@ -0,0 +1,25 @@
+import { NgModule, ModuleWithProviders } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { SERVICES } from './service';
+import { AuthStoreModule } from './auth-store.module';
+
+@NgModule({
+  declarations: [],
+  imports: [CommonModule],
+  exports: []
+})
+export class AuthModule {
+  public static forRoot(): ModuleWithProviders<AuthRootModule> {
+    return {
+      ngModule: AuthRootModule,
+      providers: [SERVICES]
+    };
+  }
+}
+
+@NgModule({
+  imports: [AuthStoreModule],
+  exports: []
+})
+export class AuthRootModule { }

src/shared/auth/model/jwt-signin-response.model.ts

@@ -0,0 +1,4 @@
+export interface JwtSigninResponse {
+  accessToken: string;
+  tokenType: string;
+}

src/shared/auth/service/auth.service.ts

@@ -0,0 +1,52 @@
+import { Injectable, Inject } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+
+import { Observable } from 'rxjs';
+import { map } from 'rxjs/operators';
+import { JwtSigninResponse } from '../model/jwt-signin-response.model';
+
+import { CookieService } from 'ngx-cookie-service';
+import { API_BASE_URL } from 'src/shared/common/type/injection-token.type';
+
+@Injectable({ providedIn: 'root' })
+export class AuthService {
+  public constructor(
+    private httpClient: HttpClient,
+    private cookieService: CookieService,
+    @Inject(API_BASE_URL) private apiBaseUrl: string
+  ) { }
+
+  public login(
+    username: string,
+    password: string
+  ): Observable<JwtSigninResponse> {
+    const model = {
+      username,
+      password
+    };
+
+    return this.httpClient
+      .post<JwtSigninResponse>(`${this.apiBaseUrl}/auth/signin`, {
+        username,
+        password
+      })
+      .pipe(
+        map(res => {
+          sessionStorage.setItem('username', username);
+          let tokenStr = res.tokenType + ' ' + res.accessToken;
+          sessionStorage.setItem('token', tokenStr);
+          return res;
+        })
+      );
+    // return this.httpClient.post<User>(`${this.apiBaseUrl}/auth/signin`, model);
+  }
+
+  isLoggedIn() {
+    const user = sessionStorage.getItem('username');
+    return !(null === user);
+  }
+
+  logOut() {
+    sessionStorage.removeItem('username');
+  }
+}

src/shared/auth/service/index.ts

@@ -0,0 +1,3 @@
+import { AuthService } from './auth.service';
+
+export const SERVICES = [AuthService];

src/shared/auth/store/auth/auth.action.ts

@@ -1,5 +1,5 @@
 import { Action } from '@ngrx/store';
-import { User } from '../../../../../shared/user/model/user.model';
+import { User } from 'src/shared/user/model/user.model';
 
 export enum ActionType {
   LoginProcessing = '[account.auth] LoginProcessing',

src/shared/auth/store/auth/auth.state.ts

@@ -1,5 +1,5 @@
 import { Selector, createSelector } from '@ngrx/store';
-import { User } from '../../../../../shared/user/model/user.model';
+import { User } from 'src/shared/user/model/user.model';
 
 export interface State {
   processing: boolean;