设备item修改

persagy-web-big-edit/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@persagy-web/big-edit",
-    "version": "2.2.43",
+    "version": "2.2.44",
     "description": "博锐尚格二维图形编辑器。",
     "main": "lib/index.js",
     "types": "lib/index.d.js",
@@ -40,7 +40,7 @@
         "typescript": "^3.5.3"
     },
     "dependencies": {
-        "@persagy-web/edit": "2.2.35",
+        "@persagy-web/edit": "2.2.36",
         "@types/uuid": "^8.0.0",
         "crypto-js": "^4.0.0",
         "axios": "^0.20.0"

persagy-web-big-edit/src/SBaseEditScene.ts

@@ -280,6 +280,7 @@ export class SBaseEditScene extends SGraphEditScene {
         if (anc) {
             anc.parent?.connect("changePos", item, item.changePos);
             item.anchor1Id = anc.id;
+            // @ts-ignore
             item.node1Id = anc.parent ? anc.parent.nodeId : "";
         }
 
@@ -524,6 +525,7 @@ export class SBaseEditScene extends SGraphEditScene {
                     }
 
                     this.grabItem.anchor2Id = anc.id;
+                    // @ts-ignore
                     this.grabItem.node2Id = anc.parent.nodeId;
                     this.grabItem.onMouseDown(event);
                     this.grabItem.status = SItemStatus.Normal;

persagy-web-big-edit/src/items/SBaseEquipment.ts

@@ -24,11 +24,11 @@
  * *********************************************************************************************************************
  */
 
-import { SGraphItem, SAnchorItem } from "@persagy-web/graph/lib";
+import { SAnchorItem, SGraphItem } from "@persagy-web/graph/lib";
 import { SBaseIconTextEdit, SBaseTextEdit } from "@persagy-web/edit";
 import { SColor } from "@persagy-web/draw/lib";
 import { v1 as uuidv1 } from "uuid";
-import { Legend, svgTobase64,ItemOrder } from "@persagy-web/big/lib";
+import { ItemOrder, Legend, svgTobase64 } from "@persagy-web/big/lib";
 
 /**
  * 编辑基础设备类
@@ -86,7 +86,7 @@ export class SBaseEquipment extends SBaseIconTextEdit {
     /**
      * 设置 legendData 时对 item 做设置
      */
-    initData() {
+    initData(): void {
         // this.legendData 不能为空
         if (!this.legendData) return;
 
@@ -166,7 +166,7 @@ export class SBaseEquipment extends SBaseIconTextEdit {
     /**
      * 根据 url 获取图片
      */
-    initUrl() {
+    initUrl(): void {
         // 获取图数据转换为 base64
         svgTobase64(this.url)
             .then(res => {
@@ -256,16 +256,17 @@ export class SBaseEquipment extends SBaseIconTextEdit {
         // this.legendData 必须存在
         if (this.legendData) {
             // 遍历锚点获取需要存储的数据格式
-            const list = this.anchorList.map(item => {
+            this.legendData.anchorList = this.anchorList.map(item => {
+                const temp = item.mapToScene(0, 0);
+                const anchorPos = this.img.mapFromScene(temp.x, temp.y);
                 return {
                     anchorId: item.id, // 数据类型中定义为 id,但是后台保存要的是字段anchorId
                     pos: {
-                        x: item.x,
-                        y: item.y
+                        x: anchorPos.x,
+                        y: anchorPos.y
                     }
                 };
             });
-            this.legendData.anchorList = list;
             // 反馈大小
             if (this.legendData.size) {
                 this.legendData.size.width = this.sWidth;
@@ -277,18 +278,21 @@ export class SBaseEquipment extends SBaseIconTextEdit {
                 };
             }
 
+            const poi = this.img.mapToScene(0, 0);
             // 位置
             this.legendData.pos = {
-                x: this.x,
-                y: this.y
+                x: poi.x,
+                y: poi.y
             };
 
             // 存储信息点
             const infoPoinList: any[] = [];
             // 获取信息点对应参数
             this.textItemList.forEach(item => {
+                const temp = item.mapToScene(0, 0);
+                const textPos = this.img.mapFromScene(temp.x, temp.y);
                 let obj = Object.assign(item.propertyData, {
-                    pos: { x: item.x, y: item.y },
+                    pos: { x: textPos.x, y: textPos.y },
                     font: item.font.size,
                     color: item.color.value,
                     backgroundColor: item.backgroundColor.value,
@@ -309,4 +313,21 @@ export class SBaseEquipment extends SBaseIconTextEdit {
             return this.legendData;
         }
     }
+
+    /**
+     * 计算并移动锚点的位置
+     */
+    changeAnchorPoint(): void {
+        if (this.anchorList.length) {
+            let anchorPoint = [
+                { x: this.img.x, y: this.img.y },
+                { x: this.img.x, y: this.img.y },
+                { x: this.img.x, y: this.img.y },
+                { x: this.img.x, y: this.img.y }
+            ];
+            this.anchorList.forEach((item, index) => {
+                item.moveTo(anchorPoint[index].x, anchorPoint[index].y);
+            });
+        }
+    }
 }

persagy-web-edit/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@persagy-web/edit",
-    "version": "2.2.35",
+    "version": "2.2.36",
     "description": "博锐尚格二维图形编辑器。",
     "main": "lib/index.js",
     "types": "lib/index.d.js",

persagy-web-edit/src/SGraphEditScene.ts

@@ -479,24 +479,25 @@ export class SGraphEditScene extends SGraphScene {
                     let scenePoint = item.img.mapFromScene(event.x, event.y);
                     // 点击点在图片区域内
                     if (item.img.contains(scenePoint.x, scenePoint.y)) {
-                        let anchor = item.anchorList[0];
-                        let anchorPoint = anchor.mapToScene(0, 0);
-                        let dis = SMathUtil.pointDistance(
-                            event.x,
-                            event.y,
-                            anchorPoint.x,
-                            anchorPoint.y
-                        );
-                        // 第一次进入循环
-                        if (len < 0) {
-                            minAnchor = anchor;
-                            len = dis;
-                        }
-                        // 得到距离最小的锚点
-                        if (dis < len) {
-                            minAnchor = anchor;
-                            len = dis;
-                        }
+                        item.anchorList.forEach(anchor => {
+                            let anchorPoint = anchor.mapToScene(0, 0);
+                            let dis = SMathUtil.pointDistance(
+                                event.x,
+                                event.y,
+                                anchorPoint.x,
+                                anchorPoint.y
+                            );
+                            // 第一次进入循环
+                            if (len < 0) {
+                                minAnchor = anchor;
+                                len = dis;
+                            }
+                            // 得到距离最小的锚点
+                            if (dis < len) {
+                                minAnchor = anchor;
+                                len = dis;
+                            }
+                        });
                     }
                 }
             }
@@ -555,7 +556,7 @@ export class SGraphEditScene extends SGraphScene {
     /**
      * 粘贴
      */
-    paste(): void { }
+    paste(): void {}
 
     /**
      *  选中状态方法
@@ -584,5 +585,5 @@ export class SGraphEditScene extends SGraphScene {
      * @param  item     SGraphEdit|null 返回 item
      *
      */
-    getItem(item: SGraphEdit | null, event: SMouseEvent[]): void { }
+    getItem(item: SGraphEdit | null, event: SMouseEvent[]): void {}
 }