diff --git a/ruoyi-ui/src/views/board/GPS/index.vue b/ruoyi-ui/src/views/board/GPS/index.vue index 007d839..c9d7b31 100644 --- a/ruoyi-ui/src/views/board/GPS/index.vue +++ b/ruoyi-ui/src/views/board/GPS/index.vue @@ -159,14 +159,14 @@ export default { type: 'warning' }).then(() => { handleAlarmInfo({ - alarmInfoId: e.no + alarmInfoId: e.value1 }).then(e => { if (e.code === 200) { this.$message({ type: 'success', message: '已处理!' }); - this.setTable3() + this.setAlarmInfos() } else { this.$message({ type: 'info', diff --git a/ruoyi-ui/src/views/board/equipmentMonitoring/index.vue b/ruoyi-ui/src/views/board/equipmentMonitoring/index.vue index 96a8268..4bbd145 100644 --- a/ruoyi-ui/src/views/board/equipmentMonitoring/index.vue +++ b/ruoyi-ui/src/views/board/equipmentMonitoring/index.vue @@ -3,7 +3,7 @@
- {{ i.deviceModeName }} + {{ i.deviceModeName }}
@@ -39,6 +39,11 @@ :header-cell-style="{ textAlign: 'center',backgroundColor:'#0a457d' }" :max-height="maxHeight"> style="width: 100%"> + + @@ -115,12 +165,17 @@ import { } from '@/utils/coordtransform' let map = null +let maptext = null +let mapMarker = null +let flag = true export default { components: {}, data() { return { + vh: document.documentElement.offsetHeight / 100, topData: {}, bottomData: [], + mapData: [], collapseNo: '1', radio: '日统计报表', tableData: [], @@ -132,7 +187,7 @@ export default { deviceDataColumns: [], show: false, isMap: false, - date: new Date(new Date().toLocaleDateString()).getTime() + date: [new Date(new Date().toLocaleDateString()).getTime(), new Date(new Date().toLocaleDateString()).getTime() + 1000 * 60 * 60 * 24], } }, async mounted() { @@ -150,10 +205,11 @@ export default { async search() { this.currentPage = 1 await this.setHistoryData() + flag = true }, async reset() { this.currentPage = 1 - this.date = new Date(new Date().toLocaleDateString()).getTime() + this.date = [new Date(new Date().toLocaleDateString()).getTime(), new Date(new Date().toLocaleDateString()).getTime() + 1000 * 60 * 60 * 24] await this.setHistoryData() }, setPolyline(e) { @@ -162,20 +218,40 @@ export default { borderWeight: 2, // 线条宽度,默认为 1 }); map.add(polyline); - map.setFitView() }, setMarker(e, i) { let marker = new AMap.Marker({ position: e, // 经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9] title: `信息\n经度:${e[0]}\n纬度:${e[1]}\n时间:${i}`, - offset:new AMap.Pixel(-2.5,-2.5), - content:`
` + offset: new AMap.Pixel(-2.5, -2.5), + content: `
` }); map.add(marker); - map.setFitView() }, + setMarkerSharding(e) { + let sum = e.length + let nowNum = 0 + let fun = () => { + setTimeout(() => { + let arr = e.splice(nowNum * 20, (nowNum + 1) * 20) + arr.forEach(v => { + this.setMarker([v.longitude, v.latitude], v.ts) + }) + this.setPolyline(arr.map(e => { + return [e.longitude, e.latitude] + })) + nowNum += 1 + + flag && map.setFitView() + if (nowNum * 20 <= sum) { + fun() + } + }, 1000 * 0.5) + } + fun() + }, + async currentChange(e) { - console.log(e) this.currentPage = e await this.setHistoryData() }, @@ -194,7 +270,7 @@ export default { async setDeviceInfo() { const {data} = await getDeviceInfo(this.deviceId) this.topData = data || {} - if(this.topData.gpsFlag !== '1'){ + if (this.topData.gpsFlag !== '1') { this.date = null } }, @@ -206,28 +282,24 @@ export default { "sceneId": this.$store.getters.sceneId, "deviceId": this.deviceId, deviceModeId: this.deviceModeId, - "offset":this.topData.gpsFlag !== '1'? (this.currentPage - 1) : null, - "limit": this.topData.gpsFlag !== '1'?10:null, - startTime: this.date, - endTime: this.date ? this.date + (1000 * 60 * 60 * 24) : null + "offset": this.topData.gpsFlag !== '1' ? (this.currentPage - 1) : null, + "limit": this.topData.gpsFlag !== '1' ? 10 : null, + startTime: this.date?.[0], + endTime: this.date?.[1], }) let dataList = data.historyData?.dataList || [] if (dataList.filter(e => (Object.keys(e).includes('longitude') || Object.keys(e).includes('longitude'))).length > 0) { this.isMap = true - let mapData = dataList.filter(e => (Object.keys(e).includes('longitude') || Object.keys(e).includes('longitude'))).map(e=>{ - let [lng,lat] = wgs84togcj02(e.longitude,e.latitude) + let mapData = dataList.filter(e => (Object.keys(e).includes('longitude') || Object.keys(e).includes('longitude'))).map(e => { + let [lng, lat] = wgs84togcj02(e.longitude, e.latitude) return { ...e, - longitude:lng, - latitude:lat + longitude: lng, + latitude: lat } }) - mapData.forEach(e => { - this.setMarker([e.longitude, e.latitude], e.ts) - }) - this.setPolyline(mapData.map(e => { - return [e.longitude, e.latitude] - })) + this.mapData = JSON.parse(JSON.stringify(mapData)) + this.setMarkerSharding(mapData) // this.tableData = data.historyData?.dataList // this.total = data.historyData?.count // this.currentPage = 1 @@ -248,6 +320,27 @@ export default { async setLinkDevices() { const {data} = await getLinkDevices(this.deviceId) this.bottomData = data + }, + mapTableChange(e) { + maptext && maptext.remove() + mapMarker && mapMarker.remove() + maptext = new AMap.Text({ + text: `信息\n经度:${e.longitude}\n纬度:${e.latitude}\n时间:${e.ts}`, + anchor: "bottom-center", //设置文本标记锚点位置 + cursor: "pointer", //指定鼠标悬停时的鼠标样式。 + position: [e.longitude, e.latitude], //点标记在地图上显示的位置 + }); + mapMarker = new AMap.Marker({ + position: [e.longitude, e.latitude], // 经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9] + offset: new AMap.Pixel(-5, -5), + content: `
` + }); + + map.add(maptext); + map.add(mapMarker); + map.setFitView([maptext,mapMarker]) + flag = false + console.log(e) } } }; @@ -313,6 +406,14 @@ export default { /deep/ .el-table .el-table__header-wrapper th { color: #05ecf3; } + + /deep/ .el-table .current-row { + color: #000; + } + + /deep/ .el-table .el-table__row:hover { + color: #000; + } } @@ -398,7 +499,8 @@ export default { width: 100%; height: 50vh; } -.infoDiv{ + +.infoDiv { position: absolute; left: 60vh; height: 100%;