fire-mh/src/components/mixins/map-data1.js

import axios from "axios";
import data from "@c/mixins/anbao";
export default {
    data() {
        return {
            stores: this.$useStore(),
            map: null,
            oldPopup: null,
            oldPopupId: null,
        };
    },
    mounted() {
        window.vue = this;
        window.jMap = null;
        window.jmapQuery = null;
    },
    methods: {
        streetTownMap(name) {
            return name
        },
        /**
         *地图初始化
         *
         */
        async initMap() {

            window.vue = this;
            window.jMap = null;
            window.jmapQuery = null;
            window.jMap = new JMap();
            var map_params = {
                camera: {
                    x: 121.4175597,
                    y: 31.119248,
                    radius: 18000.0,
                    offset: { heading: -4, pitch: -70, range: 0 },
                },
                map_complete_callback: () => {
                    window.jmapQuery = new JMapQuery(window.jMap);
                    // ToDo...
                },
                map_left_click_callback: (obj, type, movement, event) => {
                    console.log(movement.position)
                    this.stores.$state.tankuangXY = { x: movement.position.x, y: movement.position.y };
                    // this.$store.commit("tankuangXY", { x: movement.position.x, y: movement.position.y });
                },
                map_right_click_callback: (obj) => {},
            };

            let res = await this.$axios.get(this.$api.dt);

            // 加载地图
            window.jMap.createMap("mapF", res.data, window.location.origin, map_params, {});
            // 地图背景样式
            window.jMap.switchBaseLayer("blue");
            /**
             * 获取街镇信息
             */
            var options = {
                click: addLayerCallBack,
                isZoom: false,
                style: {
                    outline: true,
                    outlineColor: "rgb(255,0,0,0.8)",
                    material: "rgb(154,255,154,0)",
                    perPositionHeight: false,
                    height: 5,
                    width: 5,
                    label: {
                        show: true,
                        text: "name",
                        font: "16px Helvetica",
                        fillColor: "rgb(0,255,0,0.9)",
                        pixelOffset: [0, -40],
                        backgroundColor: "rgb(0,0,0,0)",
                        showBackground: false,
                    },
                },
                // where:"name = '莘庄镇'"
            };

            window.jMap.addLayer("mh_dyn_district", [1], options);
            var _this = this;

            function addLayerCallBack(obj) {
                // _this.streetTownMap(obj._name)
                _this.stores.streetTownSet(obj._name)

            }

            // 街镇标题
            var qp = new JMapQueryParam({
                queryMapService: "mh_dyn_district",
                queryMapLayers: [1],
                outFields: ["code", "name", "center_x", "center_y"],
                queryWhere: "name like '%莘庄镇%' ",
                callBack: (res) => {

                    res.features.forEach(async(val) => {
                        await window.jMap.FlagInfo.show({
                            id: val.attributes.code,
                            position: { x: Number(val.attributes.center_x), y: Number(val.attributes.center_y), z: 0 },
                            element: `<div class='ysc-dynamic-layer ys-css3-box' onclick="vue.clickFlag(${val.attributes.code})">
                                                <div class='biaozhu' style="font-size:18px !important">${val.attributes.name}   ${val.attributes.code}</div>
                                        </div>`,
                        }, { isZoom: false });
                    });
                },
            });

            // new JMapQuery(window.jMap).execQuery(qp)

            //window.jMap.bindBuildingClick(callbackFunction)
            // 点击三维建筑模型触发的回调函数
        },
        /**
         *添加动态图层
         *
         */
        addLayer() {
            var wheres = [];
            wheres[1] = "subdistrict='七宝镇'"; // 1:图层序号  subdistrict='七宝镇' 筛选条件
            var options = {
                click: windowGxLayer,
                wheres: wheres
            };

            setTimeout(() => {
                jMap.addImageryLayer("mh_dyn_cywg", [1], options);
            }, 3000);


        },
        // 点击事件回调函数
        addLayerCallBack(obj) {

        },

        /**
         *安保区域划分
         *
         */
        anbaoMap() {
            let target = {
                id: '100001',
                attributes: {
                    name: '大型安保范围',
                },
                position: data[0],
                label: {
                    text: "大型安保范围",
                    font: "16px Helvetica",
                    color: "rgba(255,255,255,0.1)",
                    pixelOffset: [0, -50],
                    backgroundColor: "red"
                }

            }
            var options = {
                isZoom: true,
                style: {
                    color: 'rgb(255,255,0,0.9)',
                    transparency: 1,
                    outline: true,
                    outlineColor: 'transparent',
                    perPositionHeight: true

                },
                // click: regionLocateCallBack
            };
            setTimeout(() => {
                window.jMap.Locate.trackLocate(target, options);
            }, 1000)

        },
        // 安保分布点点击事件的回调函数
        regionLocateCallBack(obj) {
            console.log(obj); // obj为返回值
        },

        /**
         * @聚合撒点
         * @param {数据list} data
         * @param {页面类型} pageType
         * @param {类型} type
         */
        initMarkers(data, pageType, type) {
            var _this = this;

            var tag = 1; //1.自定义图标 2.完全自定义 3.默认
            var style = ""; //地图最大化小图标
            var points = []; //地图撒点处理数据存储

            var options = {
                style: { pixelRange: 10 },
                isZoom: true,
                click: clusterMapCallBack,
            };
            jMap.ClusterMap.show(data, options);
        },
        clickFlag(val) {
            console.log(val);
        },
        randomColor() {
            var color = "#";
            //for循环中，如果后面仅有一条语句，{}可省略不写
            //随机生成6位0-15之间的数字，再用toString(16)将数字转成16进制
            for (var i = 0; i < 6; i++) color += parseInt(Math.random() * 16).toString(16);
            return color;
        },
        removeMarkers(lnglats) {
            this.map.remove(lnglats);
        },
        /**
         *街镇切换
         */
        streetTownSwitch(data) {
            //     console.log(data);
            let sf = 2800.0;
            if (data.id == 12) {
                //区缩放比例调整
                sf = 18000.0;
            }
            var options = {
                area: data.id,
                base_layer_name: "dark",
                model_data_name: "dark",
                isShowDistrictLabel: true,
                camera: {
                    x: data.x,
                    y: data.y,
                    radius: sf,
                    offset: { heading: 4, pitch: -89, range: 0 },
                },
            };
            jMap.switchStreet(options);
        },

        /**
         * 点分布（撒点）
         * @param {坐标信息} lnglats
         * @param {页面类型} type
         */
        addMarker(lnglats, pageType, type) {
            window.jMap.Locate.clearLocate();
            let icon = "";
            let arr = []
            let arr1 = []
            let arr2 = []
            let arr3 = []
            let arr4 = []
            let arr5 = []
            var target = lnglats.map((val, ind) => {
                var wgs84 = CoordUtil.gcj02towgs84(Number(val.gisX) || Number(val.longitude), Number(val.gisY) || Number(val.latitude))
                var x = wgs84[0]
                var y = wgs84[1]
                if (pageType == "enforcement-dynamic" ||
                    pageType == "self-management" ||
                    pageType == "comprehensive-disposal" ||
                    pageType == "rescue-station" ||
                    pageType == "security-plan" ||
                    pageType == "fire-signs" ||

                    pageType == "fire-data-analysis" ||
                    pageType == "water-sources") {
                    let marker = {
                        id: ind + 1,
                        attrbutes: val,
                        position: {
                            x: x,
                            y: y,
                            //     x: Number(val.gisX) || Number(val.longitude),
                            //     y: Number(val.gisY) || Number(val.latitude),
                            z: 0
                        },
                        image: {
                            url: type == "双随机执法单位" ? this.stores.sadianIcon.ssjzf : type == "安全检查单位" ? this.stores.sadianIcon.aqjcdw : type == "举报投诉" ? this.stores.sadianIcon.jbts : type == "执法记录仪" ? this.stores.sadianIcon.zfjly :

                                type == "重点单位" ? this.stores.sadianIcon.zddw : type == "龙湖天街（试点）" ? this.stores.sadianIcon.lhtj : type == "一般单位" ? this.stores.sadianIcon.ybdw : type == "九小场所" ? this.stores.sadianIcon.jxcs : type == "其他单位" ? this.stores.sadianIcon.qtdw :

                                type == "厂房" ? this.stores.sadianIcon.cf : type == "仓库" ? this.stores.sadianIcon.ck :

                                type == "车辆" && val.type != "国家会展中心" ? this.stores.sadianIcon.xfc : type == "历史警情" && val.type != "国家会展中心" ? this.stores.sadianIcon.lsjq :

                                type == "历史火灾" && val.type != "国家会展中心" ? this.stores.sadianIcon.lshz : val.type == "国家会展中心" ? this.stores.sadianIcon.hzzx :

                                type == "亡人火灾" ? this.stores.sadianIcon.wrhz : type == "伤人火灾" ? this.stores.sadianIcon.srhz :

                                type == "消火栓可用" ? this.stores.sadianIcon.xhs : type == "消火栓不可用" ? this.stores.sadianIcon.xhsH :

                                type == "天然水源" ? this.stores.sadianIcon.trsy : type == "科普教育基地" ? this.stores.sadianIcon.kpjyjd :

                                type == "消防站" ? this.stores.sadianIcon.xfz : type == "高层建筑覆盖" && val.stationType == 1 ? this.stores.sadianIcon.xfdjl :

                                type == "高层建筑覆盖" && val.stationType == 2 ? this.stores.sadianIcon.xfdj2 : type == "高层建筑覆盖" && val.stationType == 3 ? this.stores.sadianIcon.xfdj3 :

                                type == "高层建筑覆盖" && val.stationType == 4 ? this.stores.sadianIcon.zzd : type == "高层建筑覆盖" && val.stationType == 5 ? this.stores.sadianIcon.jzwxxfz :

                                type == "高层建筑覆盖" && val.stationType == 111 ? this.stores.sadianIcon.dian : type == "高层建筑" ? this.stores.sadianIcon.gcggjz :

                                type == "专职队" ? this.stores.sadianIcon.zzd : type == "微型消防站" ? this.stores.sadianIcon.jzwxxfz : type == "大型综合体" && val.facilityType == "lhtj" ? this.stores.sadianIcon.lhtj :

                                type == "大型综合体" && (val.facilityType == 2 || val.facilityType == 3) ? this.stores.sadianIcon.dxzht : type == "重大火灾隐患" ? this.stores.sadianIcon.lsjq :

                                type == "企业消防" && val.facilityType == 13 ? this.stores.sadianIcon.zddw : type == "企业消防" && val.facilityType == 14 ? this.stores.sadianIcon.ybdw :

                                type == "社区消防" && val.facilityType == 15 ? this.stores.sadianIcon.zddw : type == "社区消防" && val.facilityType == 16 ? this.stores.sadianIcon.ybdw :

                                type == "一级微型消防站" ? this.stores.sadianIcon.yjxfz : type == "街镇专职消防队" ? this.stores.sadianIcon.jzzzxfd : type == "中小学" ? this.stores.sadianIcon.zs : type == "幼儿园" ? this.stores.sadianIcon.yey : type == "其他学校" ? this.stores.sadianIcon.qtxx :

                                type == "三合一" ? this.stores.sadianIcon.shy : type == "实时警情" ? this.stores.sadianIcon.ssjq :

                                type == "本年度重点事项推进情况" && val.status == 1 ? this.stores.sadianIcon.ywc : type == "本年度重点事项推进情况" && val.status == 2 ? this.stores.sadianIcon.jxz : type == "本年度重点事项推进情况" && val.status == 3 ? this.stores.sadianIcon.zbz : 

                                type == "高风险" ? this.stores.sadianIcon.gfx : type == "较高风险" ? this.stores.sadianIcon.jgfx : type == "一般风险" ? this.stores.sadianIcon.ybfx : type == "低风险" ? this.stores.sadianIcon.dfx : 
                                
                                this.stores.sadianIcon.trsy,

                            // this.jqzhczIcon3 : val.type == "4" ?
                            // this.jqzhczIcon4 : val.type == "5" ?
                            // this.jqzhczIcon5 : val.type == "消火栓" && val.status == "1" ?
                            // this.jqzhczIcon5 : val.type == "消火栓" && val.status == "2" ?
                            // this.jqzhczIcon51 : val.type == "天然水源" ?
                            // this.jqzhczIcon7 : this.xfzfdtIcon4,

                            width: val.type == "国家会展中心" ? 83 : type == "高层建筑覆盖" && val.stationType == 111 ? 7 : type == 111 ? 74 : 19.5,
                            height: val.type == "国家会展中心" ? 59 : type == "高层建筑覆盖" && val.stationType == 111 ? 7 : type == 111 ? 66 : 25,
                        },
                    };
                    if (type == "高层建筑覆盖" && val.stationType == 1) {
                        arr1.push(val)
                    }
                    if (type == "高层建筑覆盖" && val.stationType == 2) {
                        arr2.push(val)
                    }
                    if (type == "高层建筑覆盖" && val.stationType == 3) {
                        arr3.push(val)
                    }
                    if (type == "高层建筑覆盖" && val.stationType == 4) {
                        arr4.push(val)
                    }
                    if (type == "高层建筑覆盖" && val.stationType == 5) {
                        arr5.push(val)
                    }

                    return marker;
                } else {
                    let marker = {
                        id: ind + 1,
                        attrbutes: val,
                        position: { x: val.gisBaiDuX, y: val.gisBaiDuY, z: 0 },
                        image: { url: icon, width: 300, height: 300 },
                    };

                    return marker;
                }
            });
            if (type == "高层建筑覆盖") {
                if (arr1.length > 0) {
                    this.bufferL1(arr1)
                }
                if (arr2.length > 0) {
                    this.bufferL2(arr2)
                }
                if (arr3.length > 0) {
                    this.bufferL3(arr3)
                }
                if (arr4.length > 0) {
                    this.bufferL4(arr4)
                }
                if (arr5.length > 0) {
                    this.bufferL5(arr5)
                }
                // this.bufferL(arr)
            }
            //消防水源
            if (pageType == "water-sources") {
                var array = {
                    clusterId: 100001,
                    clusterData: []
                }
                var target1 = lnglats.map((val, ind) => {
                    var wgs84 = CoordUtil.gcj02towgs84(Number(val.gisX) || Number(val.longitude), Number(val.gisY) || Number(val.latitude))
                    var x = wgs84[0]
                    var y = wgs84[1]
                    val.type2 = type
                    var array1 = {
                        attributes: val,
                        position: {
                            x: x,
                            y: y,
                            z: 0,
                        },
                        image: {
                            url: type == "消火栓可用" ? this.stores.sadianIcon.xhs : type == "消火栓不可用" ? this.stores.sadianIcon.xhsH : type == "天然水源" ? this.stores.sadianIcon.trsy : this.stores.sadianIcon.trsy,
                            width: 19.5,
                            height: 25,
                        }
                    }
                    array.clusterData.push(array1)
                })
                var options = {
                    style: { pixelRange: 60 },
                    isZoom: true,
                    click: this.clusterMapCallBack

                };
                window.jMap.ClusterMap.show(array, options)
            } else {
                //撒点类型
                window.jMap.Locate.pointLocate(target, {
                    //撒点
                    isZoom: false,
                    //animate: { "show": true },
                    scaleByDistance: {
                        minScaling: 1,
                        maxScaling: 1,
                        minDistance: 50, //最小距离
                        maxDistance: 120000 //最大距离
                    },
                    click: (val) => {
                        //消防执法
                        if (pageType == "enforcement-dynamic") {
                            if (type == "安全检查单位" || type == "双随机执法单位") {
                                this.$axios
                                    .get(
                                        this.$api.siaeall.one +
                                        "?" +
                                        this.$qs.stringify({
                                            companyId: val.attrbutes.number,
                                            companyName: val.attrbutes.name,
                                        })
                                    )
                                    .then((res) => {
                                        res.data[0].company = val._attrbutes.name;
                                        res.data[0].streetTown = val._attrbutes.streetTown;
                                        let arrayList = [{
                                                title: [res.data[0].company, res.data[0].company ? true : false],
                                                children: [
                                                    ["单位地址：", res.data[0].companyAddress, 24],
                                                    ["负责人：", res.data[0].linkPerson, 10],
                                                    ["联系电话：", res.data[0].linkPhone, 14],
                                                    ["历史火灾次数：", res.data[0].fireCount, 12],

                                                ],
                                            },
                                            {
                                                title: ["行政许可情况", res.data[0].processDate && res.data[0].carefullyCheckDate && res.data[0].securityCheckDates],
                                                children: [
                                                    ["审核时间：", res.data[0].processDate, 12],
                                                    ["验收时间：", res.data[0].carefullyCheckDate, 12],
                                                    ["安检时间：", res.data[0].securityCheckDates, 12],
                                                ],
                                            },
                                            {
                                                title: ["历史检查情况", res.data[0].inspectCompany && res.data[0].fireHazard && res.data[0].rectificateFireHazard && res.data[0].punishmentDecision && res.data[0].orderThreeStops && res.data[0].correctionNotice && res.data[0].temporarySeizure && res.data[0].penaltyAmount],
                                                children: [
                                                    ["检查：", res.data[0].inspectCompany + "(家)", 8],
                                                    ["隐患：", res.data[0].fireHazard + "(起)", 8],
                                                    ["整改：", res.data[0].rectificateFireHazard + "(起)", 8],
                                                    ["行罚：", res.data[0].punishmentDecision + "(份)", 8],
                                                    ["三停：", res.data[0].orderThreeStops + "(家)", 8],
                                                    ["责改：", res.data[0].correctionNotice + "(份)", 8],
                                                    ["临封：", res.data[0].temporarySeizure + "(份)", 8],
                                                    ["罚金：", res.data[0].penaltyAmount + "(万元)", 8],
                                                ],
                                            },
                                            {
                                                title: ["相关火灾情况", res.data[0].fireTime && res.data[0].disposalDuration && res.data[0].burnedArea && res.data[0].fireGrade && res.data[0].mobilizeVehicles && res.data[0].squadron && res.data[0].status && res.data[0].initialFuelType1],
                                                children: [
                                                    ["报警时间：", res.data[0].fireTime, 12],
                                                    ["处置时长：", res.data[0].disposalDuration, 12],
                                                    ["过火面积：", res.data[0].burnedArea, 12],
                                                    ["火灾等级：", res.data[0].fireGrade, 12],
                                                    ["调动车辆：", res.data[0].mobilizeVehicles + "(辆)", 12],
                                                    ["所属中队：", res.data[0].squadron, 12],
                                                    ["状况：", res.data[0].status, 12],
                                                    ["起火物：", res.data[0].initialFuelType1, 12],
                                                ],
                                            },
                                        ];
                                        this.popup(val._attrbutes, arrayList, true)
                                    });
                            } else if (type == "举报投诉") {
                                let arrayList = [{
                                    title: [val._attrbutes.name, true],
                                    children: [

                                    ],
                                }]
                                this.popup(val._attrbutes, arrayList, true)

                            } else if (type == "执法记录仪") {
                                let arrayList = [{
                                        title: [val._attrbutes.groupName, true],
                                        children: [
                                            ["执法人：", val._attrbutes.name, 12],
                                        ],
                                        type: type,
                                        url: val._attrbutes.url,
                                    },

                                ]
                                this.popup(val._attrbutes, arrayList, true)
                            } else if (type == "重大火灾隐患") {
                                let msgParse = JSON.parse(val.attrbutes.extendData)
                                let arrayList = [{
                                    title: [val.attrbutes.facilityName, true],
                                    children: [
                                        ["地址：", val.attrbutes.address, 24],
                                        ["分类等级：", val.attrbutes.address, 24],
                                        ["基础信息:", msgParse.test1, 24],
                                        ["消防安全隐患情况：", msgParse.test2, 24],

                                    ],
                                }, ];
                                this.popup(val._attrbutes, arrayList, true)
                            } else if (type == "三合一") {
                                let msgParse = JSON.parse(val.attrbutes.extendData)
                                let arrayList = [{
                                    title: [val.attrbutes.facilityName, true],
                                    children: [
                                        ["单位地址：", val.attrbutes.address.replace("\t", ""), 24],
                                        ["单位类别：", "三合一九小场所", 24],
                                        ["单位法人:", val.attrbutes.facilityName.replace("\t", ""), 24],

                                        ["检查人员姓名：", msgParse.test1, 24],
                                        ["检查时间：", msgParse.test3, 24],
                                        ["单位使用性质：", msgParse.test4, 24],
                                        ["单位所属街道：", msgParse.test8, 24],
                                        ["消消防安全责任人：", msgParse.test10, 24],
                                        ["消防安全管理人（联系人）：", msgParse.test11, 24],
                                        ["联系电话（手机）：", msgParse.test12, 24],
                                        ["单位（场所）面积（m²）：", msgParse.test17, 24],
                                        ["地上：", msgParse.test18, 24],
                                        ["地下：", msgParse.test19, 24],
                                        ["建筑性质：", msgParse.test21, 24],
                                        ["建筑结构：", msgParse.test22, 24],

                                    ],
                                }, ];
                                this.popup(val._attrbutes, arrayList, true)
                            } else if (type == "本年度重点事项推进情况") {
                                let msgParse = JSON.parse(val.attrbutes.extendData)
                                let arrayList = [{
                                    title: [val.attrbutes.facilityName, true],
                                    children: [
                                        ["街道名称：", val.attrbutes.streetTown, 24],
                                        ["地址：", val.attrbutes.address, 24],
                                        ["状态：", val.attrbutes.status == 1 ? "已完成" : val.attrbutes.status == 2 ? "施工中" : val.attrbutes.status == 3 ? "招标中" : "", 24],

                                    ],
                                }, ];
                                this.popup(val._attrbutes, arrayList, true)
                            }
                        }

                        //企业自主
                        if (pageType == "self-management") {
                            if (val.attrbutes.type == "重点单位") {
                                this.elementInfo(val.attrbutes, "重点单位")
                            } else if (val.attrbutes.type == "大型综合体") {
                                let msgParse = JSON.parse(val.attrbutes.extendData)
                                let arrayList = [{
                                    title: [val.attrbutes.facilityName, true],
                                    children: [
                                        ["地址：", val.attrbutes.address, 24],
                                        ["类型：", val.attrbutes.facilityType == 2 ? "5W平大型商业综合体" : val.attrbutes.facilityType == 3 ? "3-5万平大型商业综合体" : "", 24],
                                        ["平面布局：", msgParse.planeLayout, 24],
                                        ["用火用电用气管理：", msgParse.fireGasManage, 24],
                                        ["油烟管道管理：", msgParse.oilFumeManage, 24],
                                        ["消防设施：", msgParse.fireFacility, 24],
                                        ["其他安全管理：", msgParse.otherSecurityManage, 24],
                                        ["合计汇总：", msgParse.totalSummary, 24],
                                    ],
                                }, ];
                                this.popup(val._attrbutes, arrayList, true)
                            } else if (val.attrbutes.type == "中小学" || val.attrbutes.type == "幼儿园" || val.attrbutes.type == "其他学校") {
                                let msgParse = JSON.parse(val.attrbutes.extendData)
                                let phone = val.attrbutes.contactPhone
                                let arrayList = [{
                                    title: [val.attrbutes.facilityName, true],
                                    children: [
                                        ["机构简称：", msgParse.test1, 24],
                                        // ["学校办别：", val.attrbutes.facilityType, 24],
                                        ["学校类型：", val.attrbutes.type, 24],
                                        ["所在街镇：", val.attrbutes.streetTown, 24],
                                        ["地址：", msgParse.address, 24],
                                        ["法人代表：", val.attrbutes.contact, 24],
                                        ["手机：", phone.length > 8 ? phone.substring(0, 3) + '****' + phone.substring(phone.length - 3, phone.length) : phone.substring(0, 2) + '***' + phone.substring(phone.length - 3, phone.length), 24],
                                    ],
                                }, ];
                                this.popup(val._attrbutes, arrayList, true)

                            } else {
                                let arrayList = [{
                                    title: ["单位详情", val.attrbutes.companyName ? true : false],
                                    children: [
                                        ["单位名称：", val.attrbutes.companyName, 24],
                                        ["单位类型：", val.attrbutes.companyTypeName, 24],
                                        ["联系电话：", val.attrbutes.linkPhone, 24],
                                        ["地址：", val.attrbutes.address, 24],
                                    ],
                                }, ];
                                this.popup(val._attrbutes, arrayList, true)
                            }

                        }
                        //大型安保 、火灾数据分析
                        if (pageType == "security-plan" || pageType == "fire-data-analysis") {
                            let arrayList = [{
                                title: ["案件详情", true],
                                children: [
                                    ["案件编号：", val.attrbutes.ajbh, 24],
                                    ["案件描述：", val.attrbutes.bcxx, 24],
                                    ["报警时间：", val.attrbutes.tzsj, 24],
                                    ["案件类型：", val.attrbutes.ajlx, 24],
                                    ["警情类别：", type, 24],
                                    ["警情等级：", val.attrbutes.ajdj, 24],
                                    ["调动车辆：", val.attrbutes.cdcl, 24],
                                    ["处置对象：", val.attrbutes.czdx, 24],
                                    ["主责中队：", val.attrbutes.zhongdui, 24],
                                    ["案件状态：", val.attrbutes.ajzt, 24],
                                    ["到场时间：", val.attrbutes.cssj, 24],
                                    ["控制时间：", val.attrbutes.kzsj, 24],
                                    ["熄灭时间：", val.attrbutes.xmsj, 24],
                                    ["返队时间：", val.attrbutes.fdsj, 24],
                                    ["所属街道：", val.attrbutes.streettown, 24],
                                ],
                            }, ];
                            if (val._attrbutes.type != "国家会展中心") {
                                this.popup(val._attrbutes, arrayList, true)
                            }
                        }
                        //消防救援站点
                        if (pageType == "rescue-station") {
                            if (type == "科普教育基地") {
                                let arrayList = [{
                                    title: [val.attrbutes.type, true],
                                    children: [
                                        ["成立时间/联系人：", val.attrbutes.policeTime, 24],
                                        ["站点地址：", val.attrbutes.alertLevel, 24],
                                        ["预约电话：", val.attrbutes.address, 24],
                                    ],
                                }, ];
                                this.popup(val._attrbutes, arrayList, true)
                            }
                            if (type == "消防站" || type == "专职队" || type == "高层建筑覆盖" || type == "高层建筑" || type == "微型消防站" || type == "一级微型消防站" || type == "街镇专职消防队") {
                                if (val.attrbutes.stationType == 1 || val.attrbutes.stationType == 2 || val.attrbutes.stationType == 3 || val.attrbutes.stationType == 4) {
                                    let arrayList = [{
                                        title: [val.attrbutes.stationName, true],
                                        children: [
                                            ["消防站地址：", val.attrbutes.stationAddress, 24],
                                            ["消防站类型：", val.attrbutes.stationType == 1 ? "一级消防站" : val.attrbutes.stationType == 2 ? "二级消防站" : val.attrbutes.stationType == 3 ? "三级消防站" : val.attrbutes.stationType == 4 ? "专职队" : "", 24],
                                        ],
                                    }, ];
                                    this.popup(val._attrbutes, arrayList, true)
                                }
                                if (val.attrbutes.stationType == 5) {
                                    let arrayList = [{
                                        title: [val.attrbutes.streetTown + "微型消防站（" + val.attrbutes.stationCode + '号）', true],
                                        children: [
                                            ["地址：", val.attrbutes.stationAddress, 24],
                                            ["编号：", val.attrbutes.stationCode, 24],
                                            ["距消防站直线距离：", val.attrbutes.stationAddress, 24],
                                            ["距消防站行驶距离：", val.attrbutes.driveDistance, 24],
                                            ["交通拥堵行驶时间：", val.attrbutes.jamDrive, 24],
                                            ["交通畅通行驶时间：", val.attrbutes.unimpededDrive, 24],
                                            //     ["点位情况：", val.attrbutes.pointSituation, 24],
                                            ["建筑情况：", val.attrbutes.buildSituation, 24],
                                            ["车辆停放：", val.attrbutes.vehiclePark, 24],
                                            ["是否有产证：", val.attrbutes.birthCert, 24],
                                            ["产证情况：", val.attrbutes.birthCertSituation, 24],
                                        ],
                                    }, ];
                                    this.popup(val._attrbutes, arrayList, true)
                                }
                                if (val.attrbutes.stationType == 111 || val.attrbutes.stationType == 112) {
                                    let arrayList = [{
                                        title: [val.attrbutes.buildName, true],
                                        children: [
                                            ["建筑地址：", val.attrbutes.address, 24],
                                            ["主要产权人：", val.attrbutes.principalPropertyOwner, 24],
                                            ["统一社会信用代码：", val.attrbutes.creditCode, 24],
                                            ["物业服务企业名称：", val.attrbutes.propertyServiceName, 24],
                                            ["建成年份：", val.attrbutes.completeYear, 24],
                                            ["建筑高度：", val.attrbutes.buildHigh, 24],
                                            ["地上建筑层数：", val.attrbutes.aboveFloor, 24],
                                            ["地下建筑层数：", val.attrbutes.underFloor, 24],
                                            ["建筑类型：", val.attrbutes.buildType, 24],
                                            ["功能用途：", val.attrbutes.functionalPurpose, 24],
                                        ],
                                    }, ];
                                    this.popup(val._attrbutes, arrayList, true)
                                }
                                if (val.attrbutes.stationType == 17 || val.attrbutes.stationType == 18) {
                                    let bianhao = JSON.parse(val.attrbutes.extendData).test1
                                    let arrayList = [{
                                        title: [val.attrbutes.facilityName, true],
                                        children: [
                                            ["编号：", bianhao, 24],
                                            ["消防站地址：", val.attrbutes.address, 24],
                                            ["消防站类型：", val.attrbutes.stationType == 17 ? "一级微型消防站" : val.attrbutes.stationType == 18 ? "街镇专职消防队" : "", 24],
                                        ],
                                    }, ];
                                    this.popup(val._attrbutes, arrayList, true)
                                }
                            }
                            if (type == "企业消防" || type == "社区消防") {
                                let arrayList = [{
                                    title: [val.attrbutes.facilityName, true],
                                    children: [

                                        ["站点地址：", val.attrbutes.address, 24],
                                        ["站点类型：", val.attrbutes.facilityType == 13 ? "重点单位微站" :
                                            val.attrbutes.facilityType == 14 ? "一般单位微站" : val.attrbutes.facilityType == 15 ? "居委会微站" : val.attrbutes.facilityType == 16 ? "村委会微站" : "", 24
                                        ],
                                        ["街镇：", val.attrbutes.streetTown, 24],
                                    ],
                                }, ];
                                this.popup(val._attrbutes, arrayList, true)
                            }

                        }

                        //警情综合处置
                        if (pageType == "comprehensive-disposal") {
                            if (type == "实时警情") {
                                let arrayList = [{
                                    title: ["案件详情", true],
                                    children: [
                                        ["案件编号：", val.attrbutes.ajbh, 24],
                                        ["案件描述：", val.attrbutes.bcxx, 24],
                                        ["报警时间：", val.attrbutes.tzsj, 24],
                                        ["案件类型：", val.attrbutes.ajlx, 24],
                                        ["警情类别：", val.attrbutes.type, 24],
                                        ["警情等级：", val.attrbutes.ajdj, 24],
                                        ["案发地址：", val.attrbutes.afdz, 24],
                                        ["调动车辆：", val.attrbutes.cdcl, 24],
                                        ["处置对象：", val.attrbutes.czdx, 24],
                                        ["主责中队：", val.attrbutes.zhongdui, 24],
                                        ["案件状态：", val.attrbutes.cssj, 24],
                                        ["到场时间：", val.attrbutes.dcsj, 24],
                                        ["出水时间：", val.attrbutes.cssj, 24],
                                        ["控制时间：", val.attrbutes.kzsj, 24],
                                        ["熄灭时间：", val.attrbutes.xmsj, 24],
                                        ["所属街道：", val.attrbutes.streettown, 24],
                                    ],
                                }, ];
                                this.popup(val._attrbutes, arrayList, true)
                            }

                        }
                        //城市消防体征
                        if (pageType == "fire-signs") {
                            if (type == "仓库") {
                                let arrayList = [{
                                    title: [val.attrbutes.companyName, true],
                                    children: [
                                        ["单位地址：", val.attrbutes.address, 24],
                                        ["单位类别：", val.attrbutes.companyType, 24],
                                        ["单位使用性质：", val.attrbutes.companyNature, 24],
                                        ["单位（法人）名称：", val.attrbutes.delegateName, 24],
                                        ["统一社会信用代码：", val.attrbutes.socialCode, 24],
                                        ["所辖派出所：", val.attrbutes.policeStation, 24],
                                        ["消防安全责任人：", val.attrbutes.fireDutyName, 24],
                                        ["消防安全管理人：", val.attrbutes.fireManageName, 24],
                                        ["联系电话（手机）：", val.attrbutes.linkPhone, 24],
                                        ["是否自主消防安全管理：", val.attrbutes.fireSafetyManage, 24],
                                        ["单位（场所）面积（㎡）：", val.attrbutes.companyArea, 24],
                                        ["行业类别：", val.attrbutes.industryType, 24],
                                        ["是否为洁净厂房：", val.attrbutes.cleanRoom, 24],
                                        ["生产经营组织形式：", val.attrbutes.organizationForm, 24],
                                        ["网格号：", val.attrbutes.gridNo, 24],
                                        ["年份：", val.attrbutes.particularYear, 24],
                                        ["提交时间：", val.attrbutes.submitTime, 24],
                                        ["经度：", val.attrbutes.longitude, 24],
                                        ["纬度：", val.attrbutes.latitude, 24],
                                    ],
                                }, ];
                                this.popup(val._attrbutes, arrayList, true)
                            }
                        }

                    },
                });
            }

        },
        //聚合点击事件
        clusterMapCallBack(clusterPointArr, clickPoint) {
            let val = clusterPointArr.attributes
            if (val.type2 == "消火栓可用" || val.type2 == "消火栓不可用") {
                let arrayList = [{
                    title: ["消火栓", true],
                    children: [
                        ["水源位置：", val.address, 24],
                        ["电话：", val.phone, 12],
                        ["责任人：", val.dutyPerson, 12],
                        ["支队名称：", val.detachmentName, 24],
                        ["管辖机构：", val.jurisdictionalAgency, 12],
                        ["水源类型：", val.type, 12],
                        ["取水形式：", val.getWaterType, 12],
                        ["水源性质：", val.waterAdministrative, 12],
                        ["供水单位：", val.waterUnit, 24],
                        ["水压（Mpa）：", val.waterGage, 24],
                        ["状态：", val.status == 1 ? "可用" : "不可用", 12],
                    ],
                }, ];
                this.popup(val, arrayList, true)
            } else if (type == "天然水源") {
                let arrayList = [{
                    title: [val.facilityName, true],
                    children: [
                        ["水源位置：", val.address, 24],
                    ],
                }, ];
                this.popup(val, arrayList, true)
            }
        },

        heatMap(data) {
            let target = []
            if (data.length > 0) {
                for (let i = 0; i < data.length; i++) {
                    var wgs84 = CoordUtil.gcj02towgs84(Number(data[i].gisX) || Number(data[i].longitude), Number(data[i].gisY) || Number(data[i].latitude))
                    var x = wgs84[0]
                    var y = wgs84[1]
                    target[i] = []
                    target[i].x = x
                    target[i].y = y
                }
            }
            let options = {
                style: {
                    minOpacity: 0.6,
                    maxOpacity: 0.9,
                    radius: 50,
                    gradient: {
                        '.10': 'green',
                        '.45': 'yellow',
                        '.65': 'orange',
                        '.80': 'red'
                    }
                },
                isZoom: false
            }
            jMap.HeatMap.show(target, options)
        },
        // 无经纬度创建标点和点击事件
        addMarkerAddress(lnglats) {
            let target = lnglats.map((val, ind) => {
                if (!val.addressId) {
                    let addressInfo = window.jMap.queryMphInfo(val.address)[val.address][0];
                    return {
                        ...val,
                        addressId: addressInfo.address_id, // 地址id
                        province: addressInfo.province, // 市
                        district: addressInfo.district, // 区
                        sub_district: addressInfo.sub_district, // 街镇
                        streetname: addressInfo.streetname, // 路
                        address: addressInfo.address, // 户
                        committee: addressInfo.committee, // 居委会
                    };
                }
            });
            target = target.reduce((item, next) => {
                !item.some((val) => val.addressId === next.addressId) && item.push(next);
                return item;
            }, []);
            for (let item = 0; item < Math.floor(target.length / 100); item++) {
                setTimeout(() => {
                    window.jMap.locateMph(
                        target
                        .slice(item * 100, (item + 1) * 100)
                        .map((val) => val.addressId)
                        .join(), {
                            isZoom: false,
                            scaleByDistance: { minScaling: 0, maxScaling: 1, minDistance: 1000, maxDistance: 30000 },
                            click: (value) => {
                                this.elementInfo(value, "fire");
                            },
                        }
                    );
                }, 0);
            }
        },
        elementInfo(value, type) {
            let element = "";
            if (type == "重点单位") {
                element = `<div class="ysc-dynamic-layer ys-css3-box" onclick="vue.removePopup">
                                    <div class="tableTooltip mapTab">
                                    <div class="tableTitle">
                                        <div>1212121</div>
                                    </div>
                                   </div>
                                </div>`;
            }
            this.addMarkerInfo(element, value, type);
        },
        bufferL(val) {
            let target = {
                geometry: [{
                    position: [],
                    type: 'point'
                }],
                distance: 7000
            }
            for (let i = 0; i < val.length; i++) {
                // var wgs84 = CoordUtil.gcj02towgs84(Number(val.longitude + '0000000' ),  Number(val.latitude + '0000000' ))
                // var x = wgs84[0]
                // var y = wgs84[1]
                target.geometry[i] = {
                        position: [{ x: Number(val[i].longitude) + '0000000', y: Number(val[i].latitude) + '0000000' }],
                        type: 'point'
                    }
                    // if(val[i].stationType ==7 ){
                    //         target
                    // }
            }
            var options = { callBack: this.bufferCallback };
            jMap.Buffer.generate(target, options);
        },
        bufferL1(val) {
            let target = {
                geometry: [{
                    position: [],
                    type: 'point'
                }],
                distance: ((Math.sqrt(7 / 3.14) * 1000) / 2).toFixed(0)
            }
            for (let i = 0; i < val.length; i++) {
                var wgs84 = CoordUtil.gcj02towgs84(Number(val[i].longitude), Number(val[i].latitude))
                var x = wgs84[0].toFixed(13)
                var y = wgs84[1].toFixed(13)
                target.geometry[i] = {
                    position: [{ x: x, y: y }],
                    type: 'point'
                }
            }
            var options = { callBack: bufferCallback };
            jMap.Buffer.generate(target, options);
        },
        bufferL2(val) {
            let target = {
                geometry: [{
                    position: [],
                    type: 'point'
                }],
                distance: ((Math.sqrt(4 / 3.14) * 1000) / 2).toFixed(0)
            }
            for (let i = 0; i < val.length; i++) {
                var wgs84 = CoordUtil.gcj02towgs84(Number(val[i].longitude), Number(val[i].latitude))
                var x = wgs84[0].toFixed(13)
                var y = wgs84[1].toFixed(13)
                target.geometry[i] = {
                    position: [{ x: x, y: y }],
                    type: 'point'
                }
            }
            var options = { callBack: bufferCallback };
            jMap.Buffer.generate(target, options);
        },
        bufferL3(val) {
            let target = {
                geometry: [{
                    position: [],
                    type: 'point'
                }],
                distance: ((Math.sqrt(2 / 3.14) * 1000) / 2).toFixed(0)
            }
            for (let i = 0; i < val.length; i++) {
                var wgs84 = CoordUtil.gcj02towgs84(Number(val[i].longitude), Number(val[i].latitude))
                var x = wgs84[0].toFixed(13)
                var y = wgs84[1].toFixed(13)
                target.geometry[i] = {
                    position: [{ x: x, y: y }],
                    type: 'point'
                }
            }
            var options = { callBack: bufferCallback };
            jMap.Buffer.generate(target, options);
        },
        bufferL4(val) {
            let target = {
                geometry: [{
                    position: [],
                    type: 'point'
                }],
                distance: ((Math.sqrt(2 / 3.14) * 1000) / 2).toFixed(0)
            }
            for (let i = 0; i < val.length; i++) {
                var wgs84 = CoordUtil.gcj02towgs84(Number(val[i].longitude), Number(val[i].latitude))
                var x = wgs84[0].toFixed(13)
                var y = wgs84[1].toFixed(13)
                target.geometry[i] = {
                    position: [{ x: x, y: y }],
                    type: 'point'
                }
            }
            var options = { callBack: bufferCallback };
            jMap.Buffer.generate(target, options);
        },
        bufferL5(val) {
            let target = {
                geometry: [{
                    position: [],
                    type: 'point'
                }],
                distance: ((Math.sqrt(2 / 3.14) * 1000) / 2).toFixed(0)
            }
            for (let i = 0; i < val.length; i++) {
                var wgs84 = CoordUtil.gcj02towgs84(Number(val[i].longitude), Number(val[i].latitude))
                var x = wgs84[0].toFixed(13)
                var y = wgs84[1].toFixed(13)
                target.geometry[i] = {
                    position: [{ x: x, y: y }],
                    type: 'point'
                }
            }
            var options = { callBack: bufferCallback };
            jMap.Buffer.generate(target, options);
        },
        bufferCallback(result) {
            for (var i in result) {
                var target = {
                    id: i,
                    position: CoordUtil.arrayToJson(result[i].rings[0]) //  二维坐标数组转JSON数组，详见三中
                };
                var options = {
                        style: {
                            color: 'red',
                            transparency: 0.6,
                        }
                    }
                    // if (result[i].stationType == 1) {
                    //     options.style.color = '#f80000',
                    //         options.style.transparency = 0.6
                    // }
                    // if (result[i].stationType == 2) {
                    //     options.style.color = '#f88c00',
                    //         options.style.transparency = 0.6
                    // }
                    // if (result[i].stationType == 3) {
                    //     options.style.color = '#0092f8',
                    //         options.style.transparency = 0.6
                    // }
                jMap.Locate.regionLocate(target, options)
            }

        },
        bufferCallback1(result) {
            for (var i in result) {
                var target = {
                    id: i,
                    position: CoordUtil.arrayToJson(result[i].rings[0]) //  二维坐标数组转JSON数组，详见三中
                };
                jMap.Locate.regionLocate(target, {
                    style: {
                        color: '#f80000',
                        transparency: 0.6,
                    }
                })
            }
        },
        bufferCallback2(result2) {
            for (var i in result2) {
                var target = {
                    id: i,
                    position: CoordUtil.arrayToJson(result2[i].rings[0]) //  二维坐标数组转JSON数组，详见三中
                };
                jMap.Locate.regionLocate(target, {
                    isZoom: true,
                    style: {
                        color: '#f88c00',
                        transparency: 0.6,
                    }
                })
            }
        },
        bufferCallback3(result3) {
            for (var i in result3) {
                var target = {
                    id: i,
                    position: CoordUtil.arrayToJson(result3[i].rings[0]) //  二维坐标数组转JSON数组，详见三中
                };
                jMap.Locate.regionLocate(target, {
                    style: {
                        color: '#0092f8',
                        transparency: 0.6,
                    }
                })
            }
        },
        addMarkerInfo(element, value, type, isBtn = false) {
            var wgs84 = CoordUtil.gcj02towgs84(Number(value.gisX) || Number(value.longitude), Number(value.gisY) || Number(value.latitude))
            var x = wgs84[0]
            var y = wgs84[1]
            let _this = this
                // window.jMap.Popup && window.jMap.Popup.hide([this.oldPopup && this.oldPopup.id]);
            if (this.oldPopup && value.id === this.oldPopup.id) {
                window.jMap.Popup.hide();
                return (this.oldPopup = null);
            }
            if (type == "selfManagement" || type == "water") {
                window.jMap.Popup.show({
                    id: value.id,
                    //position: value.wgs84position, //使用自定义窗体
                    position: { x: x, y: y }, //使用自定义窗体

                    element: element,
                }, { isZoom: false, offset: [0, -40] });
            }
            if (type == "重点单位") {
                _this.stores.zddwIdSD(value.companyId);
                // localStorage.setItem("zddw",)
                // window.jMap.Popup.show({
                //     //     position: { x: value.gisX, y: value.gisY }, //使用自定义窗体
                //     position: { x: x, y: y }, //使用自定义窗体

                //     element: element,
                // }, { isZoom: 100, offset: [0, -40] });
            }

            //     if (!isBtn) {
            //         window.jMap.goTo({
            //             x: Number(value.wgs84position.x),
            //             y: Number(value.wgs84position.y),
            //             radius: 1000,
            //         }, {
            //             duration: 3,
            //             offset: {
            //                 heading: -4,
            //                 pitch: -70,
            //                 range: 0,
            //             },
            //         });
            //         window.jMap.Buffer.generate({
            //             geometry: [{ position: [{ x: Number(value.wgs84position.x), y: Number(value.wgs84position.y) }], type: "point" }],
            //             distance: 1000,
            //         }, {
            //             callBack: (el) => {
            //                 for (const i in el) {
            //                     var target = {
            //                         id: i,
            //                         position: CoordUtil.arrayToJson(el[i].rings[0]),
            //                     };
            //                 }
            //                 window.jMap.Locate.regionLocate(target, {
            //                     style: {
            //                         color: "rgba(235, 98, 98, .1)",
            //                         transparency: 0.3,
            //                     },
            //                 });
            //             },
            //         });
            //     }
            this.oldPopup = value;
        },

        removePopup(e) {

        },

        /**
         *
         *气泡窗
         */
        popup(data, arrayList, type, other) {
            if (type) {
                if (!other) {
                    var html = document.createElement('div');
                    html.className = 'ysc-dynamic-layer ys-css3-box';
                    var line = document.createElement('div');
                    line.className = 'line';
                    var main = document.createElement('div');
                    main.className = 'main';
                    main.setAttribute('style', 'position: absolute;top:50%;max-height:500px;overflow-y: scroll;background:none;width:400px;bottom:auto; padding:10px 10px 5px 0 !important; border-radius: 0.05rem;border:1px solid rgba(115, 251, 253, 1);box - shadow: inset 0 0 1px 0.0125rem rgba(115, 251, 253, 1); background:rgba(0, 0, 0, 0.6)');
                    var click = document.createElement('div');
                    click.setAttribute('style', 'float: right;width: 13px;height: 13px;position: absolute;top:8px;right:16px;cursor: pointer');
                    var img = document.createElement('img');
                    img.className = 'click';
                    img.setAttribute("src", this.stores.sadianIcon.close);
                    img.setAttribute("style", 'width: 20px;height: 20px;')
                    click.appendChild(img)

                    var contain = document.createElement('div');
                    contain.setAttribute('style', 'margin-left: 3%;right:50px;top:30px;padding: 0px 0 ');
                    if (arrayList[0].title[1]) {
                        var p = document.createElement('div');
                        p.setAttribute('style', 'font-size:18px;color:#73fbfd;line-height:25px');
                        p.innerHTML = arrayList[0].title[0]
                        contain.appendChild(p)
                    }
                    for (let i = 0; i < arrayList[0].children.length; i++) {
                        if (arrayList[0].children[i][1]) {
                            let textWrap = document.createElement('div');
                            textWrap.setAttribute('style', 'font-size:14px;color:#fff;line-height:25px;');
                            let p1 = document.createElement('span');
                            p1.setAttribute('style', 'color:#73fbfd;');
                            p1.innerHTML = arrayList[0].children[i][0]

                            let p2 = document.createElement('span');
                            p2.setAttribute('style', 'color:#fff;word-break:break-all !important');
                            p2.innerHTML = arrayList[0].children[i][1]
                            textWrap.appendChild(p1)
                            textWrap.appendChild(p2)
                            contain.appendChild(textWrap)
                        }
                    }
                    setTimeout(() => {
                        main.appendChild(click)
                        main.appendChild(contain)
                        html.appendChild(line)
                        html.appendChild(main)
                        let text = html.innerHTML.replace(/"click"/g, '"click" onclick="vue.popup(false, false, false)"')
                        var wgs84 = CoordUtil.gcj02towgs84(Number(data.gisX) || Number(data.longitude), Number(data.gisY) || Number(data.latitude))
                        var x = wgs84[0]
                        var y = wgs84[1]
                        var target = {
                            id: '100001',
                            position: { x: x, y: y, z: 0 },
                            element: `<div class="ysc-dynamic-layer ys-css3-box" style="">${text}</div>`
                        };
                        var options = {
                            //     isZoom: true,
                            offset: [-6, -275]
                        };
                        jMap.Popup.show(target, options);
                    }, 10)
                } else {

                }


            } else {
                jMap.Popup.hide();
            }

        },
    }
}