overflow_cloud/member_webapp
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

noti badge bug fix & map context menu is adding

Browse Source
This commit is contained in:
insanity 2018-04-25 20:23:30 +09:00
parent aeb949161e
commit c43d270846
8 changed files with 160 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/commons/component/layout/notification/app.notification.component.html
View File

@ -1,8 +1,8 @@
<div class="ui-g-12 ui-bottom-border-1">
No tifications
Notifications
</div>
<li role="menuitem" *ngFor="let noti of notifications; let i = index" class="ui-bottom-border-1 ui-app-noti">
<a *ngIf="i < 5" href="javascript:void(0)" class="topbar-message" (click)="onNotiClick(noti)" [ngStyle]="noti.confirmDate ? '' : {'background-color': 'lightblue'}">
<li role="menuitem" *ngFor="let noti of notifications | slice:0:5; let i = index" class="ui-bottom-border-1 ui-app-noti">
<a href="javascript:void(0)" class="topbar-message" (click)="onNotiClick(noti)" [ngStyle]="noti.confirmDate ? '' : {'background-color': 'lightblue'}">
<div class="ui-app-noti-title">{{noti.title}}</div>
<div class="ui-app-noti-content">{{noti.message}}</div>
<div class="ui-app-noti-date">{{noti.createDate | date: 'short'}}</div>

5
src/packages/infra/component/host-summary/host-summary.component.html Normal file
View File

@ -0,0 +1,5 @@
<div *ngIf="host">
<b>{{ host.ip }}</b>
<b>{{ host.mac }}</b>
<b>{{ host.os.vendor.name }}</b>
</div>

30
src/packages/infra/component/host-summary/host-summary.component.ts Normal file
View File

@ -0,0 +1,30 @@
import { Component, OnInit, AfterContentInit, Input, OnChanges } from '@angular/core';
import { InfraHost } from '../../model';
@Component({
selector: 'of-host-summary',
templateUrl: './host-summary.component.html',
})
export class HostSummaryComponent implements OnInit, AfterContentInit, OnChanges {
@Input() host: InfraHost;
@Input() visible: boolean;
constructor(
) { }
ngOnInit() {
}
ngAfterContentInit() {
}
ngOnChanges() {
if (!this.visible) {
this.host = null;
}
}
}

6
src/packages/infra/component/index.ts
View File

@ -1,7 +1,11 @@
import { MapComponent } from './map/map.component';
import { ProbeSummaryComponent } from './probe-summary/probe-summary.component';
import { HostSummaryComponent } from './host-summary/host-summary.component';
import { ServiceSummaryComponent } from './service-summary/service-summary.component';
export const COMPONENTS = [
MapComponent,
ProbeSummaryComponent
ProbeSummaryComponent,
HostSummaryComponent,
ServiceSummaryComponent
];

28
src/packages/infra/component/map/map.component.html
View File

@ -25,42 +25,54 @@
</div>
</div>
<div class="ui-g-12 ui-g-nopad">
<p-tree [value]="infraTree" selectionMode="single" [(selection)]="selectedTree" (onNodeSelect)="onNodeSelect($event)">
<p-tree [value]="infraTree" selectionMode="single" [(selection)]="selectedTree" (onNodeSelect)="onNodeSelect($event)" [contextMenu]="cm">
<ng-template let-node pTemplate="default">
<div>{{node.label}}</div>
</ng-template>
<ng-template let-node pTemplate="infra">
<div>{{node.label}}</div>
<div (contextmenu)="nodeMenu($event, node)">{{node.label}}</div>
</ng-template>
<ng-template let-node pTemplate="probe">
<div>{{node.label}}</div>
<div (contextmenu)="nodeMenu($event, node)">{{node.label}}</div>
</ng-template>
<ng-template let-node pTemplate="host">
<div>{{node.label}}</div>
<div (contextmenu)="nodeMenu($event, node)">{{node.label}}</div>
</ng-template>
<ng-template let-node pTemplate="service">
<div>{{node.label}}</div>
<div (contextmenu)="nodeMenu($event, node)">{{node.label}}</div>
</ng-template>
<ng-template let-node pTemplate="sensor">
<div><i class="fa ui-icon-stop ui-status-icon ui-status-success"></i>{{node.label}}</div>
<div (contextmenu)="nodeMenu($event, node)">
<i class="fa ui-icon-stop ui-status-icon ui-status-success"></i>{{node.label}}</div>
</ng-template>
</p-tree>
</div>
</div>
<p-contextMenu #cmProbe [model]="contextMenuProbe"></p-contextMenu>
<p-contextMenu #cmHost [model]="contextMenuHost"></p-contextMenu>
<p-sidebar [(visible)]="visibleSidebar" position="bottom" [baseZIndex]="10000">
<!-- <p-sidebar [(visible)]="visibleSidebar" position="bottom" [baseZIndex]="10000">
<div *ngIf="selectedNodeType === 'probe'">
<of-probe-summary [probe]="selectedNode" [visible]="visibleSidebar"></of-probe-summary>
</div>
</p-sidebar>
<div *ngIf="selectedNodeType === 'host'">
<of-host-summary [host]="selectedNode" [visible]="visibleSidebar"></of-host-summary>
</div>
<div *ngIf="selectedNodeType === 'service'">
<of-service-summary [service]="selectedNode" [visible]="visibleSidebar"></of-service-summary>
</div>
</p-sidebar> -->

