Browse Source

editer:feat:多边形箭头填联动属性框;editer监听前解绑;生成快照隐藏选择器

haojianlong 4 years ago
parent
commit
873e26d242

+ 1 - 11
src/components/editClass/big-edit/items/SBaseArrowPolyEdit.ts

@@ -54,16 +54,6 @@ export class SBaseArrowPolyEdit extends SBaseLineEdit {
 		this.update();
 	} // Set isSingle
 
-	/** 多边形填充色 */
-	private _polyFillColor: SColor = SColor.White;
-	get polyFillColor(): SColor {
-		return this._polyFillColor;
-	} // Get polyFillColor
-	set polyFillColor(v: SColor) {
-		this._polyFillColor = v;
-		this.update();
-	} // Set polyFillColor
-
 	/**
 		 * 构造函数
 		 *
@@ -136,7 +126,7 @@ export class SBaseArrowPolyEdit extends SBaseLineEdit {
 			painter.translate(this.line[0].x, this.line[0].y);
 			painter.rotate((this._ang * 180) / Math.PI);
 			painter.pen.color = this.strokeColor;
-			painter.brush.color = this.polyFillColor;
+			painter.brush.color = this.fillColor;
 
 			if (this.selected && this.status == SItemStatus.Normal) {
 				painter.pen.lineWidth = 2 * lw;

+ 5 - 1
src/components/editClass/edit/items/SBaseLineEdit.ts

@@ -175,7 +175,10 @@ export class SBaseLineEdit extends SGraphEdit {
             if (data.style.default.strokeColor) {
                 this.strokeColor = new SColor(data.style.default.strokeColor)
             }
-
+            // 颜色
+            if (data.style.default.fillColor) {
+                this.fillColor = new SColor(data.style.default.fillColor)
+            }
             // 线宽
             if (data.style.default.lineWidth) {
                 this.lineWidth = data.style.default.lineWidth
@@ -531,6 +534,7 @@ export class SBaseLineEdit extends SGraphEdit {
         this.data.style.default.lineWidth = this.lineWidth;
         this.data.style.default.lineStyle = this.lineStyle;
         this.data.style.default.strokeColor = this.strokeColor.value;
+        this.data.style.default.fillColor = this.fillColor.value;
         return this.data
     } // Function toData()
 

+ 9 - 5
src/components/editClass/edit/items/SBaseRectEdit.ts

@@ -51,9 +51,13 @@ export class SBaseRectEdit extends SGraphEdit {
     } // Set status
 
     /** 宽度 */
-    width: number = 0;
+    get width(): number {
+        return this._rightBottom.x - this._leftTop.x;
+    }
     /** 高度 */
-    height: number = 0;
+    get height(): number {
+        return this._rightBottom.y - this._leftTop.y;
+    }
     /** 矩形两个对角 */
     private _line: SPoint[] = [];
     get line(): SPoint[] {
@@ -143,6 +147,7 @@ export class SBaseRectEdit extends SGraphEdit {
                     return new SPoint(i.x, i.y)
                 });
                 this.line = setPointList;
+                this.calRect()
             }
             // 颜色
             if (data.style.default.strokeColor) {
@@ -304,7 +309,7 @@ export class SBaseRectEdit extends SGraphEdit {
      */
     boundingRect(): SRect {
         if (this.line.length > 1) {
-            this.calRect();
+            // this.calRect();
             return new SRect(this._leftTop, this._rightBottom);
         }
 
@@ -351,7 +356,6 @@ export class SBaseRectEdit extends SGraphEdit {
             t.y = t.y + this.y;
             return t;
         });
-  
         this.x = 0;
         this.y = 0;
     } // Function moveToOrigin()
@@ -382,7 +386,7 @@ export class SBaseRectEdit extends SGraphEdit {
      */
     onDraw(painter: SPainter): void {
         if (this.line.length == 2) {
-            this.calRect();
+            // this.calRect();
             painter.pen.color = this.strokeColor;
             painter.brush.color = this.fillColor;
             painter.pen.lineWidth = this.lineWidth;

+ 37 - 29
src/components/editview/baseTopoEditer.vue

@@ -165,7 +165,11 @@ export default {
       // 下载图片
       bus.$off('saveTopoImg');
       bus.$on("saveTopoImg", () => {
-        this.view.saveImage(`${this.topoContent.name}.png`, "png");
+        // 隐藏选择器
+        this.scene.selectContainer.clear();
+        setTimeout(() => {
+          this.view.saveImage(`${this.topoContent.name}.png`, "png");
+        },80)
       });
       // 发布图片
       bus.$off('issueTopo');
@@ -226,35 +230,39 @@ export default {
     },
     // 生成快照
     generateSnap(uuid) {
-      // base64数据
-      const data = this.view.imageUrl('png');
-      // 根据base64生成file
-      const file = base64ToFile(data);
-      const reader = new FileReader();
-      const fileType = file.name.split(".");
-      const imgType = fileType[fileType.length - 1];
-      return new Promise((resolve, reject) => {
-        reader.onloadend = function () {
-          // 这个事件在读取结束后,无论成功或者失败都会触发
-          if (reader.error) {
-            console.log('reader error', reader.error);
-            reject(reader.error)
-          } else {
-            // 构造 XMLHttpRequest 对象,发送文件 Binary 数据
-            const xhr = new XMLHttpRequest();
-            xhr.open("POST", `/image-service/common/image_upload?systemId=dataPlatform&secret=9e0891a7a8c8e885&overwrite=true&key=${uuid}.${imgType}`);
-            xhr.send(reader.result);
-            xhr.onreadystatechange = function () {
-              if (xhr.readyState == 4) {
-                if (xhr.status == 200) {
-                  resolve(xhr)
+      // 隐藏选择器
+      this.scene.selectContainer.clear();
+      setTimeout(() => {
+        // base64数据
+        const data = this.view.imageUrl('png');
+        // 根据base64生成file
+        const file = base64ToFile(data);
+        const reader = new FileReader();
+        const fileType = file.name.split(".");
+        const imgType = fileType[fileType.length - 1];
+        return new Promise((resolve, reject) => {
+          reader.onloadend = function () {
+            // 这个事件在读取结束后,无论成功或者失败都会触发
+            if (reader.error) {
+              console.log('reader error', reader.error);
+              reject(reader.error)
+            } else {
+              // 构造 XMLHttpRequest 对象,发送文件 Binary 数据
+              const xhr = new XMLHttpRequest();
+              xhr.open("POST", `/image-service/common/image_upload?systemId=dataPlatform&secret=9e0891a7a8c8e885&overwrite=true&key=${uuid}.${imgType}`);
+              xhr.send(reader.result);
+              xhr.onreadystatechange = function () {
+                if (xhr.readyState == 4) {
+                  if (xhr.status == 200) {
+                    resolve(xhr)
+                  }
                 }
-              }
-            };
-          }
-        };
-        reader.readAsArrayBuffer(file);
-      })
+              };
+            }
+          };
+          reader.readAsArrayBuffer(file);
+        })
+      },80)
     },
     // 保存草稿
     saveDraft(uuid) {

+ 2 - 1
src/components/editview/rightPropertyBar/property.vue

@@ -28,7 +28,8 @@
         itemType == 'BaseRect' ||
         itemType == 'BaseTriangle' ||
         itemType == 'BaseCircle' ||
-        itemType == 'BasePolygon'
+        itemType == 'BasePolygon' || 
+        itemType == 'BaseArrowPolygon'
       "
     ></BaseGraphy>
     <BaseImagePro