zhangyu před 4 roky
rodič
revize
8b5f68526d

Rozdílová data souboru nebyla zobrazena, protože soubor je příliš velký
+ 402 - 402
package-lock.json


+ 3 - 3
src/api/editer.js

@@ -37,8 +37,8 @@ export function queryGlsmsasset(data,params){
 }
 
 // 查询楼层清单
-export function getPlazaFloor(data,params){
-    return httputils.postJson(`${dataApi}/plaza/floor?plazaId=${data.plazaId}`, params)
+export function getPlazaFloor(data){
+    return httputils.getJson(`${dataApi}/data/plaza/floor`, data)
 }
 // 查询专业系统
 export function getQuerySmsxt(params){
@@ -83,5 +83,5 @@ export function deleteGraph(params){
 
 // 发布系统图
 export function publishGraph(params){
-    return httputils.getJson(`${testApi}/graph/publish`, params)
+    return httputils.postJson(`${testApi}/graph/publish`, params)
 }

+ 83 - 15
src/components/baseEditer.vue

@@ -12,7 +12,7 @@ import { SFloorParser } from "@saga-web/big";
 import { FloorView } from "./../lib/FloorView";
 import { EditScence } from "./mapClass/EditScence";
 import bus from "@/bus";
-import { saveGroup, readGroup, queryTypeGraph } from "@/api/editer.js";
+import { saveGroup, readGroup, queryTypeGraph,publishGraph } from "@/api/editer.js";
 import { STopologyParser } from "./../lib/parsers/STopologyParser";
 import { uuid } from "@/components/mapClass/until";
 import { SImageItem } from "@saga-web/graph/lib";
@@ -48,7 +48,10 @@ export default {
       floorList: {},
       urlMsg: {},
       chiceItemList: [], //选中itemlist
-      hasTypeList: [] // 当前类型下包含的typeid(提取)
+      hasTypeList: [], // 当前类型下包含的typeid(提取)
+      graphId:'',
+      initScale: 1,  //加载好底图之后的,初始缩放比例
+      changeScaleByClick: false,  //区分 滚轮,点击 事件改变的缩放比例
     };
   },
   mounted() {
@@ -58,6 +61,7 @@ export default {
     // 挂在bus
     this.getBus();
     store.dispatch("getElementType", { PageSize: 1000 });
+    window.vm = this
   },
   methods: {
     init() {
@@ -90,9 +94,12 @@ export default {
             loadings.close();
           });
         this.view.fitSceneToView();
+
       });
       // 获取主题数据
       this.readGroup().then(data => {
+        this.graphId = data.Data[0].ID;
+        bus.$emit('setGraphId',this.graphId)
         if (data.Data) {
           const parserData = new STopologyParser(null);
           parserData.parseData(data.Data[0].Elements);
@@ -174,6 +181,9 @@ export default {
             this.loading = false;
             this.isQuerying = false;
             console.log("success");
+            // 设置初始化缩放比例
+            this.initScale = this.view.scale
+            bus.$emit('initScale', this.view.scale)
           });
         } else {
           console.log("楼层不正确");
@@ -266,7 +276,7 @@ export default {
           BuildingID: this.urlMsg.BuildingID, // 建筑ID
           FloorID: this.urlMsg.FloorID // 楼层id
         };
-         Message({
+        Message({
           message: '上传中,切勿关闭窗口!',
           type: 'warning'
         });
@@ -352,20 +362,36 @@ export default {
         this.scene.upadatitemExplain(val);
       });
       //发布图
-      // bus.$on("publishGraph", val => {
-      //       this.spinning = true;
-    //   publishGraph({ graphId: this.graphId, pubUser: "" }).then(res => {
-    //     this.spinning = false;
-    //     if (res.Result == "success") {
-    //       this.$message.success(res.Message);
-    //     } else {
-    //       this.$message.error(res.Message);
-    //     }
-    //   });
-    // });
+      bus.$on("publishGraph", val => {
+        publishGraph({ graphId: this.graphId, pubUser: "" }).then(res => {
+          if (res.Result == "success") {
+            this.$message.success(res.Message);
+          } else {
+            this.$message.error(res.Message);
+          }
+        });
+      });
       //创建区域是否点选
       bus.$on("changeDrawType", val => {
         this.scene.isSelecting = val == "select";
+      }),
+      //发布图
+      bus.$on("publishMap", () => {
+       this.publishBtn()
+      })
+      /**
+       * @name changeScale缩放底图
+       * @param { Number } zoom 缩放比例
+       * 
+       */
+      // TODO: changeScale缩放底图
+      bus.$on('changeScale', zoom => {
+        let { scale } = this.view;
+        this.changeScaleByClick = true
+        this.view.scaleByPoint(zoom, this.canvasWidth / 2, this.canvasHeight / 2)
+        this.changeScaleByClick = false
+        setTimeout(() => {
+        }, 100);
       })
     },
     // 读取数据
@@ -379,6 +405,38 @@ export default {
       };
       return readGroup(data);
     },
+        //发布
+    publishBtn() {
+      console.log(this.graphId);
+      const loadings = Loading.service({
+        lock: true,
+        text: "Loading",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)"
+      });
+      const data = {
+        BuildingID: this.urlMsg.BuildingID,
+        CategoryID: this.urlMsg.categoryId,
+        FloorID: this.urlMsg.FloorID,
+        GraphId: this.graphId,
+        ProjectID: this.urlMsg.projectId,
+        PubUser: ""
+      };
+      publishGraph(data).then(res => {
+        loadings.close();
+        if (res.Result == "success") {
+          this.$message.success(res.Message);
+          const data = `categoryId=${this.urlMsg.categoryId}&projectId=${this.urlMsg.projectId}&BuildingID=${this.urlMsg.BuildingID}&FloorID=${this.urlMsg.FloorID}&fmapID=${this.urlMsg.fmapID}`;
+          const url =
+                  window.location.origin +
+                  "/wandaEditer/drafts?" +
+                  encodeURIComponent(data);
+          window.open(url, true);
+        } else {
+          this.$message.error(res.Message);
+        }
+      });
+    },
     // 获取typeid
     getTypeId() {
       const data = {
@@ -404,7 +462,17 @@ export default {
         this.$emit("setCmdType", cmd);
       },
       deep: true
-    }
+    },
+    // 监听scale的变化 
+    'view.scale': {
+      handler(scale) {
+
+        // 滚轮触发的缩放
+        if (!this.changeScaleByClick) {
+          bus.$emit('mouseScale', scale / this.initScale)
+        }
+      }
+    },
   },
   created() {
     const href = window.location.href;

+ 1 - 1
src/components/edit/edit-dialog.vue

@@ -279,7 +279,7 @@
               let data = {
                 plazaId:'1000423'
               }
-            getPlazaFloor(data,{}).then(res =>{
+            getPlazaFloor(data).then(res =>{
               if(res.result == 'success'){
                 let data = res.data;
                 data.map(item=>{

+ 4 - 3
src/components/edit/leftbar_components/itemTree.vue

@@ -13,6 +13,7 @@
         node-key="id"
         @expand="onExpand"
         @select="onSelect"
+        @check="onCheck"
       />
       </a-spin>
     </div>
@@ -32,7 +33,7 @@ export default {
     return {
       expandedKeys: ["", ""],
       autoExpandParent: true,
-      checkedKeys: [""],
+      checkedKeys: ["1-1"],
       selectedKeys: [],
       treeData,
       spinning:false
@@ -55,8 +56,8 @@ export default {
       this.expandedKeys = expandedKeys;
       this.autoExpandParent = false;
     },
-    onCheck(checkedKeys) {
-      console.log("onCheck", checkedKeys);
+    onCheck(checkedKeys,b) {
+      console.log("onCheck", checkedKeys,b.node);
       this.checkedKeys = checkedKeys;
     },
     onSelect(selectedKeys, info) {

+ 79 - 18
src/components/edit/top_toolbar.vue

@@ -21,9 +21,9 @@
         </li>-->
         <li class="zoom-window">
           <div>
-            <img class="lock" :src="require(`./../../assets/images/缩小.png`)" alt />
-            <span class="percentage">100%</span>
-            <img class="lock" :src="require(`./../../assets/images/放大 amplification.png`)" alt />
+            <img class="lock" @click="handleScale(-1)" :src="require(`./../../assets/images/缩小.png`)" alt />
+            <span class="percentage">{{scalePercent}}</span>
+            <img class="lock" @click="handleScale(1)" :src="require(`./../../assets/images/放大 amplification.png`)" alt />
           </div>
           <span>缩放窗口</span>
         </li>
@@ -37,16 +37,8 @@
               <a-icon type="caret-down" class="down-icon" />
             </div>
             <a-menu slot="overlay">
-              <a-menu-item
-                v-for="item in alignmentOptions"
-                :key="item.value"
-                @click="changeAlignItem(item.value)"
-              >
-                <img
-                  style="width: 16px;margin-right: 5px;"
-                  :src="require(`./../../assets/images/`+item.img+`.png`)"
-                  alt
-                />
+              <a-menu-item v-for="item in alignmentOptions" :key="item.value" @click="changeAlignItem(item.value)">
+                <img style="width: 16px;margin-right: 5px;" :src="require(`./../../assets/images/`+item.img+`.png`)" alt />
                 <span>{{item.label}}</span>
               </a-menu-item>
             </a-menu>
@@ -75,7 +67,7 @@
       </ul>
     </div>
     <div class="btn-list">
-      <div class="btn-list-item">
+      <div class="btn-list-item" @click="publishMap">
         <Icon name="release" />
         <span>发布</span>
       </div>
@@ -85,7 +77,8 @@
 <script>
 import bus from "@/bus";
 import { SGraphLayoutType } from "@saga-web/graph/lib";
-import systym from "./codeMapSystem.js"
+import systym from "./codeMapSystem.js";
+import { MessageBox } from 'element-ui';
 export default {
   data() {
     return {
@@ -133,10 +126,61 @@ export default {
           label: "水平分布",
           img: "t-level"
         }
-      ]
+      ],
+      scale: 0.5, //底图缩放比例
+      initScale: 0.5,  //初始 底图缩放比例
+      baseScale: 1.0,  //底图基础缩放比例,由底图加载完成后,传入进来
+      scaleStep: 0.05, // +-缩放步进
     };
   },
+  computed: {
+    // 缩放比例显示文本
+    scalePercent() {
+      return (this.scale * 100).toFixed(0) + '%'
+    }
+  },
   methods: {
+    /**
+     * @name getInitScale
+     * @description 获取底图加载完成后的,初始化的缩放比例initScale,设置为baseScale
+     */
+    getInitScale() {
+      bus.$on('initScale', baseScale => {
+        this.baseScale = Number(baseScale || 1)
+      })
+    },
+    /**
+     * @name getMouseScale
+     * @description 滚轮滚动,导致的底图缩放比例 逻辑处理
+     */
+    getMouseScale() {
+      //  zoom 为缩放后改变的比例
+      bus.$on('mouseScale', zoom => {
+        this.scale = Number((zoom * this.initScale).toFixed(2))
+      })
+    },
+    /**
+     * @name handleScale
+     * @param { Number } type  -1:点击 - 缩小底图; 1:点击 + 放大底图
+     * @description 点击 -+ 缩放底图
+     */
+    handleScale(type) {
+      // +-按钮禁用处理
+      let flag = true
+      // 设置缩放范围 0.05 ~ 100
+      if ((type < 0 && this.scale <= 0.05) || (type > 0 && this.scale >= 100)) {
+        flag = false
+      } else {
+        flag = true
+      }
+      if (!flag) {
+        return false
+      }
+      // emit 缩放比例 this.scale / oldScale
+      let oldScale = this.scale
+      this.scale = Number((oldScale + type * this.scaleStep).toFixed(2))
+      bus.$emit('changeScale', this.scale / oldScale)
+    },
     FocusItemChanged(itemMsg) {
       this.focusItem = null;
       if (itemMsg.itemList.length == 1) {
@@ -167,16 +211,32 @@ export default {
         this.$message.error("请选择指定对象!", 1);
       }
     },
+    // 发布图例
+    publishMap(){
+      MessageBox.confirm('确认后即发布到平台?', '提示', {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        bus.$emit("publishMap");
+      }).catch(() => {
+      });
+
+    },
     // 对齐item
     changeAlignItem(val) {
       bus.$emit("changeAlignItem", val);
     }
   },
-  mounted() {
+  async mounted() {
     bus.$on("FocusItemChanged", itemMsg => {
       console.log("itemMsg", itemMsg);
       this.FocusItemChanged(itemMsg);
     });
+    // 获取底图加载完成后的初始sacle
+    await this.getInitScale()
+    // 监听滚轮 底图缩放比例
+    this.getMouseScale()
   },
   created() {
     const href = window.location.href;
@@ -198,7 +258,6 @@ export default {
       obj[arr[0]] = arr[1];
     });
     this.urlMsg = obj;
-    // ///////////测试代码
     const FloorName =  this.urlMsg.FloorName ? this.urlMsg.FloorName:'';
     this.urlMsg.floorName = systym[this.urlMsg.categoryId] + '-' + FloorName;
   }
@@ -245,6 +304,8 @@ li {
           height: 16px;
         }
         .percentage {
+          display: inline-block;
+          width: 35px;
           border-bottom: 1px solid #c3c7cb;
           margin: 0 13px;
           font-size: 14px;

+ 36 - 8
src/lib/items/SFHFQZoneLegendItem.ts

@@ -2,7 +2,7 @@
 import { SGraphItem } from "@saga-web/graph/lib";
 import { SPolygonItem } from "@/components/mapClass/SPolygonItem";
 import { Legend } from '../types/Legend';
-import { SPainter, SColor, SFont, SPoint } from "@saga-web/draw";
+import { SPainter, SColor, SFont, SPoint, SLineCapStyle } from "@saga-web/draw";
 import { STextItem } from '@saga-web/graph/lib';
 import { hexify } from "@/components/mapClass/until"
 import { SItemStatus, ItemOrder } from '@saga-web/big/lib';
@@ -85,6 +85,18 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
         }
     }
 
+    /** 是否蒙版遮罩  */
+    _maskFlag: boolean = false;
+    get maskFlag(): boolean {
+        return this._maskFlag;
+    }
+    set maskFlag(v: boolean) {
+        if (v === this._maskFlag) {
+            return
+        }
+        this._maskFlag = v;
+        this.update()
+    }
 
     /**
      * 构造函数
@@ -129,27 +141,27 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
                 this.color = new SColor(data.Properties.color);
             }
             if (data.Properties.font) {
-                this.font =new SFont("sans-serif", data.Properties.font);
+                this.font = new SFont("sans-serif", data.Properties.font);
             }
             //    if( data.Properties.LineDash){
             //     this.LineDash =this._legend.Properties.LineDash
             //    }
         }
         // 监听多边形创建完成事件,并动态计算文本位置
-        this.connect("finishCreated",this, () => {
+        this.connect("finishCreated", this, () => {
             // 计算文本位置
             let x: number = this.getPointList.reduce((pre, cur, index, arr) => {
-                                return pre + (cur.x / arr.length)
-                            }, 0),
+                return pre + (cur.x / arr.length)
+            }, 0),
                 y: number = this.getPointList.reduce((pre, cur, index, arr) => {
-                                return pre + (cur.y / arr.length)
-                            }, 0);
+                    return pre + (cur.y / arr.length)
+                }, 0);
             this.textItem.moveTo(x, y);
         })
     }
 
     toData(): any {
-        this.data.Pos = {X: this.x, Y: this.y};
+        this.data.Pos = { X: this.x, Y: this.y };
         this.data.Name = this.text;
         this.data.Properties.FillColor = this.fillColor.value;
         this.data.Properties.StrokeColor = this.strokeColor.value;
@@ -166,4 +178,20 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
         return this.data;
     }
 
+    onDraw(painter: SPainter) {
+        if (this.maskFlag && this.status == SItemStatus.Normal) {
+            let color = new SColor(this.strokeColor)
+            color.alpha = 100;
+            let brushcolor = new SColor(this.fillColor)
+            brushcolor.alpha = 100;
+            painter.pen.color = color;
+            painter.pen.lineCapStyle = SLineCapStyle.Square;
+            painter.pen.lineWidth = painter.toPx(this._lineWidth);
+            painter.brush.color = brushcolor;
+            // @ts-ignore
+            painter.drawPolygon([...this.pointList]);
+        } else {
+            super.onDraw(painter);
+        }
+    }
 } // Class SZoneLegendItem

+ 39 - 4
src/lib/items/SLineMarkerItem.ts

@@ -1,7 +1,7 @@
 
-import { SGraphItem } from "@saga-web/graph/lib";
-import { SPoint, SColor } from "@saga-web/draw/lib";
-import { ItemOrder, SLineItem } from '@saga-web/big/lib';
+import { SGraphItem, SLineStyle } from "@saga-web/graph/lib";
+import { SPoint, SPainter, SColor, SLineCapStyle } from "@saga-web/draw/lib";
+import { ItemOrder, SLineItem, SItemStatus } from '@saga-web/big/lib';
 import { Marker } from '../types/Marker';
 
 /**
@@ -13,6 +13,19 @@ export class SLineMarkerItem extends SLineItem {
     /** 标识对象数据 */
     data: Marker;
 
+    /** 是否蒙版遮罩  */
+    _maskFlag: boolean = false;
+    get maskFlag(): boolean {
+        return this._maskFlag;
+    }
+    set maskFlag(v: boolean) {
+        if (v === this._maskFlag) {
+            return
+        }
+        this._maskFlag = v;
+        this.update()
+    }
+
     /**
      * 构造函数
      *
@@ -45,7 +58,7 @@ export class SLineMarkerItem extends SLineItem {
     } // Constructor
 
     toData(): Marker {
-        this.data.Pos = {X: this.x, Y: this.y};
+        this.data.Pos = { X: this.x, Y: this.y };
         this.data.Properties.Line = this.line.map(pos => {
             return {
                 X: pos.x,
@@ -58,4 +71,26 @@ export class SLineMarkerItem extends SLineItem {
         return this.data;
     }
 
+    onDraw(painter: SPainter) {
+        if (this.maskFlag && this.status == SItemStatus.Normal) {
+            let color = new SColor(this.strokeColor);
+            color.alpha = 100;
+            painter.pen.color = new SColor(this.strokeColor);
+            if (this.lineStyle == SLineStyle.Dashed) {
+                painter.pen.lineDash = [
+                    painter.toPx(this.lineWidth * 3),
+                    painter.toPx(this.lineWidth * 7)
+                ];
+            }
+            else if (this.lineStyle == SLineStyle.Dotted) {
+                painter.pen.lineDash = [
+                    painter.toPx(this.lineWidth),
+                    painter.toPx(this.lineWidth)
+                ];
+            }
+            painter.drawLine(this.line[0], this.line[1]);
+        } else {
+            super.onDraw(painter);
+        }
+    }
 } // Class SLineMarkerItem

+ 41 - 11
src/lib/items/SSCPZZoneLegendItem.ts

@@ -2,7 +2,7 @@
 import { SGraphItem } from "@saga-web/graph/lib";
 import { SPolygonItem } from "@/components/mapClass/SPolygonItem";
 import { Legend } from '../types/Legend';
-import { SPainter, SColor, SFont, SPoint } from "@saga-web/draw";
+import { SPainter, SColor, SFont, SPoint, SLineCapStyle } from "@saga-web/draw";
 import { STextItem } from '@saga-web/graph/lib';
 import { hexify } from "@/components/mapClass/until"
 import { SItemStatus, ItemOrder } from '@saga-web/big/lib';
@@ -84,11 +84,25 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
             this.textItem.hide();
         }
     }
+
+    /** 是否蒙版遮罩  */
+    _maskFlag: boolean = false;
+    get maskFlag(): boolean {
+        return this._maskFlag;
+    }
+    set maskFlag(v: boolean) {
+        if (v === this._maskFlag) {
+            return
+        }
+        this._maskFlag = v;
+        this.update()
+    }
+
     /** 图例说明  */
-    set itemExplain(v:string){
-      this.data.Properties.ItemExplain = v
+    set itemExplain(v: string) {
+        this.data.Properties.ItemExplain = v
     }
-    get itemExplain():string{
+    get itemExplain(): string {
         return this.data.Properties.ItemExplain
     }
 
@@ -135,27 +149,27 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
                 this.color = new SColor(data.Properties.color);
             }
             if (data.Properties.font) {
-                this.font =new SFont("sans-serif", data.Properties.font);
+                this.font = new SFont("sans-serif", data.Properties.font);
             }
             //    if( data.Properties.LineDash){
             //     this.LineDash =this._legend.Properties.LineDash
             //    }
         }
         // 监听多边形创建完成事件,并动态计算文本位置
-        this.connect("finishCreated",this, () => {
+        this.connect("finishCreated", this, () => {
             // 计算文本位置
             let x: number = this.getPointList.reduce((pre, cur, index, arr) => {
-                                return pre + (cur.x / arr.length)
-                            }, 0),
+                return pre + (cur.x / arr.length)
+            }, 0),
                 y: number = this.getPointList.reduce((pre, cur, index, arr) => {
-                                return pre + (cur.y / arr.length)
-                            }, 0);
+                    return pre + (cur.y / arr.length)
+                }, 0);
             this.textItem.moveTo(x, y);
         })
     }
 
     toData(): any {
-        this.data.Pos = {X: this.x, Y: this.y};
+        this.data.Pos = { X: this.x, Y: this.y };
         this.data.Name = this.text;
         this.data.Properties.FillColor = this.fillColor.value;
         this.data.Properties.StrokeColor = this.strokeColor.value;
@@ -172,4 +186,20 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
         return this.data;
     }
 
+    onDraw(painter: SPainter) {
+        if (this.maskFlag && this.status == SItemStatus.Normal) {
+            let color = new SColor(this.strokeColor)
+            color.alpha = 100;
+            let brushcolor = new SColor(this.fillColor)
+            brushcolor.alpha = 100;
+            painter.pen.color = color;
+            painter.pen.lineCapStyle = SLineCapStyle.Square;
+            painter.pen.lineWidth = painter.toPx(this._lineWidth);
+            painter.brush.color = brushcolor;
+            // @ts-ignore
+            painter.drawPolygon([...this.pointList]);
+        } else {
+            super.onDraw(painter);
+        }
+    }
 } // Class SZoneLegendItem

+ 35 - 7
src/lib/items/SZoneLegendItem.ts

@@ -1,7 +1,7 @@
 
 import { SGraphItem } from "@saga-web/graph/lib";
 import { Legend } from '../types/Legend';
-import { SPainter, SColor, SFont, SPoint } from "@saga-web/draw";
+import { SPainter, SColor, SFont, SPoint, SLineCapStyle } from "@saga-web/draw";
 import { STextItem } from '@saga-web/graph/lib';
 import { hexify } from "@/components/mapClass/until"
 import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib';
@@ -84,6 +84,18 @@ export class SZoneLegendItem extends SPolygonItem {
         }
     }
 
+    /** 是否蒙版遮罩  */
+    _maskFlag: boolean = false;
+    get maskFlag(): boolean {
+        return this._maskFlag;
+    }
+    set maskFlag(v: boolean) {
+        if (v === this._maskFlag) {
+            return
+        }
+        this._maskFlag = v;
+        this.update()
+    }
 
     /**
      * 构造函数
@@ -136,20 +148,20 @@ export class SZoneLegendItem extends SPolygonItem {
             //    }
         }
         // 监听多边形创建完成事件,并动态计算文本位置
-        this.connect("finishCreated",this, () => {
+        this.connect("finishCreated", this, () => {
             // 计算文本位置
             let x: number = this.getPointList.reduce((pre, cur, index, arr) => {
-                                return pre + (cur.x / arr.length)
-                            }, 0),
+                return pre + (cur.x / arr.length)
+            }, 0),
                 y: number = this.getPointList.reduce((pre, cur, index, arr) => {
-                                return pre + (cur.y / arr.length)
-                            }, 0);
+                    return pre + (cur.y / arr.length)
+                }, 0);
             this.textItem.moveTo(x, y);
         })
     }
 
     toData(): any {
-        this.data.Pos = {X: this.x, Y: this.y};
+        this.data.Pos = { X: this.x, Y: this.y };
         this.data.Name = this.name;
         this.data.Properties.FillColor = this.fillColor.value;
         this.data.Properties.StrokeColor = this.strokeColor.value;
@@ -166,4 +178,20 @@ export class SZoneLegendItem extends SPolygonItem {
         return this.data;
     }
 
+    onDraw(painter: SPainter) {
+        if (this.maskFlag && this.status == SItemStatus.Normal) {
+            let color = new SColor(this.strokeColor)
+            color.alpha = 100;
+            let brushcolor = new SColor(this.fillColor)
+            brushcolor.alpha = 100;
+            painter.pen.color = color;
+            painter.pen.lineCapStyle = SLineCapStyle.Square;
+            painter.pen.lineWidth = painter.toPx(this._lineWidth);
+            painter.brush.color = brushcolor;
+            // @ts-ignore
+            painter.drawPolygon([...this.pointList]);
+        } else {
+            super.onDraw(painter);
+        }
+    }
 } // Class SZoneLegendItem

+ 26 - 1
src/lib/items/TipelineItem.ts

@@ -1,4 +1,4 @@
-import { SPolylineItem, ItemOrder } from '@saga-web/big/lib';
+import { SPolylineItem, ItemOrder, SItemStatus } from '@saga-web/big/lib';
 import { SPainter, SColor } from '@saga-web/draw';
 import { SAnchorItem, SGraphItem } from '@saga-web/graph/lib';
 import { Relation } from '../types/Relation';
@@ -69,6 +69,20 @@ export class TipelineItem extends SPolylineItem {
       this.data.Anchor2ID = this._anchor2ID;
     }
   }
+
+  /** 是否蒙版遮罩  */
+  _maskFlag: boolean = false;
+  get maskFlag(): boolean {
+    return this._maskFlag;
+  }
+  set maskFlag(v: boolean) {
+    if (v === this._maskFlag) {
+      return
+    }
+    this._maskFlag = v;
+    this.update()
+  }
+
   /** 数据存储  */
   data: Relation | null = null;
   /** 接收事件作出修改  */
@@ -142,4 +156,15 @@ export class TipelineItem extends SPolylineItem {
 
     return this.data
   }
+
+  onDraw(painter: SPainter) {
+    if (this.maskFlag && this.status == SItemStatus.Normal) {
+      let color = new SColor(this.strokeColor)
+      color.alpha = 100;
+      painter.pen.color = color;
+      painter.drawPolyline(this.pointList);
+    } else {
+      super.onDraw(painter);
+    }
+  }
 }

+ 36 - 24
src/views/drafts.vue

@@ -1,7 +1,5 @@
 <template>
-
-    <div id="drafts">
-      <a-spin :spinning="spinning">
+  <div id="drafts">
       <div class="tit">草稿箱</div>
       <div class="conent">
         <div class="left-nav">
@@ -63,9 +61,7 @@
           </div>
         </div>
       </div>
-      </a-spin>
-    </div>
-
+  </div>
 </template>
 <script>
 import Tree from "./../components/Tree/Tree.vue";
@@ -85,6 +81,7 @@ import { STopologyParser } from "./../lib/parsers/STopologyParser";
 import { uuid } from "@/components/mapClass/until";
 import { SImageItem } from "@saga-web/graph/lib";
 import store from "../store";
+import {Loading} from "element-ui";
 let fengmap = null;
 export default {
   components: { Tree },
@@ -121,10 +118,9 @@ export default {
       fmapID: "", //蜂鸟地图id
       graphId: "", //绘制生成得图id
       legendLoading: false,
-      spinning: false, //全局加载
       systemName: "",
       floorName: "",
-      floorId:'',    //楼层id
+      floorId: "", //楼层id
       BuildingID: "1", // 建筑id
       categoryId: "" //系统类id
     };
@@ -244,12 +240,17 @@ export default {
     },
     //删除
     deleteBtn() {
-      this.spinning = true;
+      const loadings = Loading.service({
+        lock: true,
+        text: "Loading",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)"
+      });
       deleteGraph([{ Id: this.graphId }]).then(res => {
         console.log(res);
-        this.spinning = false;
+        loadings.close();
         if (res.Result == "success") {
-          this.$message.success('删除成功');
+          this.$message.success("删除成功");
           this.getTreeData();
           this.legendData = [];
         } else {
@@ -259,11 +260,26 @@ export default {
     },
     //发布
     publishBtn() {
-      this.spinning = true;
-      publishGraph({ graphId: this.graphId, pubUser: "" }).then(res => {
-        this.spinning = false;
+      const loadings = Loading.service({
+        lock: true,
+        text: "Loading",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)"
+      });
+      const data = {
+        BuildingID: this.BuildingID,
+        CategoryID: this.categoryId,
+        FloorID: this.floorId,
+        GraphId: this.graphId,
+        ProjectID: this.projectId,
+        PubUser: ""
+      };
+      publishGraph(data).then(res => {
+        loadings.close();
         if (res.Result == "success") {
-          this.$message.success(res.Message);
+          this.$message.success('发布成功');
+          this.getTreeData();
+          this.legendData = [];
         } else {
           this.$message.error(res.Message);
         }
@@ -275,8 +291,7 @@ export default {
         categoryId: this.categoryId,
         projectId: this.projectId,
         BuildingID: this.BuildingID, // 建筑ID
-        FloorID: floorid, // 楼层id
-        Pub:false   //是否获取草稿 //获取草稿
+        FloorID: floorid // 楼层id
       };
       return readGroup(data);
     },
@@ -286,7 +301,10 @@ export default {
      */
     goToEditer() {
       const data = `categoryId=${this.categoryId}&projectId=${this.projectId}&BuildingID=1&FloorID=${this.floorId}&FloorName=${this.floorName}&fmapID=${this.fmapID}`;
-      const url = window.location.origin + "/wandaEditer/editer?" + encodeURIComponent(data);
+      const url =
+        window.location.origin +
+        "/wandaEditer/editer?" +
+        encodeURIComponent(data);
       window.open(url, true);
     },
     // 切换草稿箱楼层
@@ -372,12 +390,6 @@ export default {
 };
 </script>
 <style lang="less" scoped>
-  /deep/ .ant-spin-nested-loading{
-    height: 100% !important;
-   .ant-spin-container{
-     height: 100% !important;
-   }
-  }
 #drafts {
   widows: 100%;
   height: 100%;

+ 1 - 1
src/views/editer.vue

@@ -88,7 +88,7 @@ export default {
     .left_toolbar {
       position: absolute;
       height: 100%;
-      z-index: 1001;
+      /*z-index: 1001;*/
       /*left: 12px;*/
       /*top: 12px;*/
     }