[임대현] #114 unknown group node/link의 상세정보에 보여주는 차트를 histogram에서 load로 변경

git-svn-id: http://svn.bds.nhncorp.com/pe/hippo-web/trunk@3721 84d0f5b1-2673-498c-a247-62c4ff18d310

src/main/webapp/scripts/controllers/main.js

@@ -149,8 +149,8 @@ pinpointApp.controller('MainCtrl', [ 'filterConfig', '$scope', '$timeout', '$rou
             var oSidebarTitleVo = new SidebarTitleVo;
             if (link.targetRawData) {
                 oSidebarTitleVo
-                    .setImageType('UNKNOWN_GROUP')
-                    .setTitle('Link Group');
+                    .setImageType(link.sourceInfo.serviceType)
+                    .setTitle('Unknown Group from ' + link.sourceInfo.applicationName);
             } else {
                 oSidebarTitleVo
                     .setImageType(link.sourceInfo.serviceType)

src/main/webapp/styles/linkInfoDetails.css

@@ -1,11 +1,14 @@
 .linkInfoDetails {
-    line-height: 25px;
-    margin-bottom: 5px;
-    /*font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;*/
-    font-size: 12px;
     padding: 5px 15px 30px;
 }
 .linkInfoDetails .infoBarChart svg g.nv-group rect,
 .linkInfoDetails .infoBarChart svg g.nv-group text {
     cursor: pointer;
+}
+.linkInfoDetails .panel {
+    border: 1px solid #BDC3C7;
+}
+.linkInfoDetails .panel-default>.panel-heading {
+    background-color: #E5F0FC;
+    border-bottom: 1px solid #BDC3C7;
 }

src/main/webapp/styles/nodeInfoDetails.css

@@ -11,4 +11,11 @@
     margin-bottom: 5px;
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     font-size: 14px;
+}
+.nodeInfoDetails .panel {
+    border: 1px solid #BDC3C7;
+}
+.nodeInfoDetails .panel-default>.panel-heading {
+    background-color: #E5F0FC;
+    border-bottom: 1px solid #BDC3C7;
 }

src/main/webapp/views/linkInfoDetails.html

@@ -3,13 +3,12 @@
     <div ng-if="linkCategory == 'UnknownLinkInfoBox'">
 
         <div class="panel panel-default" ng-repeat="target in targetInfo | orderBy:'count':true">
-            <div class="panel-heading" style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"
-                 title="{{sourceInfo.applicationName}} → {{target.applicationName}}" data-placement="bottom" data-toggle="tooltip" >
-                <img ng-src="/images/icons/{{sourceInfo.serviceType | icons}}.png" style="height:14px;" />
-                {{sourceInfo.applicationName}}
+            <div class="panel-heading">
+                <!--<img ng-src="/images/icons/{{sourceInfo.serviceType | icons}}.png" style="height:14px;" />-->
+                <!--{{sourceInfo.applicationName}}-->
                 <span class="glyphicon glyphicon-arrow-right"></span>
-                <img ng-src="/images/icons/UNKNOWN.png" style="height:14px;" />
-                {{target.applicationName}}
+                <!--<img ng-src="/images/icons/UNKNOWN.png" style="height:14px;" />-->
+                {{target.applicationName}}  <span class="badge">{{target.count}}</span>
             </div>
             <div ng-init="showLinkResponseSummary=false" class="panel-body summaryCharts_{{target.applicationName | applicationNameToClassName}}" style="position: relative; padding:0">
                 <div class="response-summary" ng-show="showLinkResponseSummary">

src/main/webapp/views/nodeInfoDetails.html

@@ -4,7 +4,7 @@
 
         <div class="panel panel-default" ng-repeat="node in unknownGroup | orderBy:'count':true">
             <div class="panel-heading">
-                {{node.applicationName}}
+                {{node.applicationName}} <span class="badge">{{node.count}}</span>
             </div>
 
             <div ng-init="showNodeResponseSummary=false" class="panel-body summaryCharts_{{node.applicationName | applicationNameToClassName}}" style="position: relative; padding:0">