73
src/packages/infra/component/map/map.component.ts
View File

@ -6,7 +6,7 @@ import {
ViewChild
} from '@angular/core';
import { Router } from '@angular/router';
import { TreeNode } from 'primeng/primeng';
import { TreeNode, MenuItem, ContextMenu } from 'primeng/primeng';
import { Store, select } from '@ngrx/store';
import * as ListStore from '../../store/list';
import { ListSelector } from '../../store';
@ -53,9 +53,16 @@ export class MapComponent implements OnInit, AfterContentInit {
targetTreeMap: Map<number, TreeNode> = new Map();
DEFAULT_EXPANDED: Boolean = true;
visibleSidebar = false;
selectedNodeType: string;
selectedNode: Object = null;
// visibleSidebar = false;
// selectedNodeType: string;
// selectedNode: Object = null;
contextMenuProbe: MenuItem[];
contextMenuHost: MenuItem[];
@ViewChild('cmProbe') cmProbe: ContextMenu;
@ViewChild('cmHost') cmHost: ContextMenu;
constructor(private router: Router,
private listStore: Store<ListStore.State>,
@ -109,7 +116,20 @@ export class MapComponent implements OnInit, AfterContentInit {
);
}
ngOnInit() { }
ngOnInit() {
this.initContextMenu();
}
initContextMenu() {
this.contextMenuProbe = [
// { label: 'Delete file', icon: 'fa-delete', command: (event) => this.deleteFile(this.selectedMenuItem) }
{ label: 'ProbeMenu', icon: 'fa-check' }
];
this.contextMenuHost = [
{ label: 'HostMenu1', icon: 'fa-check' },
{ label: 'HostMenu2', icon: 'fa-check' },
];
}
searchObj(treeList: any[], target: Target, searchList: any[]) {
@ -377,15 +397,41 @@ export class MapComponent implements OnInit, AfterContentInit {
}
onNodeSelect(event) {
if (event.node.type !== 'probe') {
return;
const nodeType = event.node.type;
// this.selectedNodeType = nodeType;
if (nodeType === 'probe') {
this.router.navigate(['probe', event.node.obj, 'info']);
} else if (nodeType === 'host') {
}
this.selectedNodeType = event.node.type;
const probe = {
id : event.node.obj
};
this.selectedNode = probe;
this.visibleSidebar = true;
// const nodeType = event.node.type;
// if (nodeType !== 'probe' && nodeType !== 'host' && nodeType !== 'service') {
// return;
// }
// this.selectedNodeType = nodeType;
// if (nodeType === 'probe') {
// const probe = {
// id: event.node.obj
// };
// this.selectedNode = probe;
// } else {
// this.selectedNode = event.node.obj;
// }
// this.visibleSidebar = true;
}
public nodeMenu(event: MouseEvent, node: any) {
this.cmProbe.hide();
this.cmHost.hide();
if (node.type === 'probe') {
this.cmProbe.show(event);
}
if (node.type === 'host') {
this.cmHost.show(event);
}
return false;
}
}
@ -559,3 +605,4 @@ const testInfraList = [
]
}
];

5
src/packages/infra/component/service-summary/service-summary.component.html Normal file
View File

@ -0,0 +1,5 @@
<div *ngIf="service">
<b>{{ service.vendor.name }}</b>
<b>{{ service.port }}</b>
<b>{{ service.portType }}</b>
</div>

32
src/packages/infra/component/service-summary/service-summary.component.ts Normal file
View File

@ -0,0 +1,32 @@
import { Component, OnInit, AfterContentInit, Input, OnChanges } from '@angular/core';
import { InfraHost } from '../../model';
import { InfraService } from '../../service/infra.service';
@Component({
selector: 'of-service-summary',
templateUrl: './service-summary.component.html',
})
export class ServiceSummaryComponent implements OnInit, AfterContentInit, OnChanges {
@Input() service: InfraService;
@Input() visible: boolean;
constructor(
) { }
ngOnInit() {
}
ngAfterContentInit() {
console.log(this.service);
}
ngOnChanges() {
if (!this.visible) {
this.service = null;
}
}
}