修改地图

breach-zhy
夜笙歌 5 months ago
parent f52e3319f3
commit ecdc356fd2

@ -1,4 +1,4 @@
import request from '@/utils/request'
import request,{download} from '@/utils/request'
// 左下
export function monitorUnitPercentage(query) {
@ -92,3 +92,28 @@ export function selectDeviceByName(query) {
data:query
})
}
// 导出告警信息
export function exTableData(data,name) {
return download('/business/monitorPlatform/AlarmInfosExport',data,name,{},{type:'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'})
}
// 查看台账
export function getRedisFile(query) {
return request({
// baseURL:'/monitoring-api',
url: '/business/monitorPlatform/getRedisFile/'+query,
method: 'get',
})
}
// 导入台账
export function importAccount(query) {
return request({
// baseURL:'/monitoring-api',
url: '/business/monitorPlatform/import',
method: 'post',
data:query
})
}

@ -49,18 +49,52 @@
<div class="rightImg" @click="toIndex">
</div>
<div class="equipmentRecord">
<span>
</span>
</div>
<div class="equipmentRecordImg" @click="toEquipmentRecord">
</div>
<el-dialog title="台账管理" :visible.sync="dialogTableVisible">
<el-button type="primary" @click="importf"></el-button>
<el-table :data="tableData">
<el-table-column :property="i" :label="i" width="200px" v-for="i in tableTh"></el-table-column>
</el-table>
</el-dialog>
<el-dialog title="上传" :visible.sync="uploadDialog">
<el-upload
style="width: 100%"
class="upload-demo"
drag
:action="api+'/business/monitorPlatform/import/'"
:data="{tenantId:$store.getters.tenantId}"
:headers="{Authorization:'Bearer ' + token}"
:on-success="uploadSuccess"
multiple>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处<em>点击上传</em></div>
</el-upload>
</el-dialog>
</div>
</template>
<script>
import {getToken} from '@/utils/auth'
import {
selectSecnes
} from '@/api/board/nav'
import {
getTenantData
getTenantData,
getRedisFile,
importAccount
} from '@/api/board/index'
export default {
name: 'BoardTopNav',
data() {
@ -71,6 +105,12 @@ export default {
sceneId: this.$store.getters.sceneId,
nowMenu: '1',
tenantData: {},
dialogTableVisible: false,
uploadDialog: false,
tableData: [],
tableTh:[],
api: process.env.VUE_APP_BASE_API,
token: getToken()
}
},
// props: {
@ -146,6 +186,21 @@ export default {
},
toIndex() {
this.$router.replace({path: "/index"});
},
async toEquipmentRecord() {
this.dialogTableVisible = true
const data = await getRedisFile(this.$store.getters.tenantId)
this.tableData = JSON.parse(data.content)
this.tableTh = Object.keys(data.Header).map(e=>data.Header[e])
},
importf() {
this.uploadDialog = true
},
async uploadSuccess(e){
this.uploadDialog = false
const data = await getRedisFile(this.$store.getters.tenantId)
this.tableData = JSON.parse(data.content)
this.tableTh = Object.keys(data.Header).map(e=>data.Header[e])
}
}
};
@ -210,6 +265,30 @@ export default {
text-align: center;
}
.equipmentRecord {
position: absolute;
width: 8vw;
height: 1.66vw;
top: 3.8%;
left: 79%;
line-height: 1.66vw;
font-size: 0.8vw;
color: #d4d4d4;
text-align: center;
}
.equipmentRecordImg {
transform: rotateX(180deg);
background-image: url('~@/assets/board/common/subheadClick1.png');
background-repeat: no-repeat;
background-size: 100% 100%;
position: absolute;
width: 8vw;
height: 1.66vw;
top: 3.8%;
left: 79%;
}
.el-dropdown-menu {
padding: 0 !important;
border: none !important;
@ -223,4 +302,12 @@ export default {
.el-dropdown-menu__item:not(.is-disabled):hover span {
color: #053563 !important;
}
/deep/ .el-upload-dragger {
width: 100%;
}
/deep/ .el-upload {
width: 100%;
}
</style>

@ -177,6 +177,7 @@ import red from '@/assets/board/GPS/red.png'
import green from '@/assets/board/GPS/green.png'
import {handleAlarmInfo} from "@/api/board/index";
import {selectBeaconDevicesHistory} from "../../../api/board/GPS";
import {selectMonitorElectronic} from "../../../api/board";
let map = null
let polyEditor = null
@ -418,15 +419,17 @@ export default {
</svg>
</div>`
});
marker.on('click', () => {
this.historyDialog = true
this.form = {
pageNum: 1,
pageSize: 10,
deviceId: e.deviceId,
time: [],
marker.on('click', async () => {
const {data} = await selectMonitorElectronic(e.deviceId)
data.map(e => e.hwFenceAreaList).flat(1).forEach(e => {
if (e.areaShapeFlag === '1') {
this.setPolygon(e.areaRange.split('_').map(e => e.split(',').map(v => parseFloat(v))))
}
this.getHistoryData()
if (e.areaShapeFlag === '2') {
let arr = e.areaRange.split(',')
this.setCircle([arr[0], arr[1]], arr[2])
}
})
})
map.add(marker);
},
@ -434,7 +437,16 @@ export default {
map.setZoomAndCenter(16, [e.longitude, e.latitude])
},
equipmentInfo(e) {
this.$router.push(`/board/senso?id=${e.deviceId}&deviceModeId=${e.deviceModeId}`)
this.historyDialog = true
this.form = {
pageNum: 1,
pageSize: 10,
deviceId: e.deviceId,
time: [],
}
this.getHistoryData()
// this.$router.push(`/board/senso?id=${e.deviceId}&deviceModeId=${e.deviceModeId}`)
},
async getHistoryData() {
let query = this.form

@ -131,37 +131,29 @@
</div>
<el-table
:data="historyData"
v-if="isHistoryTable"
style="width: 100%">
<el-table-column
type="index"
width="50">
</el-table-column>
<el-table-column
prop="longitude"
label="经度"
v-for="i in Object.keys(historyTh)"
v-if="historyTh[i]"
:prop="i"
:label="historyTh[i]"
width="180">
</el-table-column>
<el-table-column
prop="latitude"
label="纬度"
width="180">
</el-table-column>
<el-table-column
prop="speed"
label="速度">
</el-table-column>
<el-table-column
prop="ts"
label="采集时间">
</el-table-column>
</el-table>
<pagination
v-if="isHistoryTable"
v-show="total>0"
:total="total"
:page.sync="form.pageNum"
:limit.sync="form.pageSize"
@pagination="getHistoryData"
/>
<Chart v-if="!isHistoryTable" ref="historyChart" class="historyChart"></Chart>
</el-dialog>
<el-dialog title="对比" :visible.sync="comparisonDialog">
@ -193,47 +185,9 @@
<el-button type="primary" @click="getComparisonData"></el-button>
</el-form-item>
</el-form>
<!-- <div style="margin-bottom: 12px">-->
<!-- <el-button type="primary">导出</el-button>-->
<!-- <el-button type="success">对比</el-button>-->
<!-- </div>-->
<el-table
v-if="false"
:data="historyData"
style="width: 100%">
<el-table-column
type="index"
width="50">
</el-table-column>
<el-table-column
prop="longitude"
label="经度"
width="180">
</el-table-column>
<el-table-column
prop="latitude"
label="纬度"
width="180">
</el-table-column>
<el-table-column
prop="speed"
label="速度">
</el-table-column>
<el-table-column
prop="ts"
label="采集时间">
</el-table-column>
</el-table>
<div>
<Chart ref="chart" class="chart"></Chart>
</div>
<pagination
v-show="total>0"
:total="total"
:page.sync="form.pageNum"
:limit.sync="form.pageSize"
@pagination="getHistoryData"
/>
</el-dialog>
</div>
</template>
@ -296,6 +250,8 @@ export default {
time: [new Date(new Date().getTime() - 1000 * 60 * 60 * 24), new Date()],
},
historyData: [],
historyTh:{},
isHistoryTable:true,
total: 100,
comparisonDialog: false,
sensorOptions: [],
@ -392,8 +348,6 @@ export default {
this.MonitorInfo = data
},
toHistory(e, i) {
// console.log(e)
// console.log(i)
// this.$router.push({path: "/board/senso", query: {id: e, deviceModeId: i}});
this.historyDialog = true
this.form = {
@ -411,8 +365,50 @@ export default {
query.endTime = this.parseTime(this.form.time?.[1]?.getTime())
delete query.time
const data = await selectHistoryAndTrendAnalysis(query)
this.historyData = data.rows
this.total = data.total
if(query.type === '1'){
this.isHistoryTable = false
this.$nextTick(()=>{
let series = Object.keys(data.mapName).map(e => {
if(data.mapName[e]){
return {
name: data.mapName[e],
type: 'line',
stack: 'Total',
data: data.tableDataInfo.rows.map(v=>[new Date(v.ts),v[e]])
}
}
})
this.$refs.historyChart.setData({
tooltip: {
trigger: 'axis'
},
legend: {},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'time',
boundaryGap: false,
},
yAxis: {
type: 'value'
},
series: series
})
})
}
if(query.type === '2'){
this.isHistoryTable = true
this.$nextTick(()=>{
this.historyData = data.tableDataInfo.rows
this.historyTh = data.mapName
this.total = data.tableDataInfo.total
})
}
},
async comparison() {
this.comparisonDialog = true
@ -458,7 +454,7 @@ export default {
delete query.sensor
const data = await selectHistoryAndTrendAnalysis(query)
let chartData = {}
data.rows.forEach(e => {
data.tableDataInfo.rows.forEach(e => {
if (chartData[e.deviceId]) {
chartData[e.deviceId].push({
value: [new Date(e.ts), e.functionIdentifier]
@ -508,7 +504,6 @@ export default {
query.endTime = this.parseTime(this.form.time?.[1]?.getTime())
delete query.time
const data = exportData(query, '历史数据')
console.log(data)
}
},
};
@ -811,4 +806,8 @@ export default {
width: 100%;
height: 50vh;
}
.historyChart{
width: 100%;
height: 50vh;
}
</style>

@ -133,6 +133,10 @@
</div>
</vue-seamless-scroll>
</div>
<el-button type="primary" class="exTable"
@click="exTable">导出告警信息
</el-button>
<div v-if="isMap">
<Chart ref="mapChart" class="mapChart"></Chart>
<el-button type="primary" style="position:absolute;bottom: 4%;left: 50%;transform: translateX(-50%)"
@ -187,7 +191,8 @@ import {
getDeviceByAreaId,
getTenantData,
selectMonitorElectronic,
selectDeviceByName
selectDeviceByName,
exTableData
} from '@/api/board/index'
import ChinaMapData from '@/utils/ChinaMapData.json'
import gsByMap from '@/utils/map/gs_by.json'
@ -511,6 +516,7 @@ export default {
this.$refs.chart3.setData(option3)
},
dispose(e) {
this.textarea = ''
this.isDispose = true
this.disposeNo = e.no
},
@ -800,7 +806,6 @@ export default {
})
marker.on('dblclick', () => {
this.$router.push({path: '/board/equipment', query: {monitorUnitId: e.monitorUnitId}})
console.log(e)
});
map.add(marker);
markers.push(marker)
@ -844,11 +849,17 @@ export default {
});
},
async searchMap(){
const data = selectDeviceByName(this.formInline)
console.log(data)
const {data} = await selectDeviceByName(this.formInline)
map.remove(markers)
map.remove(polygons)
map.remove(circles)
console.log(data)
data.forEach(e=>{
this.setMarker(e)
})
},
exTable(){
exTableData({}, '告警信息')
}
}
}
@ -991,5 +1002,10 @@ export default {
width: 100%;
height: 80vh;
}
.exTable{
position: absolute;
bottom: 0%;
left: 87%;
transform: translateX(-50%);
}
</style>

Loading…
Cancel
Save