Merge branch 'develop' of http://39.106.8.246:3003/web/persagy_topo_editer into develop

package.json

@@ -19,6 +19,7 @@
     "@persagy-web/big": "2.2.19",
     "@persagy-web/draw": "2.2.8",
     "@persagy-web/graph": "2.2.23",
+    "@types/uuid": "^8.0.0",
     "ant-design-vue": "^1.6.5",
     "axios": "^0.20.0",
     "core-js": "^3.6.5",

src/components/editClass/big-edit/SBaseEditScene.ts

@@ -409,7 +409,6 @@ export class SBaseEditScene extends SGraphEditScene {
      * @param event   鼠标事件参数
      */
     onMouseUp(event: SMouseEvent): boolean {
-        console.log('-----baseEditScene');
         if (this.grabItem) {
             // 鼠标抬起时，如果grabItem为框选则删除框选item
             if (this.grabItem instanceof SRectSelectItem) {
@@ -420,16 +419,10 @@ export class SBaseEditScene extends SGraphEditScene {
                 if (this.view) {
                     this.view.update()
                 }
-                console.log(1);
-
                 return true;
             }
-            console.log(2);
-
             return this.grabItem.onMouseUp(event);
         }
-        console.log(3);
-
         return super.onMouseUp(event)
     } // Function onMouseUp()
 

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;

src/components/editClass/edit/items/SBaseCircleEdit.ts

@@ -141,7 +141,6 @@ export class SBaseCircleEdit extends SGraphEdit {
         });
         this.line = setPointList;
         this.calRect()
-        console.log('this.line', this.line)
       }
     }
 

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()
 

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;

src/components/editview/baseTopoEditer.vue

