ing
This commit is contained in:
parent
3c8e2a47c1
commit
a664e2cf0c
|
@ -40,15 +40,21 @@ export class AppComponent implements OnInit, AfterContentInit, AfterViewInit, On
|
|||
this.showTitleBar = false;
|
||||
this.block = false;
|
||||
|
||||
this.translateService.onLangChange.subscribe(() => {
|
||||
this.changeDetector.detectChanges();
|
||||
});
|
||||
this.translateService.onTranslationChange.subscribe(() => {
|
||||
this.changeDetector.detectChanges();
|
||||
});
|
||||
// this.translateService.onLangChange.subscribe(() => {
|
||||
// this.changeDetector.detectChanges();
|
||||
// });
|
||||
// this.translateService.onTranslationChange.subscribe(() => {
|
||||
// this.changeDetector.detectChanges();
|
||||
// });
|
||||
|
||||
this.translateService.setDefaultLang('en');
|
||||
this.translateService.use('en');
|
||||
|
||||
// const i18ns = ['en', 'ko'];
|
||||
// i18ns.forEach((lang) => {
|
||||
// this.translateService.use(lang);
|
||||
// });
|
||||
|
||||
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
[attr.targetId]="link.target.id">
|
||||
<line class="link" [attr.x1]="link.source.x" [attr.y1]="link.source.y" [attr.x2]="link.target.x" [attr.y2]="link.target.y"></line>
|
||||
<text *ngIf="link.target.group === 'service'" class="linkTextClass" [attr.x]="(link.source.x - link.target.x) / 2 + link.target.x"
|
||||
[attr.y]="(link.source.y - link.target.y) / 2 + link.target.y">{{link.target.target.port.portNumber}}</text>
|
||||
[attr.y]="(link.source.y - link.target.y) / 2 + link.target.y">{{link.target.infra.port.portNumber}}</text>
|
||||
</g>
|
||||
</g>
|
||||
<g *ngFor="let node of nodes">
|
||||
|
@ -16,7 +16,7 @@
|
|||
xlink:href="assets/image/node/icon/icon_overflow.svg"></image>
|
||||
</g>
|
||||
<g *ngIf="node.group === 'zone'">
|
||||
<text class="textClass" [attr.y]="(node.r - 10) / 10 + 'em'" text-anchor="middle">{{node.target.network}}</text>
|
||||
<text class="textClass" [attr.y]="(node.r - 10) / 10 + 'em'" text-anchor="middle">{{node.infra.network}}</text>
|
||||
</g>
|
||||
<g *ngIf="node.group !== 'zone'">
|
||||
<image [attr.x]="-node.r" [attr.y]="-node.r" [attr.width]="node.r * 2" [attr.height]="node.r * 2"
|
||||
|
@ -24,28 +24,28 @@
|
|||
</g>
|
||||
<g *ngIf="node.group === 'host'">
|
||||
<image [attr.x]="-node.r" [attr.y]="-node.r" [attr.width]="node.r * 2" [attr.height]="node.r * 2"
|
||||
attr.xlink:href="assets/image/node/icon/icon_{{node.target.hostType | lowercase}}.svg"></image>
|
||||
attr.xlink:href="assets/image/node/icon/icon_{{node.infra.hostType | lowercase}}.svg"></image>
|
||||
</g>
|
||||
<g *ngIf="node.group === 'host' && node.target.hostType === 'HOST' && node.target.osType !== 'UNKNOWN'">
|
||||
<g *ngIf="node.group === 'host' && node.infra.hostType === 'HOST' && node.infra.osType !== 'UNKNOWN'">
|
||||
<image [attr.x]="-node.r" [attr.y]="-node.r" [attr.width]="node.r * 2" [attr.height]="node.r * 2"
|
||||
attr.xlink:href="assets/image/node/logo/logo_{{node.target.osType | lowercase}}.svg"></image>
|
||||
attr.xlink:href="assets/image/node/logo/logo_{{node.infra.osType | lowercase}}.svg"></image>
|
||||
</g>
|
||||
<!-- <g *ngIf="node.group === 'host' && node.target.hostType !== 'HOST' && node.target.hostVendor !== ''">
|
||||
<text class="textClass" [attr.y]="(node.r - 30) / 10 + 'em'" text-anchor="middle">{{node.target.hostVendor}}</text>
|
||||
<!-- <g *ngIf="node.group === 'host' && node.infra.hostType !== 'HOST' && node.infra.hostVendor !== ''">
|
||||
<text class="textClass" [attr.y]="(node.r - 30) / 10 + 'em'" text-anchor="middle">{{node.infra.hostVendor}}</text>
|
||||
</g> -->
|
||||
<g *ngIf="node.group === 'host'">
|
||||
<text class="textClass" [attr.y]="(node.r - 10) / 10 + 'em'" text-anchor="middle">{{node.target.address}}</text>
|
||||
<text class="textClass" [attr.y]="(node.r - 10) / 10 + 'em'" text-anchor="middle">{{node.infra.address}}</text>
|
||||
</g>
|
||||
<g *ngIf="node.group === 'service'">
|
||||
<image [attr.x]="-node.r" [attr.y]="-node.r" [attr.width]="node.r * 2" [attr.height]="node.r * 2"
|
||||
attr.xlink:href="assets/image/node/icon/icon_{{node.target.serviceType | lowercase}}.svg"></image>
|
||||
attr.xlink:href="assets/image/node/icon/icon_{{node.infra.serviceType | lowercase}}.svg"></image>
|
||||
</g>
|
||||
<g *ngIf="node.group === 'service' && node.target.key !== 'UNKNOWN'">
|
||||
<g *ngIf="node.group === 'service' && node.infra.key !== 'UNKNOWN'">
|
||||
<image [attr.x]="-node.r" [attr.y]="-node.r" [attr.width]="node.r * 2" [attr.height]="node.r * 2"
|
||||
attr.xlink:href="assets/image/node/logo/logo_{{node.target.key | lowercase}}.svg"></image>
|
||||
attr.xlink:href="assets/image/node/logo/logo_{{node.infra.key | lowercase}}.svg"></image>
|
||||
</g>
|
||||
<g *ngIf="node.group === 'service'">
|
||||
<text class="textClass" [attr.y]="(node.r - 10) / 10 + 'em'" text-anchor="middle">{{node.target.name}}</text>
|
||||
<text class="textClass" [attr.y]="(node.r - 10) / 10 + 'em'" text-anchor="middle">{{node.infra.name}}</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
|
|
|
@ -19,8 +19,6 @@ import { Store, select } from '@ngrx/store';
|
|||
import * as d3 from 'd3';
|
||||
|
||||
import { Zone, Host, Service, Port } from '@overflow/model/discovery';
|
||||
import { Link } from '../../../core/model/link';
|
||||
import { Node } from '../../../core/model/node';
|
||||
|
||||
import * as AppStore from '../../../store';
|
||||
import * as DiscoveryConfigStore from '../../../store/discovery/config';
|
||||
|
@ -31,6 +29,78 @@ import { DiscoveryMessageType } from 'src/app/core/type';
|
|||
import { ConfirmationService } from 'primeng/primeng';
|
||||
import { MetaServiceTypeEnum, toMetaServiceTypeEnum } from '@overflow/model/meta/MetaServiceType';
|
||||
|
||||
export class Link implements d3.SimulationLinkDatum<Node> {
|
||||
source: Node;
|
||||
target: Node;
|
||||
|
||||
index?: number;
|
||||
|
||||
constructor(source: Node, target: Node) {
|
||||
target.addLink(this);
|
||||
|
||||
if ('zone' !== source.group) {
|
||||
source.addLink(this);
|
||||
}
|
||||
|
||||
this.source = source;
|
||||
this.target = target;
|
||||
}
|
||||
}
|
||||
|
||||
export class Node implements d3.SimulationNodeDatum {
|
||||
/**
|
||||
* Node’s zero-based index into nodes array. This property is set during the initialization process of a simulation.
|
||||
*/
|
||||
index?: number;
|
||||
/**
|
||||
* Node’s current x-position
|
||||
*/
|
||||
x?: number;
|
||||
/**
|
||||
* Node’s current y-position
|
||||
*/
|
||||
y?: number;
|
||||
/**
|
||||
* Node’s current x-velocity
|
||||
*/
|
||||
vx?: number;
|
||||
/**
|
||||
* Node’s current y-velocity
|
||||
*/
|
||||
vy?: number;
|
||||
/**
|
||||
* Node’s fixed x-position (if position was fixed)
|
||||
*/
|
||||
fx?: number | null;
|
||||
/**
|
||||
* Node’s fixed y-position (if position was fixed)
|
||||
*/
|
||||
fy?: number | null;
|
||||
|
||||
r?: number;
|
||||
|
||||
id: string;
|
||||
|
||||
group?: string;
|
||||
|
||||
infra?: Host | Port | Service | null;
|
||||
|
||||
image?: string;
|
||||
|
||||
links?: Link[];
|
||||
|
||||
constructor(id) {
|
||||
this.id = id;
|
||||
this.links = [];
|
||||
}
|
||||
|
||||
addLink(link: Link) {
|
||||
this.links.push(link);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
export class DisplaySummary {
|
||||
totalHosts: number;
|
||||
totalPorts: number;
|
||||
|
@ -781,7 +851,7 @@ export class MapComponent implements OnInit, AfterContentInit, OnDestroy {
|
|||
|
||||
this.store.dispatch(new InfraStore.ChangeSelectedInfra({
|
||||
group: node.group,
|
||||
infra: node.target,
|
||||
infra: node.infra,
|
||||
}));
|
||||
|
||||
this.selectedNode = node;
|
||||
|
@ -864,7 +934,7 @@ export class MapComponent implements OnInit, AfterContentInit, OnDestroy {
|
|||
this.zone = zone;
|
||||
this.zoneNode = new Node(this.getZoneId(zone));
|
||||
this.zoneNode.group = 'zone';
|
||||
this.zoneNode.target = zone;
|
||||
this.zoneNode.infra = zone;
|
||||
this.zoneNode.fx = this.displayInfraWidth / 2;
|
||||
this.zoneNode.fy = this.displayInfraHeight / 2;
|
||||
this.zoneNode.r = 60;
|
||||
|
@ -888,10 +958,10 @@ export class MapComponent implements OnInit, AfterContentInit, OnDestroy {
|
|||
|
||||
let { node } = this.getNode(hostId);
|
||||
if (null !== node) {
|
||||
node.target = host;
|
||||
node.infra = host;
|
||||
} else {
|
||||
node = new Node(hostId);
|
||||
node.target = host;
|
||||
node.infra = host;
|
||||
node.group = 'host';
|
||||
node.r = 40;
|
||||
node.x = this.zoneNode.x;
|
||||
|
@ -951,13 +1021,13 @@ export class MapComponent implements OnInit, AfterContentInit, OnDestroy {
|
|||
|
||||
if (MetaServiceTypeEnum.UNKNOWN === MetaServiceTypeEnum[service.serviceType]) {
|
||||
if (null !== unknownServiceNode) {
|
||||
unknownServiceNode.target = service;
|
||||
unknownServiceNode.infra = service;
|
||||
} else {
|
||||
newNode = true;
|
||||
}
|
||||
} else {
|
||||
if (null !== serviceNode) {
|
||||
serviceNode.target = service;
|
||||
serviceNode.infra = service;
|
||||
} else {
|
||||
if (null !== unknownServiceNode) {
|
||||
const { index: linkIdx } = this.getLink(hostNode, unknownServiceNode);
|
||||
|
@ -988,7 +1058,7 @@ export class MapComponent implements OnInit, AfterContentInit, OnDestroy {
|
|||
|
||||
if (newNode) {
|
||||
serviceNode = new Node(serviceId);
|
||||
serviceNode.target = service;
|
||||
serviceNode.infra = service;
|
||||
serviceNode.group = 'service';
|
||||
serviceNode.r = 30;
|
||||
serviceNode.x = hostNode.x;
|
||||
|
|
|
@ -1,3 +1 @@
|
|||
export * from './link';
|
||||
export * from './node';
|
||||
export * from './discover-request-info';
|
||||
|
|
|
@ -1,21 +0,0 @@
|
|||
import * as d3 from 'd3';
|
||||
|
||||
import { Node } from './node';
|
||||
|
||||
export class Link implements d3.SimulationLinkDatum<Node> {
|
||||
source: Node;
|
||||
target: Node;
|
||||
|
||||
index?: number;
|
||||
|
||||
constructor(source: Node, target: Node) {
|
||||
target.addLink(this);
|
||||
|
||||
if ('zone' !== source.group) {
|
||||
source.addLink(this);
|
||||
}
|
||||
|
||||
this.source = source;
|
||||
this.target = target;
|
||||
}
|
||||
}
|
|
@ -1,55 +0,0 @@
|
|||
import * as d3 from 'd3';
|
||||
import { Link } from './link';
|
||||
|
||||
export class Node implements d3.SimulationNodeDatum {
|
||||
/**
|
||||
* Node’s zero-based index into nodes array. This property is set during the initialization process of a simulation.
|
||||
*/
|
||||
index?: number;
|
||||
/**
|
||||
* Node’s current x-position
|
||||
*/
|
||||
x?: number;
|
||||
/**
|
||||
* Node’s current y-position
|
||||
*/
|
||||
y?: number;
|
||||
/**
|
||||
* Node’s current x-velocity
|
||||
*/
|
||||
vx?: number;
|
||||
/**
|
||||
* Node’s current y-velocity
|
||||
*/
|
||||
vy?: number;
|
||||
/**
|
||||
* Node’s fixed x-position (if position was fixed)
|
||||
*/
|
||||
fx?: number | null;
|
||||
/**
|
||||
* Node’s fixed y-position (if position was fixed)
|
||||
*/
|
||||
fy?: number | null;
|
||||
|
||||
r?: number;
|
||||
|
||||
id: string;
|
||||
|
||||
group?: string;
|
||||
|
||||
target?: any;
|
||||
|
||||
image?: string;
|
||||
|
||||
links?: Link[];
|
||||
|
||||
constructor(id) {
|
||||
this.id = id;
|
||||
this.links = [];
|
||||
}
|
||||
|
||||
addLink(link: Link) {
|
||||
this.links.push(link);
|
||||
}
|
||||
|
||||
}
|
Loading…
Reference in New Issue
Block a user