<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" type="text/css" href="./css/style.css" />
<link rel="stylesheet" type="text/css" href="./css/animation.css" />
<link rel="stylesheet" type="text/css" href="font/iconfont.css" />
<link rel="stylesheet" type="text/css" href="./css/zoom1920.css" />
<title>安全生产综合信息监管</title>
<style>
[v-cloak] {
display: none;
}
</style>
</head>
<body>
<div class="full-screen">
<div id="map"></div>
<div class="content" id="app" v-cloak>
<div class="db-header">
<div class="db-header-title-bg">
<div class="header-loop-bg"></div>
<div class="header-loop"></div>
<span>安全生产综合监管</span>
</div>
</div>
<div class="db-toolbar">
<!--模糊搜索开始-->
<div class="map-search">
<div class="map-search-main">
<input id="map-search-main-input" placeholder="搜索企业名称" v-model="KEYWORDS">
<i class="iconfont icon-sousuo" id="icon-sousuo"></i>
<i class="iconfont icon-sousuo" id="icon-sousuo-1" v-on:click="getQuery()" hidden></i>
</div>
<div id="map-search-dropdown" class="map-search-dropdown" hidden>
<div class="h-scrollbar">
<ul>
<template v-for="(data,index) in varList">
<li v-on:click="setCenter(data)">
<div class="h-icon-dw">
<i></i>
</div>
<div>
<p>{{data.CORP_NAME || ''}}</p>
<p>{{data.ADDRESS || ''}}</p>
</div>
</li>
</template>
</ul>
</div>
<div class="h-empty" v-if="varList.length==0">
<div class="h-empty__wrapper h-breakpoint--sm">
<i class="iconfont icon-wushuju"></i>
<p class="h-empty__description">暂无数据</p>
</div>
</div>
</div>
</div>
<!--下拉筛选开始-->
</div>
<div class="hv-layout">
<div class="top-shadow"></div>
<div class="left-shadow"></div>
<div class="right-shadow"></div>
<div class="view-layout stage-2">
<div class="view-layout-bg">
<div class="view-layout-loop-bg"></div>
<div class="view-layout-loop"></div>
</div>
<div class="view-layout-main">
<header>
<div class="header-time">
<span>{{time}}</span><span>{{date}}</span><span>{{week}}</span>
</div>
</header>
<section>
<div class="view-panel">
<header class="view-panel-title">
<span>企业统计</span>
</header>
<div class="view-panel-main">
<div class="enterprise-chart">
<div class="left-aside">
<div class="circle-bg"></div>
<div class="circle-outer"></div>
<div class="circle-line"></div>
<div class="circle-inner"></div>
<div class="chart-main" id="chart1">
</div>
</div>
<div class="right-aside">
<div class="enterprise-box">
<div class="enterprise-item">
<i class="bg-green"></i>
<p>
企业总数
<transition name="fade">
<span class="color-green counter-value">{{animatedAllCount}}</span>
</transition>
<b>家</b>
</p>
</div>
<div class="enterprise-item">
<i class="bg-oringe"></i>
<p>
确认企业数
<span class="color-oringe counter-value">{{animatedSureCount}}</span>
<b>家</b>
</p>
</div>
<div class="enterprise-item">
<i class="bg-red"></i>
<p>
确认率
<span class="color-red counter-value">{{animatedSureRate}}</span>
<b>%</b>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="view-panel">
<header class="view-panel-title">
<span>风险辨识情况统计</span>
</header>
<div class="view-panel-main neiw">
<div class="signboard">
<div class="bg-signbig">
<label class="counter-value color-blue">{{animatedRiskCorpCount}}</label>
<span>开展风险辨识企业数</span>
</div>
<ul>
<li>
<label class="counter-value color-oringe">{{animatedUnitCount}}</label>
<span>风险点（单元）</span>
</li>
<li>
<label class="counter-value color-green">{{animatedIdCount}}</label>
<span>辨识部位</span>
</li>
<li>
<label class="counter-value color-red">{{animatedPointCount}}</label>
<span>存在风险</span>
</li>
</ul>
</div>
</div>
</div>
<div class="view-panel">
<header class="view-panel-title">
<span>辨识部位风险等级</span>
</header>
<div class="view-panel-main neiw">
<div class="Ladder">
<ul>
<li class="high-fx bg-map">
<label>{{riskData.Acount}}</label>
<span>高风险</span>
</li>
<li class="big-fx bg-map">
<label>{{riskData.Bcount}}</label>
<span>较大风险</span>
</li>
<li class="normal-fx bg-map">
<label>{{riskData.Ccount}}</label>
<span>一般风险</span>
</li>
<li class="low-fx bg-map">
<label>{{riskData.Dcount}}</label>
<span>低风险</span>
</li>
</ul>
</div>
</div>
</div>
<div class="view-panel">
<header class="view-panel-title">
<span>重大危险源企业分布</span>
</header>
<div class="view-panel-main neiw">
<div class="column-chart-bg">
<div class="column-chart" id="chart2">
</div>
</div>
</div>
</div>
</section>
</div>
</div>
<div class="view-layout reverse stage-2">
<div class="view-layout-bg">
<div class="view-layout-loop-bg"></div>
<div class="view-layout-loop"></div>
</div>
<div class="view-layout-main">
<header>
<div class="header-weather">
<div class="db-header-weather">
<!-- <i class="sunny"></i>-->
<!-- <i id="type"></i>-->
<span id="type"></span>
<label>
<span id="wendu"></span>
<span class="unit">℃</span>
</label>
<dl>
<dt>风力风向</dt>
<dd id="feng"></dd>
</dl>
</div>
</div>
</header>
<section>
<div class="view-panel reverse">
<header class="view-panel-title">
<span>企业规模统计情况</span>
</header>
<div class="view-panel-main">
<div class="sizestate">
<dl>
<dt>规上</dt>
<dd>{{upCorpNum}}</dd>
</dl>
<dl>
<dt>规下</dt>
<dd>{{downCorpNum}}</dd>
</dl>
</div>
<div class="circular-chart-bg">
<div class="circular-chart" id="chart3">
</div>
</div>
</div>
</div>
<div class="view-panel reverse">
<header class="view-panel-title">
<span>企业相关属性统计</span>
</header>
<div class="view-panel-main">
<div class="line-chart-bg">
<div class="line-chart" id="chart5">
</div>
</div>
</div>
</div>
<div class="view-panel reverse">
<header class="view-panel-title">
<span>隐患整改对比图</span>
</header>
<div class="view-panel-main">
<div class="line-chart-bg">
<div class="line-chart" id="chart4">
</div>
</div>
</div>
</div>
</section>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/dist/echarts.min.js"></script>
<script type="text/javascript"
src="https://api.map.baidu.com/api?v=2.0&ak=OElqFYoKiAH8KFtph8ftLKF5NlNrbCUr&s=1"></script>
<script src="https://pv.sohu.com/cityjson?ie=utf-8" type="text/javascript"></script>
<script src="js/echart.js" type="text/javascript" charset="utf-8"></script>
<script src="./js/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="./js/vue.js" type="text/javascript" charset="utf-8"></script>
<script src="./js/gsap.min.js"></script>
<script src="../config.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#map").height($(document).height())
// 搜索点击事件
$('#icon-sousuo').bind('click', function () {
$('#icon-sousuo').hide()
$('#icon-sousuo-1').show()
$('#map-search-main-input').addClass('show')
})
// $("#map-search-main-input").blur(function(){
// $("#map-search-main-input").removeClass("show");
// });
// 筛选点击事件
$('.map-filter-main:first').bind('click', function () {
$('.map-filter-main>i:first').toggleClass('show-dropdown')
$('#first-dropdown').toggle()
})
$('.map-filter-main:eq(1)').bind('click', function () {
$('.map-filter-main>i:eq(1)').toggleClass('show-dropdown')
$('#second-dropdown').toggle()
})
// 隐藏侧边栏
$('.icon-collapse').bind('click', function () {
$('.view-layout').toggleClass('collapse')
$('.left-shadow').toggleClass('width0')
$('.right-shadow').toggleClass('width0')
$('.db-toolbar-filter').toggleClass('right0')
$('.map-search').toggleClass('left0')
})
window.addEventListener('resize', function () {
$("#map").height($(document).height())
});
$.getScript('http://api.map.baidu.com/location/ip?ak=OElqFYoKiAH8KFtph8ftLKF5NlNrbCUr&callback=findWeather')
})
function findWeather(data) {
jQuery.support.cors = true
$.ajax({
url: 'http://wthrcdn.etouch.cn/weather_mini',
type: 'GET',
dataType: 'json',
data: { city: (data.content.address).split('省')[1] }, //(returnCitySN.cname).split('省')[1]：获取所在的市
success: function (res) {
var city = res.data.city//所在城市
$('#wendu').html(res.data.wendu)
$('#feng').html(res.data.forecast[0].fengxiang + ' ' + res.data.forecast[0].fengli.replace('<![CDATA[', '').replace(']]>', ''))
$('#type').html(res.data.forecast[0].type)
// var maxTemperature = res.data.forecast[0].high;//最高温度
// var minTemperature = res.data.forecast[0].low;//最低温度
// var weather = minTemperature.split(' ')[1] + '~' + maxTemperature.split(' ')[1];
var type = res.data.forecast[0].type//天气状态
},
error: function (err) {
console.log(err)
}
})
}
var vm = new Vue({
el: '#app',
data: {
map: '',
KEYWORDS: '',
ECOTypeList: [],
CORP_TYPE_NAME: '企业经济类型', // 经济类型
CORP_TYPE: '', // 经济类型
varList: [],
mapTypeList: [{ id: 1, name: '企业信息' }, { id: 2, name: '隐患信息' }, { id: 3, name: '风险信息' }, { id: 4, name: '重大危险源信息' }],
MAP_TYPE_NAME: '企业信息', // 经济类型
MAP_TYPE: '1', // 经济类型
time: '',
date: '',
week: '',
allCount: 0,
tweenedAllCount: 0,
sureCount: 0,
tweenedSureCount: 0,
sureRate: 0,
tweenedSureRate: 0,
upCorpNum: 0,
downCorpNum: 0,
riskCorpList: [],
riskCorpCount: 0,
tweenedRiskCorpCount: 0,
unitCount: 0,
tweenedUnitCount: 0,
idCount: 0,
tweenedIdCount: 0,
pointCount: 0,
tweenedPointCount: 0,
riskData: {
Acount: 0,
Bcount: 0,
Ccount: 0,
Dcount: 0
}
},
computed: {
animatedAllCount: function () {
return this.tweenedAllCount.toFixed(0)
},
animatedSureCount: function () {
return this.tweenedSureCount.toFixed(0)
},
animatedSureRate: function () {
return this.tweenedSureRate.toFixed(2)
},
animatedRiskCorpCount: function () {
return this.tweenedRiskCorpCount.toFixed(0)
},
animatedUnitCount: function () {
return this.tweenedUnitCount.toFixed(0)
},
animatedIdCount: function () {
return this.tweenedIdCount.toFixed(0)
},
animatedPointCount: function () {
return this.tweenedPointCount.toFixed(0)
}
},
watch: {
allCount: function (newValue) {
gsap.to(this.$data, { duration: 1.5, tweenedAllCount: newValue })
},
sureCount: function (newValue) {
gsap.to(this.$data, { duration: 1.5, tweenedSureCount: newValue })
},
sureRate: function (newValue) {
gsap.to(this.$data, { duration: 1.5, tweenedSureRate: newValue })
},
riskCorpCount: function (newValue) {
gsap.to(this.$data, { duration: 1.5, tweenedRiskCorpCount: newValue })
},
unitCount: function (newValue) {
gsap.to(this.$data, { duration: 1.5, tweenedUnitCount: newValue })
},
idCount: function (newValue) {
gsap.to(this.$data, { duration: 1.5, tweenedIdCount: newValue })
},
pointCount: function (newValue) {
gsap.to(this.$data, { duration: 1.5, tweenedPointCount: newValue })
}
},
methods: {
init: function () {
this.handleMap()
this.getDict()
this.getCorpStatistics()
this.getRiskCorp()
this.getRiskData()
this.getMajorData()
this.getHiddenData()
setInterval(function () {
vm.getTime()
}, 1000)
},
handleMap() {
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: config.httpurl + 'department/getCityCode',
data: {
},
dataType: 'json',
success: function (data) {
vm.map = new BMap.Map('map')
var point = new BMap.Point(119.570882,39.915455);
// 39.922898,119.60518
console.log(data)
// var point = '邢台市'
vm.map.centerAndZoom(point, 12)
vm.map.enableScrollWheelZoom(true)
vm.addPoint()
}
}).done().fail(function () {
alert('登录失效!', '请求服务器无响应，稍后再试', 'warning')
setTimeout(function () {
window.location.href = '../../login'
}, 2000)
})
},
getCorpStatistics: function () {
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: config.httpurl + 'corpinfo/main/statistics',
data: {
CORP_TYPE: this.CORP_TYPE
},
dataType: 'json',
success: function (data) {
if ('success' == data.result) {
vm.allCount = data.pd.allCorpNum
vm.sureCount = data.pd.sureCorpNum
if (data.pd.allCorpNum == 0) {
vm.sureRate = 0
} else {
vm.sureRate = ((data.pd.sureCorpNum / data.pd.allCorpNum).toFixed(4)) * 100
}
vm.upCorpNum = data.pd.upCorpNum
vm.downCorpNum = data.pd.downCorpNum
corpCountChart(data.pd)
corpScanChart(data.pd)
corpAttributeChart(data.pd)
}
}
}).done().fail(function () {
alert('登录失效!', '请求服务器无响应，稍后再试', 'warning')
setTimeout(function () {
window.location.href = '../../login'
}, 2000)
})
},
getRiskCorp: function () {
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: config.httpurl + 'corpinfo/riskStatisticslistAll',
data: {
COUNTRY: this.COUNTRY,
VILLAGE: this.VILLAGE,
CORP_TYPE: this.CORP_TYPE
},
dataType: 'json',
success: function (data) {
if ('success' == data.result) {
vm.riskCorpList = data.varList
let riskCorpCount = 0
let unitCount = 0
let idCount = 0
let pointCount = 0
for (let i = 0; i < vm.riskCorpList.length; i++) {
riskCorpCount++
unitCount += vm.riskCorpList[i].unitCount
idCount += vm.riskCorpList[i].idCount
pointCount += vm.riskCorpList[i].pointCount
}
vm.riskCorpCount = riskCorpCount
vm.unitCount = unitCount
vm.idCount = idCount
vm.pointCount = pointCount
}
}
}).done().fail(function () {
alert('登录失效!', '请求服务器无响应，稍后再试', 'warning')
setTimeout(function () {
window.location.href = '../../login'
}, 2000)
})
},
getRiskData() {
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: config.httpurl + 'riskpoint/main/statistics',
data: {
COUNTRY: this.COUNTRY,
VILLAGE: this.VILLAGE,
CORP_TYPE: this.CORP_TYPE
},
dataType: 'json',
success: function (data) {
if ('success' == data.result) {
vm.riskData = data.pd
}
}
}).done().fail(function () {
alert('登录失效!', '请求服务器无响应，稍后再试', 'warning')
setTimeout(function () {
window.location.href = '../../login'
}, 2000)
})
},
getMajorData() {
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: config.httpurl + 'majorinformation/main/statistics',
data: {},
dataType: 'json',
success: function (data) {
if ('success' == data.result) {
const varLisr = data.varList
const barData = {
GROUP_NAME: [],
Acount: [],
Bcount: [],
Ccount: [],
Dcount: []
}
for (let i = 0; i < varLisr.length; i++) {
barData.GROUP_NAME.push(varLisr[i].GROUP_NAME)
barData.Acount.push(varLisr[i].Acount)
barData.Bcount.push(varLisr[i].Bcount)
barData.Ccount.push(varLisr[i].Ccount)
barData.Dcount.push(varLisr[i].Dcount)
}
majorBar(barData)
}
}
}).done().fail(function () {
alert('登录失效!', '请求服务器无响应，稍后再试', 'warning')
setTimeout(function () {
window.location.href = '../../login'
}, 2000)
})
},
getHiddenData: function () {
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: config.httpurl + 'hidden/main/statistics',
data: {},
dataType: 'json',
success: function (data) {
if ('success' == data.result) {
const varLisr = data.varList
const lineData = {
GROUP_NAME: [],
SBHD_NUM: [],
ZGHD_NUM: []
}
for (let i = 0; i < varLisr.length; i++) {
lineData.GROUP_NAME.push(varLisr[i].GROUP_NAME)
lineData.SBHD_NUM.push(varLisr[i].SBHD_NUM)
lineData.ZGHD_NUM.push(varLisr[i].ZGHD_NUM)
}
hiddenLine(lineData)
}
}
}).done().fail(function () {
alert('登录失效!', '请求服务器无响应，稍后再试', 'warning')
setTimeout(function () {
window.location.href = '../../login'
}, 2000)
})
},
selectEcoType: function (id, name) {
this.CORP_TYPE = id
this.CORP_TYPE_NAME = name
$('.map-filter-main>i:first').toggleClass('show-dropdown')
$('#first-dropdown').toggle()
this.getCorpStatistics()
this.getRiskCorp()
this.getRiskData()
this.addPoint()
},
selectMapType: function (id, name) {
this.MAP_TYPE = id
this.MAP_TYPE_NAME = name
$('.map-filter-main>i:eq(1)').toggleClass('show-dropdown')
$('#second-dropdown').toggle()
this.addPoint()
},
getQuery() {
$('#icon-sousuo').show()
$('#icon-sousuo-1').hide()
$('#map-search-dropdown').show(300)
$('#map-search-main-input').removeClass('show')
this.addPoint()
},
addPoint: function () {
this.map.clearOverlays()
if (this.MAP_TYPE == 1) {
this.getCorpMap();
} else if (this.MAP_TYPE == 2) {
this.getHiddenMap()
} else if (this.MAP_TYPE == 3) {
this.getRiskMap()
} else if (this.MAP_TYPE == 4) {
this.getDangerMap()
}
},
setCenter: function (data) {
$('#map-search-dropdown').hide(300)
const point = new BMap.Point(data.LONGITUDE, data.LATITUDE)
vm.map.centerAndZoom(point, 12)
},
getCorpMap: function () {
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: config.httpurl + 'corpinfo/listAllV2',
data: {
KEYWORDS: this.KEYWORDS,
COUNTRY: this.COUNTRY,
VILLAGE: this.VILLAGE,
CORP_TYPE: this.CORP_TYPE
},
dataType: 'json',
success: function (data) {
if ('success' == data.result) {
const varList = data.varList
vm.varList = varList
for (let i = 0; i < varList.length; i++) {
const point = new BMap.Point(varList[i].LONGITUDE, varList[i].LATITUDE)
const marker = new BMap.Marker(point) // 创建标注
vm.map.addOverlay(marker) // 将标注添加到地图中
// 设置提示框的宽高等
const opts = {
title: '<h4>' + varList[i].CORP_NAME + '</h4>',
width: 320,
// height: 320,
enableMessage: false,
offset: {
width: 5, height: -15
}
}
// 设置提示框的内容
const infoWindow = new BMap.InfoWindow(`<table class="table-baidu-map">` +
`<tr>` +
`<td class="brbi">企业类型：</td>` +
`<td>` + (varList[i].CORP_OF_TYPE_VAL || '') + (varList[i].CORP_OF_TYPE2_VAL ? '--' + varList[i].CORP_OF_TYPE2_VAL : '') + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">主要负责人：</td>` +
`<td>` + (varList[i].CONTACTS || '') + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">电话：</td>` +
`<td>` + (varList[i].CONTACTS_PHONE || '') + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">风险点：` + (varList[i].unitCount || '0') + `</td>` +
`<td class="brbi">辨识部位：` + (varList[i].idCount || '0') + ` </td>` +
`<td class="brbi">存在风险：` + (varList[i].pointCount || '0') + ` </td>` +
`</tr>` +
`<tr>` +
`<td class="arai_red" >检查清单数：` + (varList[i].checkedCount || '0') + ` </td>` +
`<td class="arai_green">上报隐患数：` + (varList[i].zdCount + varList[i].ybCount || '0') + ` </td>` +
`<td class="arai_blue">已整改隐患数：` + (varList[i].zdCount || '0') + ` </td>` +
`</tr>`
//
// `<tr>` +
// `<td class="brbi">企业状态：</td>` +
// `<td>` + (varList[i].STATUS_NAME || '') + `</td>` +
// `</tr>` +
//
//
// `<tr>` +
// `<td class="brbi">地址：</td>` +
// `<td>` + (varList[i].ADDRESS || '') + `</td>` +
// `</tr>`
, opts)
marker.addEventListener('mouseover', function () {
vm.map.openInfoWindow(infoWindow, point)
})
}
}
}
}).done().fail(function () {
alert('登录失效!', '请求服务器无响应，稍后再试', 'warning')
setTimeout(function () {
window.location.href = '../../login'
}, 2000)
})
},
getHiddenMap: function () {
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: config.httpurl + 'corpinfo/listAll',
data: {
KEYWORDS: this.KEYWORDS,
COUNTRY: this.COUNTRY,
VILLAGE: this.VILLAGE,
CORP_TYPE: this.CORP_TYPE,
HIDDEN_GIS: 1
},
dataType: 'json',
success: function (data) {
if ('success' == data.result) {
const varList = data.varList
vm.varList = varList
for (let i = 0; i < varList.length; i++) {
const point = new BMap.Point(varList[i].LONGITUDE, varList[i].LATITUDE)
const marker = new BMap.Marker(point) // 创建标注
vm.map.addOverlay(marker) // 将标注添加到地图中
// 设置提示框的宽高等
const opts = {
title: '<h4>' + varList[i].CORP_NAME + '</h4>',
width: 280,
// height: 320,
enableMessage: false,
offset: {
width: 5, height: -15
}
}
// 设置提示框的内容
const infoWindow = new BMap.InfoWindow(`<table class="table-baidu-map">` +
`<tr>` +
`<td class="brbi">主要负责人</td>` +
`<td>` + (varList[i].CONTACTS || '') + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">联系电话</td>` +
`<td>` + (varList[i].CONTACTS_PHONE || '') + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">上报隐患数</td>` +
`<td>` + (varList[i].zgCount + varList[i].wzgCount) + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">整改隐患数</td>` +
`<td>` + varList[i].zgCount + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">未整改隐患数</td>` +
`<td>` + varList[i].wzgCount + `</td>` +
`</tr>`
, opts)
marker.addEventListener('mouseover', function () {
vm.map.openInfoWindow(infoWindow, point)
})
}
}
}
}).done().fail(function () {
alert('登录失效!', '请求服务器无响应，稍后再试', 'warning')
setTimeout(function () {
window.location.href = '../../login'
}, 2000)
})
},
getRiskMap: function () {
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: config.httpurl + 'corpinfo/riskStatisticslistAll',
data: {
KEYWORDS: this.KEYWORDS,
COUNTRY: this.COUNTRY,
VILLAGE: this.VILLAGE,
CORP_TYPE: this.CORP_TYPE
},
dataType: 'json',
success: function (data) {
if ('success' == data.result) {
const varList = data.varList
vm.varList = varList
for (let i = 0; i < varList.length; i++) {
const point = new BMap.Point(varList[i].LONGITUDE, varList[i].LATITUDE)
const marker = new BMap.Marker(point) // 创建标注
vm.map.addOverlay(marker) // 将标注添加到地图中
// 设置提示框的宽高等
const opts = {
title: '<h4>' + varList[i].CORP_NAME + '</h4>',
width: 280,
// height: 320,
enableMessage: false,
offset: {
width: 5, height: -15
}
}
// 设置提示框的内容
const infoWindow = new BMap.InfoWindow(`<table class="table-baidu-map">` +
`<tr>` +
`<td class="brbi">主要负责人</td>` +
`<td>` + (varList[i].CONTACTS || '') + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">联系电话</td>` +
`<td>` + (varList[i].CONTACTS_PHONE || '') + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">风险点（单元）数</td>` +
`<td>` + (varList[i].unitCount || 0) + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">辨识部位数</td>` +
`<td>` + (varList[i].idCount || 0) + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">存在风险数</td>` +
`<td>` + (varList[i].pointCount || 0) + `</td>` +
`</tr>`
, opts)
marker.addEventListener('mouseover', function () {
vm.map.openInfoWindow(infoWindow, point)
})
}
}
}
}).done().fail(function () {
alert('登录失效!', '请求服务器无响应，稍后再试', 'warning')
setTimeout(function () {
window.location.href = '../../login'
}, 2000)
})
},
getDangerMap: function () {
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: config.httpurl + 'majorinformation/listAll',
data: {
KEYWORDS: this.KEYWORDS,
COUNTRY: this.COUNTRY,
VILLAGE: this.VILLAGE,
CORP_TYPE: this.CORP_TYPE
},
dataType: 'json',
success: function (data) {
if ('success' == data.result) {
const varList = data.varList
vm.varList = varList
for (let i = 0; i < varList.length; i++) {
const point = new BMap.Point(varList[i].LONGITUDE, varList[i].LATITUDE)
const marker = new BMap.Marker(point) // 创建标注
vm.map.addOverlay(marker) // 将标注添加到地图中
// 设置提示框的宽高等
const opts = {
title: '<h4>' + varList[i].MAJOR_NAME + '</h4>',
width: 280,
// height: 320,
enableMessage: false,
offset: {
width: 5, height: -15
}
}
let levelName = ''
if (varList[i].MAJOR_LEVEL == 'level1') {
levelName = '一级'
} else if (varList[i].MAJOR_LEVEL == 'level2') {
levelName = '二级'
} else if (varList[i].MAJOR_LEVEL == 'level3') {
levelName = '三级'
} else if (varList[i].MAJOR_LEVEL == 'level4') {
levelName = '四级'
}
// 设置提示框的内容
const infoWindow = new BMap.InfoWindow(`<table class="table-baidu-map">` +
`<tr>` +
`<td class="brbi">所属企业：</td>` +
`<td>` + (varList[i].CORP_NAME || '') + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">等级：</td>` +
`<td>` + levelName + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">类型：</td>` +
`<td>` + (varList[i].TYPE_NAME || '') + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">主要负责人：</td>` +
`<td>` + (varList[i].LIABLE_NAME || '') + `</td>` +
`</tr>` +
`<tr>` +
`<td class="brbi">联系电话：</td>` +
`<td>` + (varList[i].LIABLE_PHONE || '') + `</td>` +
`</tr>`
, opts)
marker.addEventListener('mouseover', function () {
vm.map.openInfoWindow(infoWindow, point)
})
}
}
}
}).done().fail(function () {
alert('登录失效!', '请求服务器无响应，稍后再试', 'warning')
setTimeout(function () {
window.location.href = '../../login'
}, 2000)
})
},
getTime: function () {
var myDate = new Date
var year = myDate.getFullYear() //获取当前年
var mon = myDate.getMonth() + 1 //获取当前月
var date = myDate.getDate() //获取当前日
var h = myDate.getHours()//获取当前小时数(0-23)
var m = myDate.getMinutes()//获取当前分钟数(0-59)
var s = myDate.getSeconds()//获取当前秒
if (s < 10) {
s = '0' + s
}
var week = myDate.getDay()
var weeks = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
this.time = h + ':' + m + ':' + s
this.date = year + '.' + mon + '.' + date
this.week = weeks[week]
// $("#time").html(year + "年" + mon + "月" + date + "日" + weeks[week]);
},
//获取数据字典数据
getDict: function () {
//企业经济类型
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: config.httpurl + 'dictionaries/getLevels?tm=' + new Date().getTime(),
data: { DICTIONARIES_ID: 'f2598ba72e864eadabf0ca4b664d26b9' },
dataType: 'json',
success: function (data) {
vm.ECOTypeList = data.list
}
})
}
},
mounted() {
this.init()
}
})
// $(function() {
// var H = $(window).height();
// var W = $(window).width();
// $(".full-screen").width(W).height(H);
// getCorpStatistics()
// $(window).resize(function() {
// var H = $(window).height();
// var W = $(window).width();
// $(".full-screen").width(W).height(H);
// });
// })
</script>