Sfoglia il codice sorgente

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

zhulizhen1111 4 anni fa
parent
commit
46b8e1caa1

+ 5 - 5
package.json

@@ -11,11 +11,11 @@
     },
     "dependencies": {
         "@mapbox/geojson-merge": "^1.1.1",
-        "@saga-web/base": "2.1.24",
-        "@saga-web/big": "1.0.97",
-        "@saga-web/draw": "2.1.105",
-        "@saga-web/feng-map": "1.0.31",
-        "@saga-web/graph": "2.1.118",
+        "@saga-web/base": "2.1.25",
+        "@saga-web/big": "1.0.105",
+        "@saga-web/draw": "2.1.106",
+        "@saga-web/feng-map": "1.0.35",
+        "@saga-web/graph": "2.1.121",
         "ant-design-vue": "^1.4.10",
         "axios": "^0.19.2",
         "core-js": "^3.4.4",

+ 5 - 1
src/App.vue

@@ -49,7 +49,7 @@ export default {
     },
     mounted() {
         this.isMounted = true
-        this.plazaIds = localStorage.getItem('PLAZAID');
+        this.plazaIds = localStorage.getItem('PLAZAID')
     },
     computed: {
         ...mapGetters(['plazaId', 'fmapID', 'haveFengMap', 'accessLevel']),
@@ -349,4 +349,8 @@ body {
         padding-right: 0;
     }
 }
+.el-tooltip__popper {
+    max-width: 600px !important;
+    line-height: 20px !important;
+}
 </style>

+ 322 - 22
src/components/floorMap/index.vue

@@ -8,22 +8,94 @@
             <canvasFun @fit='fit' @savePng='savePng' @saveSvg='saveSvg' @saveJson='saveJson' @scale='scale' @showText='showText' ref='canvasFun'></canvasFun>
         </div>
         <room-box ref='boxRoom'></room-box>
+        <el-popover ref="popover" placement="right" trigger="manual" v-model="visible" width="380">
+            <!-- <div style="text-align: right;margin-bottom: 10px;">
+                <span style="float: left;">对应的工程信息化信息</span>
+                <el-link icon="el-icon-close" :underline="false" @click="visible = false"></el-link>
+            </div> -->
+
+            <div v-if="equipIds.length && !tabData.pointData.length" style="margin-top: 10px;">
+                <el-table :data="tabData.tableData" max-height="235" style="width: 100%" @row-click='handleClickEquipDetail' v-loading="eqLoading">
+                    <el-table-column prop="sbjc" label="设备简称" width="164" :show-overflow-tooltip='true'></el-table-column>
+                    <el-table-column prop="sl" width="50" label="数量" :show-overflow-tooltip='true'></el-table-column>
+                    <el-table-column prop="sb_status" width="70" label="设备状态" :show-overflow-tooltip='true'></el-table-column>
+                    <el-table-column prop="sbglgs" width="70" label="管理归属" :show-overflow-tooltip='true'></el-table-column>
+                    <!-- <el-table-column prop="assetnum" width="80" label="设备内码" :show-overflow-tooltip='true'></el-table-column>
+                    <el-table-column label="" width="80" :show-overflow-tooltip='true'>
+                        <template slot-scope="scope">
+                            <span class="equip-detail-btn">台账详情</span>
+                        </template>
+                    </el-table-column> -->
+                </el-table>
+                <!-- <div style="text-align: right; margin-top: 10px;">
+                    <el-button size="mini" type="primary" @click="visible = false">关闭</el-button>
+                </div> -->
+            </div>
+
+            <div v-else-if="!equipIds.length && tabData.pointData.length" style="margin-top: 10px;">
+                <ul class="pointList">
+                    <li v-for="point in tabData.pointData" :key="point.id" @click="handleClickPointDeatil(point)">
+                        <span :title="point.name">{{point.name}}</span>
+                        <a>查看</a>
+                    </li>
+                </ul>
+                <div style="text-align: right; margin-top: 10px;">
+                    <el-button v-show="showBtnWell" size="mini" type="primary" @click="handleClickHightLight(tabData.pointData)">查看控制商铺范围</el-button>
+                    <!-- <el-button size="mini" type="primary" @click="visible = false">关闭</el-button> -->
+                </div>
+            </div>
+
+            <el-tabs v-else-if="equipIds.length && tabData.pointData.length" v-model="activeName">
+                <el-tab-pane label="设备设施" name="equip">
+                    <el-table :data="tabData.tableData" max-height="235" style="width: 100%" @row-click='handleClickEquipDetail' v-loading="eqLoading">
+                        <el-table-column prop="sbjc" label="设备简称" width="164" :show-overflow-tooltip='true'></el-table-column>
+                        <el-table-column prop="sl" width="50" label="数量" :show-overflow-tooltip='true' align="right"></el-table-column>
+                        <el-table-column prop="sb_status" width="70" label="设备状态" :show-overflow-tooltip='true'></el-table-column>
+                        <el-table-column prop="sbglgs" width="70" label="管理归属" :show-overflow-tooltip='true'></el-table-column>
+                        <!-- <el-table-column prop="assetnum" width="80" label="设备内码" :show-overflow-tooltip='true'></el-table-column>
+                        <el-table-column label="" width="80" :show-overflow-tooltip='true'>
+                            <template slot-scope="scope">
+                                <span class="equip-detail-btn">台账详情</span>
+                            </template>
+                        </el-table-column> -->
+                    </el-table>
+                    <div style="text-align: right; margin-top: 10px;">
+                        <!-- <el-button size="mini" type="primary" @click="visible = false">关闭</el-button> -->
+                    </div>
+                </el-tab-pane>
+                <el-tab-pane label="位置" name="point">
+                    <ul class="pointList">
+                        <li v-for="point in tabData.pointData" :key="point.id" @click="handleClickPointDeatil(point)">
+                            <span :title="point.name">{{point.name}}</span>
+                            <a>查看</a>
+                        </li>
+                    </ul>
+                    <div style="text-align: right; margin-top: 10px;">
+                        <el-button v-show="showBtnWell" size="mini" type="primary" @click="handleClickHightLight(tabData.pointData)">查看控制商铺范围</el-button>
+                        <!-- <el-button size="mini" type="primary" @click="visible = false">关闭</el-button> -->
+                    </div>
+                </el-tab-pane>
+            </el-tabs>
+        </el-popover>
+        <span class="popStyle" :style="popoverPosition" v-popover:popover></span>
     </div>
 </template>
 <script>
 import { SFengParser } from '@saga-web/feng-map'
-import { SFloorParser, ItemOrder, ItemColor } from '@saga-web/big'
+import { SFloorParser, ItemOrder, ItemColor, SPolygonItem } 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, queryStatis } from '@/api/public'
-import { queryShops } from '@/api/equipmentList.js'
+import { queryShops, queryAsset } from '@/api/equipmentList.js'
 import { STopologyParser } from '@/lib/parsers/STopologyParser'
 import { mapGetters, mapActions } from 'vuex'
