fix（删除无用代码+ 加兜底+ 小数点保留+ 取值）

src/views/business-analysis/analysis/components/biz.vue

@@ -127,7 +127,6 @@
         
         <div v-if='flag==true' style='position:relative;'>
           <div v-if='num == 1' class='tree_box'>
-            <Topo :graphData='graphData' topoId='container' v-on:changeState="clickRowHandleNode" ref='topo'/>
           </div>
           <div v-if="num ==2">
             <el-table   
@@ -426,7 +425,6 @@
         
         <div v-if='flag==true' style='position:relative;'>
           <div v-if='num == 1' class='tree_box'>
-            <Topo :graphData='graphData' topoId='container1' v-on:changeState="clickRowHandleNode"/>
           </div>
           <div v-if="num ==2">
             <el-table   
@@ -660,76 +658,7 @@
             </ul>
           </el-collapse-item>
           <el-collapse-item title="Resource" name="tow">
-            <!-- <ul class='ul_box' v-if='detailData.resource_attributes !=null'>
-              <li>
-                <div class="ul_label">container.id</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['container.id']}}""</div>
-              </li>
-              <li>
-                <div class="ul_label">host.arch</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['host.arch']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">host.name</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['host.name']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">os.description</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['os.description']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">os.type</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['os.type']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">pod.ip</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['pod.ip']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">process.command_line</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['process.command_line']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">process.executable.path</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['process.executable.path']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">process.pid</div>
-                <div class="ul_value" style='color:#0000ff'>{{detailData.resource_attributes['process.pid']}}</div>
-              </li>
-              <li>
-                <div class="ul_label">process.runtime.description</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['process.runtime.description']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">process.runtime.name</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['process.runtime.name']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">process.runtime.version</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['process.runtime.version']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">service.name</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['service.name']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">telemetry.auto.version</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['telemetry.auto.version']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">telemetry.sdk.language</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['telemetry.sdk.language']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">telemetry.sdk.name</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['telemetry.sdk.name']}}"</div>
-              </li>
-              <li>
-                <div class="ul_label">telemetry.sdk.version</div>
-                <div class="ul_value" style='color:#008080'>"{{detailData.resource_attributes['telemetry.sdk.version']}}"</div>
-              </li>
-            </ul> -->
+           
             <ul class='ul_box' v-if='detailData.resource_attributes !=null'>
               <li v-for='(value,key) in detailData.resource_attributes' :key='key'> 
                 <div class="ul_label">{{key}}</div>
@@ -772,11 +701,7 @@
 <script>
 import { traceList, traceGraph } from '@/api/trace'
 import { listBiz,listBizStats,listBizGraph} from '@/api/mapping'
