sensor / filter
This commit is contained in:
insanity
parent
5330179781
commit
e3013e95a6
|
|
@ -133,7 +133,14 @@
|
|||
<span class="topbar-item-name">Messages</span>
|
||||
</a>
|
||||
<ul class="ultima-menu animated fadeInDown">
|
||||
<li role="menuitem">
|
||||
<li role="menuitem" *ngFor="let noti of notis">
|
||||
<a href="#" class="topbar-message">
|
||||
<!-- <img src="assets/layout/images/avatar1.png" width="35" /> -->
|
||||
<span>{{noti.title}}</span>
|
||||
<span>{{noti.content}}</span>
|
||||
</a>
|
||||
</li>
|
||||
<!-- <li role="menuitem">
|
||||
<a href="#" class="topbar-message">
|
||||
<img src="assets/layout/images/avatar1.png" width="35" />
|
||||
<span>Give me a call</span>
|
||||
|
|
@ -162,7 +169,7 @@
|
|||
<img src="assets/layout/images/avatar4.png" width="35" />
|
||||
<span>Out of office</span>
|
||||
</a>
|
||||
</li>
|
||||
</li> -->
|
||||
</ul>
|
||||
</li>
|
||||
<li #notifications [ngClass]="{'active-top-menu':app.activeTopbarItem === notifications}">
|
||||
|
|
|
|||
|
|
@ -1,13 +1,32 @@
|
|||
import {Component} from '@angular/core';
|
||||
import {AppComponent} from 'app/app.component';
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { AppComponent } from 'app/app.component';
|
||||
import { PagesComponent } from '../../../../pages/pages.component';
|
||||
|
||||
@Component({
|
||||
selector: 'of-topbar',
|
||||
templateUrl: './app.topbar.component.html'
|
||||
})
|
||||
export class AppTopbarComponent {
|
||||
export class AppTopbarComponent implements OnInit {
|
||||
|
||||
constructor(public app: PagesComponent) {}
|
||||
notis;
|
||||
|
||||
constructor(public app: PagesComponent) { }
|
||||
|
||||
ngOnInit() {
|
||||
this.notis = [
|
||||
{
|
||||
title: 'Notification 1',
|
||||
content: 'Noti content11111111111111111111111111111111111111111111',
|
||||
},
|
||||
{
|
||||
title: 'Notification 2',
|
||||
content: 'Noti content22222222222',
|
||||
},
|
||||
{
|
||||
title: 'Notification 3',
|
||||
content: 'content3',
|
||||
}
|
||||
];
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -66,7 +66,8 @@ import { ToolbarModule } from 'primeng/primeng';
|
|||
import { TooltipModule } from 'primeng/primeng';
|
||||
import { TreeModule } from 'primeng/primeng';
|
||||
import { TreeTableModule } from 'primeng/primeng';
|
||||
import {CardModule} from 'primeng/card';
|
||||
import { CardModule } from 'primeng/card';
|
||||
import {DataViewModule} from 'primeng/dataview';
|
||||
|
||||
|
||||
const PRIME_NG_MODULES: any[] = [
|
||||
|
|
@ -137,7 +138,8 @@ const PRIME_NG_MODULES: any[] = [
|
|||
TooltipModule,
|
||||
TreeModule,
|
||||
TreeTableModule,
|
||||
CardModule
|
||||
CardModule,
|
||||
DataViewModule,
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
|
|
@ -148,4 +150,4 @@ const PRIME_NG_MODULES: any[] = [
|
|||
PRIME_NG_MODULES
|
||||
],
|
||||
})
|
||||
export class PrimeNGModules {}
|
||||
export class PrimeNGModules { }
|
||||
|
|
|
|||
|
|
@ -10,8 +10,53 @@
|
|||
<button type="button" label="Add Sensor with Target2(temp)" icon="ui-icon-add" pButton (click)="onAddSensorWithTarget2()"></button>
|
||||
</div>
|
||||
|
||||
<div class="ui-g-12 ui-md-3">
|
||||
|
||||
<p-table [value]="sensors" selectionMode="single" (onRowSelect)="onRowSelect($event)" [resizableColumns]="true">
|
||||
<button pButton type="button" label="Search" class="ui-button-secondary" (click)="onSearch()"></button>
|
||||
|
||||
<div class="ui-inputgroup">
|
||||
<span class="md-inputfield">
|
||||
<input type="text" pInputText>
|
||||
<label>IP or Application name</label>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p-multiSelect [options]="targetOptions" [(ngModel)]="selectedTargets"></p-multiSelect>
|
||||
<!-- <p-multiSelect [options]="targetOptions" (onChange)="onTargetFilterSelect($event)"></p-multiSelect> -->
|
||||
</div>
|
||||
|
||||
|
||||
<div class="ui-g-12 ui-md-4">
|
||||
<p-checkbox name="cg" value="Active" label="Active" [(ngModel)]="checkboxValues"></p-checkbox>
|
||||
</div>
|
||||
<div class="ui-g-12 ui-md-4">
|
||||
<p-checkbox name="cg" value="Inactive" label="Inactive" [(ngModel)]="checkboxValues"></p-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ui-g-12 ui-md-9">
|
||||
|
||||
<div class="card card-w-title">
|
||||
<p-dataList [value]="targetSensor" [paginator]="true" styleClass="cars-datalist" [rows]="10">
|
||||
<!-- <p-header>
|
||||
List of Cars
|
||||
</p-header> -->
|
||||
<ng-template let-item pTemplate="item">
|
||||
<div style="border-bottom: 1px solid #bdbdbd" class="clearfix car-item">
|
||||
<div width="48" style="display:inline-block;margin:24px;vertical-align:middle">{{item.target.id}} - {{item.target.displayName}}</div>
|
||||
<div class="car-details" style="display:inline-block;vertical-align:middle">
|
||||
<div *ngFor="let sensor of item.sensors">
|
||||
<a href="javascript:void(0)" (click)="onSensorClick(sensor)">{{sensor.crawler.name}} | {{sensor.itemCount}} items | {{sensor.status.name}}</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <button type="button" pButton icon="ui-icon-search" style="margin:24px 24px 0 0;float:right"></button> -->
|
||||
</div>
|
||||
</ng-template>
|
||||
</p-dataList>
|
||||
</div>
|
||||
|
||||
<!-- <p-table [value]="sensors" selectionMode="single" (onRowSelect)="onRowSelect($event)" [resizableColumns]="true">
|
||||
<ng-template pTemplate="header">
|
||||
<tr>
|
||||
<th>No.</th>
|
||||
|
|
@ -32,4 +77,5 @@
|
|||
<td>{{sensor.createDate | date: 'dd.MM.yyyy'}}</td>
|
||||
</tr>
|
||||
</ng-template>
|
||||
</p-table>
|
||||
</p-table> -->
|
||||
</div>
|
||||
|
|
@ -15,6 +15,7 @@ import { AuthSelector } from 'packages/member/store';
|
|||
import { Page, PageParams } from 'app/commons/model';
|
||||
import { Target } from 'packages/target/model';
|
||||
import { SettingComponent } from '../setting/setting.component';
|
||||
import { SelectItem } from 'primeng/primeng';
|
||||
|
||||
@Component({
|
||||
selector: 'of-sensor-list',
|
||||
|
|
@ -24,13 +25,19 @@ import { SettingComponent } from '../setting/setting.component';
|
|||
export class ListComponent implements OnInit, AfterContentInit {
|
||||
|
||||
sensorList$ = this.store.pipe(select(sensorListSelector.select('page')));
|
||||
PAGE_SIZE = '10';
|
||||
PAGE_SIZE = '99999';
|
||||
totalLength = 0;
|
||||
sensorSettingDisplay = false;
|
||||
|
||||
sensors: Sensor[];
|
||||
target: Target = null;
|
||||
|
||||
targetSensor;
|
||||
|
||||
// filter
|
||||
targetOptions: SelectItem[];
|
||||
selectedTargets: string[] = [];
|
||||
|
||||
constructor(private router: Router,
|
||||
private store: Store<ListStore.State>,
|
||||
) { }
|
||||
|
|
@ -40,7 +47,7 @@ export class ListComponent implements OnInit, AfterContentInit {
|
|||
(page: Page) => {
|
||||
if (page != null) {
|
||||
this.sensors = page.content;
|
||||
this.totalLength = page.totalElements;
|
||||
this.generateSensorMap();
|
||||
}
|
||||
},
|
||||
(error: RPCClientError) => {
|
||||
|
|
@ -71,8 +78,48 @@ export class ListComponent implements OnInit, AfterContentInit {
|
|||
);
|
||||
}
|
||||
|
||||
onRowSelect(event) {
|
||||
this.router.navigate(['sensor', event.data.id, 'info']);
|
||||
generateSensorMap() {
|
||||
const tempList = [];
|
||||
for (const sensor of this.sensors) {
|
||||
const targetNode = this.existTarget(sensor, tempList);
|
||||
if (targetNode === null) {
|
||||
const sensorsNode = [];
|
||||
sensorsNode.push(sensor);
|
||||
const node = {
|
||||
target: sensor.target,
|
||||
sensors: sensorsNode,
|
||||
};
|
||||
|
||||
tempList.push(node);
|
||||
} else {
|
||||
targetNode.sensors.push(sensor);
|
||||
}
|
||||
}
|
||||
this.totalLength = tempList.length;
|
||||
this.targetSensor = tempList;
|
||||
|
||||
this.generateTargetFilter();
|
||||
}
|
||||
|
||||
generateTargetFilter() {
|
||||
if (this.targetOptions) {
|
||||
return;
|
||||
}
|
||||
const tempList = [];
|
||||
for (const data of this.targetSensor) {
|
||||
tempList.push({ label: data.target.displayName, value: data.target.id });
|
||||
}
|
||||
this.targetOptions = tempList;
|
||||
}
|
||||
|
||||
existTarget(sensor: Sensor, tempList) {
|
||||
let targetNode = null;
|
||||
for (const node of tempList) {
|
||||
if (node.target.id === sensor.target.id) {
|
||||
targetNode = node;
|
||||
}
|
||||
}
|
||||
return targetNode;
|
||||
}
|
||||
|
||||
onAddSensor() {
|
||||
|
|
@ -80,6 +127,21 @@ export class ListComponent implements OnInit, AfterContentInit {
|
|||
this.sensorSettingDisplay = true;
|
||||
}
|
||||
|
||||
onSensorSettingClose() {
|
||||
this.sensorSettingDisplay = false;
|
||||
}
|
||||
onSensorClick(sensor) {
|
||||
this.router.navigate(['sensor', sensor.id, 'info']);
|
||||
}
|
||||
|
||||
onSearch() {
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// Test
|
||||
onAddSensorWithTarget() {
|
||||
this.target = {
|
||||
id: 1,
|
||||
|
|
@ -99,8 +161,5 @@ export class ListComponent implements OnInit, AfterContentInit {
|
|||
};
|
||||
this.sensorSettingDisplay = true;
|
||||
}
|
||||
onSensorSettingClose() {
|
||||
this.sensorSettingDisplay = false;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
<h1>Targets</h1>
|
||||
|
||||
<p-table [value]="infras" selectionMode="single" (onRowSelect)="onRowSelect($event)" [resizableColumns]="true">
|
||||
<ng-template pTemplate="header">
|
||||
<tr>
|
||||
|
|
@ -20,7 +21,7 @@
|
|||
<td>??</td>
|
||||
<td>{{infra.createDate | date: 'dd.MM.yyyy'}}</td>
|
||||
<td>
|
||||
<button type="button" label="Add Sensor" icon="ui-icon-add" pButton (click)="onAddSensor(infra.target)"></button>
|
||||
<button type="button" label="AddSensor" icon="ui-icon-add" pButton (click)="onAddSensor(infra.target)"></button>
|
||||
</td>
|
||||
</tr>
|
||||
</ng-template>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user