debug

public/systemConf.js

@@ -39,7 +39,8 @@ var __systemConf = {
         { id: "Pj0002220008", name: "数字化交付08" },
         { id: "Pj0002220009", name: "数字化交付09" },
         { id: "Pj00022200010", name: "数字化交付10" },
-
+        // 资产管理
+        { id: "Pj3702020002", name: "青岛海天中心" }
 
 
     ] // 项目列表

src/components/editClass/persagy-edit/PTopoFactory.ts

@@ -28,6 +28,7 @@ import { Marker } from "@persagy-web/big"
 import { SBaseInfoPoint } from "./items/SBaseInfoPoint"
 import { SBasePipeUninTool } from "./items/SBasePipeUninTool"
 import { SBaseBtns } from "./items/SBaseBtns"
+import { SBaseEquation } from "./items/SBaseEquation"
 import { BigEditFactory } from "@persagy-web/big-edit"
 /**
  * item 创建工厂
@@ -78,4 +79,17 @@ export class PTopoFactory extends BigEditFactory {
         item.data = data;
         return item;
     }
+
+    /**
+     * 创建公式
+     *
+     * @param data  数据
+     * @return 线
+     */
+    createBaseEqation(data: Marker): SBaseEquation {
+        const item = new SBaseEquation(null, data);
+        item.data = data;
+        return item;
+    }
+
 }

src/components/editClass/persagy-edit/PTopoParser.ts

@@ -112,6 +112,9 @@ export class PTopoParser extends SParser {
                 case "baseBtn":
                     this.markers.push(this.factory.createBaseBaseBtn(data));
                     break;
+                case "Equation":
+                        this.markers.push(this.factory.createBaseEqation(data));
+                    break;
                 case "BaseArrowPolygon":
                     this.markers.push(this.factory.createBasePolygonArrowEdit(data));
             }

src/components/editClass/persagy-edit/PTopoScene.ts

