选中的连线绘制优化

adm_comp/src/lib/DiagramEditor.ts

@@ -105,34 +105,12 @@ export class DiagramEditor extends Editor {
 		//绘制连线
 		if(this.diagram.lines) {
 			this.diagram.lines.forEach(line => {
-				if(line.locationPath) {
-					this.ctx.strokeStyle = "#000000";
-					this.ctx.setLineDash([]);
-					this.ctx.lineWidth = 1;
-					if(this.getSelComp() == line) {
-						this.ctx.strokeStyle = "#5783FA";
-						this.ctx.lineWidth = 2;
-					}else if(line.flag == 'duplicate') {
-						if(this.showContainer) {
-							this.ctx.setLineDash([3, 2]);
-							this.ctx.strokeStyle = "#ffaa7f";	
-						}else{
-							return;
-						}
-					}
-						
-					this.ctx.beginPath();
-					var iter = 0;
-					for(var p of line.locationPath){
-						p = this.util.toCanvas(p);
-						if(iter == 0)
-							this.ctx.moveTo(p.x, p.y);
-						else
-							this.ctx.lineTo(p.x, p.y);	
-						iter++;
-					}
-					this.ctx.stroke();
-				}
+				if(this.getSelComp() != line)
+					this.drawLine(line);
+			});
+			this.diagram.lines.forEach(line => {
+				if(this.getSelComp() == line)
+					this.drawLine(line);
 			});
 		}
 	}
@@ -207,6 +185,37 @@ export class DiagramEditor extends Editor {
 		}
 	}
 			
+	private drawLine(line: Line): void {
+		if(line.locationPath) {
+			this.ctx.strokeStyle = "#000000";
+			this.ctx.setLineDash([]);
+			this.ctx.lineWidth = 1;
+			if(this.getSelComp() == line) {
+				this.ctx.strokeStyle = "#5783FA";
+				this.ctx.lineWidth = 2;
+			}else if(line.flag == 'duplicate') {
+				if(this.showContainer) {
+					this.ctx.setLineDash([3, 2]);
+					this.ctx.strokeStyle = "#ffaa7f";	
+				}else{
+					return;
+				}
+			}
+				
+			this.ctx.beginPath();
+			var iter = 0;
+			for(var p of line.locationPath){
+				p = this.util.toCanvas(p);
+				if(iter == 0)
+					this.ctx.moveTo(p.x, p.y);
+				else
+					this.ctx.lineTo(p.x, p.y);	
+				iter++;
+			}
+			this.ctx.stroke();
+		}
+	}
+			
 	// private redrawOnScroll(_this) {	
 	// 	const top = _this.container.scrollTop;
 	// 	const left = _this.container.scrollLeft;