|
|
@@ -15,16 +15,16 @@
|
|
|
<div class="amap-demo" id="mapContainer2"></div>
|
|
|
<div class="searchbox">
|
|
|
<el-select
|
|
|
- v-model="inoffvalue"
|
|
|
- placeholder="请选择所在监测点"
|
|
|
+ v-model="typevalue"
|
|
|
+ placeholder="请选择设备类型"
|
|
|
size="mini"
|
|
|
@change="search"
|
|
|
>
|
|
|
<el-option
|
|
|
- v-for="item in inoffoptions"
|
|
|
- :key="item.point_id"
|
|
|
- :label="item.point_name"
|
|
|
- :value="item.point_id"
|
|
|
+ v-for="item in typeoptions"
|
|
|
+ :key="item.type_id"
|
|
|
+ :label="item.type_name"
|
|
|
+ :value="item.type_id"
|
|
|
>
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
@@ -57,19 +57,20 @@
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
<el-select
|
|
|
- v-model="typevalue"
|
|
|
- placeholder="请选择设备类型"
|
|
|
+ v-model="inoffvalue"
|
|
|
+ placeholder="请选择所在监测点"
|
|
|
size="mini"
|
|
|
@change="search"
|
|
|
>
|
|
|
<el-option
|
|
|
- v-for="item in typeoptions"
|
|
|
- :key="item.type_id"
|
|
|
- :label="item.type_name"
|
|
|
- :value="item.type_id"
|
|
|
+ v-for="item in inoffoptions"
|
|
|
+ :key="item.point_id"
|
|
|
+ :label="item.point_name"
|
|
|
+ :value="item.point_id"
|
|
|
>
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
+
|
|
|
<div class="inputbox">
|
|
|
<el-input
|
|
|
v-model="idinput"
|
|
|
@@ -84,13 +85,13 @@
|
|
|
<div class="tallybox_item">
|
|
|
<img src="../../../static/images/homepage/cbd.png" alt="" />
|
|
|
<p>
|
|
|
- 测报灯:<span style="color: #27c2ff">{{ cbdnum }}台</span>
|
|
|
+ 智能测报灯:<span style="color: #27c2ff">{{ cbdnum }}台</span>
|
|
|
</p>
|
|
|
</div>
|
|
|
<div class="tallybox_item">
|
|
|
<img src="../../../static/images/homepage/ybq.png" alt="" />
|
|
|
<p>
|
|
|
- 诱捕器:<span style="color: #ff00ff">{{ ybqnum }}台</span>
|
|
|
+ 实蝇诱捕器:<span style="color: #ff00ff">{{ ybqnum }}台</span>
|
|
|
</p>
|
|
|
</div>
|
|
|
<div class="tallybox_item">
|
|
|
@@ -130,7 +131,7 @@
|
|
|
'background-color':
|
|
|
tracklistdata_backups[trackpage] &&
|
|
|
tracklistdata_backups[trackpage][index] &&
|
|
|
- tracklistdata_backups[trackpage][index].color,
|
|
|
+ tracklistdata_backups[trackpage][index].color
|
|
|
}"
|
|
|
>
|
|
|
{{ item.user_name.slice(0, 1) }}
|
|
|
@@ -143,7 +144,7 @@
|
|
|
tracklistdata_backups[trackpage][index] &&
|
|
|
tracklistdata_backups[trackpage][index].type &&
|
|
|
'tracklist_btn tracklist_btn_none') ||
|
|
|
- 'tracklist_btn'
|
|
|
+ 'tracklist_btn'
|
|
|
"
|
|
|
@click="seeteack(item, index)"
|
|
|
>
|
|
|
@@ -152,7 +153,7 @@
|
|
|
tracklistdata_backups[trackpage][index] &&
|
|
|
tracklistdata_backups[trackpage][index].type &&
|
|
|
'关闭') ||
|
|
|
- '查看轨迹'
|
|
|
+ '查看轨迹'
|
|
|
}}
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -323,12 +324,12 @@ export default {
|
|
|
stateoptions: [
|
|
|
{
|
|
|
value: '0',
|
|
|
- label: '停用(离线)',
|
|
|
+ label: '停用(离线)'
|
|
|
},
|
|
|
{
|
|
|
value: '1',
|
|
|
- label: '正常(在线)',
|
|
|
- },
|
|
|
+ label: '正常(在线)'
|
|
|
+ }
|
|
|
], //设备状态列表
|
|
|
typevalue: '', //设备类型
|
|
|
typeoptions: [], //设备类型 列表
|
|
|
@@ -340,11 +341,11 @@ export default {
|
|
|
ah: '',
|
|
|
ds: '',
|
|
|
ws: '',
|
|
|
- csq: '',
|
|
|
+ csq: ''
|
|
|
},
|
|
|
uptime: '',
|
|
|
- pest_list: [],
|
|
|
- },
|
|
|
+ pest_list: []
|
|
|
+ }
|
|
|
], //设备详情
|
|
|
loading: false,
|
|
|
device_type_id: 0,
|
|
|
@@ -382,21 +383,21 @@ export default {
|
|
|
'rgb(97, 76, 115)',
|
|
|
'rgb(9, 117, 139)',
|
|
|
'rgb(165, 7, 62)',
|
|
|
- 'rgb(7, 107, 42)',
|
|
|
+ 'rgb(7, 107, 42)'
|
|
|
],
|
|
|
trackpage: 1,
|
|
|
pagekey: 1,
|
|
|
total: 8,
|
|
|
tracklistdata_backups: {},
|
|
|
arealistmouse: {},
|
|
|
- trackloading: true,
|
|
|
+ trackloading: true
|
|
|
};
|
|
|
},
|
|
|
//监听属性 类似于data概念
|
|
|
computed: {},
|
|
|
//监控data中的数据变化
|
|
|
watch: {
|
|
|
- pietf: function (val) {
|
|
|
+ pietf: function(val) {
|
|
|
// console.log(this.width)
|
|
|
if (val) {
|
|
|
this.width = '500px';
|
|
|
@@ -417,14 +418,14 @@ export default {
|
|
|
}
|
|
|
// console.log(this.width)
|
|
|
},
|
|
|
- device_type_id: function (val) {
|
|
|
+ device_type_id: function(val) {
|
|
|
// console.log(val);
|
|
|
if (val != 6) {
|
|
|
if (this.myVideo2[`myPlayer`]) {
|
|
|
this.myVideo2[`myPlayer`].stop();
|
|
|
}
|
|
|
}
|
|
|
- },
|
|
|
+ }
|
|
|
},
|
|
|
//方法集合
|
|
|
methods: {
|
|
|
@@ -467,14 +468,14 @@ export default {
|
|
|
zoom: 11,
|
|
|
lang: 'en',
|
|
|
mapStyle: 'amap://styles/fresh',
|
|
|
- layers: [],
|
|
|
+ layers: []
|
|
|
});
|
|
|
//new AMap.TileLayer.Satellite(),new AMap.TileLayer.RoadNet()
|
|
|
AMap.plugin(['AMap.ToolBar', 'AMap.Geocoder'], () => {
|
|
|
map.addControl(new AMap.ToolBar());
|
|
|
this.geocoder = new AMap.Geocoder({
|
|
|
city: '全国',
|
|
|
- radius: 1000,
|
|
|
+ radius: 1000
|
|
|
});
|
|
|
});
|
|
|
AMap.plugin(['AMap.MouseTool'], () => {
|
|
|
@@ -491,15 +492,16 @@ export default {
|
|
|
// this.pestboxloading = true
|
|
|
this.$axios({
|
|
|
method: 'POST',
|
|
|
- url: '/api/api_gateway?method=monitor_manage.home_map.device_distribute_new',
|
|
|
+ url:
|
|
|
+ '/api/api_gateway?method=monitor_manage.home_map.device_distribute_new',
|
|
|
data: this.qs.stringify({
|
|
|
trap_number: this.idinput, // 非必传(string) 设备编号 搜索项
|
|
|
point_id: this.inoffvalue, // 非必传(string) 设备所属监测点id 搜索项
|
|
|
org_id: this.versionsvalue2, // 非必传(string) 设备所属组织id 搜索项
|
|
|
trap_status: this.statevalue, // 非必传(num) 诱捕器状态 0停用 1正常 搜索项
|
|
|
- type_id: this.typevalue, // 非必传(num) 3测报灯 4诱捕器 6监控 搜索项
|
|
|
- }),
|
|
|
- }).then((res) => {
|
|
|
+ type_id: this.typevalue // 非必传(num) 3测报灯 4诱捕器 6监控 搜索项
|
|
|
+ })
|
|
|
+ }).then(res => {
|
|
|
// this.init(res.data.data);
|
|
|
console.log(res.data.data);
|
|
|
var resdata = res.data.data;
|
|
|
@@ -548,18 +550,25 @@ export default {
|
|
|
icon = '../../../static/images/homepage/jk.png';
|
|
|
this.jknum++;
|
|
|
}
|
|
|
+
|
|
|
+ var iconInstance = new AMap.Icon({
|
|
|
+ size: new AMap.Size(18, 23), // 图标尺寸
|
|
|
+ imageSize: new AMap.Size(16, 20),
|
|
|
+ image: icon // Icon的图像
|
|
|
+ });
|
|
|
+
|
|
|
var marker = new AMap.Marker({
|
|
|
position: new AMap.LngLat(
|
|
|
this.ToDigital(data.lng),
|
|
|
this.ToDigital(data.lat)
|
|
|
),
|
|
|
offset: new AMap.Pixel(-10, -10),
|
|
|
- icon: icon, // 添加 Icon 图标 URL
|
|
|
+ icon: iconInstance, // 添加 Icon 图标 URL
|
|
|
title: '设备标点',
|
|
|
d_id: data.d_id,
|
|
|
- type_id: data.device_type_id,
|
|
|
+ type_id: data.device_type_id
|
|
|
});
|
|
|
- marker.on('click', (e) => {
|
|
|
+ marker.on('click', e => {
|
|
|
console.log(e.target._originOpts.title);
|
|
|
this.device_type_id = e.target._originOpts.type_id;
|
|
|
this.pietf = true;
|
|
|
@@ -594,9 +603,9 @@ export default {
|
|
|
method: 'POST',
|
|
|
url: '/api/api_gateway?method=monitor_manage.trap_manage.trap_org',
|
|
|
data: this.qs.stringify({
|
|
|
- page_item: '1000000',
|
|
|
- }),
|
|
|
- }).then((res) => {
|
|
|
+ page_item: '1000000'
|
|
|
+ })
|
|
|
+ }).then(res => {
|
|
|
// console.log(res.data.data);
|
|
|
this.versionsoptions2 = res.data.data.org_data;
|
|
|
this.inoffoptions = res.data.data.point_data;
|
|
|
@@ -605,8 +614,9 @@ export default {
|
|
|
gettype() {
|
|
|
this.$axios({
|
|
|
method: 'POST',
|
|
|
- url: '/api/api_gateway?method=monitor_manage.home_map.home_map_device_type',
|
|
|
- }).then((res) => {
|
|
|
+ url:
|
|
|
+ '/api/api_gateway?method=monitor_manage.home_map.home_map_device_type'
|
|
|
+ }).then(res => {
|
|
|
// console.log(res.data.data);
|
|
|
this.typeoptions = res.data.data;
|
|
|
this.initmap();
|
|
|
@@ -617,11 +627,12 @@ export default {
|
|
|
this.loading = true;
|
|
|
this.$axios({
|
|
|
method: 'POST',
|
|
|
- url: '/api/api_gateway?method=monitor_manage.home_map.device_distribute_details',
|
|
|
+ url:
|
|
|
+ '/api/api_gateway?method=monitor_manage.home_map.device_distribute_details',
|
|
|
data: this.qs.stringify({
|
|
|
- d_id: d_id,
|
|
|
- }),
|
|
|
- }).then((res) => {
|
|
|
+ d_id: d_id
|
|
|
+ })
|
|
|
+ }).then(res => {
|
|
|
// console.log(res.data.data);
|
|
|
this.loading = false;
|
|
|
this.baseinfo = res.data.data;
|
|
|
@@ -689,35 +700,35 @@ export default {
|
|
|
icon: new AMap.Icon({
|
|
|
size: new AMap.Size(19, 31), //图标大小
|
|
|
imageSize: new AMap.Size(19, 31),
|
|
|
- image: '//webapi.amap.com/theme/v1.3/markers/b/start.png',
|
|
|
+ image: '//webapi.amap.com/theme/v1.3/markers/b/start.png'
|
|
|
}),
|
|
|
- offset: new AMap.Pixel(-9, -31),
|
|
|
+ offset: new AMap.Pixel(-9, -31)
|
|
|
},
|
|
|
endMarkerOptions: {
|
|
|
//可缺省
|
|
|
icon: new AMap.Icon({
|
|
|
size: new AMap.Size(19, 31), //图标大小
|
|
|
imageSize: new AMap.Size(19, 31),
|
|
|
- image: '//webapi.amap.com/theme/v1.3/markers/b/end.png',
|
|
|
+ image: '//webapi.amap.com/theme/v1.3/markers/b/end.png'
|
|
|
}),
|
|
|
- offset: new AMap.Pixel(-9, -31),
|
|
|
+ offset: new AMap.Pixel(-9, -31)
|
|
|
},
|
|
|
midMarkerOptions: {
|
|
|
//可缺省
|
|
|
icon: new AMap.Icon({
|
|
|
size: new AMap.Size(19, 31), //图标大小
|
|
|
imageSize: new AMap.Size(19, 31),
|
|
|
- image: '//webapi.amap.com/theme/v1.3/markers/b/mid.png',
|
|
|
+ image: '//webapi.amap.com/theme/v1.3/markers/b/mid.png'
|
|
|
}),
|
|
|
- offset: new AMap.Pixel(-9, -31),
|
|
|
+ offset: new AMap.Pixel(-9, -31)
|
|
|
},
|
|
|
lineOptions: {
|
|
|
//可缺省
|
|
|
strokeStyle: 'solid',
|
|
|
strokeColor: '#FF33FF',
|
|
|
strokeOpacity: 1,
|
|
|
- strokeWeight: 2,
|
|
|
- },
|
|
|
+ strokeWeight: 2
|
|
|
+ }
|
|
|
//同 RangingTool 的 自定义 设置，缺省为默认样式
|
|
|
});
|
|
|
break;
|
|
|
@@ -736,7 +747,7 @@ export default {
|
|
|
strokeOpacity: 0.5,
|
|
|
fillColor: '#1791fc',
|
|
|
fillOpacity: 0.4,
|
|
|
- strokeStyle: 'solid',
|
|
|
+ strokeStyle: 'solid'
|
|
|
});
|
|
|
break;
|
|
|
}
|
|
|
@@ -744,7 +755,7 @@ export default {
|
|
|
},
|
|
|
drawend() {
|
|
|
var mouseTool = this.mouseTool;
|
|
|
- mouseTool.on('draw', (ev) => {
|
|
|
+ mouseTool.on('draw', ev => {
|
|
|
// 确定时测量面积鼠标工具
|
|
|
if (ev.obj.CLASS_NAME === 'Overlay.Polygon') {
|
|
|
const id = ev.obj._amap_id;
|
|
|
@@ -756,7 +767,7 @@ export default {
|
|
|
position: new AMap.LngLat(position[0], position[1]),
|
|
|
icon: 'https://webapi.amap.com/images/destroy.png',
|
|
|
offset: new AMap.Pixel(-7, 7),
|
|
|
- id: id,
|
|
|
+ id: id
|
|
|
});
|
|
|
// 计算区域面积
|
|
|
var area =
|
|
|
@@ -767,11 +778,11 @@ export default {
|
|
|
text = new AMap.Text({
|
|
|
position: center,
|
|
|
text: area + '平方公里',
|
|
|
- offset: new AMap.Pixel(-20, -20),
|
|
|
+ offset: new AMap.Pixel(-20, -20)
|
|
|
});
|
|
|
this.map.add(text);
|
|
|
this.map.add(marker);
|
|
|
- marker.on('click', (e) => {
|
|
|
+ marker.on('click', e => {
|
|
|
var ids = e.target._originOpts.id;
|
|
|
this.map.remove(this.arealistmouse[ids].text);
|
|
|
this.map.remove(this.arealistmouse[ids].marker);
|
|
|
@@ -780,7 +791,7 @@ export default {
|
|
|
var obj = {
|
|
|
text: text,
|
|
|
marker: marker,
|
|
|
- mouse: ev.obj,
|
|
|
+ mouse: ev.obj
|
|
|
};
|
|
|
this.arealistmouse[id] = obj;
|
|
|
}
|
|
|
@@ -792,7 +803,7 @@ export default {
|
|
|
let X = 0;
|
|
|
let Y = 0;
|
|
|
let Z = 0;
|
|
|
- PolygonArr.forEach((lnglat) => {
|
|
|
+ PolygonArr.forEach(lnglat => {
|
|
|
let lng = (lnglat[0] * Math.PI) / 180;
|
|
|
let lat = (lnglat[1] * Math.PI) / 180;
|
|
|
let x, y, z;
|
|
|
@@ -822,9 +833,9 @@ export default {
|
|
|
data: this.qs.stringify({
|
|
|
create_time: this.tracktime,
|
|
|
page: this.trackpage,
|
|
|
- page_item: '5',
|
|
|
- }),
|
|
|
- }).then((res) => {
|
|
|
+ page_item: '5'
|
|
|
+ })
|
|
|
+ }).then(res => {
|
|
|
console.log(res.data.data);
|
|
|
var data = res.data.data.page_list;
|
|
|
// if(data.length){
|
|
|
@@ -841,7 +852,7 @@ export default {
|
|
|
var obj = {
|
|
|
type: false,
|
|
|
color: colorlist[i],
|
|
|
- walk_list_arr: [],
|
|
|
+ walk_list_arr: []
|
|
|
};
|
|
|
arr.push(obj);
|
|
|
}
|
|
|
@@ -888,8 +899,8 @@ export default {
|
|
|
console.log(
|
|
|
this.tracklistdata_backups[this.trackpage][index].walk_list_arr
|
|
|
);
|
|
|
- var walk_list_arr =
|
|
|
- this.tracklistdata_backups[this.trackpage][index].walk_list_arr;
|
|
|
+ var walk_list_arr = this.tracklistdata_backups[this.trackpage][index]
|
|
|
+ .walk_list_arr;
|
|
|
for (var i = 0; i < walk_list_arr.length; i++) {
|
|
|
this.map.remove(walk_list_arr[i]);
|
|
|
}
|
|
|
@@ -898,8 +909,8 @@ export default {
|
|
|
console.log(this.tracklistdata_backups[this.trackpage][index].type);
|
|
|
this.initteack_info(data.walk_list, index);
|
|
|
}
|
|
|
- this.tracklistdata_backups[this.trackpage][index].type =
|
|
|
- !this.tracklistdata_backups[this.trackpage][index].type;
|
|
|
+ this.tracklistdata_backups[this.trackpage][index].type = !this
|
|
|
+ .tracklistdata_backups[this.trackpage][index].type;
|
|
|
},
|
|
|
//绘制路径
|
|
|
initteack_info(walk_list, index) {
|
|
|
@@ -918,7 +929,7 @@ export default {
|
|
|
strokeColor: this.tracklistdata_backups[this.trackpage][index].color, //线颜色
|
|
|
strokeOpacity: 1, //线透明度
|
|
|
strokeWeight: 6, //线宽
|
|
|
- zIndex: 51,
|
|
|
+ zIndex: 51
|
|
|
});
|
|
|
this.tracklistdata_backups[this.trackpage][index].walk_list_arr.push(
|
|
|
polyline2
|
|
|
@@ -932,7 +943,7 @@ export default {
|
|
|
month = month < 10 ? '0' + month : month;
|
|
|
day = day < 10 ? '0' + day : day;
|
|
|
return years + '-' + month + '-' + day;
|
|
|
- },
|
|
|
+ }
|
|
|
},
|
|
|
beforeCreate() {}, //生命周期 - 创建之前
|
|
|
//生命周期 - 创建完成（可以访问当前this实例）
|
|
|
@@ -960,7 +971,7 @@ export default {
|
|
|
this.myVideo2[`myPlayer`].stop();
|
|
|
}
|
|
|
}, //生命周期 - 销毁完成
|
|
|
- activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
|
|
|
+ activated() {} //如果页面有keep-alive缓存功能，这个函数会触发
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="less" scoped>
|
|
|
@@ -1230,4 +1241,4 @@ export default {
|
|
|
/deep/.amap-controls {
|
|
|
display: none !important;
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|
yf_zhb