@@ -490,7 +490,7 @@ export class PTopoScene extends SBaseEditScene {
      */
     save(isAll: boolean = true) {
         if (!this.view) return;
-        const Marktype: string[] = ['BasePolygon', 'BaseLine', 'BaseText', 'BaseExplain', 'BaseImage', 'BaseCircle', 'BaseArrow', 'BaseTriangle', 'BaseRect', 'BaseArrowPolygon', 'InfoPoint', 'BasePipeUninTool','baseBtn'];
+        const Marktype: string[] = ['BasePolygon', 'BaseLine', 'BaseText', 'BaseExplain', 'BaseImage', 'BaseCircle', 'BaseArrow', 'BaseTriangle', 'BaseRect', 'BaseArrowPolygon', 'InfoPoint', 'BasePipeUninTool','baseBtn',"Equation"];
         const NodeType: string[] = ['BaseEquipment'];
         const RelationType: string[] = ["BasePipe"];
         const markers: any = [];   /**图例节点 */  // 与工程信息无关的标识对象（增加文本注释，图上的图片说明）

src/components/editview/baseTopoEditer.vue

@@ -66,6 +66,8 @@ export default {
       autoSave: null, // 自动保存定时器
       isLock: false, //右键item是否锁定
       viewScale: 0, //视图缩放比例
+      changeScaleByClick: false, //区分滚轮，点击 事件改变的缩放比例
+      initScale: 1,
     };
   },
   computed: {
@@ -251,6 +253,17 @@ export default {
       bus.$on("changeBackgroundColor", (val) => {
         this.scene.changeBackgroundColor(val);
       });
+      // 比例缩放
+      bus.$off("scale");
+      bus.$on("scale", (newV, oldV) => {
+        this.changeScaleByClick = true;
+        this.view.scaleByPoint(
+          newV / oldV,
+          this.canvasWidth / 2,
+          this.canvasHeight / 2
+        );
+        this.changeScaleByClick = false;
+      });
     },
     // 读取拓扑图
     readtopoMsg() {
@@ -355,6 +368,9 @@ export default {
       });
       // 读取完成后默认走保存一次
       this.saveTopoDraft();
+      // 设置初始化缩放比例
+      this.initScale = this.view.scale;
+      bus.$emit("initScale", this.view.scale);
     },
     // 生成快照并保存草稿
     saveTopoDraft() {
@@ -573,6 +589,15 @@ export default {
       },
       deep: true,
     },
+    // 监听scale的变化
+    "view.scale": {
+      handler(scale) {
+        // 滚轮触发的缩放
+        if (!this.changeScaleByClick) {
+          bus.$emit("mouseScale", scale / this.initScale);
+        }
+      },
+    },
   },
   created() {
     this.SETPROJECT(this.$route.query);

src/components/editview/rightPropertyBar/BaseImagePro.vue

@@ -26,14 +26,14 @@
               placeholder="请输入内容"
             ></el-input>
           </div>
-          <el-upload
+          <!-- <el-upload
             class="avatar-uploader"
             action="https://jsonplaceholder.typicode.com/posts/"
             :show-file-list="false"
             :before-upload="beforeAvatarUpload"
           >
             <i class="el-icon-link"></i>
-          </el-upload>
+          </el-upload> -->
         </div>
       </li>
       <li>
@@ -184,7 +184,7 @@ export default {
       if (val.length > 0 && !isNaN(Number(val))) {
         if (val > 360) {
           val = 360;
-        } 
+        }
         if (val < -360) {
           val = -360;
         }
@@ -197,7 +197,7 @@ export default {
       fileReader.readAsDataURL(file); //读取图片
       const ftype = file.type;
       const fname = file.name;
-      const uploadKey = file.uid;
+      const uploadKey = fname;
       const imgType = ftype.split(".")[ftype.length - 1];
       fileReader.addEventListener("load", function () {
         // 读取完成
@@ -225,14 +225,14 @@ export default {
               /* method */
               "POST",
               /* target url */
-              imgServeUpload + uploadKey + "." + imgType
+              imgServeUpload + uploadKey
             );
             xhr.send(reader.result);
             xhr.onreadystatechange = function () {
               if (xhr.readyState == 4) {
                 if (xhr.status == 200) {
-                  that.url = uploadKey + "." + imgType;
+                  that.url = uploadKey
-                  bus.$emit("updateStyle", "url", uploadKey + "." + imgType);
+                  bus.$emit("updateStyle", "url", uploadKey );
                 }
               }
             };

src/components/editview/rightPropertyBar/property.vue

@@ -216,7 +216,8 @@ export default {
         this.end = arrowType[item.end];
       } else if (
         this.itemType == "BaseText" ||
-        this.itemType == "BaseExplain"
+        this.itemType == "BaseExplain" ||
+        this.itemType == "Equation"
       ) {
         this.strokeColor = item.strokeColor.toRgba();
         this.backgroundColor = item.backgroundColor.toRgba();

src/components/editview/zoom.vue

@@ -2,20 +2,59 @@
 <template>
   <div id="zoom">
     <i @click="sacle(1)" class="el-icon-zoom-in btn"></i>
-    <span>{{Math.floor(scale * 100)}}%</span>
+    <span>{{ sliderValPercent }}</span>
     <i @click="sacle(0)" class="el-icon-zoom-out btn"></i>
   </div>
 </template>
 <script>
+import bus from "@/bus/bus";
 export default {
   props: ["scale"],
   data() {
-    return {};
+    return {
+      min: 0.1,
+      max: 5,
+      initScale: 1, //初始 底图缩放比例
+      sliderVal: 1, // 缩放比例
+    };
+  },
+  computed: {
+    sliderValPercent() {
+      return `${(this.sliderVal * 100).toFixed(0)}%`;
+    },
   },
   methods: {
     sacle(data) {
-      this.$emit("sacle", data);
+      const oldV = this.sliderVal;
+      if (data) {
+        this.sliderVal = Number((this.sliderVal + 0.1).toFixed(1));
+        if (this.sliderVal > this.maxScale) {
+          this.sliderVal = this.maxScale;
+        }
+        bus.$emit("scale", this.sliderVal, oldV);
+      } else {
+        this.sliderVal = Number((this.sliderVal - 0.1).toFixed(1));
+        if (this.sliderVal < this.min) {
+          this.sliderVal = this.min;
+        }
+        bus.$emit("scale", this.sliderVal, oldV);
+      }
     },
+    /**
+     * @name getMouseScale
+     * @description 滚轮滚动，导致的底图缩放比例 逻辑处理
+     */
+    getMouseScale() {
+      //  zoom 为缩放后改变的比例
+      bus.$off("mouseScale");
+      bus.$on("mouseScale", (zoom) => {
+        const s = Number((zoom * this.initScale).toFixed(2));
+        this.sliderVal = s > 0.1 ? s : 0.1;
+      });
+    },
+  },
+  mounted() {
+    this.getMouseScale();
   },
 };
 </script>