@@ -25,7 +25,8 @@ import {
 // import { SFloorParser } from "@persagy-web/big/lib";
 import topoTooltip from "./topoTooltip.vue";
 import { mapState, mapMutations } from "vuex";
-import base64ToFile from "@/utils/base64ToFile";
+import base64ToFile from "@/utils/base64ToFile"
+import { v1 as uuidv1 } from "uuid";
 import bus from "@/bus/bus";
 import {
   saveGroup,
@@ -34,6 +35,7 @@ import {
   getImageGroup,
   readPubGroup,
 } from "@/api/editer";
+import { publishGraph } from "@/api/home"
 export default {
   components: { topoTooltip },
   data() {
@@ -116,93 +118,68 @@ export default {
     //初始化bus绑定事件
     initBusEvent() {
       // 改变样式
+      bus.$off('updateStyle');
       bus.$on("updateStyle", (type, val) => {
         this.scene.updateStyle(type, val);
       });
       // 撤销
+      bus.$off('topoUndo');
       bus.$on("topoUndo", (val) => {
         this.scene.undo();
       });
       // 重做
+      bus.$off('topoRedo');
       bus.$on("topoRedo", (val) => {
         this.scene.redo();
       });
       // 删除
+      bus.$off('deleteItem');
       bus.$on("deleteItem", (val) => {
         this.scene.deleteItem();
       });
       // 复制
+      bus.$off('copy');
       bus.$on("copy", (val) => {
         this.scene.copy();
       });
       // 粘贴
+      bus.$off('paste');
       bus.$on("paste", (val) => {
         this.scene.paste();
       });
       // 保存
+      bus.$off('saveTopo');
       bus.$on("saveTopo", (val) => {
-        const elements = this.scene.save();
-        const obj = {
-          elements,
-          name: this.topoContent.name, // 名称
-          categoryId: this.categoryId, // 图分类ID
-          projectId: this.projectId, // 项目ID
-          label: this.topoContent.label,
-          buildingId: "1", // 建筑ID
-          floorId: "1", // 楼层id
-          note: "1", // 图说明
-          log: {
-            // 图操作日志
-            mark: "1", // 图的存盘标记
-            commandList: [
-              {
-                command: "1", // 命令
-                desc: "1", // 描述
-                detail: "1", // 详情
-              },
-            ],
-          },
-        };
-        Object.assign(obj, {
-          graphId: this.graphId,
-          id: this.id,
-        });
-        saveGroup(obj).then((res) => {
-          // 如果是从已发布跳转过来
-          if (this.isPub == 1) {
-            // 设置发布状态为 未发布
-            this.SETISPUB(0);
-            const gid = res.entityList[0].graphId;
-            const id = res.entityList[0].id;
-            // 重设图id 与 id
-            this.SETPROJECT({ graphId: gid, id: id });
-            // 修改url参数
-            this.$router.push({
-              name: "Editer",
-              query: {
-                graphId: gid,
-                id: id,
-                categoryName: encodeURI(this.categoryName),
-                isPub: 0,
-              },
-            });
-          }
-          this.$message.success(`保存成功${res.entityList[0].version}`);
-        });
+        this.saveTopoDraft()
       });
       // 设置实例置顶置底
+      bus.$off('setOrder');
       bus.$on("setOrder", (val) => {
         this.scene.setOrder(val);
       });
       // 设置实例status状态
+      bus.$off('setItemStatus');
       bus.$on("setItemStatus", (val) => {
         this.scene.setItemStatus();
       });
       // 下载图片
+      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');
+      bus.$on("issueTopo", () => {
+        this.saveTopoDraft().then(() => {
+          this.issueDraft()
+        })
       });
       // 手动添加设备实例
+      bus.$off('addEquipment');
       bus.$on("addEquipment", (val) => {
         this.addEquipmentList(val);
       });
@@ -244,6 +221,111 @@ export default {
       });
       this.view.fitSceneToView();
     },
+    // 保存草稿
+    saveTopoDraft(){
+      const uuid = uuidv1();
+      return Promise.all([this.generateSnap(uuid), this.saveDraft(uuid)]).then(vals => {
+        this.$message.success(`保存成功${vals[1].version}`);
+      })
+    },
+    // 生成快照
+    generateSnap(uuid) {
+      // 隐藏选择器
+      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);
+        })
+      },80)
+    },
+    // 保存草稿
+    saveDraft(uuid) {
+      const elements = this.scene.save();
+      const obj = {
+        elements,
+        name: this.topoContent.name, // 名称
+        categoryId: this.categoryId, // 图分类ID
+        projectId: this.projectId, // 项目ID
+        label: this.topoContent.label,
+        buildingId: "1", // 建筑ID
+        floorId: "1", // 楼层id
+        note: "1", // 图说明
+        pic: `${uuid}.png`,
+        graphId: this.graphId,
+        id: this.id,
+        log: {
+          // 图操作日志
+          mark: "1", // 图的存盘标记
+          commandList: [
+            {
+              command: "1", // 命令
+              desc: "1", // 描述
+              detail: "1", // 详情
+            },
+          ],
+        },
+      };
+      return new Promise((resolve, reject) => {
+        saveGroup(obj).then((res) => {
+          // 如果是从已发布跳转过来
+          if (this.isPub == 1) {
+            // 设置发布状态为 未发布
+            this.SETISPUB(0);
+            const gid = res.entityList[0].graphId;
+            const id = res.entityList[0].id;
+            // 重设图id 与 id
+            this.SETPROJECT({ graphId: gid, id: id });
+            // 修改url参数
+            this.$router.push({
+              name: "Editer",
+              query: {
+                graphId: gid,
+                id: id,
+                categoryName: encodeURI(this.categoryName),
+                isPub: 0,
+              },
+            });
+          }
+          resolve(res.entityList[0])
+        });
+      })
+    },
+    // 发布草稿
+    issueDraft(){
+      const pa = {
+        graphId: this.graphId,
+        id: this.id
+      }
+      publishGraph(pa).then(res => {
+        this.$message.success('发布成功');
+      })
+    },
     // 手动添加设备
     addEquipmentList(list) {
       const parse = new PTopoParser();
@@ -279,8 +361,6 @@ export default {
         this.view.fitSceneToView();
       });
     },
-    // 生成快照
-    generateSnap() {},
   },
   watch: {
     editCmd(val) {

src/components/editview/rightPropertyBar/property.vue

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

src/views/editer.vue

@@ -28,7 +28,10 @@ export default {
     saveTopo() {
       bus.$emit("saveTopo");
     },
-    issueTopo() {},
+    // 发布
+    issueTopo() {
+      bus.$emit("issueTopo");
+    },
     // 下载图片
     saveTopoImg(){
       bus.$emit("saveTopoImg")