From a18ef847922b2dee20307520a0ec18bcbaf32f2a Mon Sep 17 00:00:00 2001
From: richard-loafle <44828666+richard-loafle@users.noreply.github.com>
Date: Thu, 16 Apr 2020 17:21:13 +0900
Subject: [PATCH] bug fixed

---
 .../components/default.layout.component.html  |  1 +
 .../components/default.layout.component.ts    | 27 +++++++------------
 .../components/sidenav.page.component.html    |  2 +-
 3 files changed, 12 insertions(+), 18 deletions(-)

diff --git a/src/app/layouts/components/default.layout.component.html b/src/app/layouts/components/default.layout.component.html
index 62ef1e2..ccb265e 100644
--- a/src/app/layouts/components/default.layout.component.html
+++ b/src/app/layouts/components/default.layout.component.html
@@ -1,6 +1,7 @@
 <div fxFlexFill class="layout-container">
   <div class="navi-container">
     <mat-tab-group
+      #navTabGroup
       vertical
       disablePagination="true"
       (selectedTabChange)="onSelectedTabChange($event)"
diff --git a/src/app/layouts/components/default.layout.component.ts b/src/app/layouts/components/default.layout.component.ts
index 23e8780..dd9da8a 100644
--- a/src/app/layouts/components/default.layout.component.ts
+++ b/src/app/layouts/components/default.layout.component.ts
@@ -10,7 +10,7 @@ import {
 } from '@angular/core';
 import { Router, NavigationEnd } from '@angular/router';
 
-import { MatTabChangeEvent } from '@angular/material/tabs';
+import { MatTabChangeEvent, MatTabGroup } from '@angular/material/tabs';
 import { MatSidenav } from '@angular/material/sidenav';
 
 import { Store, select } from '@ngrx/store';
@@ -20,12 +20,17 @@ import { LogService } from '@ucap/ng-logger';
 import { AppSelector } from '@app/store/state';
 import { UCAP_PATH_PARAM } from '@app/types/tokens';
 
+const NAVS = ['/group', '/chat', '/organization', '/message'];
+
 @Component({
   selector: 'app-layouts-default',
   templateUrl: './default.layout.component.html',
   styleUrls: ['./default.layout.component.scss']
 })
 export class DefaultLayoutComponent implements OnInit, OnDestroy {
+  @ViewChild('navTabGroup', { static: true })
+  navTabGroup: MatTabGroup;
+
   @ViewChild('leftSidenav', { static: true })
   leftSidenav: MatSidenav;
 
@@ -45,7 +50,6 @@ export class DefaultLayoutComponent implements OnInit, OnDestroy {
   ) {
     this.routerEventSubscription = this.router.events.subscribe((event) => {
       if (event instanceof NavigationEnd) {
-        this.logService.debug('DefaultLayoutComponent', event);
         this.onRoute(event.url);
       }
     });
@@ -65,6 +69,8 @@ export class DefaultLayoutComponent implements OnInit, OnDestroy {
           }
         }
       });
+
+    this.onRoute(this.router.url);
   }
 
   ngOnDestroy(): void {
@@ -77,24 +83,11 @@ export class DefaultLayoutComponent implements OnInit, OnDestroy {
   }
 
   onSelectedTabChange(event: MatTabChangeEvent) {
-    switch (event.index) {
-      case 1:
-        this.router.navigate(['/chat']);
-        break;
-      case 2:
-        this.router.navigate(['/organization']);
-        break;
-      case 3:
-        this.router.navigate(['/message']);
-        break;
-      default:
-        this.router.navigate(['/group']);
-        break;
-    }
+    this.router.navigate([NAVS[event.index]]);
   }
 
   onRoute(url: string) {
-    this.logService.debug('onRoute', url);
+    this.navTabGroup.selectedIndex = NAVS.findIndex((v) => url.startsWith(v));
 
     this.sidenavInjector = Injector.create({
       providers: [{ provide: UCAP_PATH_PARAM, useValue: 'sidenav' }],
diff --git a/src/app/pages/organization/components/sidenav.page.component.html b/src/app/pages/organization/components/sidenav.page.component.html
index 00e135e..d9438a6 100644
--- a/src/app/pages/organization/components/sidenav.page.component.html
+++ b/src/app/pages/organization/components/sidenav.page.component.html
@@ -1,3 +1,3 @@
 <div fxFlexFill>
-  sidenav page of ogranization is works!
+  sidenav page of ogranization is works!!!!
 </div>