This commit is contained in:
snoop 2018-04-26 21:33:41 +09:00
commit affef764f5
6 changed files with 81 additions and 58 deletions

View File

@ -61,20 +61,8 @@
<p-contextMenu #cmService [model]="contextMenuService"></p-contextMenu>
<p-contextMenu #cmSensor [model]="contextMenuSensor"></p-contextMenu>
<p-sidebar [(visible)]="visibleSidebar" position="bottom" [baseZIndex]="10000" *ngIf="selectedNode" styleClass="ui-sidebar-md">
<div *ngIf="selectedNode.type === 'probe'">
<of-probe-summary [probe]="targetNodeForView" [visible]="visibleSidebar"></of-probe-summary>
</div>
<div *ngIf="selectedNode.type === 'host'">
<of-host-summary [host]="targetNodeForView" [visible]="visibleSidebar"></of-host-summary>
</div>
<div *ngIf="selectedNode.type === 'service'">
<of-service-summary [service]="targetNodeForView" [visible]="visibleSidebar"></of-service-summary>
</div>
</p-sidebar>
<p-dialog [modal]="true" [width]="800" [(visible)]="sensorSettingDisplay" [showHeader]="true" [closeOnEscape]="false">
<of-sensor-setting [visible]="sensorSettingDisplay" [preTarget]="targetNodeForView" (close)="onSensorSettingClose()"></of-sensor-setting>
<of-sensor-setting [visible]="sensorSettingDisplay" [preTarget]="target" (close)="onSensorSettingClose()"></of-sensor-setting>
</p-dialog>

View File

