sensor page is in progress
This commit is contained in:
insanity
parent
0ad9d38d49
commit
3c4dbb64df
|
|
@ -1,17 +0,0 @@
|
||||||
<p-panel [showHeader]="false">
|
|
||||||
<div *ngIf="crawler; else info" class="ui-g ui-width-100-" style="height: 180px; overflow: auto">
|
|
||||||
<div class="ui-g-12" *ngFor="let item of inputItems">
|
|
||||||
<span class="md-inputfield">
|
|
||||||
<input id="name" type="text" pInputText />
|
|
||||||
<label for="name">User</label>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ng-template #info>
|
|
||||||
<div>개발자의 배려가 돋보이는 친절한 안내 메시지</div>
|
|
||||||
</ng-template>
|
|
||||||
<div dir="rtl">
|
|
||||||
<button *ngIf="crawler" type="button" label="Test" icon="ui-icon-send" pButton class="ui-button-width-fit" (click)="testCredentials()"></button>
|
|
||||||
</div>
|
|
||||||
</p-panel>
|
|
||||||
|
|
@ -1,25 +0,0 @@
|
||||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { CrawlerAuthComponent } from './crawler-auth.component';
|
|
||||||
|
|
||||||
describe('FilterComponent', () => {
|
|
||||||
let component: CrawlerAuthComponent;
|
|
||||||
let fixture: ComponentFixture<CrawlerAuthComponent>;
|
|
||||||
|
|
||||||
beforeEach(async(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [ CrawlerAuthComponent ]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(CrawlerAuthComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
@ -1,96 +0,0 @@
|
||||||
import { Component, OnInit, Input, OnChanges, Output, EventEmitter } from '@angular/core';
|
|
||||||
import { Router } from '@angular/router';
|
|
||||||
import { MetaCrawler } from '@overflow/commons-typescript/model/meta';
|
|
||||||
|
|
||||||
import { Store, select } from '@ngrx/store';
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
import * as ListStore from '@overflow/meta/crawler-input-item/store/list';
|
|
||||||
import { ReadCrawlerInputItemSelector } from '@overflow/meta/crawler-input-item/store';
|
|
||||||
import { MetaCrawlerInputItem } from '@overflow/commons-typescript/model/meta';
|
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'of-crawler-auth',
|
|
||||||
templateUrl: './crawler-auth.component.html',
|
|
||||||
})
|
|
||||||
export class CrawlerAuthComponent implements OnInit, OnChanges {
|
|
||||||
|
|
||||||
inputItems$ = this.listStore.pipe(select(ReadCrawlerInputItemSelector.select('inputs')));
|
|
||||||
inputItems: MetaCrawlerInputItem[];
|
|
||||||
title: string;
|
|
||||||
|
|
||||||
@Output() credentialPassed = new EventEmitter<boolean>();
|
|
||||||
@Input() crawler: MetaCrawler;
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private router: Router,
|
|
||||||
private listStore: Store<ListStore.State>,
|
|
||||||
) { }
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
// this.inputItems$.subscribe(
|
|
||||||
// (list: MetaCrawlerInputItem[]) => {
|
|
||||||
// if (list !== null) {
|
|
||||||
// if (this.inputItems !== list) {
|
|
||||||
// this.testPassEvent.emit(false);
|
|
||||||
// }
|
|
||||||
// this.inputItems = list;
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// (error: RPCClientError) => {
|
|
||||||
// console.log(error.response.message);
|
|
||||||
// }
|
|
||||||
// );
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnChanges() {
|
|
||||||
// this.getCrawlerAuthInputItems();
|
|
||||||
this.title = '3. Credentials';
|
|
||||||
|
|
||||||
this.inputItems = [];
|
|
||||||
// Temporary data
|
|
||||||
if (null == this.crawler) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.title += ' for ' + this.crawler.name;
|
|
||||||
for (let i = 0; i < 10; i++) {
|
|
||||||
const item: MetaCrawlerInputItem = {
|
|
||||||
id: i,
|
|
||||||
// inputType: {
|
|
||||||
// id: i,
|
|
||||||
// name: '',
|
|
||||||
// description: '',
|
|
||||||
// },
|
|
||||||
crawler: null,
|
|
||||||
description: '',
|
|
||||||
name: '',
|
|
||||||
createDate: new Date(),
|
|
||||||
required: true,
|
|
||||||
defaultValue: '',
|
|
||||||
pattern: '',
|
|
||||||
keyName: '',
|
|
||||||
keyValue: '',
|
|
||||||
};
|
|
||||||
this.inputItems.push(item);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
getCrawlerAuthInputItems() {
|
|
||||||
this.listStore.dispatch(new ListStore.ReadAll(this.crawler));
|
|
||||||
}
|
|
||||||
|
|
||||||
testCredentials() {
|
|
||||||
// switch (this.crawler.id) {
|
|
||||||
// case 1:
|
|
||||||
// break;
|
|
||||||
// case 2:
|
|
||||||
// break;
|
|
||||||
// case 3:
|
|
||||||
// break;
|
|
||||||
// default :
|
|
||||||
// break;
|
|
||||||
// }
|
|
||||||
this.credentialPassed.emit(true);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,16 +0,0 @@
|
||||||
<div *ngIf="target; else info" class="ui-width-100-">
|
|
||||||
<p-orderList [value]="crawlers" [listStyle]="{'height':'200px'}" [responsive]="true" filterBy="name"
|
|
||||||
(onSelectionChange)="onSelectionChange($event)" class="ui_orderlist_controls_none">
|
|
||||||
<ng-template let-crawler pTemplate="item">
|
|
||||||
<div class="ui-helper-clearfix">
|
|
||||||
<div style="font-size:14px;margin:0">{{crawler.name}}</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</p-orderList>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ng-template #info>
|
|
||||||
<p-panel [showHeader]="false">
|
|
||||||
<div>개발자의 배려가 돋보이는 친절한 안내 메시지</div>
|
|
||||||
</p-panel>
|
|
||||||
</ng-template>
|
|
||||||
|
|
@ -1,25 +0,0 @@
|
||||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { CrawlerSelectorComponent } from './crawler-selector.component';
|
|
||||||
|
|
||||||
describe('FilterComponent', () => {
|
|
||||||
let component: CrawlerSelectorComponent;
|
|
||||||
let fixture: ComponentFixture<CrawlerSelectorComponent>;
|
|
||||||
|
|
||||||
beforeEach(async(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [ CrawlerSelectorComponent ]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(CrawlerSelectorComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
@ -1,67 +0,0 @@
|
||||||
import { Component, OnInit, Input, OnChanges, AfterContentInit, Output, EventEmitter } from '@angular/core';
|
|
||||||
import { Router } from '@angular/router';
|
|
||||||
import { Target } from '@overflow/commons-typescript/model/target';
|
|
||||||
|
|
||||||
import { Store, select } from '@ngrx/store';
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
import * as ListStore from '@overflow/meta/crawler/store/list';
|
|
||||||
import { ReadAllCrawlerSelector } from '@overflow/meta/crawler/store';
|
|
||||||
import { MetaCrawler } from '@overflow/commons-typescript/model/meta';
|
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'of-crawler-selector',
|
|
||||||
templateUrl: './crawler-selector.component.html',
|
|
||||||
})
|
|
||||||
export class CrawlerSelectorComponent implements OnInit, OnChanges, AfterContentInit {
|
|
||||||
|
|
||||||
crawlers$ = this.listStore.pipe(select(ReadAllCrawlerSelector.select('metaCrawlerList')));
|
|
||||||
@Input() target: Target;
|
|
||||||
crawlers: MetaCrawler[];
|
|
||||||
@Output() crawlerSelected = new EventEmitter<MetaCrawler>();
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private router: Router,
|
|
||||||
private listStore: Store<ListStore.State>,
|
|
||||||
) { }
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
// this.crawlers$.subscribe(
|
|
||||||
// (list: MetaCrawler[]) => {
|
|
||||||
// if (list !== null) {
|
|
||||||
// this.crawlers = list;
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// (error: RPCClientError) => {
|
|
||||||
// console.log(error.response.message);
|
|
||||||
// }
|
|
||||||
// );
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
ngAfterContentInit() {
|
|
||||||
// this.listStore.dispatch(new ListStore.ReadAll());
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnChanges() {
|
|
||||||
|
|
||||||
this.crawlers = [];
|
|
||||||
if (null == this.target) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Temporary Data
|
|
||||||
for (let i = 0; i < 4; i++) {
|
|
||||||
const c: MetaCrawler = {
|
|
||||||
id: i,
|
|
||||||
name: 'CrawlerName' + i + ' For ' + this.target.displayName,
|
|
||||||
};
|
|
||||||
this.crawlers.push(c);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
onSelectionChange(event) {
|
|
||||||
this.crawlerSelected.emit(event.value[0]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,10 +0,0 @@
|
||||||
<p-panel [showHeader]="false">
|
|
||||||
<div *ngIf="crawler && target; else info" class="ui-g ui-width-100- ui-no-border" style="height: 200px; overflow: auto">
|
|
||||||
<p-tree [value]="itemTreeNode" selectionMode="checkbox" [(selection)]="selectedItems" (onNodeSelect)="onNodeSelect($event)"
|
|
||||||
(onNodeUnselect)="onNodeUnselect($event)"></p-tree>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ng-template #info>
|
|
||||||
<div>개발자의 배려가 돋보이는 친절한 안내 메시지</div>
|
|
||||||
</ng-template>
|
|
||||||
</p-panel>
|
|
||||||
|
|
@ -1,25 +0,0 @@
|
||||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { SensorItemSelectorComponent } from './sensor-item-selector.component';
|
|
||||||
|
|
||||||
describe('SensorItemSelectorComponent', () => {
|
|
||||||
let component: SensorItemSelectorComponent;
|
|
||||||
let fixture: ComponentFixture<SensorItemSelectorComponent>;
|
|
||||||
|
|
||||||
beforeEach(async(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [ SensorItemSelectorComponent ]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(SensorItemSelectorComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
@ -1,126 +0,0 @@
|
||||||
import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, AfterViewInit, OnDestroy } from '@angular/core';
|
|
||||||
import { Router } from '@angular/router';
|
|
||||||
import { Store, select } from '@ngrx/store';
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
import * as ListStore from '@overflow/meta/sensor-display-item/store/list';
|
|
||||||
import { ReadAllSensorDisplayItemByCrawlerSelector } from '@overflow/meta/sensor-display-item/store';
|
|
||||||
import { MetaSensorDisplayItem } from '@overflow/commons-typescript/model/meta';
|
|
||||||
import { MetaCrawler } from '@overflow/commons-typescript/model/meta';
|
|
||||||
import { MetaSensorItemType } from '@overflow/commons-typescript/model/meta';
|
|
||||||
import { TreeNode } from 'primeng/primeng';
|
|
||||||
import { Target } from '@overflow/commons-typescript/model/target';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'of-sensor-item-selector',
|
|
||||||
templateUrl: './sensor-item-selector.component.html',
|
|
||||||
})
|
|
||||||
export class SensorItemSelectorComponent implements OnInit, OnChanges {
|
|
||||||
|
|
||||||
@Input() target: Target;
|
|
||||||
@Input() crawler: MetaCrawler;
|
|
||||||
@Output() sensorItemsSelected = new EventEmitter<TreeNode[]>();
|
|
||||||
|
|
||||||
items$ = this.listStore.pipe(select(ReadAllSensorDisplayItemByCrawlerSelector.select('list')));
|
|
||||||
|
|
||||||
selectedItems: TreeNode[];
|
|
||||||
itemTreeNode: TreeNode[];
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private router: Router,
|
|
||||||
private listStore: Store<ListStore.State>,
|
|
||||||
) { }
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
// this.selectedItems = new Set();
|
|
||||||
// this.items$.subscribe(
|
|
||||||
// (list: MetaSensorDisplayItem[]) => {
|
|
||||||
// if (list !== null) {
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// (error: RPCClientError) => {
|
|
||||||
// console.log(error.response.message);
|
|
||||||
// }
|
|
||||||
// );
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnChanges() {
|
|
||||||
// this.selectedItems.clear();
|
|
||||||
// this.listStore.dispatch(new ListStore.ReadAllByCrawler(this.crawler));
|
|
||||||
|
|
||||||
this.itemTreeNode = [];
|
|
||||||
if (!this.target || !this.crawler) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
// Temporary data
|
|
||||||
const displayItems = [];
|
|
||||||
for (let i = 0; i < 10; i++) {
|
|
||||||
let isDefault = false;
|
|
||||||
const t: MetaSensorItemType = {
|
|
||||||
name: 'CPU'
|
|
||||||
};
|
|
||||||
if (i % 2) {
|
|
||||||
isDefault = true;
|
|
||||||
t.name = 'Memory';
|
|
||||||
}
|
|
||||||
const si: MetaSensorDisplayItem = {
|
|
||||||
id: i,
|
|
||||||
key: 'SensorDisplayItemKey' + i,
|
|
||||||
displayName: 'this.is.display.item.name' + i,
|
|
||||||
description: 'Description' + i,
|
|
||||||
default: isDefault,
|
|
||||||
itemType: t
|
|
||||||
};
|
|
||||||
displayItems.push(si);
|
|
||||||
}
|
|
||||||
|
|
||||||
this.generateTreeData(displayItems);
|
|
||||||
}
|
|
||||||
|
|
||||||
generateTreeData(items) {
|
|
||||||
this.itemTreeNode = [];
|
|
||||||
for (const item of items) {
|
|
||||||
const categoryNode = this.existCategory(item);
|
|
||||||
if (categoryNode === null) {
|
|
||||||
const childrenNode = [];
|
|
||||||
childrenNode.push(this.getChildNode(item));
|
|
||||||
const node = {
|
|
||||||
label: item.itemType.name,
|
|
||||||
children: childrenNode,
|
|
||||||
expanded: true,
|
|
||||||
};
|
|
||||||
this.itemTreeNode.push(node);
|
|
||||||
} else {
|
|
||||||
categoryNode.children.push(this.getChildNode(item));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
getChildNode(item) {
|
|
||||||
const childNode = {
|
|
||||||
label: item.displayName,
|
|
||||||
expandedIcon: item.default ? 'ui-icon-star' : '',
|
|
||||||
collapsedIcon: item.default ? 'ui-icon-star' : '',
|
|
||||||
expanded: true,
|
|
||||||
data: item
|
|
||||||
};
|
|
||||||
return childNode;
|
|
||||||
}
|
|
||||||
existCategory(item: MetaSensorDisplayItem) {
|
|
||||||
let categoryNode = null;
|
|
||||||
for (const node of this.itemTreeNode) {
|
|
||||||
if (node.label === item.itemType.name) {
|
|
||||||
categoryNode = node;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return categoryNode;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
onNodeSelect(event) {
|
|
||||||
this.sensorItemsSelected.emit(this.selectedItems);
|
|
||||||
}
|
|
||||||
onNodeUnselect(event) {
|
|
||||||
this.sensorItemsSelected.emit(this.selectedItems);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,3 +0,0 @@
|
||||||
<div style="height: 70%;">
|
|
||||||
page 2222222
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,25 +0,0 @@
|
||||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { SettingETCComponent } from './setting-etc.component';
|
|
||||||
|
|
||||||
describe('SettingETCComponent', () => {
|
|
||||||
let component: SettingETCComponent;
|
|
||||||
let fixture: ComponentFixture<SettingETCComponent>;
|
|
||||||
|
|
||||||
beforeEach(async(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [ SettingETCComponent ]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(SettingETCComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
@ -1,32 +0,0 @@
|
||||||
import { Component, OnInit, Input } from '@angular/core';
|
|
||||||
import { Router } from '@angular/router';
|
|
||||||
import { MetaCrawler } from '@overflow/commons-typescript/model/meta';
|
|
||||||
import { MetaSensorDisplayItem } from '@overflow/commons-typescript/model/meta';
|
|
||||||
import { Target } from '@overflow/commons-typescript/model/target';
|
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'of-sensor-setting-etc',
|
|
||||||
templateUrl: './setting-etc.component.html',
|
|
||||||
})
|
|
||||||
export class SettingETCComponent implements OnInit {
|
|
||||||
|
|
||||||
@Input() selectedTarget: Target;
|
|
||||||
@Input() selectedCrawler: MetaCrawler;
|
|
||||||
@Input() selectedItems: MetaSensorDisplayItem[];
|
|
||||||
|
|
||||||
intervals = [
|
|
||||||
'600 sec',
|
|
||||||
'400 sec',
|
|
||||||
'200 sec',
|
|
||||||
];
|
|
||||||
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private router: Router,
|
|
||||||
) { }
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
@ -1,60 +0,0 @@
|
||||||
<h1>Add Sensor</h1>
|
|
||||||
<div *ngIf="page === 1; else etc">
|
|
||||||
<p-accordion [multiple]="false" [activeIndex]="step" (onOpen)="onTabOpen($event)">
|
|
||||||
<p-accordionTab header="{{getTitle(0)}}" [disabled]="preTarget" class="ui-nopad">
|
|
||||||
<of-target-selector [visible]="visible" [preTarget]="preTarget" (targetSelected)="onTargetSelect($event)"></of-target-selector>
|
|
||||||
</p-accordionTab>
|
|
||||||
<p-accordionTab header="{{getTitle(1)}}" class="ui-nopad">
|
|
||||||
<of-crawler-selector [target]="selectedTarget" (crawlerSelected)="onCrawlerSelect($event)"></of-crawler-selector>
|
|
||||||
</p-accordionTab>
|
|
||||||
<p-accordionTab header="{{getTitle(2)}}" class="ui-nopad">
|
|
||||||
<of-crawler-auth [crawler]="selectedCrawler" (credentialPassed)="onCredentialPass($event)"></of-crawler-auth>
|
|
||||||
</p-accordionTab>
|
|
||||||
<p-accordionTab header="{{getTitle(3)}}" class="ui-nopad">
|
|
||||||
<of-sensor-item-selector [target]="selectedTarget" [crawler]="selectedCrawler" (sensorItemsSelected)="onItemsSelect($event)"></of-sensor-item-selector>
|
|
||||||
</p-accordionTab>
|
|
||||||
</p-accordion>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ng-template #etc>
|
|
||||||
<of-sensor-setting-etc></of-sensor-setting-etc>
|
|
||||||
</ng-template>
|
|
||||||
|
|
||||||
<div class="ui-top-space-10" dir="rtl">
|
|
||||||
<button pButton *ngIf="page === 1" class=" ui-button-width-fit" [disabled]="!nextable" type="button" label="Next" icon="fa-check" (click)="onNext()"></button>
|
|
||||||
<button pButton *ngIf="page === 2" class=" ui-button-width-fit" type="button" label="Done" icon="fa-check" (click)="onDone()"></button>
|
|
||||||
|
|
||||||
<button pButton *ngIf="page === 1" class="ui-button-danger ui-button-width-fit" type="button" label="Cancel" icon="ui-icon-close" (click)="onCancel()"></button>
|
|
||||||
<button pButton *ngIf="page === 2" class="ui-button-danger ui-button-width-fit" type="button" label="Prev" icon="ui-icon-close" (click)="onPrev()"></button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- <div [hidden]="step !== 1">
|
|
||||||
<div class="ui-g">
|
|
||||||
<div class="ui-g-6">
|
|
||||||
<of-target-selector [preTarget]="preTarget" (targetSelected)="onTargetSelect($event)"></of-target-selector>
|
|
||||||
</div>
|
|
||||||
<div class="ui-g-6">
|
|
||||||
<of-crawler-auth [crawler]="selectedCrawler" (credentialPassed)="onCredentialPass($event)"></of-crawler-auth>
|
|
||||||
</div>
|
|
||||||
<div class="ui-g-6">
|
|
||||||
<of-crawler-selector [target]="selectedTarget" (crawlerSelected)="onCrawlerSelect($event)"></of-crawler-selector>
|
|
||||||
</div>
|
|
||||||
<div class="ui-g-6">
|
|
||||||
<of-sensor-item-selector [target]="selectedTarget" [crawler]="selectedCrawler" (sensorItemsSelected)="onItemsSelect($event)"></of-sensor-item-selector>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div *ngIf="step === 2">
|
|
||||||
<of-sensor-setting-etc [selectedTarget]="selectedTarget" [selectedCrawler]="selectedCrawler" [selectedItems]="selectedSensorDisplayItems"></of-sensor-setting-etc>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<button pButton *ngIf="step === 1" class="ui-button-danger" type="button" label="Cancel" icon="ui-icon-close" (click)="onCancel()"></button>
|
|
||||||
<button pButton *ngIf="step === 2" class="ui-button-danger" type="button" label="Prev" icon="ui-icon-close" (click)="onPrev()"></button>
|
|
||||||
|
|
||||||
<button pButton *ngIf="step === 1" [disabled]="!nextable" type="button" label="Next" icon="fa-check" (click)="onNext()"></button>
|
|
||||||
<button pButton *ngIf="step === 2" type="button" label="Done" icon="fa-check" (click)="onDone()"></button>
|
|
||||||
</div> -->
|
|
||||||
|
|
@ -1,25 +0,0 @@
|
||||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { SettingComponent } from './setting.component';
|
|
||||||
|
|
||||||
describe('SensorSettingComponent', () => {
|
|
||||||
let component: SettingComponent;
|
|
||||||
let fixture: ComponentFixture<SettingComponent>;
|
|
||||||
|
|
||||||
beforeEach(async(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [ SettingComponent ]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(SettingComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
@ -1,159 +0,0 @@
|
||||||
import { Component, OnInit, Input, Inject, DoCheck, ViewEncapsulation, Output, EventEmitter, OnChanges } from '@angular/core';
|
|
||||||
import { Target } from '@overflow/commons-typescript/model/target';
|
|
||||||
import { Infra } from '@overflow/commons-typescript/model/infra';
|
|
||||||
import { MetaCrawler } from '@overflow/commons-typescript/model/meta';
|
|
||||||
import { MetaSensorDisplayItem } from '@overflow/commons-typescript/model/meta';
|
|
||||||
|
|
||||||
import { Store, select, StateObservable } from '@ngrx/store';
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
import * as SensorItemKeyListStore from '@overflow/sensor-item/store/key-list';
|
|
||||||
import { ReadSensorItemKeySelector } from '@overflow/sensor-item/store';
|
|
||||||
import { MetaSensorItemKey } from '@overflow/commons-typescript/model/meta';
|
|
||||||
import { TreeNode } from 'primeng/primeng';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'of-sensor-setting',
|
|
||||||
templateUrl: './setting.component.html',
|
|
||||||
encapsulation: ViewEncapsulation.None
|
|
||||||
})
|
|
||||||
export class SettingComponent implements OnInit, DoCheck, OnChanges {
|
|
||||||
|
|
||||||
@Input() preTarget: Target;
|
|
||||||
@Output() close = new EventEmitter();
|
|
||||||
@Input() visible;
|
|
||||||
|
|
||||||
nextable = false;
|
|
||||||
selectedTarget: Target;
|
|
||||||
selectedCrawler: MetaCrawler;
|
|
||||||
credentialPassed: boolean;
|
|
||||||
selectedSensorDisplayItems: MetaSensorDisplayItem[];
|
|
||||||
itemNodes: TreeNode[];
|
|
||||||
step = 0;
|
|
||||||
page = 1;
|
|
||||||
|
|
||||||
sensorItemKeys$: StateObservable;
|
|
||||||
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private keyListStore: Store<SensorItemKeyListStore.State>
|
|
||||||
) {
|
|
||||||
keyListStore.pipe(select(ReadSensorItemKeySelector.select('list')));
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
this.step = this.preTarget ? 1 : 0;
|
|
||||||
// this.sensorItemKeys$.subscribe(
|
|
||||||
// (list: MetaSensorItemKey[]) => {
|
|
||||||
// if (list !== null) {
|
|
||||||
// console.log(list);
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// (error: RPCClientError) => {
|
|
||||||
// console.log(error.response.message);
|
|
||||||
// }
|
|
||||||
// );
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnChanges(changes) {
|
|
||||||
this.step = this.preTarget ? 1 : 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
ngDoCheck() {
|
|
||||||
try {
|
|
||||||
if (
|
|
||||||
this.selectedTarget === null ||
|
|
||||||
this.selectedCrawler === null ||
|
|
||||||
this.itemNodes === null ||
|
|
||||||
this.itemNodes.length === 0 ||
|
|
||||||
!this.credentialPassed
|
|
||||||
) {
|
|
||||||
this.nextable = false;
|
|
||||||
} else {
|
|
||||||
this.nextable = true;
|
|
||||||
}
|
|
||||||
} catch (exception) {
|
|
||||||
this.nextable = false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onCancel() {
|
|
||||||
this.page = 1;
|
|
||||||
this.step = 0;
|
|
||||||
this.visible = false;
|
|
||||||
this.nextable = false;
|
|
||||||
this.selectedTarget = null;
|
|
||||||
this.selectedCrawler = null;
|
|
||||||
this.credentialPassed = false;
|
|
||||||
this.selectedSensorDisplayItems = null;
|
|
||||||
this.close.emit();
|
|
||||||
}
|
|
||||||
|
|
||||||
onNext() {
|
|
||||||
this.page += 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
onPrev() {
|
|
||||||
this.page -= 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
onDone() {
|
|
||||||
this.selectedSensorDisplayItems = [];
|
|
||||||
for (const node of this.itemNodes) {
|
|
||||||
if (node.data && node.data !== undefined) {
|
|
||||||
this.selectedSensorDisplayItems.push(node.data);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
console.log(this.selectedSensorDisplayItems);
|
|
||||||
}
|
|
||||||
|
|
||||||
onTargetSelect(t: Target) {
|
|
||||||
this.selectedTarget = t;
|
|
||||||
this.step = 1;
|
|
||||||
}
|
|
||||||
onCrawlerSelect(c: MetaCrawler) {
|
|
||||||
this.selectedCrawler = c;
|
|
||||||
this.step = 2;
|
|
||||||
}
|
|
||||||
onCredentialPass(b: boolean) {
|
|
||||||
if (!b) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.credentialPassed = b;
|
|
||||||
this.step = 3;
|
|
||||||
}
|
|
||||||
onItemsSelect(nodes: TreeNode[]) {
|
|
||||||
this.itemNodes = nodes;
|
|
||||||
}
|
|
||||||
|
|
||||||
onTabOpen(event) {
|
|
||||||
this.step = event.index;
|
|
||||||
}
|
|
||||||
|
|
||||||
getTitle(index) {
|
|
||||||
if (index === 0 && this.preTarget) {
|
|
||||||
return this.preTarget.displayName;
|
|
||||||
}
|
|
||||||
let title = '';
|
|
||||||
switch (index) {
|
|
||||||
case 0:
|
|
||||||
title = this.selectedTarget && this.step !== index ?
|
|
||||||
this.selectedTarget.displayName :
|
|
||||||
'Choose a Target to monitor.';
|
|
||||||
break;
|
|
||||||
case 1:
|
|
||||||
title = this.selectedCrawler && this.step !== index ?
|
|
||||||
this.selectedCrawler.name :
|
|
||||||
'Choose a Crawler.';
|
|
||||||
break;
|
|
||||||
case 2:
|
|
||||||
title = this.credentialPassed && this.step !== index ?
|
|
||||||
'Credentials test succeed.' :
|
|
||||||
'Credentials';
|
|
||||||
break;
|
|
||||||
case 3:
|
|
||||||
title = 'Choose Sensor Items.';
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
return title;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,11 +0,0 @@
|
||||||
<div *ngIf="preTarget === null" class="ui-width-100-">
|
|
||||||
<p-orderList [value]="targets" [listStyle]="{'height':'200px'}" [responsive]="true" filterBy="displayName"
|
|
||||||
(onSelectionChange)="onSelectionChange($event)" class="ui_orderlist_controls_none">
|
|
||||||
<ng-template let-target pTemplate="item">
|
|
||||||
<div class="ui-helper-clearfix">
|
|
||||||
<img src="assets/demo/images/car/BMW.gif" style="display:inline-block;margin:2px 0 2px 2px" />
|
|
||||||
<div style="font-size:14px;float:right;margin:15px 5px 0 0">{{ target.displayName }}</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</p-orderList>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,25 +0,0 @@
|
||||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { TargetSelectorComponent } from './target-selector.component';
|
|
||||||
|
|
||||||
describe('FilterComponent', () => {
|
|
||||||
let component: TargetSelectorComponent;
|
|
||||||
let fixture: ComponentFixture<TargetSelectorComponent>;
|
|
||||||
|
|
||||||
beforeEach(async(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [ TargetSelectorComponent ]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(TargetSelectorComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
@ -1,92 +0,0 @@
|
||||||
import { Component, OnInit, Output, EventEmitter, Input, AfterContentInit, OnChanges } from '@angular/core';
|
|
||||||
import { Router } from '@angular/router';
|
|
||||||
import { Target } from '@overflow/commons-typescript/model/target';
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
import { Domain } from '@overflow/commons-typescript/model/domain';
|
|
||||||
import { AuthSelector } from '@overflow/member/store';
|
|
||||||
import * as ListStore from '@overflow/infra/store/list';
|
|
||||||
import { ListSelector } from '@overflow/infra/store';
|
|
||||||
import { Store, select } from '@ngrx/store';
|
|
||||||
// import { Page, PageParams } from 'app/commons/model';
|
|
||||||
import { SelectItem } from 'primeng/primeng';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'of-target-selector',
|
|
||||||
templateUrl: './target-selector.component.html',
|
|
||||||
})
|
|
||||||
export class TargetSelectorComponent implements OnInit, OnChanges {
|
|
||||||
|
|
||||||
targets$ = this.store.pipe(select(ListSelector.select('page')));
|
|
||||||
|
|
||||||
@Input() preTarget: Target = null;
|
|
||||||
@Input() visible;
|
|
||||||
@Output() targetSelected = new EventEmitter<Target>();
|
|
||||||
targets: Target[] = null;
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private router: Router,
|
|
||||||
private store: Store<ListStore.State>
|
|
||||||
) { }
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
// this.targets$.subscribe(
|
|
||||||
// (page: Page) => {
|
|
||||||
// if (page !== null) {
|
|
||||||
// this.convertInfraToTarget(page);
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// (error: RPCClientError) => {
|
|
||||||
// console.log(error.response.message);
|
|
||||||
// }
|
|
||||||
// );
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnChanges(changes) {
|
|
||||||
this.targets = [];
|
|
||||||
if (this.preTarget === null) {
|
|
||||||
this.getTargetList();
|
|
||||||
} else {
|
|
||||||
this.targets.push(this.preTarget);
|
|
||||||
this.targetSelected.emit(this.preTarget);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// convertInfraToTarget(page: Page) {
|
|
||||||
// for (const infra of page.content) {
|
|
||||||
// this.targets.push(infra.target);
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
getTargetList() {
|
|
||||||
// this.store.select(AuthSelector.select('domain')).subscribe(
|
|
||||||
// (domain: Domain) => {
|
|
||||||
// const pageParams: PageParams = {
|
|
||||||
// pageNo: '0',
|
|
||||||
// countPerPage: '9999',
|
|
||||||
// sortCol: 'id',
|
|
||||||
// sortDirection: 'descending'
|
|
||||||
// };
|
|
||||||
// this.store.dispatch(new ListStore.ReadAllByDomain({ domain, pageParams }));
|
|
||||||
// },
|
|
||||||
// (error) => {
|
|
||||||
// console.log(error);
|
|
||||||
// }
|
|
||||||
// );
|
|
||||||
|
|
||||||
// Temporary data
|
|
||||||
for (let i = 0; i < 10; i++) {
|
|
||||||
const t: Target = {
|
|
||||||
id: i,
|
|
||||||
displayName: 'DisplayName' + i,
|
|
||||||
createDate: new Date(),
|
|
||||||
description: 'Description' + i,
|
|
||||||
};
|
|
||||||
this.targets.push(t);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onSelectionChange(event) {
|
|
||||||
this.targetSelected.emit(event.value[0]);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
7
@overflow/sensor/container/index.ts
Normal file
7
@overflow/sensor/container/index.ts
Normal file
|
|
@ -0,0 +1,7 @@
|
||||||
|
import { SensorListContainerComponent } from './sensor-list-container';
|
||||||
|
import { SensorDetailContainerComponent } from './sensor-detail-container';
|
||||||
|
|
||||||
|
export const CONTAINER_COMPONENTS = [
|
||||||
|
SensorListContainerComponent,
|
||||||
|
SensorDetailContainerComponent
|
||||||
|
];
|
||||||
1
@overflow/sensor/container/sensor-detail-container.html
Normal file
1
@overflow/sensor/container/sensor-detail-container.html
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
<of-sensor-detail></of-sensor-detail>
|
||||||
14
@overflow/sensor/container/sensor-detail-container.ts
Normal file
14
@overflow/sensor/container/sensor-detail-container.ts
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
import { Component } from '@angular/core';
|
||||||
|
import { Observable } from 'rxjs';
|
||||||
|
import { Store, select } from '@ngrx/store';
|
||||||
|
// import * as ProbeStore from '../store/entity/probe';
|
||||||
|
// import { ProbeEntitySelector, ProbeDetailContainerSelector } from '../store';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'of-sensor-detail-container',
|
||||||
|
templateUrl: './sensor-detail-container.html',
|
||||||
|
})
|
||||||
|
export class SensorDetailContainerComponent {
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
1
@overflow/sensor/container/sensor-list-container.html
Normal file
1
@overflow/sensor/container/sensor-list-container.html
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
<of-sensor-list></of-sensor-list>
|
||||||
16
@overflow/sensor/container/sensor-list-container.ts
Normal file
16
@overflow/sensor/container/sensor-list-container.ts
Normal file
|
|
@ -0,0 +1,16 @@
|
||||||
|
import { Component, EventEmitter, Output } from '@angular/core';
|
||||||
|
import { Observable } from 'rxjs';
|
||||||
|
import { Store, select } from '@ngrx/store';
|
||||||
|
import { Sensor } from '@overflow/commons-typescript/model/sensor';
|
||||||
|
// import * as ProbeStore from '../store/entity/probe';
|
||||||
|
// import { ProbeEntitySelector, ProbeListContainerSelector } from '../store';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'of-sensor-list-container',
|
||||||
|
templateUrl: './sensor-list-container.html',
|
||||||
|
})
|
||||||
|
export class SensorListContainerComponent {
|
||||||
|
|
||||||
|
@Output() select = new EventEmitter<Sensor>();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -7,6 +7,7 @@ import { SERVICES } from './service';
|
||||||
import { SensorStoreModule } from './sensor-store.module';
|
import { SensorStoreModule } from './sensor-store.module';
|
||||||
import { SensorItemModule } from '../sensor-item/sensor-item.module';
|
import { SensorItemModule } from '../sensor-item/sensor-item.module';
|
||||||
import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.module';
|
import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.module';
|
||||||
|
import { CONTAINER_COMPONENTS } from './container';
|
||||||
// import { MetaCrawlerModule } from '../meta/crawler/crawler.module';
|
// import { MetaCrawlerModule } from '../meta/crawler/crawler.module';
|
||||||
// import { MetaSensorDisplayItemModule } from '../meta/sensor-display-item/sensor-display-item.module';
|
// import { MetaSensorDisplayItemModule } from '../meta/sensor-display-item/sensor-display-item.module';
|
||||||
// import { MetaCrawlerInputItemModule } from '../meta/crawler-input-item/crawler-input.module';
|
// import { MetaCrawlerInputItemModule } from '../meta/crawler-input-item/crawler-input.module';
|
||||||
|
|
@ -23,9 +24,11 @@ import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.
|
||||||
KeyValueModule
|
KeyValueModule
|
||||||
],
|
],
|
||||||
declarations: [
|
declarations: [
|
||||||
|
CONTAINER_COMPONENTS,
|
||||||
COMPONENTS,
|
COMPONENTS,
|
||||||
],
|
],
|
||||||
exports: [
|
exports: [
|
||||||
|
CONTAINER_COMPONENTS,
|
||||||
COMPONENTS,
|
COMPONENTS,
|
||||||
],
|
],
|
||||||
providers: [
|
providers: [
|
||||||
|
|
|
||||||
|
|
@ -23,7 +23,7 @@ export class AppMenuComponent implements OnInit {
|
||||||
{
|
{
|
||||||
label: 'Infra', icon: 'all_inclusive', items: [
|
label: 'Infra', icon: 'all_inclusive', items: [
|
||||||
{ label: 'Map', icon: 'map', routerLink: ['/map'] },
|
{ 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'] },
|
{ label: 'Probes', icon: 'dock', routerLink: ['/probe/list'] },
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -12,8 +12,7 @@ const routes: Routes = [
|
||||||
{ path: 'probe', loadChildren: './probes/probe-tab-page.module#ProbeTabPageModule' },
|
{ path: 'probe', loadChildren: './probes/probe-tab-page.module#ProbeTabPageModule' },
|
||||||
{ path: 'discovery', loadChildren: './discovery/discovery-page.module#DiscoveryPageModule' },
|
{ path: 'discovery', loadChildren: './discovery/discovery-page.module#DiscoveryPageModule' },
|
||||||
{ path: 'map', loadChildren: './infra/infra-page.module#InfraPageModule' },
|
{ path: 'map', loadChildren: './infra/infra-page.module#InfraPageModule' },
|
||||||
// { path: 'sensors', loadChildren: './sensors/sensors-page.module#SensorsPageModule' },
|
{ path: 'sensor', loadChildren: './sensors/sensor-tab-page.module#SensorTabPageModule' },
|
||||||
// { path: 'sensor', loadChildren: './sensor/sensor-page.module#SensorPageModule' },
|
|
||||||
// { path: 'target', loadChildren: './target/target-page.module#TargetPageModule' },
|
// { path: 'target', loadChildren: './target/target-page.module#TargetPageModule' },
|
||||||
// { path: 'overview', loadChildren: './overview/overview-page.module#OverviewPageModule' },
|
// { path: 'overview', loadChildren: './overview/overview-page.module#OverviewPageModule' },
|
||||||
// { path: 'dashboard', loadChildren: './dashboard/dashboard-page.module#DashboardPageModule' },
|
// { path: 'dashboard', loadChildren: './dashboard/dashboard-page.module#DashboardPageModule' },
|
||||||
|
|
|
||||||
21
src/app/pages/sensors/sensor-tab-page-routing.module.ts
Normal file
21
src/app/pages/sensors/sensor-tab-page-routing.module.ts
Normal file
|
|
@ -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 { }
|
||||||
12
src/app/pages/sensors/sensor-tab-page.component.html
Normal file
12
src/app/pages/sensors/sensor-tab-page.component.html
Normal file
|
|
@ -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>
|
||||||
40
src/app/pages/sensors/sensor-tab-page.component.ts
Normal file
40
src/app/pages/sensors/sensor-tab-page.component.ts
Normal file
|
|
@ -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']);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
22
src/app/pages/sensors/sensor-tab-page.module.ts
Normal file
22
src/app/pages/sensors/sensor-tab-page.module.ts
Normal file
|
|
@ -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 { }
|
||||||
16
src/app/pages/sensors/sensor/sensor-page-routing.module.ts
Normal file
16
src/app/pages/sensors/sensor/sensor-page-routing.module.ts
Normal file
|
|
@ -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 { }
|
||||||
11
src/app/pages/sensors/sensor/sensor-page.component.html
Normal file
11
src/app/pages/sensors/sensor/sensor-page.component.html
Normal file
|
|
@ -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>
|
||||||
50
src/app/pages/sensors/sensor/sensor-page.component.ts
Normal file
50
src/app/pages/sensors/sensor/sensor-page.component.ts
Normal file
|
|
@ -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']);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
19
src/app/pages/sensors/sensor/sensor-page.module.ts
Normal file
19
src/app/pages/sensors/sensor/sensor-page.module.ts
Normal file
|
|
@ -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 { }
|
||||||
Loading…
Reference in New Issue
Block a user