浏览代码

Merge branch 'develop' of http://39.106.8.246:3003/web/wanda-bm-guide into develop

shaun-sheep 4 年之前
父节点
当前提交
1ffe6c018f

二进制
src/assets/imgs/yl.png


+ 38 - 18
src/components/Legend/src/legend.vue

@@ -6,7 +6,7 @@
 <template>
     <div>
         <div class='legend-container'>
-            <div class='legend' @click='showTl' v-if='type==1'>图例</div>
+            <div class='legend' @click='showTl' v-if='(type==1 || floors.length>0)&& isMessage'>图例</div>
             <el-collapse-transition>
                 <div class='legend-tab' v-if='show'>
                     <div class='legend-table'>
@@ -50,11 +50,11 @@
         <div class='edit_map' v-else>
             <!-- 备注编辑器 -->
             <el-tooltip effect='dark' content='编辑备注' placement='left'>
-                <span v-if='systemName != "土建系统"' class='bjtk' @click='legendClik'>备注</span>
+                <span v-if='systemName != "土建系统" && isMessage' class='bjtk' @click='legendClik'>备注</span>
             </el-tooltip>
             <!-- 编辑图例 -->
             <el-tooltip effect='dark' content='编辑图例' placement='left'>
-                <p v-if='systemName != "土建系统"' @click='editTl' class='tltk'>
+                <p v-if='systemName != "土建系统" && isMessage' @click='editTl' class='tltk'>
                     <img src='@/assets/imgs/bjtl.png' alt />
                 </p>
             </el-tooltip>
@@ -77,7 +77,7 @@
         <div class='select-floor' v-if='isFloor'>
             <p class='p1'>请选择需要创建“消防泵房引出管路分布图”的楼层</p>
             <p class='p2'>
-                <Select width='240' tipPlace='top' caption='楼层:' size='mini' :selectdata='floorSelect' :placeholder='"请选择"'></Select>
+                <Select width='240' tipPlace='top' v-model='floor' caption='楼层:' size='mini' :selectdata='floorSelectAble' :placeholder='"请选择"'></Select>
             </p>
             <p class='p3'>
                 <span @click='cancel'>取消</span>
