[#5565] bug fix.

- add context popup to server-map to transactionList and transactionView.
pinpoint-apm · May 8, 2019 · 313eb55 · 313eb55
1 parent b51e033
commit 313eb55
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 28 deletions.
diff --git a/...src/app/core/components/server-map/server-map-for-transaction-list-container.component.ts b/...src/app/core/components/server-map/server-map-for-transaction-list-container.component.ts
@@ -1,12 +1,12 @@
-import { Component, OnInit, OnDestroy, Inject, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';
+import { Component, OnInit, OnDestroy, Inject, ChangeDetectionStrategy, ChangeDetectorRef, ComponentFactoryResolver, Injector } from '@angular/core';
 import { Subject } from 'rxjs';
 import { takeUntil, filter } from 'rxjs/operators';
 
 import { UrlPathId } from 'app/shared/models';
-import { StoreHelperService, NewUrlStateNotificationService, WebAppSettingDataService , TransactionViewTypeService, VIEW_TYPE } from 'app/shared/services';
+import { StoreHelperService, NewUrlStateNotificationService, WebAppSettingDataService , TransactionViewTypeService, VIEW_TYPE, DynamicPopupService } from 'app/shared/services';
 import { ServerMapData } from './class/server-map-data.class';
 import { SERVER_MAP_TYPE, ServerMapType } from './class/server-map-factory';
-
+import { ServerMapContextPopupContainerComponent } from 'app/core/components/server-map-context-popup/server-map-context-popup-container.component';
 
 @Component({
     selector: 'pp-server-map-for-transaction-list-container',
@@ -25,9 +25,12 @@ export class ServerMapForTransactionListContainerComponent implements OnInit, On
     funcServerMapImagePath: Function;
     constructor(
         private changeDetectorRef: ChangeDetectorRef,
+        private injector: Injector,
+        private componentFactoryResolver: ComponentFactoryResolver,
         private newUrlStateNotificationService: NewUrlStateNotificationService,
         private storeHelperService: StoreHelperService,
         private webAppSettingDataService: WebAppSettingDataService,
+        private dynamicPopupService: DynamicPopupService,
         private transactionViewTypeService: TransactionViewTypeService,
         @Inject(SERVER_MAP_TYPE) public type: ServerMapType
     ) {
@@ -90,7 +93,16 @@ export class ServerMapForTransactionListContainerComponent implements OnInit, On
     onClickNode($event: any): void {}
     onClickLink($event: any): void {}
     onDoubleClickBackground($event: any): void {}
-    onContextClickBackground($event: any): void {}
+    onContextClickBackground(coord: ICoordinate): void {
+        this.dynamicPopupService.openPopup({
+            data: this.mapData,
+            coord,
+            component: ServerMapContextPopupContainerComponent
+        }, {
+            resolver: this.componentFactoryResolver,
+            injector: this.injector
+        });
+    }
     onContextClickNode($event: any): void {}
     onContextClickLink($param: any): void {}
 }
diff --git a/...c/app/core/components/server-map/server-map-for-transaction-view-container.component.html b/...c/app/core/components/server-map/server-map-for-transaction-view-container.component.html
@@ -1,18 +1,16 @@
-<ng-container *ngIf="(mapData$ | async) as mapData;">
-    <pp-server-map
-        [baseApplicationKey]="baseApplicationKey"
-        [mapData]="mapData"
-        [funcServerMapImagePath]="funcServerMapImagePath"
-        [type]="type"
-        (outClickBackground)="onClickBackground($event)"
-        (outDoubleClickBackground)="onDoubleClickBackground($event)"
-        (outContextClickBackground)="onContextClickBackground($event)"
-        (outClickGroupNode)="onClickGroupNode($event)"
-        (outClickNode)="onClickNode($event)"
-        (outClickLink)="onClickLink($event)"
-        (outContextClickNode)="onContextClickNode($event)"
-        (outContextClickLink)="onContextClickLink($event)"
-        (outRenderCompleted)="onRenderCompleted($event)">
-    </pp-server-map>
-</ng-container>
+<pp-server-map
+    [baseApplicationKey]="baseApplicationKey"
+    [mapData]="mapData"
+    [funcServerMapImagePath]="funcServerMapImagePath"
+    [type]="type"
+    (outClickBackground)="onClickBackground($event)"
+    (outDoubleClickBackground)="onDoubleClickBackground($event)"
+    (outContextClickBackground)="onContextClickBackground($event)"
+    (outClickGroupNode)="onClickGroupNode($event)"
+    (outClickNode)="onClickNode($event)"
+    (outClickLink)="onClickLink($event)"
+    (outContextClickNode)="onContextClickNode($event)"
+    (outContextClickLink)="onContextClickLink($event)"
+    (outRenderCompleted)="onRenderCompleted($event)">
+</pp-server-map>
 <pp-loading [showLoading]="showLoading"></pp-loading>
diff --git a/...src/app/core/components/server-map/server-map-for-transaction-view-container.component.ts b/...src/app/core/components/server-map/server-map-for-transaction-view-container.component.ts
@@ -1,11 +1,12 @@
-import { Component, OnInit, Inject, ChangeDetectionStrategy } from '@angular/core';
-import { Subject, Observable } from 'rxjs';
+import { Component, OnInit, Inject, ChangeDetectionStrategy, ChangeDetectorRef, Injector, ComponentFactoryResolver } from '@angular/core';
+import { Subject } from 'rxjs';
 import { map, takeUntil, skip } from 'rxjs/operators';
 
-import { WebAppSettingDataService, GutterEventService, StoreHelperService } from 'app/shared/services';
+import { WebAppSettingDataService, GutterEventService, StoreHelperService, DynamicPopupService } from 'app/shared/services';
 import { ServerMapInteractionService } from './server-map-interaction.service';
 import { ServerMapData } from './class/server-map-data.class';
 import { SERVER_MAP_TYPE, ServerMapType } from './class/server-map-factory';
+import { ServerMapContextPopupContainerComponent } from 'app/core/components/server-map-context-popup/server-map-context-popup-container.component';
 
 @Component({
     selector: 'pp-server-map-for-transaction-view-container',
@@ -16,11 +17,15 @@ import { SERVER_MAP_TYPE, ServerMapType } from './class/server-map-factory';
 export class ServerMapForTransactionViewContainerComponent implements OnInit {
     private unsubscribe: Subject<void> = new Subject<void>();
     baseApplicationKey: string;
-    mapData$: Observable<ServerMapData>;
+    mapData: ServerMapData;
     funcServerMapImagePath: Function;
     showLoading = true;
     constructor(
+        private changeDetectorRef: ChangeDetectorRef,
+        private injector: Injector,
+        private componentFactoryResolver: ComponentFactoryResolver,
         private webAppSettingDataService: WebAppSettingDataService,
+        private dynamicPopupService: DynamicPopupService,
         private gutterEventService: GutterEventService,
         private serverMapInteractionService: ServerMapInteractionService,
         private storeHelperService: StoreHelperService,
@@ -30,7 +35,7 @@ export class ServerMapForTransactionViewContainerComponent implements OnInit {
     ngOnInit() {
         this.funcServerMapImagePath = this.webAppSettingDataService.getServerMapIconPathMakeFunc();
         // TODO: ServiceType Empty이슈 체크 #174
-        this.mapData$ = this.storeHelperService.getTransactionDetailData(this.unsubscribe).pipe(
+        this.storeHelperService.getTransactionDetailData(this.unsubscribe).pipe(
             skip(1),
             map(({ applicationId, applicationMapData: { nodeDataArray, linkDataArray } }: ITransactionDetailData) => {
                 this.baseApplicationKey = (nodeDataArray as INodeInfo[]).find(({ applicationName }: INodeInfo) => {
@@ -39,20 +44,34 @@ export class ServerMapForTransactionViewContainerComponent implements OnInit {
 
                 return new ServerMapData(nodeDataArray, linkDataArray);
             })
-        );
+        ).subscribe((mapData: ServerMapData) => {
+            console.log( 'mapData : ', mapData );
+            this.mapData = mapData;
+            this.changeDetectorRef.detectChanges();
+        });
         this.gutterEventService.onGutterResized$.pipe(
             takeUntil(this.unsubscribe)
         ).subscribe(() => this.serverMapInteractionService.setRefresh());
     }
     onRenderCompleted(msg: string): void {
         this.showLoading = false;
+        this.changeDetectorRef.detectChanges();
     }
     onClickBackground($event: any): void {}
     onClickGroupNode($event: any): void {}
     onClickNode($event: any): void {}
     onClickLink($event: any): void {}
     onDoubleClickBackground($event: any): void {}
-    onContextClickBackground($event: any): void {}
+    onContextClickBackground(coord: ICoordinate): void {
+        this.dynamicPopupService.openPopup({
+            data: this.mapData,
+            coord,
+            component: ServerMapContextPopupContainerComponent
+        }, {
+            resolver: this.componentFactoryResolver,
+            injector: this.injector
+        });
+    }
     onContextClickNode($event: any): void {}
     onContextClickLink($param: any): void {}
 }