Merge branch 'master' of https://git.loafle.net/overflow/member_webapp

src/packages/infra/component/map/map.component.html

@@ -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>
 
 

src/packages/infra/component/map/map.component.ts

@@ -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;
   }
 }

src/packages/infra/component/probe-summary/probe-summary.component.html

@@ -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>

src/packages/infra/component/probe-summary/probe-summary.component.ts

@@ -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)
     );

src/packages/member/component/profile/profile.component.html

@@ -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>
@@ -45,6 +44,4 @@
       </button>
     </div>
   </div>
-</form>
-
-
+</form>  

src/styles.scss

@@ -112,12 +112,30 @@
         color: #8BC34A !important;
     }
 }
-
-img.ui-img-profile-responsive {
+.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;
     
-    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{
@@ -231,4 +250,10 @@ img.ui-img-profile-responsive {
             }
         }
     }
+}
+.ui-button-photo-add {
+    vertical-align: text-bottom;
+    float: right;
+    margin-top: -30px;
+    margin-right: -5px;
 }