@@ -116,11 +116,14 @@ export default {
             editText: '',
             editSwitch: false,
             isFloor: false,
-            editPmt: true //是否有跳转道图例库的权限
+            editPmt: true, //是否有跳转道图例库的权限
+            floorSelectAble: [],
+            floor: '', //传的楼层
+            floorName: ''
         }
     },
     computed: {
-        ...mapGetters(['plazaId', 'fmapID', 'floorSelect'])
+        ...mapGetters(['plazaId', 'fmapID', 'floorSelect', 'isMessage'])
     },
     props: {
         floors: {
@@ -136,10 +139,21 @@ export default {
         systemName: {
             default: '',
             type: String
+        },
+        categoryId: {
+            default: '',
+            type: String
         }
     },
     components: { lengendView, legendRemarks, lengendEdit },
     methods: {
+        formatFloor() {
+            this.floorSelectAble = []
+            this.floorSelectAble = this.floorSelect.filter(item => {
+                const hit = this.floors.find(i => i.gname == item.id)
+                return !hit
+            })
+        },
         testClick(data) {},
         // 编辑备注
         legendClik() {
@@ -148,15 +162,13 @@ export default {
         // 查询备注
         queryMarks() {
             let postParams = {
-                categoryId: this.$cookie.get('categoryId'),
+                categoryId: this.categoryId ? this.categoryId : this.$cookie.get('categoryId'),
                 projectId: this.$store.state.plazaId,
                 BuildingID: '1',
                 FloorID: this.$cookie.get('floorNow')
             }
-
             let data = {}
             queryRead({ data, postParams }).then(res => {
-                console.log('备注', res)
                 if (res.data.Data && res.data.Data[0].Note) {
                     let note = res.data.Data[0].Note
                     if (note.search(this.text1) != -1 && note.search(this.text2) != -1) {
@@ -195,18 +207,26 @@ export default {
          * @description t跳转editer编辑器
          */
         goToEditer() {
-            let FloorID = this.$cookie.get('floorMapId') || 'f1'
-            let categoryId = this.$cookie.get('categoryId')
+            if (this.floor) {
+                this.floorSelect.forEach(el => {
+                    if (el.id == this.floor) {
+                        this.floorName = el.name
+                    }
+                })
+            }
+
+            let FloorID = this.floor ? this.floor : this.$cookie.get('floorMapId') || 'f1'
+            let categoryId = this.categoryId ? this.categoryId : this.$cookie.get('categoryId')
             const { conf } = window.__systemConf,
                 { editerUrl } = conf
-            let data = `categoryId=${categoryId}&projectId=${this.plazaId}&BuildingID=1&FloorID=${FloorID}&FloorName=${this.$cookie.get(
-                'floorNow'
-            )}&fmapID=${this.fmapID}`
+            let floorName = this.floorName ? this.floorName : this.$cookie.get('floorNow')
+            let data = `categoryId=${categoryId}&projectId=${this.plazaId}&BuildingID=1&FloorID=${FloorID}&FloorName=${floorName}&fmapID=${this.fmapID}`
+            console.log('data', data)
+            console.log('this.categoryId', this.categoryId, this.$cookie.get('categoryId'))
             let url = editerUrl + 'editer?' + encodeURIComponent(data)
             window.open(url, true)
         },
         isShow2() {
-            //console.log(this.isShow2)
             this.show2 = !this.show2
         },
         handleSwich(val) {
@@ -286,6 +306,7 @@ export default {
         },
         addFloor() {
             this.isFloor = true
+            this.formatFloor()
         },
         // 新增楼层取消
         cancel() {
@@ -294,11 +315,10 @@ export default {
         // 新增楼层确定
         determine() {
             this.isFloor = false
+            this.goToEditer()
         }
     },
-    mounted() {
-        console.log(this.floors)
-    }
+    mounted() {}
 }
 </script>
 <style lang="less" scoped>

+ 1 - 1
src/components/Rotation/src/rotation.vue

@@ -40,7 +40,7 @@ export default {
         height: 100%;
     }
     img {
-        width: 90%;
+        width: 100%;
        
     }
 }

+ 14 - 21
src/components/floorList.vue

@@ -70,24 +70,14 @@ export default {
     },
     props: {
         floorsArr: {
-            type: Array
-            /*  default: () => {
-                return [
-                    { name: '第6层', code: 'F6', gname: 'f6', gcode: '6F', seq: 600 },
-                    { name: '第5层', code: 'F5', gname: 'f5', gcode: '5F', seq: 500 },
-                    { name: '第4层', code: 'F4', gname: 'f4', gcode: '4F', seq: 400 },
-                    { name: '第3层', code: 'F3', gname: 'f3', gcode: '3F', seq: 300 },
-                    { name: '第2层', code: 'F2', gname: 'f2', gcode: '2F', seq: 200 },
-                    { name: '第1层', code: 'F1', gname: 'f1', gcode: '1F', seq: 100 },
-                    { name: '地下1层', code: 'B1', gname: 'b1', gcode: 'B1', seq: -100 },
-                    { name: '地下2层', code: 'B2', gname: 'b2', gcode: 'B2', seq: -200 },
-                    { name: '地下3层', code: 'B3', gname: 'b3', gcode: 'B3', seq: -300 },
-                    { name: '地下4层', code: 'B4', gname: 'b4', gcode: 'B4', seq: -400 }
-                ]
-            } */
+            type: Array,
+            default: () => {
+                ;[]
+            }
         }
     },
     mounted() {
+        console.log(this.floorsArr)
         this.init()
     },
     watch: {
@@ -180,12 +170,15 @@ export default {
         handleCookie() {
             // return true
             let currentFloor = this.floorsArr.filter(item => item.seq == this.currentFloorId)[0]
-            this.$cookie.set('floorNow', currentFloor.code, 3)
-            this.$cookie.set('floorMapId', currentFloor.gname, 3)
-            this.$cookie.set('currentFloorId', currentFloor.seq, 3)
-            this.floorId = this.$cookie.get('floorNow') || currentFloor.code
-            this.floorMapIdName = this.$cookie.get('floorMapId') || currentFloor.gname
-            this.$emit('emitFloor', currentFloor)
+            console.log(currentFloor)
+            if (currentFloor) {
+                this.$cookie.set('floorNow', currentFloor.code || '', 3)
+                this.$cookie.set('floorMapId', currentFloor.gname, 3)
+                this.$cookie.set('currentFloorId', currentFloor.seq, 3)
+                this.floorId = this.$cookie.get('floorNow') || currentFloor.code
+                this.floorMapIdName = this.$cookie.get('floorMapId') || currentFloor.gname
+                this.$emit('emitFloor', currentFloor)
+            }
         },
         /**
          * @name tabFloor

+ 12 - 5
src/components/floorMap/canvasFun.vue

@@ -12,12 +12,17 @@
                     </el-dropdown-menu>
                 </el-dropdown>
             </div>
-            <div class='small-block' @click="showText">
+            <div class='small-block' @click='showText'>
                 <i>
-                    <img src='../../assets/imgs/er.png' alt />
+                    <el-tooltip v-if='isShow' effect='dark' content='隐藏店铺名称' placement='top'>
+                        <img src='../../assets/imgs/er.png' alt />
+                    </el-tooltip>
+                    <el-tooltip v-else effect='dark' content='显示店铺名称' placement='top'>
+                        <img src='../../assets/imgs/yl.png' alt />
+                    </el-tooltip>
                 </i>
             </div>
-            <div class='small-block' @click='fitToWindow'>
+            <div class='small-block' @click='showText'>
                 <i>
                     <img src='../../assets/imgs/qp.png' alt />
                 </i>
@@ -43,7 +48,8 @@ export default {
             min: 1,
             max: 1000,
             everyScale: 1, // 每份的放大倍数
-            isSwitch: false // 是否开启吸附
+            isSwitch: false, // 是否开启吸附
+            isShow: true
         }
     },
 
@@ -93,7 +99,8 @@ export default {
             this.scale(this.sliderVal)
         },
         showText() {
-            this.$emit('showText')
+            this.isShow = !this.isShow
+            this.$emit('showText', this.isShow)
         }
     }
 }

+ 281 - 284
src/components/floorMap/index.vue

@@ -1,309 +1,306 @@
 
 <!-- 底图 -->
 <template>
-  <div id="floor_base" v-loading="loading" ref="graphy">
-    <canvas :id="`canvas${id}`" :width="canvasWidth" :height="canvasHeight" tabindex="0"></canvas>
-    <!-- 地图底部操作按钮 -->
-    <div class="strip-bottom">
-      <canvasFun @fit="fit" @savePng="savePng" @saveSvg="saveSvg" @saveJson="saveJson" @scale="scale" @showText="showText" ref="canvasFun"></canvasFun>
+    <div id='floor_base' v-loading='loading' ref='graphy'>
+        <canvas :id='`canvas${id}`' :width='canvasWidth' :height='canvasHeight' tabindex='0'></canvas>
+        <!-- 地图底部操作按钮 -->
+        <div class='strip-bottom'>
+            <canvasFun @fit='fit' @savePng='savePng' @saveSvg='saveSvg' @saveJson='saveJson' @scale='scale' @showText='showText' ref='canvasFun'></canvasFun>
+        </div>
+        <room-box ref='boxRoom'></room-box>
     </div>
-    <room-box ref="boxRoom"></room-box>
-  </div>
 </template>
 <script>
-import { SFengParser } from "@saga-web/feng-map";
-import { SFloorParser } from "@saga-web/big";
-import { FloorView } from "@/lib/FloorView";
-import { FloorScene } from "@/lib/FloorScene";
-import RoomBox from "@/views/room/index";
-import canvasFun from "@/components/floorMap/canvasFun";
-import { readGroup } from "@/api/public";
-import { STopologyParser } from "@/lib/parsers/STopologyParser";
-import { mapGetters, mapActions } from "vuex";
-import { SImageItem } from "@saga-web/graph/lib";
-import bus from "@/utils/bus.js"
+import { SFengParser } from '@saga-web/feng-map'
+import { SFloorParser } from '@saga-web/big'
+import { FloorView } from '@/lib/FloorView'
+import { FloorScene } from '@/lib/FloorScene'
+import RoomBox from '@/views/room/index'
+import canvasFun from '@/components/floorMap/canvasFun'
+import { readGroup } from '@/api/public'
+import { STopologyParser } from '@/lib/parsers/STopologyParser'
+import { mapGetters, mapActions } from 'vuex'
+import { SImageItem } from '@saga-web/graph/lib'
+import bus from '@/utils/bus.js'
 
 // import { uuid } from "@/components/mapClass/until";
 
 export default {
-  data() {
-    return {
-      appName: "万达可视化系统",
-      key: "23f30a832a862c58637a4aadbf50a566",
-      mapServerURL: `/wdfn`,
-      canvasWidth: 1100,
-      canvasHeight: 800,
-      loading: false, // 限制重复查询
-      view: null,
-      urlMsg: {},
-      canvasID: "canvas",
-      floorid: "", //楼层id
-      topologyParser: null, // 解析器数据
-    };
-  },
-  props: {
-    id: {
-      default: "1",
-      type: String
-    },
-      categoryId: {
-      default: "",
-      type: String
+    data() {
+        return {
+            appName: '万达可视化系统',
+            key: '23f30a832a862c58637a4aadbf50a566',
+            mapServerURL: `/wdfn`,
+            canvasWidth: 600,
+            canvasHeight: 800,
+            loading: false, // 限制重复查询
+            view: null,
+            urlMsg: {},
+            canvasID: 'canvas',
+            floorid: '', //楼层id
+            topologyParser: null // 解析器数据
+        }
     },
+    props: {
+        id: {
+            default: '1',
+            type: String
+        },
+        categoryId: {
+            default: '',
+            type: String
+        },
 
-    loadName: null,
-    type: null
-  },
-  components: { RoomBox, canvasFun },
-  computed: {
-    ...mapGetters(["plazaId", "fmapID", "haveFengMap"])
-  },
-  methods: {
-    ...mapActions(["getfmapID"]),
-    init(floorid) {
-      this.loading = true;
-      this.floorid = floorid;
-      setTimeout(() => {
-        if (this.haveFengMap) {
-          this.clearGraphy();
-          this.scene = new FloorScene();
-          this.scene.selectContainer.connect(
-            "listChange",
-            this,
-            this.listChange
-          );
-          if (this.canvasID != `canvas${this.id}`) {
-            this.canvasID = `canvas${this.id}`;
-          }
-          this.parserData(floorid);
-        }
-      }, 100);
+        loadName: null,
+        type: null
     },
-    parserData(floor) {
-      if (floor == "g80") {
-        // 屋顶
-        if (window.fengmapData.frImg) {
-          let imgItem = new SImageItem(
-            null,
-            `${this.mapServerURL}/webtheme/${this.fmapID}/${window.fengmapData.frImg}`
-          );
-          this.scene.addItem(imgItem);
-          this.view.scene = this.scene;
-          this.view.minScale = this.view.scale;
-          if (this.$refs.canvasFun) {
-            this.$refs.canvasFun.everyScale = this.view.scale;
-          }
-          this.view.fitSceneToView();
-        }
-      } else {
-        if (window.fengmapData.gnameToGid[floor]) {
-          window.fengmapData.parseData(
-            window.fengmapData.gnameToGid[floor],
-            res => {
-              if (res.err) {
-                console.log("errr", res.err);
-                return;
-              }
-              const fParser = new SFloorParser(null);
-              fParser.parseData(res);
-              fParser.spaceList.forEach(t => {
-                //   t.selectable = true;
-                this.scene.addItem(t);
-              });
-              fParser.wallList.forEach(t => this.scene.addItem(t));
-              fParser.virtualWallList.forEach(t => this.scene.addItem(t));
-              fParser.doorList.forEach(t => this.scene.addItem(t));
-              fParser.columnList.forEach(t => this.scene.addItem(t));
-              fParser.casementList.forEach(t => this.scene.addItem(t));
-              this.view.scene = this.scene;
-              this.view.minScale = this.view.scale;
-              if (this.$refs.canvasFun) {
-                this.$refs.canvasFun.everyScale = this.view.scale;
-              }
-              this.view.fitSceneToView();
-              //console.log('success')
+    components: { RoomBox, canvasFun },
+    computed: {
+        ...mapGetters(['plazaId', 'fmapID', 'haveFengMap'])
+    },
+    methods: {
+        ...mapActions(['getfmapID']),
+        init(floorid) {
+            this.loading = true
+            this.floorid = floorid
+            this.mapSize()
+            setTimeout(() => {
+                if (this.haveFengMap) {
+                    this.clearGraphy()
+                    this.scene = new FloorScene()
+                    this.scene.selectContainer.connect('listChange', this, this.listChange)
+                    if (this.canvasID != `canvas${this.id}`) {
+                        this.canvasID = `canvas${this.id}`
+                    }
+                    this.parserData(floorid)
+                }
+            }, 100)
+        },
+        parserData(floor) {
+            if (floor == 'g80') {
+                // 屋顶
+                if (window.fengmapData.frImg) {
+                    let imgItem = new SImageItem(null, `${this.mapServerURL}/webtheme/${this.fmapID}/${window.fengmapData.frImg}`)
+                    this.scene.addItem(imgItem)
+                    this.view.scene = this.scene
+                    this.view.minScale = this.view.scale
+                    if (this.$refs.canvasFun) {
+                        this.$refs.canvasFun.everyScale = this.view.scale
+                    }
+                    this.view.fitSceneToView()
+                }
+            } else {
+                if (window.fengmapData.gnameToGid[floor]) {
+                    window.fengmapData.parseData(window.fengmapData.gnameToGid[floor], res => {
+                        if (res.err) {
+                            console.log('errr', res.err)
+                            return
+                        }
+                        const fParser = new SFloorParser(null)
+                        fParser.parseData(res)
+                        fParser.spaceList.forEach(t => {
+                            //   t.selectable = true;
+                            this.scene.addItem(t)
+                        })
+                        fParser.wallList.forEach(t => this.scene.addItem(t))
+                        fParser.virtualWallList.forEach(t => this.scene.addItem(t))
+                        fParser.doorList.forEach(t => this.scene.addItem(t))
+                        fParser.columnList.forEach(t => this.scene.addItem(t))
+                        fParser.casementList.forEach(t => this.scene.addItem(t))
+                        this.view.scene = this.scene
+                        this.view.minScale = this.view.scale
+                        if (this.$refs.canvasFun) {
+                            this.$refs.canvasFun.everyScale = this.view.scale
+                        }
+                        this.view.fitSceneToView()
+                        //console.log('success')
+                    })
+                } else {
+                    console.log('楼层不正确')
+                }
             }
-          );
-        } else {
-          console.log("楼层不正确");
-        }
-      }
-      this.readGroup(this.floorid).then(data => {
-        this.loading = false;
-        if (data.Data.length > 0) {
-          //console.log(data.data.Data[0].ID)
-          this.$cookie.set("graphId", data.Data[0].ID, 3);
+            this.readGroup(this.floorid).then(data => {
+                this.loading = false
+                if (data.Result == 'failure') {
+                    this.$message({
+                        message: data.Message,
+                        type: 'warning'
+                    })
+                    this.$store.commit('SETISMESSAGE', false)
+                    //    一会回来存这个
+                } else {
+                    this.$store.commit('SETISMESSAGE', true)
+                }
+                if (data.Data.length > 0) {
+                    //console.log(data.data.Data[0].ID)
+                    this.$cookie.set('graphId', data.Data[0].ID, 3)
+                }
+                this.topologyParser = new STopologyParser(null)
+                this.topologyParser.parseData(data.Data[0].Elements)
+                // 多边形
+                this.topologyParser.zoneLegendList.forEach(t => {
+                    this.scene.addItem(t)
+                })
+                // 增加文字
+                this.topologyParser.textMarkerList.forEach(t => {
+                    this.scene.addItem(t)
+                })
+                // 增加图片
+                this.topologyParser.imageMarkerList.forEach(t => {
+                    this.scene.addItem(t)
+                })
+                // 增加直线
+                this.topologyParser.lineMarkerList.forEach(t => {
+                    this.scene.addItem(t)
+                })
+                // 增加图标类图例
+                this.topologyParser.imageLegendList.forEach(t => {
+                    this.scene.addItem(t)
+                })
+                // 增加管线类
+                // 增加图标类图例
+                this.topologyParser.relationList.forEach(t => {
+                    this.scene.addItem(t)
+                })
+                this.view.fitSceneToView()
+            })
+        },
+        clearGraphy() {
+            if (this.view) {
+                this.view.scene = null
+                return
+            }
+            this.view = new FloorView(`canvas${this.id}`)
+        },
+        listChange(item, ev) {
+            let name = ev[0][0].data.Name
+            if (name.slice(name.length - 2, name.length) == '机房') {
+                this.$refs.boxRoom.open({ name: name, type: this.type })
+            }
+        },
+        // 适配底图到窗口
+        fit() {
+            this.view.fitSceneToView()
+        },
+        // 保存为png
+        savePng() {
+            this.view.saveImage(`${this.loadName}.png`, 'png')
+            //console.log(`${this.loadName}.png`)
+        },
+        // 保存为svg
+        saveSvg() {
+            this.view.saveSceneSvg(`${this.loadName}.svg`, 6400, 4800)
+        },
+        // 保存为json
+        saveJson() {
+            this.view.saveFloorJson(`${this.loadName}.json`)
+        },
+        // 缩放
+        scale(val) {
+            if (!this.view) {
+                return
+            }
+            let scale = this.view.scale
+            this.view.scaleByPoint(val / scale, this.canvasWidth / 2, this.canvasHeight / 2)
+        },
+        showText(val) {
+            this.topologyParser.zoneLegendList.forEach(t => {
+                t.showText = val
+            })
+        },
+        // 读取数据
+        readGroup(FloorID) {
+            const data = {
+                BuildingID: '1',
+                FloorID: FloorID,
+                categoryId: this.categoryId ? this.categoryId : this.$cookie.get('categoryId'),
+                projectId: this.urlMsg.ProjectID
+            }
+            return readGroup(data)
+        },
+        // 地图尺寸
+        mapSize() {
+            if (window.screen.height == '768') {
+                this.canvasWidth = this.$refs.graphy.offsetWidth
+                this.canvasHeight = this.$refs.graphy.offsetHeight - 100
+            } else {
+                this.canvasWidth = this.$refs.graphy.offsetWidth
+                this.canvasHeight = 900
+            }
+        },
+        getEvent() {
+            bus.$on('changeShow', res => {
+                this.topologyParser.zoneLegendList.forEach(t => {
+                    let id = t.data.GraphElementId
+                    t.maskFlag = !(res.indexOf(id) > -1)
+                })
+                this.topologyParser.textMarkerList.forEach(t => {
+                    let id = t.data.GraphElementId
+                    t.maskFlag = !(res.indexOf(id) > -1)
+                })
+                this.topologyParser.imageMarkerList.forEach(t => {
+                    let id = t.data.GraphElementId
+                    t.maskFlag = !(res.indexOf(id) > -1)
+                })
+                this.topologyParser.lineMarkerList.forEach(t => {
+                    let id = t.data.GraphElementId
+                    t.maskFlag = !(res.indexOf(id) > -1)
+                })
+                this.topologyParser.imageLegendList.forEach(t => {
+                    let id = t.data.GraphElementId
+                    t.maskFlag = !(res.indexOf(id) > -1)
+                })
+                this.topologyParser.relationList.forEach(t => {
+                    let id = t.data.GraphElementId
+                    t.maskFlag = !(res.indexOf(id) > -1)
+                })
+            })
         }
-        this.topologyParser = new STopologyParser(null);
-        this.topologyParser.parseData(data.Data[0].Elements);
-        // 多边形
-        this.topologyParser.zoneLegendList.forEach(t => {
-          this.scene.addItem(t);
-        });
-        // 增加文字
-        this.topologyParser.textMarkerList.forEach(t => {
-          this.scene.addItem(t);
-        });
-        // 增加图片
-        this.topologyParser.imageMarkerList.forEach(t => {
-          this.scene.addItem(t);
-        });
-        // 增加直线
-        this.topologyParser.lineMarkerList.forEach(t => {
-          this.scene.addItem(t);
-        });
-        // 增加图标类图例
-        this.topologyParser.imageLegendList.forEach(t => {
-          this.scene.addItem(t);
-        });
-        // 增加管线类
-        // 增加图标类图例
-        this.topologyParser.relationList.forEach(t => {
-          this.scene.addItem(t);
-        });
-        this.view.fitSceneToView();
-      });
-    },
-    clearGraphy() {
-      if (this.view) {
-        this.view.scene = null;
-        return;
-      }
-      this.view = new FloorView(`canvas${this.id}`);
-    },
-    listChange(item, ev) {
-      let name = ev[0][0].data.Name;
-      if (name.slice(name.length - 2, name.length) == "机房") {
-        this.$refs.boxRoom.open({ name: name, type: this.type });
-      }
-    },
-    // 适配底图到窗口
-    fit() {
-      this.view.fitSceneToView();
     },
-    // 保存为png
-    savePng() {
-      this.view.saveImage(`${this.loadName}.png`, "png");
-      //console.log(`${this.loadName}.png`)
-    },
-    // 保存为svg
-    saveSvg() {
-      this.view.saveSceneSvg(`${this.loadName}.svg`, 6400, 4800);
-    },
-    // 保存为json
-    saveJson() {
-      this.view.saveFloorJson(`${this.loadName}.json`);
-    },
-    // 缩放
-    scale(val) {
-      if (!this.view) {
-        return;
-      }
-      let scale = this.view.scale;
-      this.view.scaleByPoint(
-        val / scale,
-        this.canvasWidth / 2,
-        this.canvasHeight / 2
-      );
-    },
-    showText() {
-        this.topologyParser.zoneLegendList.forEach(t => {
-          t.showText = !t.showText;
-        })
-    },
-    // 读取数据
-    readGroup(FloorID) {
-      const data = {
-        BuildingID: "1",
-        FloorID: FloorID,
-        categoryId: this.categoryId ? this.categoryId : this.$cookie.get("categoryId"),
-        projectId: this.urlMsg.ProjectID
-      };
-      return readGroup(data);
+    watch: {
+        'view.scale': {
+            handler(n) {
+                if (this.$refs.canvasFun) {
+                    let s = (n * 10) / this.view.minScale
+                    this.$refs.canvasFun.sliderVal = s > 1000 ? 1000 : s
+                }
+            }
+        },
+        haveFengMap(val) {
+            if (val) {
+                this.init(this.floorid)
+            }
+        }
     },
-    // 地图尺寸
-    mapSize() {
-      if (window.screen.height == "768") {
-        this.canvasWidth = this.$refs.graphy.offsetWidth;
-        this.canvasHeight = this.$refs.graphy.offsetHeight - 100;
-      } else {
-        this.canvasWidth = this.$refs.graphy.offsetWidth;
-        this.canvasHeight = 900;
-      }
+    mounted() {
+        this.mapSize()
+        this.getEvent()
     },
-    getEvent() {
-      bus.$on('changeShow', res => {
-        this.topologyParser.zoneLegendList.forEach(t => {
-          let id = t.data.GraphElementId
-          t.maskFlag = !(res.indexOf(id) > -1)
-        })
-        this.topologyParser.textMarkerList.forEach(t => {
-          let id = t.data.GraphElementId
-          t.maskFlag = !(res.indexOf(id) > -1)
-        });
-        this.topologyParser.imageMarkerList.forEach(t => {
-          let id = t.data.GraphElementId
-          t.maskFlag = !(res.indexOf(id) > -1)
-        });
-        this.topologyParser.lineMarkerList.forEach(t => {
-          let id = t.data.GraphElementId
-          t.maskFlag = !(res.indexOf(id) > -1)
-        });
-        this.topologyParser.imageLegendList.forEach(t => {
-          let id = t.data.GraphElementId
-          t.maskFlag = !(res.indexOf(id) > -1)
-        });
-        this.topologyParser.relationList.forEach(t => {
-          let id = t.data.GraphElementId
-          t.maskFlag = !(res.indexOf(id) > -1)
-        });
-      })
-    }
-  },
-  watch: {
-    "view.scale": {
-      handler(n) {
-        if (this.$refs.canvasFun) {
-          let s = (n * 10) / this.view.minScale;
-          this.$refs.canvasFun.sliderVal = s > 1000 ? 1000 : s;
+    created() {
+        this.urlMsg = {
+            categoryId: this.$cookie.get('categoryId'),
+            ProjectID: this.plazaId,
+            BuildingID: '1',
+            FloorID: this.$cookie.get('floorMapId') || 'f1',
+            fmapID: this.fmapID
         }
-      }
-    },
-    haveFengMap(val) {
-      if (val) {
-        this.init(this.floorid);
-      }
     }
-  },
-  mounted() {
-    this.mapSize();
-    this.getEvent()
-  },
-  created() {
-    this.urlMsg = {
-      categoryId: this.$cookie.get("categoryId"),
-      ProjectID: this.plazaId,
-      BuildingID: "1",
-      FloorID: this.$cookie.get("floorMapId") || "f1",
-      fmapID: this.fmapID
-    };
-  }
-};
+}
 </script>
 <style lang="less" scoped>
 #floor_base {
-  position: relative;
-  .fengMap {
-    position: fixed;
-    width: 100px;
-    height: 100px;
-    z-index: -1;
-  }
-  .strip-bottom {
-    position: absolute;
-    right: 0;
-    bottom: 40px;
-    width: 100%;
-  }
+    position: relative;
+    .fengMap {
+        position: fixed;
+        width: 100px;
+        height: 100px;
+        z-index: -1;
+    }
+    .strip-bottom {
+        position: absolute;
+        right: 0;
+        bottom: 40px;
+        width: 100%;
+    }
 }
 </style>

+ 0 - 650
src/components/mapClass/SPolygonItem.js

@@ -1,650 +0,0 @@
-/*
- * ********************************************************************************************************************
- *
- *                      :*$@@%$*:                         ;:                ;;    ;;
- *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
- *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
- *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
- *                   =@*                                  %!              @ $= % %@=   =%@!      %=
- *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
- *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
- *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
- *          $@*   ;@@@%=!:                *@*
- *          =@$    ;;;!=%@@@@=!           =@!
- *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
- *            ;%@@$=$@@%*       *@@@$=%@@%;
- *               ::;::             ::;::                                              All rights reserved.
- *
- * ********************************************************************************************************************
- */
-import { SGraphItem, SGraphPointListInsert, SGraphPointListDelete, SGraphPointListUpdate } from "@saga-web/graph/lib";
-import { SUndoStack } from "@saga-web/base/";
-;
-import { SColor, SLineCapStyle, SPoint, SRect, SLine, SPolygonUtil } from "@saga-web/draw";
-import { SMathUtil } from "@saga-web/big/lib/utils/SMathUtil";
-import { SItemStatus } from "@saga-web/big";
-/**
- * 编辑多边形
- *
- * @author  韩耀龙
- */
-export class SPolygonItem extends SGraphItem {
-    /**
-    * 构造函数
-    *
-    * @param parent    指向父对象
-    * @param data      PolygonData数据
-    */
-    constructor(parent) {
-        super(parent);
-        /** X坐标最小值  */
-        this.minX = Number.MAX_SAFE_INTEGER;
-        /** X坐标最大值  */
-        this.maxX = Number.MIN_SAFE_INTEGER;
-        /** Y坐标最小值  */
-        this.minY = Number.MAX_SAFE_INTEGER;
-        /** Y坐标最大值  */
-        this.maxY = Number.MIN_SAFE_INTEGER;
-        /** 轮廓线坐标  */
-        this.pointList = [];
-        /** 是否闭合    */
-        this.closeFlag = false;
-        // 当前状态
-        this._status = SItemStatus.Normal;
-        this.data = null;
-        /** 边框颜色 */
-        this._strokeColor = new SColor("#0091FF");
-        /** 填充颜色 */
-        this._fillColor = new SColor("#1EE887");
-        /** 边框的宽 只可输入像素宽*/
-        this._lineWidth = 4;
-        /** 鼠标移动点  */
-        this.lastPoint = null;
-        /** 当前鼠标获取顶点对应索引 */
-        this.curIndex = -1;
-        /** 当前鼠标获取顶点对应坐标 */
-        this.curPoint = null;
-        /** 灵敏像素 */
-        this.len = 10;
-        /** 场景像素 内部将灵敏像素换算为场景实际距离  */
-        this.scenceLen = 15;
-        /** 场景像素  */
-        this.isAlt = false;
-        /** undoredo堆栈 */
-        this.undoStack = new SUndoStack();
-    }
-    // 获取当前状态
-    get getPointList() {
-        return this.pointList;
-    }
-    // 编辑当前状态
-    set setPointList(arr) {
-        this.pointList = arr;
-        this.update();
-    }
-    ;
-    // 获取当前状态
-    get status() {
-        return this._status;
-    }
-    // 编辑当前状态
-    set status(value) {
-        this._status = value;
-        // 如果状态为show则需清栈
-        if (value == SItemStatus.Normal) {
-            if (this.undoStack) {
-                this.undoStack.clear();
-            }
-        }
-        this.update();
-    }
-    ;
-    /**  画笔颜色 */
-    get strokeColor() {
-        return this._strokeColor;
-    }
-    ;
-    set strokeColor(v) {
-        this._strokeColor = v;
-        this.update();
-    }
-    get fillColor() {
-        return this._fillColor;
-    }
-    ;
-    set fillColor(v) {
-        this._fillColor = v;
-        this.update();
-    }
-    get lineWidth() {
-        return this._lineWidth;
-    }
-    set lineWidth(v) {
-        this._lineWidth = v;
-        this.update();
-    }
-    ;
-    //////////////////
-    //  以下为对pointList 数组的操作方法
-    /**
-     * 储存新的多边形顶点
-     *
-     * @param x   点位得x坐标
-     * @param y   点位得y坐标
-     * @param i   储存所在索引
-     * @return SPoint。添加的顶点
-     */
-    insertPoint(x, y, i = null) {
-        const point = new SPoint(x, y);
-        if (i == null) {
-            this.pointList.push(point);
-        }
-        else {
-            this.pointList.splice(i, 0, point);
-        }
-        this.update();
-        return point;
-    }
-    /**
-     * 删除点位
-     *
-     * @param i   删除点所在的索引
-     * @return    SPoint|null。索引不在数组范围则返回null
-     */
-    deletePoint(i = null) {
-        let point = null;
-        if (i != null) {
-            if (i >= (this.pointList.length) || i < 0) {
-                point = null;
-            }
-            else {
-                point = new SPoint(this.pointList[i].x, this.pointList[i].y);
-                this.pointList.splice(i, 1);
-            }
-        }
-        else {
-            if (this.pointList.length) {
-                point = this.pointList[this.pointList.length - 1];
-                this.pointList.pop();
-            }
-            else {
-                point = null;
-            }
-        }
-        this.update();
-        return point;
-    }
-    /**
-     * 多边形顶点的移动位置
-     *
-     * @param x   点位得x坐标
-     * @param y   点位得y坐标
-     * @param i   点位得i坐标
-     * @return    移动对应得点。如果索引无法找到移动顶点,则返回null
-     */
-    movePoint(x, y, i) {
-        let point = null;
-        if (i >= (this.pointList.length) || i < 0) {
-            return null;
-        }
-        if (this.pointList.length) {
-            this.pointList[i].x = x;
-            this.pointList[i].y = y;
-        }
-        point = this.pointList[i];
-        return point;
-    }
-    /**
-     * 打印出多边形数组
-     *
-     * @return  顶点数组
-     */
-    PrintPointList() {
-        return this.pointList;
-    }
-    ////////////
-    //  以下为三种状态下的绘制多边形方法
-    /**
-     * 展示状态 --绘制多边形数组
-     *
-     * @param painter      绘制类
-     * @param pointList    绘制多边形数组
-     */
-    drawShowPolygon(painter, pointList) {
-        painter.save();
-        painter.pen.lineCapStyle = SLineCapStyle.Square;
-        painter.pen.color = this._strokeColor;
-        painter.pen.lineWidth = painter.toPx(this._lineWidth);
-        painter.brush.color = this._fillColor;
-        if (this.selected) {
-            painter.shadow.shadowBlur = 10;
-            painter.shadow.shadowColor = new SColor(`#00000060`);
-            painter.shadow.shadowOffsetX = 5;
-            painter.shadow.shadowOffsetY = 5;
-        }
-        else {
-            painter.shadow.shadowColor = SColor.Transparent;
-        }
-        painter.drawPolygon([...pointList]);
-        painter.restore();
-    }
-    /**
-     * 创建状态 --绘制多边形数组
-     *
-     * @param painter      绘制类
-     * @param pointList    绘制多边形数组
-     */
-    drawCreatePolygon(painter, pointList) {
-        painter.pen.lineCapStyle = SLineCapStyle.Square;
-        painter.pen.color = this._strokeColor;
-        painter.pen.lineWidth = painter.toPx(this._lineWidth);
-        if (this.lastPoint && pointList.length) {
-            painter.drawLine(pointList[pointList.length - 1].x, pointList[pointList.length - 1].y, this.lastPoint.x, this.lastPoint.y);
-        }
-        painter.drawPolyline(pointList);
-        painter.pen.color = SColor.Transparent;
-        painter.brush.color = new SColor(this._fillColor.value + "80");
-        painter.pen.lineWidth = painter.toPx(this._lineWidth);
-        if (this.lastPoint) {
-            painter.drawPolygon([...pointList, this.lastPoint]);
-            // 绘制顶点块
-            painter.pen.color = SColor.Black;
-            painter.brush.color = SColor.White;
-            pointList.forEach((item, index) => {
-                painter.drawCircle(item.x, item.y, painter.toPx(this.len / 2));
-            });
-        }
-        else {
-            painter.drawPolygon(pointList);
-        }
-    }
-    /**
-     *
-     * 编辑状态 --绘制多边形数组
-     *
-     * @param painter    绘制类
-     * @param pointList    绘制多边形数组
-     */
-    drawEditPolygon(painter, pointList) {
-        // 展示多边形
-        painter.pen.lineCapStyle = SLineCapStyle.Square;
-        painter.pen.color = this._strokeColor;
-        painter.pen.lineWidth = painter.toPx(this._lineWidth);
-        painter.brush.color = new SColor(this._fillColor.value + "80");
-        painter.drawPolygon([...pointList]);
-        // 绘制顶点块
-        painter.pen.color = SColor.Black;
-        painter.brush.color = SColor.White;
-        pointList.forEach((item, index) => {
-            painter.drawCircle(item.x, item.y, painter.toPx(this.len / 2));
-        });
-    }
-    /**
-     * 编辑状态操作多边形数组
-     *
-     * @param event    鼠标事件
-     *
-     *
-     */
-    editPolygonPoint(event) {
-        //  判断是否为删除状态 isAlt = true为删除状态
-        if (this.isAlt) {
-            // 1 判断是否点击在多边形顶点
-            let lenIndex = -1; // 当前点击到的点位索引;
-            let curenLen = this.scenceLen; // 当前的灵敏度
-            this.pointList.forEach((item, index) => {
-                let dis = SMathUtil.pointDistance(event.x, event.y, item.x, item.y);
-                if (dis < curenLen) {
-                    curenLen = dis;
-                    lenIndex = index;
-                }
-            });
-            // 若点击到,对该索引对应的点做删除
-            if (lenIndex != -1) {
-                if (this.pointList.length <= 3) {
-                    return;
-                }
-                const delePoint = new SPoint(this.pointList[lenIndex].x, this.pointList[lenIndex].y);
-                this.deletePoint(lenIndex);
-                // 记录顶点操作记录压入堆栈
-                this.recordAction(SGraphPointListDelete, [this.pointList, delePoint, lenIndex]);
-            }
-        }
-        else {
-            // 1 判断是否点击在多边形顶点
-            this.curIndex = -1;
-            this.curPoint = null;
-            let lenIndex = -1; // 当前点击到的点位索引;
-            let curenLen = this.scenceLen; // 当前的灵敏度
-            this.pointList.forEach((item, index) => {
-                let dis = SMathUtil.pointDistance(event.x, event.y, item.x, item.y);
-                if (dis < curenLen) {
-                    curenLen = dis;
-                    lenIndex = index;
-                }
-            });
-            this.curIndex = lenIndex;
-            // 2判断是否点击在多边形得边上
-            if (-1 == lenIndex) {
-                let len = SMathUtil.pointToLine(new SPoint(event.x, event.y), new SLine(this.pointList[0], this.pointList[1])), index = 0;
-                if (this.pointList.length > 2) {
-                    for (let i = 1; i < this.pointList.length; i++) {
-                        let dis = SMathUtil.pointToLine(new SPoint(event.x, event.y), new SLine(this.pointList[i], this.pointList[i + 1]));
-                        if ((i + 1) == this.pointList.length) {
-                            dis = SMathUtil.pointToLine(new SPoint(event.x, event.y), new SLine(this.pointList[i], this.pointList[0]));
-                        }
-                        if (dis.MinDis < len.MinDis) {
-                            len = dis;
-                            index = i;
-                        }
-                    }
-                }
-                // 判断是否有点
-                if (len.Point) {
-                    console.log(index, len.Point);
-                    // 点在了多边形的边上
-                    if (len.MinDis <= this.scenceLen) {
-                        this.pointList.splice(index + 1, 0, len.Point);
-                        // 记录新增顶点操作记录压入堆栈
-                        this.recordAction(SGraphPointListInsert, [this.pointList, len.Point, index + 1]);
-                    }
-                    else { //没点在多边形边上也没点在多边形顶点上
-                        super.onMouseDown(event);
-                    }
-                }
-            }
-            else {
-                // 当捕捉到顶点后 ,记录当前点的xy坐标,用于undo、redo操作
-                this.curPoint = new SPoint(this.pointList[this.curIndex].x, this.pointList[this.curIndex].y);
-            }
-            // 刷新视图
-            this.update();
-        }
-    }
-    /////////////////////
-    // undo、redo相关操作
-    /**
-     * 记录相关动作并推入栈中
-     * @param	SGraphCommand         相关命令类
-     * @param	any                    对应传入参数
-     */
-    recordAction(SGraphCommand, any) {
-        // 记录相关命令并推入堆栈中
-        const sgraphcommand = new SGraphCommand(this, ...any);
-        if (this.undoStack) {
-            this.undoStack.push(sgraphcommand);
-        }
-    }
-    /**
-     * 执行取消操作执行
-     */
-    undo() {
-        if (this.status == SItemStatus.Normal) {
-            return;
-        }
-        if (this.undoStack) {
-            this.undoStack.undo();
-        }
-    }
-    /**
-     * 执行重做操作执行
-     */
-    redo() {
-        if (this.status == SItemStatus.Normal) {
-            return;
-        }
-        if (this.undoStack) {
-            this.undoStack.redo();
-        }
-    }
-    ///////////////////////////////
-    // 以下为鼠标事件
-    /**
-     * 鼠标双击事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onDoubleClick(event) {
-        console.log(event);
-        // 如果位show状态 双击改对象则需改为编辑状态
-        if (SItemStatus.Normal == this.status) {
-            this.status = SItemStatus.Edit;
-            this.grabItem(this);
-        }
-        else if (SItemStatus.Edit == this.status) {
-            this.status = SItemStatus.Normal;
-            this.releaseItem();
-            if (this.undoStack) {
-                this.undoStack.clear();
-            }
-        }
-        this.update();
-        return true;
-    } // Function onDoubleClick()
-    /**
-     * 键盘事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onKeyDown(event) {
-        if (this.status == SItemStatus.Normal) {
-            return false;
-        }
-        else if (this.status == SItemStatus.Create) {
-            if (event.code == 'Enter') {
-                // 当顶点大于二个时才又条件执行闭合操作并清空堆栈
-                if (this.pointList.length > 2) {
-                    this.status = SItemStatus.Normal;
-                    //3 传递完成事件状态
-                    this.$emit('finishCreated');
-                    //1 grabItem 置为null
-                    this.releaseItem();
-                    //2 清空undo
-                    if (this.undoStack) {
-                        this.undoStack.clear();
-                    }
-                }
-            }
-        }
-        else if (this.status == SItemStatus.Edit) {
-            if (event.key == 'Alt') {
-                this.isAlt = true;
-            }
-        }
-        this.update();
-        return true;
-    } // Function onKeyDown()
-    /**
-     * 键盘键抬起事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onKeyUp(event) {
-        if (this.status == SItemStatus.Edit) {
-            if (event.key == 'Alt') {
-                this.isAlt = false;
-            }
-        }
-        this.update();
-    } // Function onKeyUp()
-    /**
-     * 鼠标按下事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onMouseDown(event) {
-        // 如果状态为编辑状态则添加点
-        if (this.status == SItemStatus.Create) {
-            // 新增顶点
-            this.insertPoint(event.x, event.y);
-            // 记录新增顶点操作记录压入堆栈
-            let pos = new SPoint(event.x, event.y);
-            this.recordAction(SGraphPointListInsert, [this.pointList, pos]);
-        }
-        else if (this.status == SItemStatus.Edit) {
-            // 对多边形数组做编辑操作
-            this.editPolygonPoint(event);
-        }
-        else {
-            return super.onMouseDown(event);
-        }
-        return true;
-    } // Function onMouseDown()
-    /**
-     * 鼠标移入事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onMouseEnter(event) {
-        return true;
-    } // Function onMouseEnter()
-    /**
-     * 鼠标移出事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onMouseLeave(event) {
-        return true;
-    } // Function onMouseLeave()
-    /**
-     * 鼠标移动事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onMouseMove(event) {
-        if (this.status == SItemStatus.Create) {
-            this.lastPoint = new SPoint;
-            this.lastPoint.x = event.x;
-            this.lastPoint.y = event.y;
-            this.update();
-        }
-        else if (this.status == SItemStatus.Edit) {
-            if (-1 != this.curIndex) {
-                this.pointList[this.curIndex].x = event.x;
-                this.pointList[this.curIndex].y = event.y;
-            }
-            this.update();
-        }
-        else {
-            // return super.onMouseMove(event)
-        }
-        return true;
-    } // Function onMouseMove()
-    /**
-     * 鼠标抬起事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onMouseUp(event) {
-        if (this.status == SItemStatus.Edit) {
-            if (-1 != this.curIndex) {
-                const pos = new SPoint(this.pointList[this.curIndex].x, this.pointList[this.curIndex].y);
-                this.recordAction(SGraphPointListUpdate, [this.pointList, this.curPoint, pos, this.curIndex]);
-            }
-            this.curIndex = -1;
-            this.curPoint = null;
-        }
-        else {
-            // return super.onMouseUp(event)
-        }
-        return true;
-    } // Function onMouseUp()
-    /**
-     * 适配事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onResize(event) {
-        return true;
-    } // Function onResize()
-    /**
-     * 取消操作
-     *
-     * @param   painter       painter对象
-     */
-    cancelOperate() {
-        // 当状态为展示状态
-        if (this.status == SItemStatus.Create) {
-            // 闭合多边形
-            this.parent = null;
-        }
-        else if (this.status == SItemStatus.Edit) {
-            // 编辑状态
-            this.status = SItemStatus.Normal;
-        }
-        this.update();
-    } // Function cancelOperate()
-    /**
-     * Item对象边界区域
-     *
-     * @return SRect
-     */
-    boundingRect() {
-        if (this.pointList.length) {
-            this.minX = this.pointList[0].x;
-            this.maxX = this.pointList[0].x;
-            this.minY = this.pointList[0].y;
-            this.maxY = this.pointList[0].y;
-            this.pointList.forEach(it => {
-                let x = it.x, y = it.y;
-                if (x < this.minX) {
-                    this.minX = x;
-                }
-                if (y < this.minY) {
-                    this.minY = y;
-                }
-                if (x > this.maxX) {
-                    this.maxX = x;
-                }
-                if (y > this.maxY) {
-                    this.maxY = y;
-                }
-            });
-        }
-        ;
-        return new SRect(this.minX, this.minY, this.maxX - this.minX, this.maxY - this.minY);
-    } // Function boundingRect()
-    /**
-     * 判断点是否在区域内
-     *
-     * @param x
-     * @param y
-     */
-    contains(x, y) {
-        let arr = this.pointList;
-        if (arr.length < 3 || !SPolygonUtil.pointIn(x, y, arr)) {
-            return false;
-        }
-        return true;
-    } // Function contains()
-    /**
-     * Item绘制操作
-     *
-     * @param   painter       painter对象
-     */
-    onDraw(painter) {
-        this.scenceLen = painter.toPx(this.len);
-        // 当状态为展示状态
-        if (this.status == SItemStatus.Normal) {
-            // 闭合多边形
-            this.drawShowPolygon(painter, this.pointList);
-        }
-        else if (this.status == SItemStatus.Create) {
-            // 创建状态
-            this.drawCreatePolygon(painter, this.pointList);
-        }
-        else {
-            // 编辑状态
-            this.drawEditPolygon(painter, this.pointList);
-        }
-    } // Function onDraw()
-}

+ 0 - 704
src/components/mapClass/SPolygonItem.ts

@@ -1,704 +0,0 @@
-/*
- * ********************************************************************************************************************
- *
- *                      :*$@@%$*:                         ;:                ;;    ;;
- *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
- *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
- *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
- *                   =@*                                  %!              @ $= % %@=   =%@!      %=
- *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
- *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
- *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
- *          $@*   ;@@@%=!:                *@*
- *          =@$    ;;;!=%@@@@=!           =@!
- *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
- *            ;%@@$=$@@%*       *@@@$=%@@%;
- *               ::;::             ::;::                                              All rights reserved.
- *
- * ********************************************************************************************************************
- */
-import { SGraphItem, SGraphPointListInsert, SGraphPointListDelete, SGraphPointListUpdate } from "@saga-web/graph/lib";
-import { SMouseEvent, SUndoStack } from "@saga-web/base/";;
-import {
-    SColor,
-    SLineCapStyle,
-    SPainter,
-    SPoint,
-    SRect,
-    SLine,
-    SPolygonUtil
-} from "@saga-web/draw";
-import { SMathUtil } from "@saga-web/big/lib/utils/SMathUtil";
-import { SItemStatus } from "@saga-web/big";
-
-/**
- * 编辑多边形
- *
- * @author  韩耀龙
- */
-export class SPolygonItem extends SGraphItem {
-    /** X坐标最小值  */
-    private minX = Number.MAX_SAFE_INTEGER;
-    /** X坐标最大值  */
-    private maxX = Number.MIN_SAFE_INTEGER;
-    /** Y坐标最小值  */
-    private minY = Number.MAX_SAFE_INTEGER;
-    /** Y坐标最大值  */
-    private maxY = Number.MIN_SAFE_INTEGER;
-    /** 轮廓线坐标  */
-    private pointList: SPoint[] = [];
-    // 获取当前状态
-    get getPointList(): SPoint[] {
-        return this.pointList;
-    }
-    // 编辑当前状态
-    set setPointList(arr: SPoint[]) {
-        this.pointList = arr;
-        this.update();
-    };
-    /** 是否闭合    */
-    closeFlag: boolean = false;
-    // 当前状态
-    protected _status: number = SItemStatus.Normal;
-    // 获取当前状态
-    get status(): SItemStatus {
-        return this._status;
-    }
-    // 编辑当前状态
-    set status(value: SItemStatus) {
-        this._status = value;
-        // 如果状态为show则需清栈
-        if (value == SItemStatus.Normal) {
-            if (this.undoStack) {
-                this.undoStack.clear();
-            }
-        }
-        this.update();
-    };
-    data: any | null = null;
-    /** 边框颜色 */
-    _strokeColor: SColor = new SColor("#0091FF");
-    /**  画笔颜色 */
-    get strokeColor(): SColor {
-        return this._strokeColor
-    };
-    set strokeColor(v: SColor) {
-        this._strokeColor = v;
-        this.update()
-    }
-    /** 填充颜色 */
-    _fillColor: SColor = new SColor("#1EE887");
-    get fillColor(): SColor {
-        return this._fillColor
-    };
-    set fillColor(v: SColor) {
-        this._fillColor = v;
-        this.update()
-    }
-
-    /** 边框的宽 只可输入像素宽*/
-    _lineWidth: number = 4;
-    get lineWidth(): number {
-        return this._lineWidth
-    }
-    set lineWidth(v: number) {
-        this._lineWidth = v;
-        this.update();
-    };
-    /** 鼠标移动点  */
-    private lastPoint: SPoint | null = null;
-    /** 当前鼠标获取顶点对应索引 */
-    private curIndex: number = -1;
-    /** 当前鼠标获取顶点对应坐标 */
-    private curPoint: null | SPoint = null
-    /** 灵敏像素 */
-    private len: number = 10;
-    /** 场景像素 内部将灵敏像素换算为场景实际距离  */
-    private scenceLen: number = 15;
-    /** 场景像素  */
-    private isAlt: boolean = false;
-    /** undoredo堆栈 */
-    protected undoStack: SUndoStack | null = new SUndoStack();
-
-    /**
-    * 构造函数
-    *
-    * @param parent    指向父对象
-    * @param data      PolygonData数据
-    */
-    constructor(parent: SGraphItem | null) {
-        super(parent);
-    }
-
-    //////////////////
-    //  以下为对pointList 数组的操作方法
-
-    /**
-     * 储存新的多边形顶点
-     *
-     * @param x   点位得x坐标
-     * @param y   点位得y坐标
-     * @param i   储存所在索引
-     * @return SPoint。添加的顶点
-     */
-    insertPoint(x: number, y: number, i: number | null = null): SPoint {
-        const point = new SPoint(x, y);
-        if (i == null) {
-            this.pointList.push(point)
-        } else {
-            this.pointList.splice(i, 0, point);
-        }
-        this.update()
-        return point
-    }
-
-    /**
-     * 删除点位
-     *
-     * @param i   删除点所在的索引
-     * @return    SPoint|null。索引不在数组范围则返回null
-     */
-    deletePoint(i: number | null = null): SPoint | null {
-        let point = null;
-        if (i != null) {
-            if (i >= (this.pointList.length) || i < 0) {
-                point = null
-            } else {
-                point = new SPoint(this.pointList[i].x, this.pointList[i].y);
-                this.pointList.splice(i, 1);
-            }
-        } else {
-            if (this.pointList.length) {
-                point = this.pointList[this.pointList.length - 1];
-                this.pointList.pop();
-            } else {
-                point = null
-            }
-        }
-        this.update()
-        return point
-    }
-
-    /**
-     * 多边形顶点的移动位置
-     *
-     * @param x   点位得x坐标
-     * @param y   点位得y坐标
-     * @param i   点位得i坐标
-     * @return    移动对应得点。如果索引无法找到移动顶点,则返回null
-     */
-    movePoint(x: number, y: number, i: number, ): SPoint | null {
-        let point = null;
-        if (i >= (this.pointList.length) || i < 0) {
-            return null
-        }
-        if (this.pointList.length) {
-            this.pointList[i].x = x;
-            this.pointList[i].y = y;
-        }
-        point = this.pointList[i];
-        return point
-    }
-
-    /**
-     * 打印出多边形数组
-     *
-     * @return  顶点数组
-     */
-    PrintPointList(): SPoint[] {
-        return this.pointList
-    }
-
-    ////////////
-    //  以下为三种状态下的绘制多边形方法
-
-    /**
-     * 展示状态 --绘制多边形数组
-     *
-     * @param painter      绘制类
-     * @param pointList    绘制多边形数组
-     */
-    protected drawShowPolygon(painter: SPainter, pointList: SPoint[]): void {
-        painter.save();
-        painter.pen.lineCapStyle = SLineCapStyle.Square;
-        painter.pen.color = this._strokeColor;
-        painter.pen.lineWidth = painter.toPx(this._lineWidth);
-        painter.brush.color = this._fillColor;
-        if (this.selected) {
-            painter.shadow.shadowBlur = 10;
-            painter.shadow.shadowColor = new SColor(`#00000060`);
-            painter.shadow.shadowOffsetX = 5;
-            painter.shadow.shadowOffsetY = 5;
-        } else {
-            painter.shadow.shadowColor = SColor.Transparent;
-        }
-        painter.drawPolygon([...pointList]);
-        painter.restore();
-    }
-
-
-    /**
-     * 创建状态 --绘制多边形数组
-     *
-     * @param painter      绘制类
-     * @param pointList    绘制多边形数组
-     */
-    protected drawCreatePolygon(painter: SPainter, pointList: SPoint[]): void {
-        painter.pen.lineCapStyle = SLineCapStyle.Square;
-        painter.pen.color = this._strokeColor;
-        painter.pen.lineWidth = painter.toPx(this._lineWidth);
-        if (this.lastPoint && pointList.length) {
-            painter.drawLine(pointList[pointList.length - 1].x, pointList[pointList.length - 1].y, this.lastPoint.x, this.lastPoint.y);
-        }
-        painter.drawPolyline(pointList);
-        painter.pen.color = SColor.Transparent;
-        painter.brush.color = new SColor(this._fillColor.value + "80");
-        painter.pen.lineWidth = painter.toPx(this._lineWidth);
-
-        if (this.lastPoint) {
-            painter.drawPolygon([...pointList, this.lastPoint]);
-            // 绘制顶点块
-            painter.pen.color = SColor.Black;
-            painter.brush.color = SColor.White;
-            pointList.forEach((item, index) => {
-                painter.drawCircle(item.x, item.y, painter.toPx(this.len / 2))
-            });
-        } else {
-            painter.drawPolygon(pointList);
-        }
-
-    }
-
-    /**
-     *
-     * 编辑状态 --绘制多边形数组
-     *
-     * @param painter    绘制类
-     * @param pointList    绘制多边形数组
-     */
-    protected drawEditPolygon(painter: SPainter, pointList: SPoint[]): void {
-        // 展示多边形
-        painter.pen.lineCapStyle = SLineCapStyle.Square;
-        painter.pen.color = this._strokeColor;
-        painter.pen.lineWidth = painter.toPx(this._lineWidth);
-        painter.brush.color = new SColor(this._fillColor.value + "80");
-        painter.drawPolygon([...pointList]);
-        // 绘制顶点块
-        painter.pen.color = SColor.Black;
-        painter.brush.color = SColor.White;
-        pointList.forEach((item, index) => {
-            painter.drawCircle(item.x, item.y, painter.toPx(this.len / 2))
-        })
-    }
-
-    /**
-     * 编辑状态操作多边形数组
-     *
-     * @param event    鼠标事件
-     *
-     *
-     */
-    protected editPolygonPoint(event: SMouseEvent): void {
-        //  判断是否为删除状态 isAlt = true为删除状态
-        if (this.isAlt) {
-            // 1 判断是否点击在多边形顶点
-            let lenIndex = -1;  // 当前点击到的点位索引;
-            let curenLen = this.scenceLen; // 当前的灵敏度
-            this.pointList.forEach((item, index) => {
-                let dis = SMathUtil.pointDistance(
-                    event.x,
-                    event.y,
-                    item.x,
-                    item.y
-                );
-                if (dis < curenLen) {
-                    curenLen = dis;
-                    lenIndex = index;
-                }
-            });
-            // 若点击到,对该索引对应的点做删除
-            if (lenIndex != -1) {
-                if (this.pointList.length <= 3) {
-                    return
-                }
-                const delePoint = new SPoint(this.pointList[lenIndex].x, this.pointList[lenIndex].y)
-                this.deletePoint(lenIndex);
-                // 记录顶点操作记录压入堆栈
-                this.recordAction(SGraphPointListDelete, [this.pointList, delePoint, lenIndex]);
-            }
-        } else {
-            // 1 判断是否点击在多边形顶点
-            this.curIndex = -1;
-            this.curPoint = null;
-            let lenIndex = -1;  // 当前点击到的点位索引;
-            let curenLen = this.scenceLen; // 当前的灵敏度
-            this.pointList.forEach((item, index) => {
-                let dis = SMathUtil.pointDistance(
-                    event.x,
-                    event.y,
-                    item.x,
-                    item.y
-                );
-                if (dis < curenLen) {
-                    curenLen = dis;
-                    lenIndex = index;
-                }
-            });
-            this.curIndex = lenIndex;
-            // 2判断是否点击在多边形得边上
-            if (-1 == lenIndex) {
-                let len = SMathUtil.pointToLine(
-                    new SPoint(event.x, event.y),
-                    new SLine(this.pointList[0], this.pointList[1])
-                ),
-                    index = 0;
-                if (this.pointList.length > 2) {
-                    for (let i = 1; i < this.pointList.length; i++) {
-                        let dis = SMathUtil.pointToLine(
-                            new SPoint(event.x, event.y),
-                            new SLine(this.pointList[i], this.pointList[i + 1])
-                        );
-                        if ((i + 1) == this.pointList.length) {
-                            dis = SMathUtil.pointToLine(
-                                new SPoint(event.x, event.y),
-                                new SLine(this.pointList[i], this.pointList[0])
-                            );
-                        }
-                        if (dis.MinDis < len.MinDis) {
-                            len = dis;
-                            index = i;
-                        }
-                    }
-                }
-                // 判断是否有点
-                if (len.Point) {
-                    console.log(index,len.Point);
-                    // 点在了多边形的边上
-                    if (len.MinDis <= this.scenceLen) {
-                        this.pointList.splice(index + 1, 0, len.Point);
-                        // 记录新增顶点操作记录压入堆栈
-                        this.recordAction(SGraphPointListInsert, [this.pointList, len.Point, index + 1]);
-                    } else { //没点在多边形边上也没点在多边形顶点上
-                        super.onMouseDown(event);
-                    }
-                }
-            } else {
-                // 当捕捉到顶点后 ,记录当前点的xy坐标,用于undo、redo操作
-                this.curPoint = new SPoint(this.pointList[this.curIndex].x, this.pointList[this.curIndex].y);
-            }
-            // 刷新视图
-            this.update();
-        }
-
-    }
-
-    /////////////////////
-    // undo、redo相关操作
-
-    /**
-     * 记录相关动作并推入栈中
-     * @param	SGraphCommand         相关命令类
-     * @param	any                    对应传入参数
-     */
-    protected recordAction(SGraphCommand: any, any: any[]): void {
-        // 记录相关命令并推入堆栈中
-        const sgraphcommand = new SGraphCommand(this, ...any);
-        if (this.undoStack) {
-            this.undoStack.push(sgraphcommand);
-        }
-    }
-
-    /**
-     * 执行取消操作执行
-     */
-    undo(): void {
-        if (this.status == SItemStatus.Normal) {
-            return
-        }
-        if (this.undoStack) {
-            this.undoStack.undo();
-        }
-    }
-
-    /**
-     * 执行重做操作执行
-     */
-    redo(): void {
-        if (this.status == SItemStatus.Normal) {
-            return
-        }
-        if (this.undoStack) {
-            this.undoStack.redo();
-        }
-    }
-
-    ///////////////////////////////
-    // 以下为鼠标事件
-
-    /**
-     * 鼠标双击事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onDoubleClick(event: SMouseEvent): boolean {
-        console.log(event)
-        // 如果位show状态 双击改对象则需改为编辑状态
-        if (SItemStatus.Normal == this.status) {
-            this.status = SItemStatus.Edit;
-            this.grabItem(this);
-        } else if (SItemStatus.Edit == this.status) {
-            this.status = SItemStatus.Normal;
-            this.releaseItem();
-            if (this.undoStack) {
-                this.undoStack.clear()
-            }
-        }
-        this.update()
-        return true;
-    } // Function onDoubleClick()
-
-
-    /**
-     * 键盘事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-
-    onKeyDown(event: KeyboardEvent): boolean {
-        if (this.status == SItemStatus.Normal) {
-            return false;
-        } else if (this.status == SItemStatus.Create) {
-            if (event.code == 'Enter') {
-                // 当顶点大于二个时才又条件执行闭合操作并清空堆栈
-                if (this.pointList.length > 2) {
-                    this.status = SItemStatus.Normal;
-                    //3 传递完成事件状态
-                    this.$emit('finishCreated')
-                    //1 grabItem 置为null
-                    this.releaseItem();
-                    //2 清空undo
-                    if (this.undoStack) {
-                        this.undoStack.clear();
-                    }
-                }
-            }
-        } else if (this.status == SItemStatus.Edit) {
-            if (event.key == 'Alt') {
-                this.isAlt = true;
-            }
-        }
-        this.update();
-        return true;
-    } // Function onKeyDown()
-
-
-    /**
-     * 键盘键抬起事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onKeyUp(event: KeyboardEvent): void {
-        if (this.status == SItemStatus.Edit) {
-            if (event.key == 'Alt') {
-                this.isAlt = false;
-            }
-        }
-        this.update()
-    } // Function onKeyUp()
-
-    /**
-     * 鼠标按下事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onMouseDown(event: SMouseEvent): boolean {
-        // 如果状态为编辑状态则添加点
-        if (this.status == SItemStatus.Create) {
-            // 新增顶点
-            this.insertPoint(event.x, event.y);
-            // 记录新增顶点操作记录压入堆栈
-            let pos = new SPoint(event.x, event.y);
-            this.recordAction(SGraphPointListInsert, [this.pointList, pos]);
-        } else if (this.status == SItemStatus.Edit) {
-            // 对多边形数组做编辑操作
-            this.editPolygonPoint(event);
-        } else {
-            return super.onMouseDown(event)
-        }
-        return true;
-
-    } // Function onMouseDown()
-
-    /**
-     * 鼠标移入事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onMouseEnter(event: SMouseEvent): boolean {
-        return true;
-    } // Function onMouseEnter()
-
-
-    /**
-     * 鼠标移出事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-
-    onMouseLeave(event: SMouseEvent): boolean {
-        return true;
-    } // Function onMouseLeave()
-
-    /**
-     * 鼠标移动事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-
-    onMouseMove(event: SMouseEvent): boolean {
-        if (this.status == SItemStatus.Create) {
-            this.lastPoint = new SPoint
-            this.lastPoint.x = event.x;
-            this.lastPoint.y = event.y;
-            this.update();
-        } else if (this.status == SItemStatus.Edit) {
-            if (-1 != this.curIndex) {
-                this.pointList[this.curIndex].x = event.x;
-                this.pointList[this.curIndex].y = event.y;
-            }
-            this.update()
-        } else {
-            // return super.onMouseMove(event)
-        }
-
-        return true;
-    } // Function onMouseMove()
-
-
-    /**
-     * 鼠标抬起事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-    onMouseUp(event: SMouseEvent): boolean {
-        if (this.status == SItemStatus.Edit) {
-            if (-1 != this.curIndex) {
-                const pos = new SPoint(this.pointList[this.curIndex].x, this.pointList[this.curIndex].y)
-                this.recordAction(SGraphPointListUpdate, [this.pointList, this.curPoint, pos, this.curIndex])
-            }
-            this.curIndex = -1;
-            this.curPoint = null;
-        } else {
-            // return super.onMouseUp(event)
-        }
-        return true;
-    } // Function onMouseUp()
-
-    /**
-     * 适配事件
-     *
-     * @param	event         事件参数
-     * @return	boolean
-     */
-
-    onResize(event: SMouseEvent): boolean {
-        return true;
-    } // Function onResize()
-
-    /**
-     * 取消操作
-     *
-     * @param   painter       painter对象
-     */
-    cancelOperate(): void {
-        // 当状态为展示状态
-        if (this.status == SItemStatus.Create) {
-            // 闭合多边形
-            this.parent = null
-        } else if (this.status == SItemStatus.Edit) {
-            // 编辑状态
-            this.status = SItemStatus.Normal
-        }
-        this.update()
-    } // Function cancelOperate()
-
-    /**
-     * Item对象边界区域
-     *
-     * @return SRect
-     */
-    boundingRect(): SRect {
-        if (this.pointList.length) {
-            this.minX = this.pointList[0].x;
-            this.maxX = this.pointList[0].x;
-            this.minY = this.pointList[0].y;
-            this.maxY = this.pointList[0].y;
-            this.pointList.forEach(it => {
-                let x = it.x,
-                    y = it.y;
-                if (x < this.minX) {
-                    this.minX = x;
-                }
-                if (y < this.minY) {
-                    this.minY = y;
-                }
-                if (x > this.maxX) {
-                    this.maxX = x;
-                }
-                if (y > this.maxY) {
-                    this.maxY = y;
-                }
-            });
-        };
-        return new SRect(
-            this.minX,
-            this.minY,
-            this.maxX - this.minX,
-            this.maxY - this.minY
-        );
-    } // Function boundingRect()
-
-    /**
-     * 判断点是否在区域内
-     *
-     * @param x
-     * @param y
-     */
-    contains(x: number, y: number): boolean {
-        let arr = this.pointList;
-        if (arr.length < 3 || !SPolygonUtil.pointIn(x, y, arr)) {
-            return false;
-        }
-        return true;
-    } // Function contains()
-
-    /**
-     * Item绘制操作
-     *
-     * @param   painter       painter对象
-     */
-    onDraw(painter: SPainter): void {
-        this.scenceLen = painter.toPx(this.len)
-        // 当状态为展示状态
-        if (this.status == SItemStatus.Normal) {
-            // 闭合多边形
-            this.drawShowPolygon(painter, this.pointList);
-        } else if (this.status == SItemStatus.Create) {
-            // 创建状态
-            this.drawCreatePolygon(painter, this.pointList)
-        } else {
-            // 编辑状态
-            this.drawEditPolygon(painter, this.pointList);
-        }
-    } // Function onDraw()
-
-
-}

+ 3 - 1
src/components/menuList.vue

@@ -68,7 +68,7 @@ export default {
         }
     },
     computed: {
-        ...mapGetters(['plazas', 'plazaId'])
+        ...mapGetters(['plazas', 'plazaId', 'fmapID'])
     },
     watch: {
         $route: 'handleRoute'
@@ -79,7 +79,9 @@ export default {
     mounted() {
         window.vm = this
         this.handleRoute(this.$route)
+        console.log(this.fmapID)
     },
+
     methods: {
         //入草稿箱
         toDrafts() {

+ 1 - 1
src/lib/GraphView.js

@@ -52,7 +52,7 @@ export class GraphView extends SCanvasView {
         canvas.clearRect(0, 0, this.width, this.height);
         canvas.pen.lineWidth = this.lineWidth;
         if (this.lineType == 'dashed') {
-            canvas.pen.lineDash = [10, 10];
+            canvas.pen.lineDash = [10, 2];
         }
         if (this.lineType == 'dotted') {
             canvas.pen.lineDash = [this.lineWidth, this.lineWidth];

+ 2 - 3
src/lib/items/SFHFQZoneLegendItem.js

@@ -1,8 +1,7 @@
-import { SPolygonItem } from "@/components/mapClass/SPolygonItem";
 import { 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';
+import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib';
+import { hexify } from "../../components/mapClass/until";
 /**
  *图例节点Item(区域类型 --防火分区)
  *

+ 2 - 3
src/lib/items/SFHFQZoneLegendItem.ts

@@ -1,11 +1,10 @@
 
 import { SGraphItem } from "@saga-web/graph/lib";
-import { SPolygonItem } from "@/components/mapClass/SPolygonItem";
 import { Legend } from '../types/Legend';
 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';
+import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib';
+import { hexify } from "../../components/mapClass/until";
 /**
  *图例节点Item(区域类型 --防火分区)
  *

+ 36 - 0
src/lib/items/SImageMarkerItem.js

@@ -0,0 +1,36 @@
+import { SImageItem } from "@saga-web/graph/lib";
+import { ItemOrder } from '@saga-web/big/lib';
+/**
+ * 标识对象Item(图标类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SImageMarkerItem extends SImageItem {
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      标识对象数据
+     */
+    constructor(parent, data) {
+        super(parent);
+        this.zOrder = ItemOrder.imageOrder;
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        this.moveTo(data.Pos.X, data.Pos.Y);
+        if (data.Size) {
+            this.width = data.Size.Width;
+            this.height = data.Size.Height;
+        }
+        if (data.Properties && data.Properties.Url) {
+            this.url = data.Properties.Url;
+        }
+    } // Constructor
+    toData() {
+        this.data.Pos = { X: this.x, Y: this.y };
+        this.data.Size = { Width: this.width, Height: this.height };
+        this.data.Properties.Url = this.url;
+        return this.data;
+    }
+} // Class SImageMarkerItem

+ 47 - 0
src/lib/items/SLineLegendItem.js

@@ -0,0 +1,47 @@
+import { SPoint } from "@saga-web/draw/lib";
+import { SPolylineItem } from '@saga-web/big/lib';
+/**
+ * 图例节点Item(线类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SLineLegendItem extends SPolylineItem {
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent, data) {
+        super(parent, []);
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        this.moveTo(data.Pos.X, data.Pos.Y);
+        if (data.Properties && data.Properties.Line) {
+            let setPointList;
+            setPointList = data.Properties.Line.map(i => {
+                return new SPoint(i.x, i.y);
+            });
+            this.pointList = setPointList;
+        }
+        if (data.Properties && data.Properties.LineWidth) {
+            this.lineWidth = data.Properties.LineWidth;
+        }
+        if (data.Properties && data.Properties.StrokeColor) {
+            this.strokeColor = data.Properties.StrokeColor;
+        }
+    }
+    toData() {
+        this.data.Pos = { X: this.x, Y: this.y };
+        this.data.Properties.Line = this.pointList.map(pos => {
+            return {
+                X: pos.x,
+                Y: pos.y
+            };
+        });
+        this.data.Properties.LineWidth = this.lineWidth;
+        this.data.Properties.StrokeColor = this.strokeColor;
+        return this.data;
+    }
+} // Class SLineLegendItem

+ 22 - 0
src/lib/items/SNoneLegendItem.js

@@ -0,0 +1,22 @@
+import { SGraphItem } from "@saga-web/graph/lib";
+/**
+ * 图例节点Item(非图例类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SNoneLegendItem extends SGraphItem {
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent, data) {
+        super(parent);
+        this.data = data;
+        this.id = data.ID;
+    }
+    toData() {
+        return this.data;
+    }
+} // Class SNoneLegendItem

+ 2 - 3
src/lib/items/SSCPZZoneLegendItem.js

@@ -1,8 +1,7 @@
-import { SPolygonItem } from "@/components/mapClass/SPolygonItem";
 import { 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';
+import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib';
+import { hexify } from "../../components/mapClass/until";
 /**
  * 图例节点Item(区域类型 --石材铺装)
  *

+ 2 - 3
src/lib/items/SSCPZZoneLegendItem.ts

@@ -1,11 +1,10 @@
 
 import { SGraphItem } from "@saga-web/graph/lib";
-import { SPolygonItem } from "@/components/mapClass/SPolygonItem";
 import { Legend } from '../types/Legend';
 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';
+import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib';
+import { hexify } from "../../components/mapClass/until";
 /**
  * 图例节点Item(区域类型 --石材铺装)
  *

+ 50 - 0
src/lib/items/STextMarkerItem.js

@@ -0,0 +1,50 @@
+import { STextItem } from "@saga-web/graph/lib";
+import { SColor, SFont } from "@saga-web/draw";
+import { ItemOrder } from '@saga-web/big/lib';
+/**
+ * 标识对象Item(文本类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class STextMarkerItem extends STextItem {
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      标识对象数据
+     */
+    constructor(parent, data) {
+        super(parent);
+        this.zOrder = ItemOrder.textOrder;
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        this.moveTo(data.Pos.X, data.Pos.Y);
+        if (data.Size) {
+            this.width = data.Size.Width;
+            this.height = data.Size.Height;
+        }
+        if (data.Properties && data.Properties.Text) {
+            this.text = data.Properties.Text;
+        }
+        if (data.Properties && data.Properties.Color) {
+            this.color = new SColor(data.Properties.Color);
+        }
+        if (data.Properties && data.Properties.Font) {
+            this.font = new SFont("sans-serif", data.Properties.Font);
+            ;
+        }
+        if (data.Properties && data.Properties.BackgroundColor) {
+            this.backgroundColor = new SColor(data.Properties.BackgroundColor);
+        }
+    } // Constructor
+    toData() {
+        this.data.Pos = { X: this.x, Y: this.y };
+        this.data.Size = { Width: this.width, Height: this.height };
+        this.data.Properties.Text = this.text;
+        this.data.Properties.Color = this.color.value;
+        this.data.Properties.Font = this.font.size;
+        this.data.Properties.BackgroundColor = this.backgroundColor.value;
+        return this.data;
+    }
+} // Class STextMarkerItem

+ 8 - 3
src/store/index.js

@@ -17,7 +17,8 @@ export default new Vuex.Store({
         floorsArr: [], //楼层数组
         floorSelect: [], //楼层下拉框
         fmapID: '',
-        haveFengMap:false ,//是否有蜂鸟地图的数据
+        haveFengMap: false, //是否有蜂鸟地图的数据
+        isMessage: true,
     },
     getters: {
         floorsArr: (state) => state.floorsArr,
@@ -25,7 +26,8 @@ export default new Vuex.Store({
         plazaId: (state) => state.plazaId,
         plazas: (state) => state.plazas,
         fmapID: (state) => state.fmapID,
-        haveFengMap:(state) => state.haveFengMap
+        haveFengMap: (state) => state.haveFengMap,
+        isMessage: (state) => state.isMessage,
     },
     mutations: {
         // 设置是否登陆校验
@@ -40,6 +42,9 @@ export default new Vuex.Store({
             state.userInfo.orgCode = palyload.orgCode
             state.userInfo.username = palyload.username
         },
+        SETISMESSAGE(state, data) {
+            state.isMessage = data
+        },
         SETFLOORS(state, data) {
             state.floorsArr = data
             if (data.length > 0) {
@@ -56,7 +61,7 @@ export default new Vuex.Store({
             state.fmapID = data
         },
         SETHAVEFENGMAP(state) {
-            state.haveFengMap = true;
+            state.haveFengMap = true
         },
     },
     actions: {

+ 2 - 2
src/utils/plugins/components.js

@@ -111,7 +111,7 @@ var system = [
                         {
                             label: "分水器支路分布图",
                             id: "NTYL4",
-                            param: { tab_code: "1542", type_code: "FBT" },
+                            param: { tab_code: "1542", type_code: "FBT1" },
                         },
                     ],
                 },
@@ -221,7 +221,7 @@ var system = [
                         {
                             label: "消防泵房引出管路分布图",
                             id: "XFYL5",
-                            param: { type_code: "FBT" },
+                            param: { type_code: "FBT2" },
                         },
                     ],
                     id: "XFYL",

+ 13 - 5
src/views/equipment/eqDialog.vue

@@ -58,7 +58,7 @@
                                     :key='index1+index'
                                     :label='`${value.label}`'
                                     :name='`${value.param.type_code}`'
-                                    v-if='value.id.slice(2,4)=="YL" && eve.count>0 && value.param.type_code!="FBT"'
+                                    v-if='value.id.slice(2,4)=="YL" && eve.count>0 && value.param.type_code.slice(0,3)!="FBT"'
                                 >
                                     <!-- 有tab的原理图 -->
                                     <div style='width:100%;height:600px;overflow:hidden'>
@@ -70,9 +70,9 @@
                                     :key='index1+index'
                                     :label='`${value.label}`'
                                     :name='`${value.param.type_code}`'
-                                    v-if='value.id.slice(2,4)=="YL" && value.param.type_code=="FBT"'
+                                    v-if='value.id.slice(2,4)=="YL" && value.param.type_code.slice(0,3)=="FBT"'
                                 >
-                                    <fenbuPic ref='fenbutu'></fenbuPic>
+                                    <fenbuPic ref='fenbutu' @openFloorMap='openFloor' :typecode='value.param.type_code'></fenbuPic>
                                 </el-tab-pane>
                             </template>
                         </template>
@@ -154,12 +154,20 @@ export default {
                 this.typecode = this.dialogInfo.children[`${tab.index}`].param.type_code
                 this.diff = this.dialogInfo.children[`${tab.index}`].param.diff
             }
-            if (this.dialogInfo.children[0].id.slice(2, 4) == 'YL' && this.typecode != 'FBT') {
+            if (this.dialogInfo.children[0].id.slice(2, 4) == 'YL' && this.typecode.slice(0, 3) != 'FBT') {
                 this.initImage(this.typecode)
             }
-           
+            if (this.typecode.slice(0, 3) == 'FBT') {
+                this.openFloor()
+            }
+
             this.tabLabel = tab.label
         },
+        // 打开底图
+        openFloor() {
+            console.log(';wwwww')
+            this.$emit('openFloorMap')
+        },
         visibalBox() {
             this.$refs.Dialog.open(this.dialogInfo.id)
         },

+ 33 - 49
src/views/equipment/fenbuPic.vue

@@ -2,19 +2,11 @@
     <div class='fenbu-box'>
         <!-- 图例 -->
         <div class='legend-boxs'>
-            <Legend :floors='floors' type='0'></Legend>
+            <Legend :floors='floors' type='0' :categoryId='`${typecode=="FBT1"?"FZQZL":"XFBFYCFL"}`'></Legend>
         </div>
         <floor-list v-if='floors.length>0' :floorsArr='floors' :type='1' @emitFloor='emitFloor' :id='"floor"'></floor-list>
-        <div class='additional-box' v-if='floors.length>0'>
-            <div class='additional' @click='additionalColl'>
-                <img src='../../assets/imgs/bg.png' alt />
-            </div>
-            <el-collapse-transition>
-                <div v-if='show' class='add-img'>我是放附加数据图片哒。。。</div>
-            </el-collapse-transition>
-        </div>
-        <div v-show='floors.length>0'>
-            <floorMap ref='floorMap' :loadName='loadName' :type='"floor"'></floorMap>
+        <div v-show='floors.length>0' class='canvas-box'>
+            <floorMap ref='floorMap' :loadName='""' :categoryId='`${typecode=="FBT1"?"FZQZL":"XFBFYCFL"}`' :type='"floor"'></floorMap>
         </div>
         <div class='nodata' v-show='floors.length==0'>
             <img class='img1' src='@/assets/imgs/wtp.png' alt />
@@ -41,11 +33,13 @@ export default {
             floors: []
         }
     },
+    props: ['typecode'],
     computed: {
         ...mapGetters(['floorsArr'])
     },
     methods: {
         emitFloor(item) {
+            console.log(item)
             this.floorInfo = item
             this.$refs.floorMap.init(this.floorInfo.gname)
         },
@@ -55,11 +49,16 @@ export default {
         getFloorData() {
             let postParams = {
                 Distinct: true,
-                Filters: `projectId =${this.$store.state.plazaId};categoryId='LCGN' or categoryId='XFBFYCFL';isPub=true`,
                 PageNumber: 1,
                 PageSize: 500,
                 Projection: ['floorId']
             }
+            if (this.typecode == 'FBT1') {
+                postParams.Filters = `projectId =${this.$store.state.plazaId};categoryId='FZQZL';isPub=true`
+            }
+            if (this.typecode == 'FBT2') {
+                postParams.Filters = `projectId =${this.$store.state.plazaId};categoryId='XFBFYCFL';isPub=true`
+            }
             let floor = []
             queryPics({ postParams }).then(res => {
                 console.log(res)
@@ -70,21 +69,37 @@ export default {
                     this.floorsArr.forEach(el => {
                         floor.forEach(ele => {
                             if (ele.FloorId == el.gname) {
+                                console.log(el)
                                 this.floors.push({
                                     gname: el.gname,
-                                    code: el.code
+                                    gcode: el.gcode,
+                                    name: el.name,
+                                    code: el.code,
+                                    seq: el.seq
                                 })
                             }
                         })
                     })
                 }
-                console.log(this.floors)
+
+                this.floorInfo = this.floors[0]
+
+                this.init()
             })
+        },
+        init() {
+            this.loadName = `${this.floorInfo.code}`
+        },
+        openFloorMap() {
+            console.log('openFloorMap --------------')
+
+            this.getFloorData()
+            this.$refs.floorMap.init(this.floorInfo.gname)
         }
     },
     mounted() {
+        console.log(this.floorsArr)
         this.getFloorData()
-        // this.$refs.floorMap.init(this.floorInfo.gname)
     }
 }
 </script>
@@ -100,40 +115,9 @@ export default {
         right: 32px;
         top: 155px;
     }
-    .additional-box {
-        position: relative;
-        .additional {
-            width: 44px;
-            height: 44px;
-            background: rgba(255, 255, 255, 1);
-            box-shadow: 0px 2px 15px 0px rgba(31, 36, 41, 0.08);
-            border-radius: 2px;
-            position: fixed;
-            right: 32px;
-            top: 420px;
-            z-index: 2;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            cursor: pointer;
-            img {
-                width: 20px;
-                height: 20px;
-            }
-        }
-        .add-img {
-            width: 560px;
-            height: 325px;
-            background: #ffffff;
-            -webkit-box-shadow: 0px 2px 8px 0px rgba(31, 36, 41, 0.06);
-            box-shadow: 0px 2px 8px 0px rgba(31, 36, 41, 0.06);
-            border-radius: 2px;
-            border: 1px solid #e4e5e7;
-            position: absolute;
-            right: 77px;
-            top: 93px;
-            z-index: 2;
-        }
+    .canvas-box {
+        width: 100%;
+        height: 800px;
     }
     .nodata {
         height: calc(100%-50px);

+ 3 - 2
src/views/equipment/index.vue

@@ -25,9 +25,9 @@
                     </div>
                     <div class='eq-content'>
                         <div class='legend-boxs'>
-                            <Legend :systemName='systemName' :floors='floorsArr' type='1'></Legend>
+                            <Legend :systemName='systemName'  :floors='floorsArr' type='1'></Legend>
                         </div>
-                        <floorMap ref='floorMap' :id='"equip"' :loadName='loadName' :type='"system"'></floorMap>
+                        <floorMap ref='floorMap' :id='"equip"' :loadName='loadName'  :type='"system"'></floorMap>
                         <div class='additional-box' v-if='fqPic.length>0'>
                             <div class='additional' @click='additionalColl'>
                                 <img src='../../assets/imgs/bg.png' alt />
@@ -87,6 +87,7 @@ export default {
             this.systemName = item.name
             this.smsxt = item.smsxt
             this.$cookie.set('categoryId', item.categoryId, 3)
+            this.$refs.floorMap.init(this.floorInfo.gname)
             if (this.smsxt == '1003' || this.smsxt == '1004') {
                 this.Index()
             }