@ -69,6 +69,7 @@ export class MapComponent implements OnInit, AfterContentInit {
targetNodeForView: Object = null;
sensorSettingDisplay = false;
target: Target = null;
constructor(private router: Router,
private listStore: Store<ListStore.State>,
@ -98,10 +99,8 @@ export class MapComponent implements OnInit, AfterContentInit {
ngOnInit() {
this.infras$.subscribe(
(page: Page) => {
console.log(page);
if (page !== null) {
this.totalList = page.content;
console.log(this.totalList);
this.infraTree = this.generateInfraHostData();
}
},
@ -113,7 +112,6 @@ export class MapComponent implements OnInit, AfterContentInit {
(page: Page) => {
if (page !== null) {
const sensorList = page.content;
console.log(sensorList);
this.addTreeForSensor(sensorList);
}
},
@ -263,9 +261,8 @@ export class MapComponent implements OnInit, AfterContentInit {
};
probeMap.forEach((ifhl: InfraHost[], key: number) => {
const tp = {
label: 'Probe - ' + key,
label: ifhl[0].probe.displayName,
type: 'probe',
expandedIcon: 'fa-folder-open',
collapsedIcon: 'fa-folder',
@ -280,7 +277,7 @@ export class MapComponent implements OnInit, AfterContentInit {
ifhl.map((ih: InfraHost, idx: number) => {
const th = {
label: 'Host - ' + ih.ip,
label: 'Host - ' + ih.ipv4,
type: 'host',
expandedIcon: 'fa-folder-open',
collapsedIcon: 'fa-folder',
@ -291,9 +288,9 @@ export class MapComponent implements OnInit, AfterContentInit {
this.targetTreeMap.set(ih.target.id, th);
if (hostMap.has(ih.ip)) {
if (hostMap.has(ih.ipv4)) {
const ifsl = hostMap.get(ih.ip);
const ifsl = hostMap.get(ih.ipv4);
@ -333,7 +330,7 @@ export class MapComponent implements OnInit, AfterContentInit {
const infraType = infra.infraType.name;
if (infraType === 'HOST') {
const infraHost: InfraHost = infra;
if (filterStr && String(infraHost.ip).indexOf(filterStr) < 0) {
if (filterStr && String(infraHost.ipv4).indexOf(filterStr) < 0) {
continue;
}
@ -351,11 +348,11 @@ export class MapComponent implements OnInit, AfterContentInit {
continue;
}
if (hostMap.has(infraService.host.ip) === false) {
hostMap.set(infraService.host.ip, []);
if (hostMap.has(infraService.host.ipv4) === false) {
hostMap.set(infraService.host.ipv4, []);
}
const isl = hostMap.get(infraService.host.ip);
const isl = hostMap.get(infraService.host.ipv4);
isl.push(infraService);
}
@ -391,7 +388,7 @@ export class MapComponent implements OnInit, AfterContentInit {
getExistHost(infraHost: InfraHost): HostData {
let node = null;
for (const data of this.hostDataList) {
if (data.host.ip === infraHost.ip) {
if (data.host.ipv4 === infraHost.ipv4) {
node = data;
}
}
@ -432,18 +429,18 @@ export class MapComponent implements OnInit, AfterContentInit {
this.selectedNode = event.node;
if (nodeType === 'probe') {
this.router.navigate(['probe', event.node.obj.id, 'info']);
} else if (nodeType === 'host') {
} else if (nodeType === 'host' || nodeType === 'service') {
this.router.navigate(['sensors'], { queryParams: { target: event.node.obj.target.id } });
} else if (nodeType === 'sensor') {
this.router.navigate(['sensor', event.node.obj.id, 'info']);
}
}
viewInfo() {
const nodeType = this.selectedNode.type;
if (nodeType !== 'probe' && nodeType !== 'host' && nodeType !== 'service') {
return;
}
this.targetNodeForView = this.selectedNode['obj'];
this.visibleSidebar = true;
const temp = {
node : this.selectedNode,
};
this.onNodeSelect(temp);
}
nodeMenu(event: MouseEvent, node: any) {
@ -489,10 +486,12 @@ export class MapComponent implements OnInit, AfterContentInit {
}
addSensorWithTarget() {
this.target = this.selectedNode['obj'].target;
this.sensorSettingDisplay = true;
}
onSensorSettingClose() {
this.target = null;
this.sensorSettingDisplay = false;
}
}

View File

@ -1,3 +1,13 @@
<div *ngIf="probe">
<b>probe host detail</b>
<div *ngIf="probe && probeHost">
<!-- Probe 정보 -->
<of-key-value [key]="'Probe Key'" [value]="probeHost.probe.probeKey"></of-key-value>
<of-key-value [key]="'Display Name'" [value]="probeHost.probe.displayName"></of-key-value>
<of-key-value [key]="'Authorized at'" [value]="probeHost.probe.authorizeDate"></of-key-value>
<of-key-value [key]="'Authorized by'" [value]="probeHost.probe.authorizeMember.name"></of-key-value>
<!-- ProbeHost 정보 -->
<of-key-value [key]="'OS'" [value]="probeHost.host.os.vendor.name"></of-key-value>
<of-key-value [key]="'IPv4'" [value]="probeHost.host.ipv4"></of-key-value>
<of-key-value [key]="'IPv6'" [value]="probeHost.host.ipv6"></of-key-value>
<of-key-value [key]="'Mac Address'" [value]="probeHost.mac"></of-key-value>
</div>

View File

@ -13,7 +13,7 @@ import { Probe, ProbeHost } from 'packages/probe/model';
})
export class ProbeSummaryComponent implements OnInit, AfterContentInit, OnChanges {
@Input() probe: Probe;
@Input() probe: Object;
@Input() visible: boolean;
probeHost$ = this.detailStore.pipe(select(ProbeHostSelector.select('probeHost')));
@ -27,7 +27,8 @@ export class ProbeSummaryComponent implements OnInit, AfterContentInit, OnChange
this.probeHost$.subscribe(
(probeHost: ProbeHost) => {
if (probeHost) {
this.probe = probeHost;
console.log(probeHost);
this.probeHost = probeHost;
}
},
(error: RPCClientError) => {
@ -37,6 +38,9 @@ export class ProbeSummaryComponent implements OnInit, AfterContentInit, OnChange
}
ngAfterContentInit() {
console.log('$$$$$$$$$$');
console.log(this.probe);
console.log('$$$$$$$$$$');
this.detailStore.dispatch(
new DetailStore.ReadByProbe(this.probe)
);

View File

@ -1,36 +1,35 @@
<form [formGroup]="modifyForm" (ngSubmit)="modifyProfile()">
<div class="ui-g">
<div class="ui-g-12 ui-md-3">
<div>
<p-card>
<div class="ui-g">
<img class="profile-image ui-img-profile-responsive" src="assets/layout/images/dark-user-bg.png" />
</div>
</p-card>
<div class="ui-g-12 ui-md-4 ui-img-profile">
<div class="ui-img-profile-box">
<div class="ui-g">
<img class="profile-image " src="assets/layout/images/dark-user-bg.png" />
</div>
<button type="button" class="ui-button-photo-add" pButton icon="ui-icon-account-box" (click)="onAddSensorWithTarget(item.target)"></button>
</div>
</div>
<div class="ui-g-12 ui-md-9">
<div class="ui-g-12 ui-md-8">
<div class="ui-g form-group">
<div class="ui-g-12 ui-md-6">
<div class="ui-g-12">
<span class="md-inputfield">
<input type="text" pInputText readonly value="{{member.email}}">
<label>Email</label>
</span>
</div>
<div class="ui-g-12 ui-md-6">
<div class="ui-g-12">
<span class="md-inputfield">
<input type="text" pInputText value="{{member.name}}" >
<label>Name</label>
</span>
</div>
<div class="ui-g-12 ui-md-6">
<div class="ui-g-12">
<span class="md-inputfield">
<input type="text" pInputText value="{{member.companyName}}" >
<label>Company Name</label>
</span>
</div>
<div class="ui-g-12 ui-md-6">
<div class="ui-g-12">
<span class="md-inputfield">
<input type="text" pInputText value="{{member.phone}}" >
<label>Phone</label>
@ -46,5 +45,3 @@
</div>
</div>
</form>

View File

@ -112,11 +112,29 @@
color: #8BC34A !important;
}
}
.ui-img-profile{
min-width: 250px !important;
@media (max-width: 640px) {
text-align: center;
}
}
.ui-img-profile-box {
width: 244px !important;
padding: 12px;
box-sizing: border-box;
display: block;
background-color: #ffffff;
border: 1px solid #bdbdbd;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
margin: auto;
img.ui-img-profile-responsive {
width : 100%;
height: auto;
img {
object-fit: cover;
width:220px;
height:220px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
@ -130,6 +148,7 @@ img.ui-img-profile-responsive {
}
}
.ui-sensors-datalist {
.ui-sensors{
.ui-sensor{
@ -232,3 +251,9 @@ img.ui-img-profile-responsive {
}
}
}
.ui-button-photo-add {
vertical-align: text-bottom;
float: right;
margin-top: -30px;
margin-right: -5px;
}