sensor pages

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

@@ -15,7 +15,6 @@ const routes: Routes = [
       { path: 'sensor', loadChildren: './sensor/sensor-page.module#SensorPageModule' },
       // { path: 'discovery', loadChildren: './discovery/discovery-page.module#DiscoveryPageModule' },
       { path: 'map', loadChildren: './infra/infra-page.module#InfraPageModule' },
-      // { path: 'sensor-setting', loadChildren: './sensor-setting/sensor-setting-page.module#SensorSettingPageModule' },
       // { 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/pages.module.ts

@@ -18,6 +18,7 @@ import { PagesComponent } from './pages.component';
 import { PagesRoutingModule } from './pages-routing.module';
 import { LocationStrategy, HashLocationStrategy } from '@angular/common';
 import { PrimeNGModules } from 'packages/commons/prime-ng/prime-ng.module';
+import { TabbarModule } from 'app/commons/component/layout/tabbar/app.tabbar.module';
 
 @NgModule({
   imports: [
@@ -25,6 +26,7 @@ import { PrimeNGModules } from 'packages/commons/prime-ng/prime-ng.module';
     PagesRoutingModule,
     LocalizationModule,
     PrimeNGModules,
+    TabbarModule
   ],
   declarations: [
     PagesComponent,

src/app/pages/probe/probe-page.component.ts

@@ -22,9 +22,9 @@ export class ProbePageComponent implements OnInit {
     // ];
 
     this.tabs = [
-      { label: 'Info', routerLink: ['/probe/', id, 'info'], path: '/probe/' + id, icon: 'fa-check' },
+      { label: 'INFO', routerLink: ['/probe/', id, 'info'], path: '/probe/' + id, icon: 'fa-check' },
-      { label: 'Targets', routerLink: ['/probe/', id, 'targets'], icon: 'fa-check' },
+      { label: 'TARGETS', routerLink: ['/probe/', id, 'targets'], icon: 'fa-check' },
-      { label: 'History', routerLink: ['/probe/', id, 'history'], icon: 'fa-check', disabled: true },
+      { label: 'HISTORY', routerLink: ['/probe/', id, 'history'], icon: 'fa-check', disabled: true },
     ];
   }
 

src/app/pages/probe/probe-page.module.ts

@@ -6,7 +6,7 @@ import { ProbePageComponent } from './probe-page.component';
 import { ProbePageRoutingModule } from './probe-page-routing.module';
 import { PrimeNGModules } from 'packages/commons/prime-ng/prime-ng.module';
 import { ProbeModule } from 'packages/probe/probe.module';
-import { TabbarModule } from '../../commons/component/layout/tabbar/app.tabbar.module';
+import { TabbarModule } from 'app/commons/component/layout/tabbar/app.tabbar.module';
 
 @NgModule({
   imports: [

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

@@ -1,15 +1,15 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 import { SensorPageComponent } from './sensor-page.component';
-// import { DetailComponent } from 'packages/sensor/component/detail/detail.component';
+import { DetailComponent } from 'packages/sensor/component/detail/detail.component';
 
 const routes: Routes = [
   {
     path: '',
     component: SensorPageComponent,
     children: [
-      // { path: ':id', component: DetailComponent },
+      { path: ':id/info', component: DetailComponent },
-      // { path: ':id/history', component: null },
+      { path: ':id/history', component: null },
     ]
   }
 ];

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

@@ -2,13 +2,11 @@
     <div class="ui-g">
         <div class="ui-g-12">
             <div class="card no-margin">
-                <h1>Sensors</h1>
+                <of-tabbar [tabs]="tabs"></of-tabbar>
-
+            </div>
-                <of-sub-menubar [tabs]="tabs"></of-sub-menubar>
+            <div class="card no-margin">
-                <div style="padding: 15px">
                 <router-outlet></router-outlet>
             </div>
         </div>
     </div>
-    </div>
 </div>

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

@@ -16,8 +16,8 @@ export class SensorPageComponent implements OnInit {
     const id = this.router.url.split('sensor/')[1].split('/')[0];
 
     this.tabs = [
-      { label: 'Info', path: '/sensor/' + id },
+      { label: 'INFO', routerLink: ['/sensor/' + id, 'info'] },
-      { label: 'History', path: '/sensor/' + id + '/history' },
+      { label: 'HISTORY', path:  ['/sensor/' + id, 'history'], disabled: true },
     ];
   }
 

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

@@ -4,12 +4,14 @@ import { CommonModule } from '@angular/common';
 import { SensorModule } from 'packages/sensor/sensor.module';
 import { SensorPageRoutingModule } from './sensor-page-routing.module';
 import { SensorPageComponent } from './sensor-page.component';
+import { TabbarModule } from 'app/commons/component/layout/tabbar/app.tabbar.module';
 
 @NgModule({
   imports: [
     CommonModule,
     SensorPageRoutingModule,
     SensorModule,
+    TabbarModule
   ],
   declarations: [
     SensorPageComponent,

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

@@ -2,7 +2,6 @@
     <div class="ui-g">
         <div class="ui-g-12">
             <div class="card no-margin">
-                <h1>Sensors</h1>
                 <of-sensor-list></of-sensor-list>
             </div>
         </div>

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

@@ -9,7 +9,6 @@ export class SensorsPageComponent implements OnInit {
   tabs = [
     { label: 'Overview', path: '/sensors' },
     { label: 'History', path: '/sensors/history' },
-    { label: 'Settings', path: '/sensors/setting' },
   ];
 
   constructor() { }

src/packages/sensor/component/detail/detail.component.ts

@@ -1,22 +1,19 @@
-// import { Component, OnInit, Inject } from '@angular/core';
+import { Component, OnInit, Inject } from '@angular/core';
-// import { ActivatedRoute, Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
-// import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
-// import { ConfirmDialogComponent } from 'packages/commons/component/confirm-dialog/confirm-dialog.component';
 
-// @Component({
+@Component({
-//   selector: 'of-sensor-detail',
+  selector: 'of-sensor-detail',
-//   templateUrl: './detail.component.html',
+  templateUrl: './detail.component.html',
-//   styleUrls: ['./detail.component.scss']
+  styleUrls: ['./detail.component.scss']
-// })
+})
-// export class DetailComponent implements OnInit {
+export class DetailComponent implements OnInit {
 
-//   constructor(
+  constructor(
-//     private route: ActivatedRoute,
+    private route: ActivatedRoute,
-//     private router: Router,
+    private router: Router,
-//     public dialog: MatDialog,
+  ) { }
-//   ) { }
 
-//   ngOnInit() {
+  ngOnInit() {
-//   }
+  }
-// }
+}
 

src/packages/sensor/component/index.ts

@@ -6,10 +6,9 @@ import { CrawlerSelectorComponent } from './setting/crawler-selector/crawler-sel
 import { CrawlerAuthComponent } from './setting/crawler-auth/crawler-auth.component';
 import { SensorItemSelectorComponent } from './setting/sensor-item-selector/sensor-item-selector.component';
 import { SettingETCComponent } from './setting/setting-etc/setting-etc.component';
+import { DetailComponent } from './detail/detail.component';
 // import { FilterComponent } from './list/filter/filter.component';
-// import { DetailComponent } from './detail/detail.component';
 // import { TargetSelectorComponent } from './setting/target-selector/target-selector.component';
-// import { NameTagComponent } from './name-tag/name-tag.component';
 
 export const COMPONENTS = [
   SettingComponent,
@@ -19,8 +18,7 @@ export const COMPONENTS = [
   SensorItemSelectorComponent,
   SettingETCComponent,
   ListComponent,
+  DetailComponent,
   //   FilterComponent,
-  //   DetailComponent,
   //   SettingETCComponent,
-  //   NameTagComponent,
 ];

src/packages/sensor/component/list/list.component.html

@@ -1,11 +1,35 @@
+<h1>Sensors</h1>
+
 <div>
     <p-dialog [modal]="true" [width]="800" [(visible)]="sensorSettingDisplay" [showHeader]="false" [closeOnEscape]="false">
         <of-sensor-setting [visible]="sensorSettingDisplay" [preTarget]="target" (close)="onSensorSettingClose()"></of-sensor-setting>
     </p-dialog>
 
     <button type="button" label="Add Sensor" icon="ui-icon-add" pButton (click)="onAddSensor()"></button>
-    <button type="button" label="Add Sensor with Target" icon="ui-icon-add" pButton (click)="onAddSensorWithTarget()"></button>
+    <button type="button" label="Add Sensor with Target(temp)" icon="ui-icon-add" pButton (click)="onAddSensorWithTarget()"></button>
-    <button type="button" label="Add Sensor with Target2" icon="ui-icon-add" pButton (click)="onAddSensorWithTarget2()"></button>
+    <button type="button" label="Add Sensor with Target2(temp)" icon="ui-icon-add" pButton (click)="onAddSensorWithTarget2()"></button>
 </div>
 
-<div>sensor list</div>
+
+<p-table [value]="sensors" selectionMode="single" (onRowSelect)="onRowSelect($event)" [resizableColumns]="true">
+    <ng-template pTemplate="header">
+        <tr>
+            <th>No.</th>
+            <th>Description</th>
+            <th>Status</th>
+            <th>Crawler</th>
+            <th>Items</th>
+            <th>Created at</th>
+        </tr>
+    </ng-template>
+    <ng-template pTemplate="body" let-sensor let-rowIndex="rowIndex">
+        <tr [pSelectableRow]="sensor">
+            <td>{{rowIndex + 1}}</td>
+            <td>{{sensor.Description}}</td>
+            <td>{{sensor.status.name}}</td>
+            <td>{{sensor.crawler.name}}</td>
+            <td>???</td>
+            <td>{{sensor.createDate | date: 'dd.MM.yyyy'}}</td>
+        </tr>
+    </ng-template>
+</p-table>

src/packages/sensor/component/list/list.component.ts

@@ -28,6 +28,7 @@ export class ListComponent implements OnInit, AfterContentInit {
   totalLength = 0;
   sensorSettingDisplay = false;
 
+  sensors: Sensor[];
   target: Target = null;
 
   constructor(private router: Router,
@@ -35,20 +36,21 @@ export class ListComponent implements OnInit, AfterContentInit {
   ) { }
 
   ngOnInit() {
-    // this.sensorList$.subscribe(
+    this.sensorList$.subscribe(
-    //   (page: Page) => {
+      (page: Page) => {
-    //     if (page != null) {
+        if (page != null) {
-    //       this.totalLength = page.totalElements;
+          this.sensors = page.content;
-    //     }
+          this.totalLength = page.totalElements;
-    //   },
+        }
-    //   (error: RPCClientError) => {
+      },
-    //     console.log(error.response.message);
+      (error: RPCClientError) => {
-    //   }
+        console.log(error.response.message);
-    // );
+      }
+    );
   }
 
   ngAfterContentInit() {
-    // this.getSensors(0);
+    this.getSensors(0);
   }
 
   getSensors(pageIndex: number) {
@@ -69,8 +71,8 @@ export class ListComponent implements OnInit, AfterContentInit {
     );
   }
 
-  handleRowClick(obj: Sensor) {
+  onRowSelect(event) {
-    this.router.navigate(['target', obj.id]);
+    this.router.navigate(['sensor', event.data.id, 'info']);
   }
 
   onAddSensor() {