update

src/main/webapp/app/modal/select-role/select-role.component.html

@@ -12,7 +12,7 @@
     <tr *ngFor="let data of basicTable.data">
       <td nzShowCheckbox (nzCheckedChange)="refreshStatus()"  [(nzChecked)]="data.checked"></td>
       <td>{{data.name}}</td>
-      <td>{{data.comments}}</td>
+      <td>{{data.comment}}</td>
     </tr>
     </tbody>
   </nz-table>

src/main/webapp/app/netTopology/model/line/line.component.ts

@@ -13,6 +13,7 @@ export class LineComponent implements OnInit {
 
     isLine = false;
     hostIds = [];
+    itemId = [];  //第一个进口流量，第二个出口流量
 
     inPageNum = 1;
     outPageNum = 1;
@@ -22,23 +23,31 @@ export class LineComponent implements OnInit {
     totalNum;
 
     inList;
-    inSelect = [];
+    inSelect;
     inSearchName;
 
     outList;
-    outSelect = [];
+    outSelect;
     outSearchName;
 
     constructor(private topologySer: TopologyService, private message: NzMessageService, private localStorage: LocalStorageService,) {
     }
 
     //in
-    incurrentPageDataChange($event: Array<{ key1: string; key2: number; key3: string; key4: string; checked: boolean }>): void {
+    incurrentPageDataChange($event: Array<{ kchecked: boolean }>): void {
         this.inList = $event;
     }
 
     inselectItem(item,e){
         if(e){
+            const arr = this.inList.map(data=>{
+                return data.itemId;
+            });
+            const old = this.inSelect;
+           if(old){
+               const index = arr.indexOf(old.itemId);
+               this.inList[index].checked = false;
+           }
             this.inSelect = item;
         }else{
             this.inSelect = null;
@@ -62,6 +71,14 @@ export class LineComponent implements OnInit {
 
     outselectItem(item,e){
         if(e){
+            const arr = this.outList.map(data=>{
+                return data.itemId;
+            });
+            const old = this.outSelect;
+            if(old){
+                const index = arr.indexOf(old.itemId);
+                this.outList[index].checked = false;
+            }
             this.outSelect = item;
         }else{
             this.outSelect = null;
@@ -81,11 +98,12 @@ export class LineComponent implements OnInit {
 
     }
 
-    showModal(hostIds) {
-        this.hostIds = hostIds.split(',');
+    showModal(linkObj) {
+        this.hostIds = linkObj.hostIds;  //线条上的主机id；
+        this.itemId = linkObj.itemId.split(',');   //线条上的监测点id；
         this.isLine = true;
-        this.getOutList();
         this.getInList();
+        this.getOutList();
     }
 
     //查询进口流量
@@ -101,6 +119,11 @@ export class LineComponent implements OnInit {
             (res)=>{
                 this.totalNum = res.data.totalNum;
                 this.inList = res.data.data;
+                this.inList.forEach(e=>{   //进口流量回显
+                    if(e.itemId = this.itemId[0]){
+                        e.checked = true;
+                    }
+                })
             }
         )
 
@@ -119,6 +142,11 @@ export class LineComponent implements OnInit {
             (res)=>{
                 this.totalNum = res.data.totalNum;
                 this.outList = res.data.data;
+                this.outList.forEach(e=>{
+                    if(e.itemId = this.itemId[1]){  //出口流量回显
+                        e.checked = true;
+                    }
+                })
             }
         )
 

src/main/webapp/app/netTopology/ne-topology/ne-topology.component.html

@@ -52,8 +52,8 @@
             <span aria-hidden="true" title="全屏查看"
                   onClick="editor.utils.showInFullScreen(editor.stage.canvas,'RequestFullScreen')">全屏查看</span>
             <span aria-hidden="true" title="居中显示" onClick="editor.utils.showInCenter()">居中显示</span>
-            <span aria-hidden="true" title="编辑" onClick="editor.utils.editTopology()">编辑</span>
-            <span aria-hidden="true" title="只读" onClick="editor.utils.normalTopology()">只读</span>
+            <span aria-hidden="true" title="编辑" (click)="changeEdit('编辑')">编辑</span>
+            <span aria-hidden="true" title="只读" (click)="changeEdit('只读')">只读</span>
             <span aria-hidden="true" title="保存" (click)="update()">保存</span>
             <span aria-hidden="true" title="清空" onClick="editor.utils.clearTopology()">清空</span>
             <span aria-hidden="true" title="放大" onClick="editor.utils.scalingBig()">放大</span>
@@ -73,6 +73,9 @@
                         <canvas class="topology-context" id="topology-canvas" #topologyCanvas  style="height: 580px;">
                             您的浏览器不支持HTML5!
                         </canvas>
+                        <div class="lineList">
+                            {{editType}}
+                        </div>
                         <div class="checkList">
                             <p *ngFor="let item of checkJson;let i = index;">
                                 <span [style.fontSize]="item.fontSize +'px'">{{item.name}}</span><i (click)="deleteCheck(i)" class="minus anticon anticon-minus-circle-o"></i>

src/main/webapp/app/netTopology/ne-topology/ne-topology.component.ts

@@ -93,6 +93,7 @@ export class NeTopologyComponent implements OnInit, DoCheck, AfterViewInit, OnDe
     refreshRete;
     options;
     lineType = "1";  //线条类型
+    editType = "只读";   //拓扑图状态
 
     checkJson = [];
     fileList: UploadFile[] = [];
@@ -131,8 +132,8 @@ export class NeTopologyComponent implements OnInit, DoCheck, AfterViewInit, OnDe
         const changesLine = this.customerDifferLink.diff(this.line);
         const changesNode = this.customerDifferNode.diff(this.node);
         if (changesLine && changesLine['_appendAfter'].currentValue == "true") {
-            const arr = localStorage.getItem('linkHostIds');
-           this.smartLine.showModal(arr);
+            const linkObj = localStorage.getItem('linkObj');
+           this.smartLine.showModal(JSON.parse(linkObj));
         }
         if (changesNode && changesNode['_appendAfter'].currentValue == "true") {
             this.smartNode.showModal();
@@ -174,6 +175,17 @@ export class NeTopologyComponent implements OnInit, DoCheck, AfterViewInit, OnDe
         }
     }
 
+    //
+    changeEdit(type){
+        if(type == '编辑'){
+            editor.utils.editTopology()
+        }
+        if(type == '只读'){
+            editor.utils.normalTopology()
+        }
+        this.editType = type;
+    }
+
     //一级分类
     getTypeList(){
         this.topologySer.findTreeWithWeb().subscribe(
@@ -324,6 +336,7 @@ export class NeTopologyComponent implements OnInit, DoCheck, AfterViewInit, OnDe
             }
         });
 
+        //告警状态
         if(hostIds.length > 0){
             const res = {
                 hostIds : hostIds
@@ -353,6 +366,7 @@ export class NeTopologyComponent implements OnInit, DoCheck, AfterViewInit, OnDe
             )
         }
 
+        //流量数据
         if(list.length > 0){   //有流量监控-->查询流量监控
             const data = {
                 "list" : list
@@ -363,7 +377,7 @@ export class NeTopologyComponent implements OnInit, DoCheck, AfterViewInit, OnDe
                     response.forEach(e1=>{
                         arr.forEach(e2=>{
                             if(e1.linkId == e2.id){
-                                e2.text = "进口流量："+e1.valueIn+e1.units+" 出口流量："+e1.valueOut+e1.units;
+                                e2.text = "进口流量："+e1.fullValueIn+" 出口流量："+e1.fullValueOut;
                             }
                         })
                     });

src/main/webapp/content/javascript/jtopo/js/jtopo-editor.js

@@ -84,6 +84,7 @@ TopologyPanel.prototype.loadTopology = function (response, topologyGuid, backImg
 TopologyPanel.prototype.loadTopologyByJson = function (topologyJson, backImg) {
     try {
         JTopo.replaceStageWithJson(topologyJson)
+        var timer = $interval(function(){},100,10);
         if (editor.stage && editor.scene && editor.scene.childs && editor.scene.childs.length > 0) {
             editor.stage.centerAndZoom()
             console.log(editor.utils.getAllNodes()[0]);
@@ -619,11 +620,14 @@ TopologyEditor.prototype.init = function (topologyGuid, backImg, topologyJson) {
         if (event.target instanceof JTopo.Node && editor.stageMode === 'edit') {
             localStorage.setItem("node",'true');
         } else if (event.target instanceof JTopo.Link && editor.stageMode === 'edit') {
-            var arr = [];
-            arr.push(event.target.nodeA.hostId);
-            arr.push(event.target.nodeZ.hostId);
+            const obj = {
+                hostIds:[],
+                itemId:event.target.itemId
+            }
+            obj.hostIds.push(event.target.nodeA.hostId);
+            obj.hostIds.push(event.target.nodeZ.hostId);
             localStorage.setItem("line",'true');
-            localStorage.setItem("linkHostIds",arr);
+            localStorage.setItem("linkObj",JSON.stringify(obj));
         }
     });
 
@@ -1146,8 +1150,14 @@ editor.utils = {
         };
         var self = this;
         var link = editor.scene.selectedElements;
-        link[0].text = "进口流量："+inItem.name+"   出口流量："+outItem.name;
-        link[0].itemId = (inItem.itemId) +"," +(outItem.itemId);
+        if(inItem){
+            link[0].text = "进口流量："+inItem.name;
+            link[0].itemId = (inItem.itemId)
+        }
+        if(outItem){
+            link[0].text += "   出口流量："+outItem.name;
+            link[0].itemId += "," +(outItem.itemId);
+        }
     },
     //设置节点属性
     setNode: function (item) {