sensor page is in progress

src/app/commons/component/layout/menu/app.menu.component.ts

@@ -23,7 +23,7 @@ export class AppMenuComponent implements OnInit {
             {
                 label: 'Infra', icon: 'all_inclusive', items: [
                     { label: 'Map', icon: 'map', routerLink: ['/map'] },
-                    { label: 'Sensors', icon: 'compare_arrows', routerLink: ['/sensors'] },
+                    { label: 'Sensors', icon: 'compare_arrows', routerLink: ['/sensor/list'] },
                     { label: 'Probes', icon: 'dock', routerLink: ['/probe/list'] },
                 ]
             },

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

@@ -12,8 +12,7 @@ const routes: Routes = [
       { path: 'probe', loadChildren: './probes/probe-tab-page.module#ProbeTabPageModule' },
       { path: 'discovery', loadChildren: './discovery/discovery-page.module#DiscoveryPageModule' },
       { path: 'map', loadChildren: './infra/infra-page.module#InfraPageModule' },
-      // { path: 'sensors', loadChildren: './sensors/sensors-page.module#SensorsPageModule' },
-      // { path: 'sensor', loadChildren: './sensor/sensor-page.module#SensorPageModule' },
+      { path: 'sensor', loadChildren: './sensors/sensor-tab-page.module#SensorTabPageModule' },
       // { path: 'target', loadChildren: './target/target-page.module#TargetPageModule' },
       // { path: 'overview', loadChildren: './overview/overview-page.module#OverviewPageModule' },
       // { path: 'dashboard', loadChildren: './dashboard/dashboard-page.module#DashboardPageModule' },

src/app/pages/sensors/sensor-tab-page-routing.module.ts

@@ -0,0 +1,21 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { SensorTabPageComponent } from './sensor-tab-page.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: SensorTabPageComponent,
+    children: [
+      { path: 'list', loadChildren: './sensor/sensor-page.module#SensorPageModule' },
+      { path: ':id/info', loadChildren: './sensor/sensor-page.module#SensorPageModule' },
+      { path: ':id/history', component: null },
+    ]
+  },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class SensorTabPageRoutingModule { }

src/app/pages/sensors/sensor-tab-page.component.html

@@ -0,0 +1,12 @@
+<div class="ui-fluid">
+    <div class="ui-g">
+        <div class="ui-g-12">
+            <div *ngIf="tabs" class="card no-margin">
+                <of-tabbar [tabs]="tabs"></of-tabbar>
+            </div>
+            <div class="card no-margin">
+                <router-outlet></router-outlet>
+            </div>
+        </div>
+    </div>
+</div>

src/app/pages/sensors/sensor-tab-page.component.ts

@@ -0,0 +1,40 @@
+import { Component, OnDestroy } from '@angular/core';
+import { Router, NavigationEnd } from '@angular/router';
+import { Subscription } from 'rxjs/Subscription';
+
+@Component({
+  selector: 'of-pages-sensor-tab',
+  templateUrl: './sensor-tab-page.component.html',
+})
+export class SensorTabPageComponent implements OnDestroy {
+
+  tabs;
+  routerSubscription$: Subscription;
+
+  constructor(
+    private router: Router
+  ) {
+    this.routerSubscription$ = this.router.events.subscribe((event) => {
+      if (event instanceof NavigationEnd) {
+        this.generateTabMenu(event);
+      }
+    });
+  }
+
+  ngOnDestroy() {
+    this.routerSubscription$.unsubscribe();
+  }
+
+  generateTabMenu(event: NavigationEnd) {
+    try {
+      const parsedUrl = event.url.split('sensor/')[1].split('/')[0];
+      this.tabs = parsedUrl === 'list' ? null : [
+        { label: 'INFO', routerLink: ['/sensor/', parsedUrl, 'info'] },
+        { label: 'HISTORY', path: ['/sensor/', parsedUrl, 'history'], disabled: true },
+      ];
+    } catch {
+      this.router.navigate(['error']);
+    }
+  }
+
+}

src/app/pages/sensors/sensor-tab-page.module.ts

@@ -0,0 +1,22 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { SensorTabPageComponent } from './sensor-tab-page.component';
+import { SensorTabPageRoutingModule } from './sensor-tab-page-routing.module';
+import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
+import { SensorModule } from '@overflow/sensor/sensor.module';
+import { TabbarModule } from '../../commons/component/layout/tabbar/app.tabbar.module';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    SensorTabPageRoutingModule,
+    PrimeNGModules,
+    SensorModule,
+    TabbarModule,
+  ],
+  declarations: [
+    SensorTabPageComponent,
+  ]
+})
+export class SensorTabPageModule { }

src/app/pages/sensors/sensor/sensor-page-routing.module.ts

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

src/app/pages/sensors/sensor/sensor-page.component.html

@@ -0,0 +1,11 @@
+<div *ngIf="!isDetail; else detailView">
+    <of-sensor-list-container (select)="onSensorSelect($event)"></of-sensor-list-container>
+</div>
+
+<ng-template #detailView>
+    <of-sensor-detail-container></of-sensor-detail-container>
+    <!-- <of-probe-detail-container [probeHostID]="probeHostID"
+     (targetSelect)="onTargetSelect($event)"
+     (discovery)="onDiscovery($event)"
+     ></of-probe-detail-container> -->
+</ng-template>

src/app/pages/sensors/sensor/sensor-page.component.ts

@@ -0,0 +1,50 @@
+import { Component, OnDestroy } from '@angular/core';
+import { Router, ActivatedRoute, NavigationEnd } from '@angular/router';
+import { Subscription } from 'rxjs/Subscription';
+import { Sensor } from '@overflow/commons-typescript/model/sensor';
+import { BreadcrumbService } from '@app/commons/service/breadcrumb.service';
+
+@Component({
+  selector: 'of-pages-sensor',
+  templateUrl: './sensor-page.component.html',
+})
+export class SensorPageComponent {
+
+  isDetail: boolean;
+  sensorID: string;
+
+  constructor(
+    private router: Router,
+    private route: ActivatedRoute,
+    private breadcrumbService: BreadcrumbService
+  ) {
+    this.route.params.subscribe(params => {
+      if (params['id']) {
+        this.onDetailContainer(params['id']);
+      } else {
+        this.onListContainer();
+      }
+    });
+  }
+
+  onListContainer() {
+    this.breadcrumbService.setItems([
+      { label: 'Sensor', routerLink: ['/sensor/list'],  }
+    ]);
+    this.isDetail = false;
+  }
+
+  onDetailContainer(sensorHostID: string) {
+    this.sensorID = sensorHostID;
+    this.breadcrumbService.setItems([
+      { label: 'Sensor', routerLink: ['/sensor/list'] },
+      { label: this.sensorID }
+    ]);
+    this.isDetail = true;
+  }
+
+  onSensorSelect(sensor: Sensor) {
+    this.router.navigate(['sensor', sensor.id, 'info']);
+  }
+
+}

src/app/pages/sensors/sensor/sensor-page.module.ts

@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
+import { SensorPageComponent } from './sensor-page.component';
+import { SensorPageRoutingModule } from './sensor-page-routing.module';
+import { SensorModule } from '@overflow/sensor/sensor.module';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    SensorPageRoutingModule,
+    SensorModule
+  ],
+  entryComponents: [
+  ],
+  declarations: [SensorPageComponent]
+})
+export class SensorPageModule { }