|
|
|
|
@ -134,9 +134,17 @@
|
|
|
|
|
</vue-seamless-scroll>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<el-button type="primary" class="exTable"
|
|
|
|
|
@click="exTable">导出告警信息
|
|
|
|
|
</el-button>
|
|
|
|
|
<div class="exTable">
|
|
|
|
|
<el-date-picker
|
|
|
|
|
style="width: calc(100% - 140px)"
|
|
|
|
|
v-model="exTableTime"
|
|
|
|
|
type="datetimerange"
|
|
|
|
|
range-separator="至"
|
|
|
|
|
start-placeholder="开始日期"
|
|
|
|
|
end-placeholder="结束日期">
|
|
|
|
|
</el-date-picker>
|
|
|
|
|
<el-button type="primary" @click="exTable" style="margin-left: 8px">导出告警信息</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<div v-if="isMap">
|
|
|
|
|
<Chart ref="mapChart" class="mapChart"></Chart>
|
|
|
|
|
<el-button type="primary" style="position:absolute;bottom: 4%;left: 50%;transform: translateX(-50%)"
|
|
|
|
|
@ -144,7 +152,7 @@
|
|
|
|
|
</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<el-dialog :visible.sync="realMap" width="80%">
|
|
|
|
|
<el-dialog :visible.sync="realMap" width="80%" @close="monitorUnitId = null">
|
|
|
|
|
<el-form :inline="true" :model="formInline" class="demo-form-inline">
|
|
|
|
|
<el-form-item label="名称">
|
|
|
|
|
<el-input v-model="formInline.name" placeholder="名称"></el-input>
|
|
|
|
|
@ -153,12 +161,35 @@
|
|
|
|
|
<el-button type="primary" @click="searchMap">查询</el-button>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
|
|
|
|
|
<el-switch
|
|
|
|
|
v-model="isRail"
|
|
|
|
|
@change="RailChange"
|
|
|
|
|
active-text="显示点位"
|
|
|
|
|
inactive-text="隐藏点位">
|
|
|
|
|
</el-switch>
|
|
|
|
|
<div id="map" class="map"></div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<el-dialog
|
|
|
|
|
:visible.sync="isDispose"
|
|
|
|
|
width="30%">
|
|
|
|
|
|
|
|
|
|
<el-descriptions class="margin-top" :column="3" :size="size" border>
|
|
|
|
|
<el-descriptions-item>
|
|
|
|
|
<template slot="label">
|
|
|
|
|
报警信息
|
|
|
|
|
</template>
|
|
|
|
|
{{ warInfo.alarmLevelName }}
|
|
|
|
|
</el-descriptions-item>
|
|
|
|
|
<el-descriptions-item>
|
|
|
|
|
<template slot="label">
|
|
|
|
|
报警位置
|
|
|
|
|
</template>
|
|
|
|
|
{{ warInfo.location }}
|
|
|
|
|
</el-descriptions-item>
|
|
|
|
|
</el-descriptions>
|
|
|
|
|
|
|
|
|
|
<span>备注</span>
|
|
|
|
|
<el-input
|
|
|
|
|
style="margin-top: 12px;margin-bottom:12px"
|
|
|
|
|
@ -173,6 +204,34 @@
|
|
|
|
|
<el-button type="primary" @click="disposeAll">处理所有</el-button>
|
|
|
|
|
</span>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<el-dialog title="设备信息" :visible.sync="equipmentInfoDialog">
|
|
|
|
|
<el-descriptions class="margin-top" :column="3" :size="size" border>
|
|
|
|
|
<el-descriptions-item>
|
|
|
|
|
<template slot="label">
|
|
|
|
|
经度
|
|
|
|
|
</template>
|
|
|
|
|
{{ equipmentInfo.longitude }}
|
|
|
|
|
</el-descriptions-item>
|
|
|
|
|
<el-descriptions-item>
|
|
|
|
|
<template slot="label">
|
|
|
|
|
纬度
|
|
|
|
|
</template>
|
|
|
|
|
{{ equipmentInfo.latitude }}
|
|
|
|
|
</el-descriptions-item>
|
|
|
|
|
<el-descriptions-item>
|
|
|
|
|
<template slot="label">
|
|
|
|
|
名称
|
|
|
|
|
</template>
|
|
|
|
|
{{ equipmentInfo.deviceName }}
|
|
|
|
|
</el-descriptions-item>
|
|
|
|
|
</el-descriptions>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click="equipmentInfoDialog = false">关 闭</el-button>
|
|
|
|
|
<el-button type="primary" @click="getDeviceInfo" :disabled="!monitorUnitId">设备信息</el-button>
|
|
|
|
|
<!-- <el-button type="primary" @click="equipmentInfoDialog = true">打开内层 Dialog</el-button>-->
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
@ -212,7 +271,13 @@ export default {
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
containerPic,
|
|
|
|
|
formInline:{},
|
|
|
|
|
isRail: true,
|
|
|
|
|
monitorUnitId: null,
|
|
|
|
|
equipmentInfoDialog: false,
|
|
|
|
|
exTableTime: [new Date(new Date().getTime() - 1000 * 60 * 60 * 24), new Date()],
|
|
|
|
|
equipmentInfo: {},
|
|
|
|
|
warInfo: {},
|
|
|
|
|
formInline: {},
|
|
|
|
|
textarea: '',
|
|
|
|
|
disposeNo: null,
|
|
|
|
|
isDispose: false,
|
|
|
|
|
@ -437,6 +502,7 @@ export default {
|
|
|
|
|
const {rows: data} = await getAlarmInfos()
|
|
|
|
|
this.table1Data = data.map((e, i) => {
|
|
|
|
|
return {
|
|
|
|
|
...e,
|
|
|
|
|
no: e.alarmInfoId,
|
|
|
|
|
type: e.alarmTypeName,
|
|
|
|
|
location: e.monitorUnitName,
|
|
|
|
|
@ -516,6 +582,8 @@ export default {
|
|
|
|
|
this.$refs.chart3.setData(option3)
|
|
|
|
|
},
|
|
|
|
|
dispose(e) {
|
|
|
|
|
this.warInfo = e
|
|
|
|
|
console.log(e)
|
|
|
|
|
this.textarea = ''
|
|
|
|
|
this.isDispose = true
|
|
|
|
|
this.disposeNo = e.no
|
|
|
|
|
@ -776,12 +844,15 @@ export default {
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
setMarker(e) {
|
|
|
|
|
if (!this.isRail) {
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
let marker = new AMap.Marker({
|
|
|
|
|
position: [e.longitude, e.latitude],
|
|
|
|
|
title: `信息\n经度：${e.longitude}\n纬度：${e.latitude}\n名称：${e.deviceName}\n`,
|
|
|
|
|
offset: new AMap.Pixel(-15, -30),
|
|
|
|
|
content: `<div> <svg t="1718261114618" class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" p-id="4305" style="width: 30px;height: 30px;">
|
|
|
|
|
<path d="M512 64.5c-180.5 0-326.9 146.4-326.9 326.9 0 63.3 18 122.3 49.2 172.4 1.1 2 2.1 4 3.2 5.9 34.9 58.2 113.9 128.8 165.5 194.5 66.3 84.4 93.2 158 93.2 158 1.6 1.4 13.1 35.6 15.1 35.8 2.5 0.2 12.6-34 14.5-35.8 0 0 22-69.2 83.7-146.6 56-70.1 142.8-145.7 177-206 0.9-1.6 1.8-3.3 2.6-5 31.5-50.2 49.7-109.6 49.7-173.3 0.1-180.5-146.3-326.8-326.8-326.8z" fill="${(e.ifAlarm === '1')?'#3D93FD':'#ff0000'}" p-id="4306">
|
|
|
|
|
<path d="M512 64.5c-180.5 0-326.9 146.4-326.9 326.9 0 63.3 18 122.3 49.2 172.4 1.1 2 2.1 4 3.2 5.9 34.9 58.2 113.9 128.8 165.5 194.5 66.3 84.4 93.2 158 93.2 158 1.6 1.4 13.1 35.6 15.1 35.8 2.5 0.2 12.6-34 14.5-35.8 0 0 22-69.2 83.7-146.6 56-70.1 142.8-145.7 177-206 0.9-1.6 1.8-3.3 2.6-5 31.5-50.2 49.7-109.6 49.7-173.3 0.1-180.5-146.3-326.8-326.8-326.8z" fill="${(e.ifAlarm === '1') ? '#3D93FD' : '#ff0000'}" p-id="4306">
|
|
|
|
|
</path></svg></div>`
|
|
|
|
|
});
|
|
|
|
|
marker.on('click', async () => {
|
|
|
|
|
@ -802,11 +873,17 @@ export default {
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
marker.on('dblclick', () => {
|
|
|
|
|
this.$router.push({path: '/board/equipment', query: {monitorUnitId: e.monitorUnitId}})
|
|
|
|
|
this.equipmentInfoDialog = true
|
|
|
|
|
this.equipmentInfo = e
|
|
|
|
|
this.monitorUnitId = e.monitorUnitId
|
|
|
|
|
// this.$router.push({path: '/board/equipment', query: {monitorUnitId: e.monitorUnitId}})
|
|
|
|
|
});
|
|
|
|
|
map.add(marker);
|
|
|
|
|
markers.push(marker)
|
|
|
|
|
},
|
|
|
|
|
getDeviceInfo() {
|
|
|
|
|
this.$router.push({path: '/board/equipment', query: {monitorUnitId: this.monitorUnitId}})
|
|
|
|
|
},
|
|
|
|
|
setPolygon(e, val) {
|
|
|
|
|
// let e = position.map(val => {
|
|
|
|
|
// return [val.longitude, val.latitude]
|
|
|
|
|
@ -845,21 +922,34 @@ export default {
|
|
|
|
|
center: this.centerGeo,
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
async searchMap(){
|
|
|
|
|
async searchMap() {
|
|
|
|
|
const {data} = await selectDeviceByName(this.formInline)
|
|
|
|
|
map.remove(markers)
|
|
|
|
|
map.remove(polygons)
|
|
|
|
|
map.remove(circles)
|
|
|
|
|
console.log(data)
|
|
|
|
|
data.forEach(e=>{
|
|
|
|
|
if(e.latitude && e.longitude){
|
|
|
|
|
markers = []
|
|
|
|
|
data.forEach(e => {
|
|
|
|
|
if (e.latitude && e.longitude) {
|
|
|
|
|
this.setMarker(e)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
map.setFitView(markers)
|
|
|
|
|
},
|
|
|
|
|
exTable(){
|
|
|
|
|
exTableData({}, '告警信息')
|
|
|
|
|
exTable() {
|
|
|
|
|
let query = {}
|
|
|
|
|
query.startTime = this.parseTime(this.exTableTime?.[0]?.getTime())
|
|
|
|
|
query.endTime = this.parseTime(this.exTableTime?.[1]?.getTime())
|
|
|
|
|
exTableData(query, '告警信息')
|
|
|
|
|
},
|
|
|
|
|
async RailChange() {
|
|
|
|
|
if (this.isRail) {
|
|
|
|
|
const data = await getDeviceByAreaId(this.$store.getters.tenantId)
|
|
|
|
|
data.data.map(e => e.devicesList).flat(1).forEach(e => {
|
|
|
|
|
this.setMarker(e)
|
|
|
|
|
})
|
|
|
|
|
} else {
|
|
|
|
|
map.remove(markers)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
@ -985,8 +1075,8 @@ export default {
|
|
|
|
|
.table1 {
|
|
|
|
|
position: absolute;
|
|
|
|
|
width: 21%;
|
|
|
|
|
height: 50%;
|
|
|
|
|
top: 45.5%;
|
|
|
|
|
height: 45%;
|
|
|
|
|
top: 50.5%;
|
|
|
|
|
left: 76.3%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -1002,10 +1092,12 @@ export default {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 80vh;
|
|
|
|
|
}
|
|
|
|
|
.exTable{
|
|
|
|
|
|
|
|
|
|
.exTable {
|
|
|
|
|
position: absolute;
|
|
|
|
|
bottom: 0%;
|
|
|
|
|
left: 87%;
|
|
|
|
|
transform: translateX(-50%);
|
|
|
|
|
top: 46%;
|
|
|
|
|
left: 76.3%;
|
|
|
|
|
width: 21%;
|
|
|
|
|
/*transform: translateX(-50%);*/
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
夜笙歌
5 months ago