-import { SImageItem, SImageShowType } from '@saga-web/graph/lib'
+import { SImageItem, SImageShowType, SGraphItem } from '@saga-web/graph/lib'
 import { SColor } from '@saga-web/draw/lib'
 import bus from '@/utils/bus.js'
+import { TipelineItem } from '../../lib/items/TipelineItem'
+import { SImageLegendItem } from '../../lib/items/SImageLegendItem'
 
 // import { uuid } from "@/components/mapClass/until";
 
@@ -43,6 +115,20 @@ export default {
             topologyParser: null, // 解析器数据
             fParser: null, // 底图解析器
             wellMap: {}, // 电井控制商铺映射
+            activeName: "equip",
+            popoverPosition: {
+                top: 0,
+                left: 0
+            },
+            visible: false,
+            eqLoading: true,
+            equipIds: [],
+            tabData: {
+                tableData: [],
+                pointData: []
+            },
+            activeItem: null,
+            showBtnWell: false
         }
     },
     props: {
@@ -67,6 +153,107 @@ export default {
         ...mapGetters(['plazaId', 'fmapID', 'haveFengMap', 'bunkObj']),
     },
     methods: {
+        handleClickLegendItem(item, events) {
+            this.tabData = {tableData: [], pointData: []};
+            this.showBtnWell = false;
+            this.visible = false;
+            this.activeItem = null;
+            this.isLoading = true;
+            if (item.data.AttachObjectIds && item.data.AttachObjectIds.length) {
+                const e = events[0];
+                this.equipIds = [];
+                this.activeItem = item;
+                item.data.AttachObjectIds.forEach(v => {
+                    if (v.type == "Image") {
+                        if(v.id) { this.equipIds.push(v.id) }
+                        // this.tabData.tableData.push(v);
+                    } else if (v.type == "Zone") {
+                        this.tabData.pointData.push(v);
+                    }
+                })
+                if (this.equipIds.length) {
+                    this.eqLoading = true;
+                    let data = {
+                        plazaId: this.$store.state.plazaId,
+                        page: 1,
+                        size: this.equipIds.length
+                    }
+                    let postParams = {
+                        assetnumList: this.equipIds
+                    }
+                    queryAsset({ data, postParams }).then(res => {
+                        this.tabData.tableData = res.data.data;
+                        this.eqLoading = false;
+                    })
+                }
+                this.popoverPosition.top = `${e.clientY}px`;
+                this.popoverPosition.left = `${e.clientX}px`;
+                this.$nextTick(() => {
+                    if (
+                        item.data.GraphElementId == '100050' ||
+                        item.data.GraphElementId == '100055' ||
+                        item.data.GraphElementId == '100056' ||
+                        item.data.GraphElementId == '100057'
+                    ) { //判断是否为电井
+                        this.showBtnWell = true;
+                    }
+                    this.visible = true;
+                })
+            }
+        },
+        // 查看浮层设备详情
+        handleClickEquipDetail(row) {
+            if (row.assetuid) {
+                window.open(`http://gcgl.wanda.cn/maximo/ui/?event=loadapp&value=assetdevic&uniqueid=${row.assetuid}`)
+            }
+        },
+        // 查看浮层位置详情
+        handleClickPointDeatil(point) {
+            if (point.id && this.activeItem)
+            this.$refs.boxRoom.open({ name: this.activeItem.name, type: this.type, location: point.id });
+        },
+        handleClickHightLight(pointData) {
+            this.clearHightLight();
+            pointData.forEach(point => {
+                let location = point.id ? point.id : '';
+                if (this.wellMap.hasOwnProperty(location)) {
+                    this.wellMap[location].forEach(item => {
+                        item.highLightFlag = true;
+                        item.zOrder = 30;
+                    })
+                } else {
+                    let getParams = {
+                        plazaId: this.plazaId,
+                        floor: this.floorid,
+                        keyword: `${location}:wellnum;`
+                    }
+                    queryShops({ getParams }).then(res => {
+                        let shopsnumList = []
+                        let shopsnumItemList = []
+                        if (res.data && res.data.length) {
+                            for (let floor in res.data[0]) {
+                                if (res.data[0][floor].length) {
+                                    res.data[0][floor].forEach(v => {
+                                        shopsnumList = shopsnumList.concat(v.shopsnumList.split(','))
+                                    })
+                                }
+                            }
+                        }
+                        if (shopsnumList.length) {
+                            this.fParser.spaceList.forEach(item => {
+                                if (shopsnumList.findIndex(name => name == item.data.Name) != -1) {
+                                    item.highLightFlag = true
+                                    item.zOrder = 30
+                                    shopsnumItemList.push(item)
+                                }
+                            })
+                            this.wellMap[location] = shopsnumItemList
+                        }
+                    })
+                }
+            });
+            this.visible = false;
+        },
         ...mapActions(['getfmapID']),
         init(floorid) {
             this.loading = true
@@ -221,6 +408,7 @@ export default {
                     // 多边形
                     this.topologyParser.zoneLegendList.forEach((t) => {
                         this.scene.addItem(t)
+                        t.connect("legendItemClick", t, this.handleClickLegendItem);
                     })
                     // 增加文字
                     this.topologyParser.textMarkerList.forEach((t) => {
@@ -237,12 +425,14 @@ export default {
                     // 增加图标类图例
                     this.topologyParser.imageLegendList.forEach((t) => {
                         this.scene.addItem(t)
+                        t.connect("legendItemClick", t, this.handleClickLegendItem);
                     })
                     // 增加管线类
                     // 增加图标类图例
                     this.topologyParser.relationList.forEach((t) => {
                         t.selectable = true
                         this.scene.addItem(t)
+                        t.connect("legendItemClick", t, this.handleClickLegendItem);
                     })
                     this.view.fitSceneToView()
                     this.view.minScale = this.view.scale
@@ -263,26 +453,35 @@ export default {
             this.view = new FloorView(`canvas${this.id}`)
         },
         listChange(item, ev) {
+            // if (ev[0].length) {
+            //     let selectItem1 = ev[0][0],
+            //         location = selectItem1.data.AttachObjectIds[0] ? selectItem1.data.AttachObjectIds[0].id : ''
+            //     // 空间类型都可打开弹窗(除防火分区 编号100131,商管办公室 编号100112,铺装石材 编号100129)
+            //     if (selectItem1.data.GraphElementType == 'Zone') {
+            //         if (
+            //             selectItem1.data.GraphElementId != '100131' &&
+            //             selectItem1.data.GraphElementId != '100112' &&
+            //             selectItem1.data.GraphElementId != '100129'
+            //         ) {
+            //             if (location) {
+            //                 this.$refs.boxRoom.open({ name: selectItem1.name, type: this.type, location: location })
+            //             }
+            //         }
+            //     }
+            //     // // 选中电井设置电井关联的商铺高亮
+            //     // this.setHightLight(ev[0])
+            // } 
+            // else {
+                // this.clearHightLight()
+            // }
             if (ev[0].length) {
-                let selectItem1 = ev[0][0],
-                    location = selectItem1.data.AttachObjectIds[0] ? selectItem1.data.AttachObjectIds[0].id : ''
-                // 空间类型都可打开弹窗(除防火分区 编号100131,商管办公室 编号100112,铺装石材 编号100129)
-                if (selectItem1.data.GraphElementType == 'Zone') {
-                    if (
-                        selectItem1.data.GraphElementId != '100131' &&
-                        selectItem1.data.GraphElementId != '100112' &&
-                        selectItem1.data.GraphElementId != '100129'
-                    ) {
-                        if (location) {
-                            this.$refs.boxRoom.open({ name: selectItem1.name, type: this.type, location: location })
-                        }
-                    }
+                if (!(ev[0][0] instanceof SPolygonItem || ev[0][0] instanceof TipelineItem || ev[0][0] instanceof SImageLegendItem)) {
+                    this.visible = false;
                 }
-                // 选中电井设置电井关联的商铺高亮
-                this.setHightLight(ev[0])
             } else {
-                this.clearHightLight()
+                this.visible = false;
             }
+            this.clearHightLight()
         },
         // 选中电井关联的商铺高亮
         setHightLight(arr) {
@@ -292,9 +491,9 @@ export default {
                 // 添加了位置类型并且选中的类型为电井类型
                 if (
                     (item.data.GraphElementId == '100050' ||
-                        item.data.GraphElementId == '100055' ||
-                        item.data.GraphElementId == '100056' ||
-                        item.data.GraphElementId == '100057') &&
+                    item.data.GraphElementId == '100055' ||
+                    item.data.GraphElementId == '100056' ||
+                    item.data.GraphElementId == '100057') &&
                     location
                 ) {
                     if (this.wellMap.hasOwnProperty(location)) {
@@ -454,6 +653,9 @@ export default {
         this.getEvent()
     },
     created() {
+        // document.addEventListener("mousedown", () => {
+        //     this.visible = false;
+        // })
         this.urlMsg = {
             categoryId: this.$cookie.get('categoryId'),
             ProjectID: this.plazaId,
@@ -480,5 +682,103 @@ export default {
         bottom: 40px;
         width: 100%;
     }
+    .popStyle {
+        position: fixed;
+    }
+}
+</style>
+<style lang="less">
+a:hover {
+    text-decoration: none;
+}
+.el-popover {
+    .el-table {
+        tr {
+            .equip-detail-btn {
+                display: none;
+            }
+        }
+        tr:hover {
+            cursor: pointer;
+            .equip-detail-btn {
+                cursor: pointer;
+                display: inline-block;
+                color: #025BAA;
+            }
+        }
+    }
+    .pointList {
+        max-height: 235px;
+        overflow-y: auto;
+        text-align: right;
+        li {
+            height: 38px;
+            line-height: 38px;
+            padding: 0 12px;
+            cursor: pointer;
+            border-bottom: 1px solid rgba(0,0,0,0.06);
+            span {
+                float: left;
+                width: 260px;
+                text-align: left;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+            }
+            a {
+                display: none;
+                color: #025BAA;
+                font-size: 13px;
+            }
+        }
+        li:hover {
+            background-color: #F5F6F7;
+            a {
+                display: inline-block;
+            }
+        }
+    }
+    .el-button--primary{
+         background: linear-gradient(180deg, #369cf7 0%, #025baa 100%);
+    }
+    .el-tabs--bottom .el-tabs__item.is-bottom:nth-child(2),
+    .el-tabs--bottom .el-tabs__item.is-top:nth-child(2),
+    .el-tabs--top .el-tabs__item.is-bottom:nth-child(2),
+    .el-tabs--top .el-tabs__item.is-top:nth-child(2) {
+        padding-left: 16px;
+    }
+    .el-tabs--bottom .el-tabs__item.is-bottom:last-child,
+    .el-tabs--bottom .el-tabs__item.is-top:last-child,
+    .el-tabs--top .el-tabs__item.is-bottom:last-child,
+    .el-tabs--top .el-tabs__item.is-top:last-child {
+        padding-right: 16px;
+    }
+    .el-tabs__nav-wrap::after {
+        height: 0;
+    }
+    .is-active {
+        color: #025BAA !important;
+        border-color: #025BAA !important;
+        background: rgba(2,91,170,0.15);
+    }
+    .el-tabs__item {
+        padding: 5px 16px;
+        height: 30px;
+        line-height: 20px;
+        font-size: 14px;
+        font-family: MicrosoftYaHei;
+        color: rgba(31, 36, 41, 1);
+        border: 1px solid rgba(195, 199, 203, 1);
+    }
+    .el-tabs__active-bar {
+        background-color: transparent !important;
+    }
+    /deep/ .el-tabs__item:last-child {
+        border-radius: 0px 4px 4px 0px;
+    }
+    /deep/ .el-tabs__item:nth-child(2) {
+        border-radius: 4px 0px 0px 4px;
+    }
 }
+    
 </style>

+ 273 - 0
src/lib/items/SCustomLegendItem.ts

@@ -0,0 +1,273 @@
+
+import { SGraphItem, SLineStyle, STextOrigin } from "@saga-web/graph/lib";
+import { Legend } from '../types/Legend';
+import { SPainter, SColor, SFont, SPoint, SLineCapStyle } from "@saga-web/draw";
+import { STextItem } from '@saga-web/graph/lib';
+import { hexify, uuid } from "@/components/mapClass/until"
+import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib';
+import { SMouseEvent } from "@saga-web/base/lib";
+/**
+ * 图例节点Item(区域类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SCustomLegendItem extends SPolygonItem {
+    /** 图例节点对象数据 */
+    data: Legend;
+
+    /** text item   */
+    textItem: STextItem = new STextItem(this);
+
+    get text(): string {
+        return this.textItem.text;
+    }
+    set text(v: string) {
+        this.textItem.text = v;
+        this.update();
+    }
+    get color(): SColor {
+        return this.textItem.color;
+    }
+    set color(v: SColor) {
+        this.textItem.color = v;
+    }
+    get font(): SFont {
+        return this.textItem.font;
+    }
+    set font(v: SFont) {
+        this.textItem.font = v;
+    }
+
+    get status(): SItemStatus {
+        return this._status;
+    }
+    // 编辑当前状态
+    set status(value: SItemStatus) {
+        this._status = value;
+        // 如果状态为show则需清栈
+        if (value == SItemStatus.Normal) {
+            // 切换显示状态显示文本
+            this.showText = true;
+            // 切换显示状态不可移动文本
+            this.textItem.moveable = false;
+
+            if (this.undoStack) {
+                this.undoStack.clear();
+            }
+        } else if (value == SItemStatus.Edit) {
+            // 切换编辑状态显示文本
+            this.showText = true;
+            // 切换编辑状态可移动文本
+            this.textItem.moveable = true;
+        } else if (value == SItemStatus.Create) {
+            // 切换创建状态不显示文本
+            this.showText = false;
+            // 切换创建状态不可移动文本
+            this.textItem.moveable = false;
+        }
+        this.update();
+    };
+
+    /** 是否激活  */
+    _isActive: boolean = false;
+    get isActive(): boolean {
+        return this._isActive;
+    } // Get isActive
+    set isActive(v: boolean) {
+        this._isActive = v;
+        if (v) {
+            this.cursor = "pointer";
+            this.textItem.cursor = "pointer";
+        } else {
+            this.cursor = "auto";
+            this.textItem.cursor = "auto";
+        }
+        this.update();
+    } // Set isActive
+
+    /** 是否显示文字  */
+    _showText: boolean = true;
+    get showText(): boolean {
+        return this._showText;
+    }
+    set showText(v: boolean) {
+        if (v === this._showText) {
+            return
+        }
+        this._showText = v;
+        if (v) {
+            this.textItem.show();
+        } else {
+            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()
+    }
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Legend) {
+        super(parent);
+        this.textItem.originPosition = STextOrigin.Centrum;
+        this.textItem.isTransform = false;
+        this.zOrder = ItemOrder.polygonOrder;
+        this.data = data;
+        if (!data.ID) {
+            data.ID = uuid()
+        }
+        this.id = data.ID;
+        this.name = data.Name;
+        this.text = data.Name;
+        if (data) {
+            this.setPointList = [];
+            let setPointList: SPoint[];
+            if (data.OutLine) {
+                if (data.OutLine[0] instanceof SPoint) {
+                    // @ts-ignore
+                    this.setPointList = data.OutLine;
+                } else {
+                    setPointList = data.OutLine.map(i => {
+                        return (new SPoint(i.X, i.Y))
+                    })
+                    this.setPointList = setPointList;
+                }
+            }
+            if (data.Properties.Zorder) {
+                this.zOrder = data.Properties.Zorder;
+            }
+            // 设置线宽
+            if (data.Properties.LineWidth) {
+                this.lineWidth = data.Properties.LineWidth;
+            }
+            if (data.Properties.StrokeColor) {
+                this.strokeColor = data.Properties.StrokeColor.includes('#') ? new SColor(data.Properties.StrokeColor) : new SColor(hexify(data.Properties.StrokeColor));
+            }
+            if (data.Properties.FillColor) {
+                this.fillColor = data.Properties.FillColor.includes('#') ? new SColor(data.Properties.FillColor) : new SColor(hexify(data.Properties.FillColor))
+            }
+            if (data.Properties.TextPos) {
+                this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
+            }
+            if (data.Properties.color) {
+                this.color = new SColor(data.Properties.color);
+            }
+            if (data.Properties.font) {
+                this.font = new SFont("sans-serif", data.Properties.font);
+            }
+            if (data.Properties && data.Properties.IsActive) {
+                this.isActive = data.Properties.IsActive;
+            }
+            if (data.AttachObjectIds && data.AttachObjectIds.length) {
+                this.isActive = true;
+            }
+            switch (data.Properties.LineDash) {
+                case "solid":
+                    this.lineStyle = SLineStyle.Solid;
+                    break;
+                case "dotted":
+                    this.lineStyle = SLineStyle.Dotted;
+                    break;
+                case "dashed":
+                    this.lineStyle = SLineStyle.Dashed;
+                    break;
+                default:
+                    this.lineStyle = SLineStyle.Solid;
+            }
+        }
+        // 监听多边形创建完成事件,并动态计算文本位置
+        this.connect("finishCreated", this, () => {
+            // 计算文本位置
+            let x: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                return pre + (cur.x / arr.length)
+            }, 0),
+                y: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                    return pre + (cur.y / arr.length)
+                }, 0);
+            this.textItem.moveTo(x, y);
+        })
+    }
+
+    /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        if (event.buttons == 1)
+        this.$emit("legendItemClick", event);
+        return super.onMouseDown(event);
+    } // Function onMouseDown()
+
+    toData(): any {
+        this.data.Pos = { X: this.x, Y: this.y };
+        this.data.Name = this.name;
+        this.data.Properties.Zorder = this.zOrder;
+        this.data.Properties.FillColor = this.fillColor.value;
+        this.data.Properties.StrokeColor = this.strokeColor.value;
+        this.data.Properties.LineWidth = this.lineWidth;
+        switch (this.lineStyle) {
+            case SLineStyle.Solid:
+                this.data.Properties.LineDash = "solid";
+                break;
+            case SLineStyle.Dotted:
+                this.data.Properties.LineDash = "dotted";
+                break;
+            case SLineStyle.Dashed:
+                this.data.Properties.LineDash = "dashed";
+                break;
+            default:
+                this.data.Properties.LineDash = "solid";
+        }
+        this.data.OutLine = this.getPointList.map(pos => {
+            return {
+                X: pos.x,
+                Y: pos.y
+            }
+        });
+        this.data.Properties.TextPos = {X: this.textItem.x, Y: this.textItem.y};
+        this.data.Properties.font =  this.font.size;
+        this.data.Properties.color =  this.color.value;
+        this.data.Properties.IsActive = this.isActive;
+        return this.data;
+    }
+
+    onDraw(painter: SPainter) {
+        if (this.maskFlag && this.status == SItemStatus.Normal) {
+            let color = new SColor(this.strokeColor)
+            color.alpha = color.alpha / 5
+            let brushcolor = new SColor(this.fillColor)
+            brushcolor.alpha = brushcolor.alpha / 5
+            painter.pen.color = color
+            painter.pen.lineCapStyle = SLineCapStyle.Square
+            painter.pen.lineWidth = painter.toPx(this.lineWidth)
+            painter.brush.color = brushcolor
+            if (this.selected) {
+                painter.pen.lineWidth = painter.toPx(this.lineWidth * 2);
+                painter.shadow.shadowBlur = 10;
+                painter.shadow.shadowColor = new SColor(`#00000033`);
+                painter.shadow.shadowOffsetX = 5;
+                painter.shadow.shadowOffsetY = 5;
+            }
+            // @ts-ignore
+            painter.drawPolygon([...this.pointList]);
+        } else {
+            super.onDraw(painter);
+        }
+    }
+} // Class SZoneLegendItem

+ 15 - 0
src/lib/items/SFHFQZoneLegendItem.ts

@@ -4,6 +4,7 @@ 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';
+import { SMouseEvent } from '@saga-web/base/lib';
 /**
  * 图例节点Item(区域类型 --防火分区)
  *
@@ -75,8 +76,10 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
         this._isActive = v;
         if (v) {
             this.cursor = "pointer";
+            this.textItem.cursor = "pointer";
         } else {
             this.cursor = "auto";
+            this.textItem.cursor = "auto";
         }
         this.update();
     } // Set isActive
@@ -194,6 +197,18 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
         })
     }
 
+    /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        if (event.buttons == 1)
+        this.$emit("legendItemClick", event);
+        return super.onMouseDown(event);
+    } // Function onMouseDown()
+
     toData(): any {
         this.data.Pos = { X: this.x, Y: this.y };
         this.data.Name = this.name;

+ 17 - 0
src/lib/items/SImageLegendItem.ts

@@ -3,6 +3,7 @@ import { SIconTextItem } from '@saga-web/big/lib/items/SIconTextItem';
 import { Legend } from '../types/Legend';
 import { ItemOrder, SItemStatus } from '@saga-web/big/lib';
 import { SFont, SColor, SPainter, SRect } from '@saga-web/draw/lib';
+import { SMouseEvent } from "@saga-web/base/lib";
 /**
  * 图例节点Item(图标类型)
  *
@@ -94,6 +95,9 @@ export class SImageLegendItem extends SIconTextItem {
         if (data.Properties.ImgPos) {
             this.img.moveTo(data.Properties.ImgPos.X, data.Properties.ImgPos.Y);
         }
+        if (data.Properties && data.Properties.ImgRotate) {
+            this.img.rotate = data.Properties.ImgRotate;
+        }
         if (data.Properties && data.Properties.font) {
             this.font = new SFont("sans-serif", data.Properties.font);
         }
@@ -117,6 +121,18 @@ export class SImageLegendItem extends SIconTextItem {
         }
     }
 
+    /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        if (event.buttons == 1)
+        this.$emit("legendItemClick", event);
+        return super.onMouseDown(event);
+    } // Function onMouseDown()
+
     toData(): Legend {
         this.data.Pos = { X: this.x, Y: this.y };
         this.data.Size = { Width: this.width, Height: this.height };
@@ -125,6 +141,7 @@ export class SImageLegendItem extends SIconTextItem {
         this.data.Properties.Url = this.img.url;
         this.data.Properties.TextPos = { X: this.textItem.x, Y: this.textItem.y };
         this.data.Properties.ImgPos = { X: this.img.x, Y: this.img.y };
+        this.data.Properties.ImgRotate = this.img.rotate;
         this.data.Properties.Size = {
             Width: this.sWidth,
             Height: this.sHeight

+ 15 - 0
src/lib/items/SSCPZZoneLegendItem.ts

@@ -4,6 +4,7 @@ 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';
+import { SMouseEvent } from '@saga-web/base/lib';
 /**
  * 图例节点Item(区域类型 --石材铺装)
  *
@@ -75,8 +76,10 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
         this._isActive = v;
         if (v) {
             this.cursor = "pointer";
+            this.textItem.cursor = "pointer";
         } else {
             this.cursor = "auto";
+            this.textItem.cursor = "auto";
         }
         this.update();
     } // Set isActive
@@ -202,6 +205,18 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
         })
     }
 
+    /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        if (event.buttons == 1)
+        this.$emit("legendItemClick", event);
+        return super.onMouseDown(event);
+    } // Function onMouseDown()
+
     toData(): any {
         this.data.Pos = { X: this.x, Y: this.y };
         this.data.Name = this.name;

+ 15 - 0
src/lib/items/SZoneLegendItem.ts

@@ -4,6 +4,7 @@ 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';
+import { SMouseEvent } from '@saga-web/base/lib';
 /**
  * 图例节点Item(区域类型)
  *
@@ -75,8 +76,10 @@ export class SZoneLegendItem extends SPolygonItem {
         this._isActive = v;
         if (v) {
             this.cursor = "pointer";
+            this.textItem.cursor = "pointer";
         } else {
             this.cursor = "auto";
+            this.textItem.cursor = "auto";
         }
         this.update();
     } // Set isActive
@@ -195,6 +198,18 @@ export class SZoneLegendItem extends SPolygonItem {
         })
     }
 
+    /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        if (event.buttons == 1)
+        this.$emit("legendItemClick", event);
+        return super.onMouseDown(event);
+    } // Function onMouseDown()
+
     toData(): any {
         this.data.Pos = { X: this.x, Y: this.y };
         this.data.Name = this.name;

+ 13 - 0
src/lib/items/TipelineItem.ts

@@ -4,6 +4,7 @@ import { SAnchorItem, SGraphItem } from '@saga-web/graph/lib';
 import { Relation } from '../types/Relation';
 import { SPoint } from "@saga-web/draw/lib";
 import { Point } from "@saga-web/big/lib/types/Point";
+import { SMouseEvent } from '@saga-web/base/lib';
 
 /**
  * 管道item
@@ -141,6 +142,18 @@ export class TipelineItem extends SPolylineItem {
     }
   }
 
+  /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+      if (event.buttons == 1)
+      this.$emit("legendItemClick", event);
+      return super.onMouseDown(event);
+  } // Function onMouseDown()
+
   /** 获取data数据  */
   toData(): Relation | null {
     let pointList: Point[] = this.pointList.map(item => {

+ 5 - 0
src/lib/parsers/STopologyParser.ts

@@ -17,6 +17,7 @@ import { ItemOrder } from "@saga-web/big";
 import { SItemStatus } from "@saga-web/big";
 import { SSCPZZoneLegendItem } from '../items/SSCPZZoneLegendItem';
 import { SFHFQZoneLegendItem } from '../items/SFHFQZoneLegendItem';
+import { SCustomLegendItem } from "../items/SCustomLegendItem";
 /**
  * 拓扑图信息解析器
  *
@@ -82,6 +83,10 @@ export class STopologyParser extends SParser {
                 let item = new SFHFQZoneLegendItem(null, t);
                 item.selectable = true;
                 this.zoneLegendList.push(item);
+            }  else if (t.SubType == "CUSTOM") {
+                let item = new SCustomLegendItem(null, t);
+                item.selectable = true;
+                this.zoneLegendList.push(item);
             } else {
                 let item = new SZoneLegendItem(null, t);
                 item.selectable = true;

+ 44 - 50
src/views/legendLibrary/addForm.vue

@@ -211,69 +211,69 @@ export default {
             options: [
                 {
                     id: 'None',
-                    name: '非图例'
+                    name: '非图例',
                 },
                 {
                     id: 'Zone',
-                    name: '区域'
+                    name: '区域',
                 },
                 {
                     id: 'Image',
-                    name: '图标'
+                    name: '图标',
                 },
                 {
                     id: 'Line',
-                    name: '线条'
-                }
+                    name: '线条',
+                },
             ],
             kuan: [
                 { id: '16', name: '16' },
                 { id: '32', name: '32' },
-                { id: '64', name: '64' }
+                { id: '64', name: '64' },
             ],
             gao: [
                 { id: '16', name: '16' },
                 { id: '32', name: '32' },
-                { id: '64', name: '64' }
+                { id: '64', name: '64' },
             ],
             selectedIds: [],
             borderLineOption: [
                 {
                     id: 'solid',
-                    src: require('@/assets/imgs/1pxlines.png')
+                    src: require('@/assets/imgs/1pxlines.png'),
                 },
                 {
                     id: 'dashed',
-                    src: require('@/assets/imgs/dashedLines.png')
+                    src: require('@/assets/imgs/dashedLines.png'),
                 },
                 {
                     id: 'dotted',
-                    src: require('@/assets/imgs/dotLines.png')
-                }
+                    src: require('@/assets/imgs/dotLines.png'),
+                },
             ],
             linepxOption: [
                 {
                     id: 1,
-                    src: require('@/assets/imgs/1pxline.jpg')
+                    src: require('@/assets/imgs/1pxline.jpg'),
                 },
                 {
                     id: 2,
-                    src: require('@/assets/imgs/2pxline.jpg')
+                    src: require('@/assets/imgs/2pxline.jpg'),
                 },
                 {
                     id: 3,
-                    src: require('@/assets/imgs/3pxline.jpg')
-                }
+                    src: require('@/assets/imgs/3pxline.jpg'),
+                },
             ],
             fileList: [],
             file: '',
             // this.ruleForm.Url 图标的key,/serve/topology-wanda/Picture/query/${this.ruleForm.Url}
             value: '',
             linepxObject: {
-                src: ''
+                src: '',
             },
             borderLineOptionObject: {
-                src: ''
+                src: '',
             },
             canvasWidth: 28,
             canvasHeight: 28,
@@ -286,7 +286,7 @@ export default {
             key: 1,
             InfoLocals: undefined, //工程信息化
             // InfoSystems: undefined, //工程信息化专业/系统
-            InfoTypeIds: undefined //铺位可视化typeid
+            InfoTypeIds: undefined, //铺位可视化typeid
         }
     },
     props: ['ruleForm', 'title', 'InfosList', 'InfoTypeIdList'],
@@ -301,10 +301,10 @@ export default {
         //业下设备分类和位置分类树形结构
         initQueryDeviceAndPOsition() {
             let postParams = {}
-            queryDeviceAndPOsition({ postParams }).then(res => {
-                this.deviceList = res.data.map(i => {
+            queryDeviceAndPOsition({ postParams }).then((res) => {
+                this.deviceList = res.data.map((i) => {
                     i.children &&
-                        i.children.map(child => {
+                        i.children.map((child) => {
                             child.id = child.id + child.type
                             child.name = child.name
                         })
@@ -321,7 +321,7 @@ export default {
             this.file = file.file
             var reader = new FileReader()
             reader.readAsDataURL(this.file)
-            reader.onload = e => {
+            reader.onload = (e) => {
                 this.view.url = e.target.result
             }
         },
@@ -333,9 +333,9 @@ export default {
                 this.ruleForm.FillColor = this.hexify(this.ruleForm.FillColor)
             }
             let postParams = {
-                Content: [this.ruleForm]
+                Content: [this.ruleForm],
             }
-            createLegend({ postParams }).then(res => {
+            createLegend({ postParams }).then((res) => {
                 if (res.Result == 'success') {
                     this.$message.success('添加图例成功!')
                     this.$emit('addSuccess')
@@ -353,9 +353,9 @@ export default {
                 this.ruleForm.FillColor = this.hexify(this.ruleForm.FillColor)
             }
             let postParams = {
-                Content: [this.ruleForm]
+                Content: [this.ruleForm],
             }
-            updateLegend({ postParams }).then(res => {
+            updateLegend({ postParams }).then((res) => {
                 if (res.Result == 'success') {
                     this.$message.success('图例修改成功!')
                     this.$emit('updateSuccess')
@@ -433,7 +433,7 @@ export default {
         //线条类型改变
         changeLineType(val) {
             if (val) {
-                this.borderLineOptionObject = val && this.borderLineOption.find(item => item.id == val)
+                this.borderLineOptionObject = val && this.borderLineOption.find((item) => item.id == val)
                 this.$nextTick(() => {
                     if (this.$refs.select1 && this.$refs.select1.$el) {
                         this.$refs.select1.$el.children[0].children[0].setAttribute(
@@ -494,7 +494,7 @@ export default {
                         formData.append('file', this.file)
                     }
                     let postParams = formData
-                    uploadImg({ postParams }).then(res => {
+                    uploadImg({ postParams }).then((res) => {
                         if (res.Result == 'success') {
                             this.$set(vm.ruleForm, 'Url', res.EntityList[0])
                             this.$message.success('图标上传成功!')
@@ -520,18 +520,12 @@ export default {
 
         //位置/设备
         treeConfirmDevice(id, info) {
-            console.log('%ctreeConfirmDevice=============','color:blue')
-            console.log(id, info)
-            console.log('%ctreeConfirmDevice=============','color:blue')
             let InfoSystem = [],
                 InfoSystems = [],
                 InfoLocal = []
-            this.deviceList.forEach(i => {
+            this.deviceList.forEach((i) => {
                 i.children.length > 0 &&
-                    i.children.forEach(j => {
-                          console.log('%this.deviceList.forEach=============','color:blue')
-                          console.log(id)
-                          console.log('%this.deviceList.forEach=============','color:blue')
+                    i.children.forEach((j) => {
                         if (id.includes(j.id)) {
                             InfoSystems.push(i)
                         }
@@ -539,22 +533,22 @@ export default {
             })
             InfoSystem = JSON.parse(JSON.stringify(InfoSystems))
                 .reduce((prev, element) => {
-                    if (!prev.find(el => el.id == element.id)) {
+                    if (!prev.find((el) => el.id == element.id)) {
                         prev.push(element)
                     }
                     return prev
                 }, [])
-                .map(i => {
+                .map((i) => {
                     if (i.children.length) {
                         delete i.children
                     }
                     return i
                 })
-            InfoLocal = info.map(i => {
+            InfoLocal = info.map((i) => {
                 return {
                     type: i.id.split('')[i.id.length - 1],
                     name: i.name,
-                    id: i.id.substr(0, i.id.length - 1)
+                    id: i.id.substr(0, i.id.length - 1),
                 }
             })
             this.$set(this.ruleForm, 'InfoLocal', InfoLocal)
@@ -564,21 +558,21 @@ export default {
             // //console.log('focusChange', status)
         },
         visualization() {
-            getVisualization({}).then(res => {
+            getVisualization({}).then((res) => {
                 this.typeVisualization =
                     res.Data &&
-                    res.Data.map(i => {
+                    res.Data.map((i) => {
                         return {
                             id: i.Id,
                             name: i.Name,
                             children: i.Children
-                                ? i.Children.map(j => {
+                                ? i.Children.map((j) => {
                                       return {
                                           id: j.Id,
-                                          name: j.Id + '-' + j.Name
+                                          name: j.Id + '-' + j.Name,
                                       }
                                   })
-                                : []
+                                : [],
                         }
                     })
             })
@@ -587,12 +581,12 @@ export default {
             return {
                 id: data.Id,
                 name: data.Name,
-                children: data.Children ? data.Children.map(i => this.getTree(i)) : []
+                children: data.Children ? data.Children.map((i) => this.getTree(i)) : [],
             }
         },
         focusChange(status) {
             //console.log('focusChange', status)
-        }
+        },
     },
     mounted() {
         console.log(this.ruleForm, 'form')
@@ -616,9 +610,9 @@ export default {
                     }
                     this.initGraph()
                 }
-            }
-        }
-    }
+            },
+        },
+    },
 }
 </script>
 

+ 39 - 39
src/views/legendLibrary/index.vue

@@ -188,7 +188,7 @@ import {
     deleteLegend,
     queryTypeId,
     getVisualization,
-    queryRelation
+    queryRelation,
 } from '@/api/legendLibrary.js'
 
 function hexToRgba(hex) {
@@ -224,40 +224,40 @@ export default {
                 { id: 'test1', name: '选择项' },
                 { id: 'test2', name: '单平米' },
                 { id: 'test3', name: '下级分项' },
-                { id: 'test4', name: '滑动平均滑动平均' }
+                { id: 'test4', name: '滑动平均滑动平均' },
             ],
             stateSelect: [
                 { id: '1', name: '正常' },
-                { id: '0', name: '已作废' }
+                { id: '0', name: '已作废' },
             ],
             Type: 'all', //所属分类
             selText: '图例库管理',
             selVal: '0',
             dataSelect: [
                 { id: '0', name: '图例库管理' },
-                { id: '1', name: '图例绘制规则' }
+                { id: '1', name: '图例绘制规则' },
             ],
             typeOptions: [
                 {
                     id: 'all',
-                    name: '全部'
+                    name: '全部',
                 },
                 {
                     id: 'None',
-                    name: '非图例'
+                    name: '非图例',
                 },
                 {
                     id: 'Zone',
-                    name: '区域'
+                    name: '区域',
                 },
                 {
                     id: 'Image',
-                    name: '图标'
+                    name: '图标',
                 },
                 {
                     id: 'Line',
-                    name: '线条'
-                }
+                    name: '线条',
+                },
             ],
             TypeId: '',
             typeIdSelect: [{ id: 'Zone', name: '铺位面' }],
@@ -275,7 +275,7 @@ export default {
             GraphCategoryIds: [], //说明书位置勾选集合
             InfoLocals: [], //工程信息化
             InfoSystems: [], //工程信息化专业/系统
-            InfoTypeIds: [] //铺位可视化typeid
+            InfoTypeIds: [], //铺位可视化typeid
         }
     },
     filters: {
@@ -285,12 +285,12 @@ export default {
             } else {
                 return val
             }
-        }
+        },
     },
     watch: {
         selVal(n, o) {
             if (n === o) return
-            this.selText = this.dataSelect.find(d => d.id === n).name
+            this.selText = this.dataSelect.find((d) => d.id === n).name
             console.log(n, o)
             if (n == 0) {
                 this.$router.push({ path: 'legendLibrary' })
@@ -298,13 +298,13 @@ export default {
             if (n == 1) {
                 this.$router.push({ path: 'legendRules' })
             }
-        }
+        },
     },
     methods: {
         //业下设备分类和位置分类树形结构
         initQueryDeviceAndPOsition() {
             let postParams = {}
-            queryDeviceAndPOsition({ postParams }).then(res => {
+            queryDeviceAndPOsition({ postParams }).then((res) => {
                 // let data = res.data
                 // data.forEach(data => {
                 //     const map = {
@@ -340,8 +340,8 @@ export default {
         //说明书位置
         instruction() {
             let getParams = {}
-            getLegendTree({ getParams }).then(res => {
-                this.positionSelect = res.Content && res.Content.map(i => this.getTree(i))
+            getLegendTree({ getParams }).then((res) => {
+                this.positionSelect = res.Content && res.Content.map((i) => this.getTree(i))
             })
         },
         //监听取消 修改的时候取消会导致表格不刷新
@@ -355,26 +355,26 @@ export default {
         },
         getTypeId() {
             let postParams = {}
-            queryTypeId({ postParams }).then(res => {
+            queryTypeId({ postParams }).then((res) => {
                 this.typeIdSelect = res.Content
             })
         },
         visualization() {
-            getVisualization({}).then(res => {
+            getVisualization({}).then((res) => {
                 this.typeVisualization =
                     res.Data &&
-                    res.Data.map(i => {
+                    res.Data.map((i) => {
                         return {
                             id: i.Id,
                             name: i.Name,
                             children: i.Children
-                                ? i.Children.map(j => {
+                                ? i.Children.map((j) => {
                                       return {
                                           id: j.Id,
-                                          name: j.Id + '-' + j.Name
+                                          name: j.Id + '-' + j.Name,
                                       }
                                   })
-                                : []
+                                : [],
                         }
                     })
             })
@@ -384,7 +384,7 @@ export default {
             return {
                 id: data.Id,
                 name: data.Name,
-                children: child ? child.map(i => this.getTree(i)) : []
+                children: child ? child.map((i) => this.getTree(i)) : [],
             }
         },
         add() {
@@ -396,15 +396,15 @@ export default {
         modalConfirm() {
             let postParams = [
                 {
-                    Id: this.deleteObject.Id
-                }
+                    Id: this.deleteObject.Id,
+                },
             ]
             deleteLegend({ postParams })
-                .then(res => {
+                .then((res) => {
                     if (res.Result == 'success') {
                         this.$message({
                             type: 'success',
-                            message: '作废成功!'
+                            message: '作废成功!',
                         })
                         this.modalStatusTip = false
                         this.getTableList()
@@ -413,7 +413,7 @@ export default {
                 .catch(() => {
                     this.$message({
                         type: 'info',
-                        message: '已取消删除'
+                        message: '已取消删除',
                     })
                 })
         },
@@ -428,7 +428,7 @@ export default {
         getTableListPosition(val) {
             let postParams = val.map(({ id }) => id)
             let data = {}
-            queryRelation({ data, postParams }).then(res => {
+            queryRelation({ data, postParams }).then((res) => {
                 this.tableData = res.data.Content
                 this.loading = false
                 this.total = res.Total
@@ -437,10 +437,10 @@ export default {
         transformDate(arr) {
             arr.map(({ GraphCategorys, InfoLocal, InfoSystems, InfoTypes }) => {
                 if (GraphCategorys.length) {
-                    GraphCategorys.map(i => i)
+                    GraphCategorys.map((i) => i)
                 }
                 if (InfoLocal.length) {
-                    GraphCategorys.map(i => {
+                    GraphCategorys.map((i) => {
                         i.name
                     })
                 }
@@ -463,15 +463,15 @@ export default {
                 Name: this.keyword,
                 PageNumber: this.currentPage,
                 PageSize: this.size,
-                Type: this.Type == 'all' ? undefined : this.Type
+                Type: this.Type == 'all' ? undefined : this.Type,
             }
-            graphElementSearch({ postParams }).then(res => {
+            graphElementSearch({ postParams }).then((res) => {
                 this.key++
                 // this.tableData = res.Content
                 this.total = res.Total
                 this.tableData =
                     res.Content &&
-                    res.Content.map(i => {
+                    res.Content.map((i) => {
                         if (i.FillColor.length == '9') {
                             i.FillColor = hexToRgba(i.FillColor)
                         }
@@ -506,9 +506,9 @@ export default {
             let InfoSystem = []
             this.InfoSystems = []
             this.InfoLocals = []
-            this.deviceList.forEach(i => {
+            this.deviceList.forEach((i) => {
                 i.children.length > 0 &&
-                    i.children.forEach(j => {
+                    i.children.forEach((j) => {
                         if (id.includes(j.id)) {
                             InfoSystem.push(i.id)
                         }
@@ -525,7 +525,7 @@ export default {
         },
         focusChange(status) {
             // console.log('focusChange', status)
-        }
+        },
     },
     mounted() {
         this.getTypeId()
@@ -533,7 +533,7 @@ export default {
         this.visualization()
         this.getTableList()
         this.initQueryDeviceAndPOsition()
-    }
+    },
 }
 </script>
 <style lang="less" scoped>

+ 2 - 2
vue.config.js

@@ -4,8 +4,8 @@ module.exports = {
         port: 8090,
         proxy: {
             '/data': {
-                // target: "http://60.205.177.43",
-                target: 'http://10.199.143.126',
+                target: "http://60.205.177.43",
+                // target: 'http://10.199.143.126',
                 // target: 'http://192.168.200.11:9003', //yll
                 // target: 'http://localhost:6040/data/',
                 changeOrigin: true,