-// import Topo from './TopoNew1'
 export default {
-  components:{
-    // Topo,
-  },
   data(){
     return {
       Visible:false,

src/views/business-analysis/analysisDetail/components/Topo.vue

@@ -82,18 +82,21 @@ export default {
       this.isFull = screenfull.isFullscreen // 更新全屏状态
     },
     initGraph(data, id) {
-      // function replaceIds(obj) {
-      //   if (typeof obj === 'object' && obj!== null) {
-      //     if (obj.hasOwnProperty('id') && obj.hasOwnProperty('unique_id')) {
-      //       obj.id = obj.unique_id;
-      //     }
-      //     if (obj.hasOwnProperty('children')) {
-      //       obj.children && obj.children.forEach(child => replaceIds(child));
-      //     }
-      //   }
-      //   return obj
-      // }
-      // data = replaceIds(data)
+      function replaceIds(obj) {
+        if (typeof obj === 'object' && obj!== null) {
+          if (obj.hasOwnProperty('id') && obj.hasOwnProperty('unique_id') ) {
+            let temp = ''
+            temp = obj.id
+            obj.id = obj.unique_id
+            obj.unique_id = temp
+          }
+          if (obj.hasOwnProperty('children')) {
+            obj.children && obj.children.forEach(child => replaceIds(child));
+          }
+        }
+        return obj
+      }
+      data = replaceIds(data)
       let graph = null
       const container = document.getElementById(id)
       const width = container.scrollWidth
@@ -502,6 +505,7 @@ export default {
       if (typeof onInit === 'function') {
         onInit(graph)
       }
+      console.log('graph.node------99999-------', data)
       graph.data(data)
       graph.render()
       // 让画布内容适应视口
@@ -549,9 +553,6 @@ export default {
 
       function changeNodeColor() {
         const currentZoom = graph.getZoom()
-        // console.log('currentZoom----', currentZoom)
-        // console.log('briefZoomThreshold----', briefZoomThreshold)
-
         let toLevel = currentLevel
         if (currentZoom < briefZoomThreshold) { // 变色
           toLevel = 0

src/views/business-analysis/analysisDetail/index.vue

@@ -122,7 +122,7 @@
                   </div>
                   <div class="node-details-info-field">
                     <div class="node-details-info-field-label truncate w50" style="width:50%">成功率:</div>
-                    <div class="node-details-info-field-value truncate w50" style="width:50%">{{ ((detailData.rate)*100).toFixed(2)+'%' }}</div>
+                    <div class="node-details-info-field-value truncate w50" style="width:50%">{{ ((detailData.rate || 0)*100).toFixed(2)+'%' }}</div>
                   </div>
                 </div>
               </div>
@@ -135,19 +135,19 @@
                 </div>
                 <div class="node-details-info-field">
                   <div class="node-details-info-field-label truncate w50" style="width:50%">错误率:</div>
-                  <div class="node-details-info-field-value truncate w50" style="width:50%">{{ nodeStats.error_rate }}</div>
+                  <div class="node-details-info-field-value truncate w50" style="width:50%">{{ (nodeStats.error_rate || 0 ).toFixed(4) + '%'  }}</div>
                 </div>
                 <div class="node-details-info-field">
                   <div class="node-details-info-field-label truncate w50" style="width:50%">P50:</div>
-                  <div class="node-details-info-field-value truncate w50" style="width:50%">{{ (nodeStats.p50).toFixed(2) +'ms' }}</div>
+                  <div class="node-details-info-field-value truncate w50" style="width:50%">{{ (nodeStats.p50 || 0 ).toFixed(2) +'ms' }}</div>
                 </div>
                 <div class="node-details-info-field">
                   <div class="node-details-info-field-label truncate w50" style="width:50%">P90:</div>
-                  <div class="node-details-info-field-value truncate w50" style="width:50%">{{ (nodeStats.p90).toFixed(2) +'ms' }}</div>
+                  <div class="node-details-info-field-value truncate w50" style="width:50%">{{ (nodeStats.p90 || 0).toFixed(2) +'ms' }}</div>
                 </div>
                 <div class="node-details-info-field">
                   <div class="node-details-info-field-label truncate w50" style="width:50%">P99:</div>
-                  <div class="node-details-info-field-value truncate w50" style="width:50%">{{ nodeStats.p99.toFixed(2) +'ms' }}</div>
+                  <div class="node-details-info-field-value truncate w50" style="width:50%">{{ (nodeStats.p99 || 0).toFixed(2) +'ms' }}</div>
                 </div>
                 <div>
                   <div class="node-details-info-field" style="cursor: pointer;" @click="gotoPath(&quot;/service/InterfaceDetail/index&quot;,nodeStats)">
@@ -401,10 +401,10 @@ export default {
     clickRowHandleNode(item) {
       this.detailData = {}
       this.detailData = item
-      this.queryStats.id = Number(item.id)
-      this.queryName.id = Number(item.id)
+      this.queryStats.id = Number(item.unique_id)
+      this.queryName.id = Number(item.unique_id)
       this.queryName.name = item.name
-      this.querySpans.id = Number(item.id)
+      this.querySpans.id = Number(item.unique_id)
 
       if (item.span_type == 'http server') {
         this.getNodeStats()

src/views/ot-plugins/index.vue

@@ -315,53 +315,7 @@ export default {
           }
         }
       })
-    },
-    /** 提交按钮 */
-    // changeState: function (obj) {
-    //   var stateName = obj.pluginsState == "1" ? "安装" : "卸载";
-    //   this.$confirm(
-    //     "确定" + stateName + "？",
-    //     obj.pluginsState == 1 ? "提示" : "警告",
-    //     {
-    //       confirmButtonText: "确定",
-    //       cancelButtonText: "取消",
-    //       type: obj.pluginsState == "1" ? "" : "warning",
-    //       customClass: "message-delete",
-    //       closeOnClickModal: "false",
-    //     }
-    //   )
-    //     .then(function () {
-    //       return statePlug(obj, obj.ID);
-    //     })
-    //     .then((response) => {
-    //       if (response.code == 200) {
-    //         this.getList();
-    //         // if (obj.pluginsState == "1") {
-    //         //   this.isShowProgress = true;
-    //         //   this.startAnimate(1, 100, 20);
-    //         // } else {
-    //         //   this.msgSuccess(stateName + "成功");
-    //         // }
-    //         this.isShowProgress = true;
-    //         this.startAnimate(1, 100, 24);
-    //         setTimeout(() => {
-    //           this.msgSuccess(stateName + "成功");
-    //         }, 2500);
-    //         setTimeout(() => {
-    //           window.location.reload();
-    //         }, 3000);
-    //       }
-    //     })
-    //     .catch(function () {});
-    //   // statePlug(obj, obj.ID).then((res) => {
-    //   //   if (response.code === 200) {
-    //   //     this.msgSuccess("修改成功");
-    //   //     this.getList();
-    //   //   } else {
-    //   //     this.msgError(response.msg);
-    //   //   }
-    //   // });
-    // },
+    }
   },
 };
 </script>

src/views/service/InterfaceDetail/components/ServiceDrawer.vue

@@ -485,10 +485,10 @@ export default {
       if (item) {
         this.detailData = {}
         this.detailData = item
-        this.queryStats.id = Number(item.id)
-        this.queryName.id = Number(item.id)
+        this.queryStats.id = Number(item.unique_id)
+        this.queryName.id = Number(item.unique_id)
         this.queryName.name = item.name
-        this.spanId = Number(item.id)
+        this.spanId = Number(item.unique_id)
         this.spanType = item.span_type
       }
     },