xins
/
highwaysass
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改界面

Browse Source
master
夜笙歌 5 months ago
parent f6947e86eb
commit cd0210f77c
3 changed files with 139 additions and 48 deletions
Show Stats Download Patch File Download Diff File

16
ruoyi-ui/src/components/BoardTopNav/index.vue
Unescape Escape View File

@ -58,9 +58,9 @@
<div class="equipmentRecordImg" @click="toEquipmentRecord"> <div class="equipmentRecordImg" @click="toEquipmentRecord">
</div> </div>
<el-dialog title="台账管理" :visible.sync="dialogTableVisible"> <el-dialog title="台账管理" width="90%" :visible.sync="dialogTableVisible">
<el-button type="primary" @click="importf">导入</el-button> <el-button type="primary" @click="importf">导入</el-button>
<el-table :data="tableData"> <el-table :data="tableData" :max-height="70*vh">
<el-table-column :property="i" :label="i" width="200px" v-for="i in tableTh"></el-table-column> <el-table-column :property="i" :label="i" width="200px" v-for="i in tableTh"></el-table-column>
</el-table> </el-table>
</el-dialog> </el-dialog>
@ -94,11 +94,13 @@ import {
importAccount importAccount
} from '@/api/board/index' } from '@/api/board/index'
const vh = (document.documentElement.clientHeight || document.body.clientHeight) / 100
export default { export default {
name: 'BoardTopNav', name: 'BoardTopNav',
data() { data() {
return { return {
vh,
selectSecnesList: [], selectSecnesList: [],
name: '智慧场景', name: '智慧场景',
isIndex: true, isIndex: true,
@ -125,7 +127,7 @@ export default {
this.tenantData = e.data this.tenantData = e.data
}) })
if (!this.$store.getters.sceneId) { if (!this.$store.getters.sceneId) {
this.$router.replace({path: "/board/index"}) await this.$router.replace({path: "/board/index"})
} }
if (this.$route.name === 'smartScene' || this.$route.name === 'GPS' || this.$route.name === 'index' || this.$store.getters.sceneId) { if (this.$route.name === 'smartScene' || this.$route.name === 'GPS' || this.$route.name === 'index' || this.$store.getters.sceneId) {
} else { } else {
@ -133,7 +135,7 @@ export default {
await this.$router.replace({path: "/board/index"}); await this.$router.replace({path: "/board/index"});
} else { } else {
await this.$router.replace({path: "/board/smartScene"}); await this.$router.replace({path: "/board/smartScene"});
this.$router.push({path: '/board/smartScene'}) await this.$router.push({path: '/board/smartScene'})
} }
} }
await this.setSelectSecnes() await this.setSelectSecnes()
@ -148,11 +150,7 @@ export default {
}); });
} }
} }
if (this.$store.state.user.permissions.includes('business:monitor:index') || this.$store.state.user.permissions.includes('*:*:*')) { this.isIndex = !!(this.$store.state.user.permissions.includes('business:monitor:index') || this.$store.state.user.permissions.includes('*:*:*'));
this.isIndex = true
} else {
this.isIndex = false
}
}, },
methods: { methods: {

41
ruoyi-ui/src/views/board/equipment/index.vue
Unescape Escape View File

@ -655,16 +655,16 @@ export default {
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
position: relative; position: relative;
width: 100%; width: 50%;
height: 7vw; height: 3.5vw;
margin-top: 12px; margin-top: 12px;
display: inline-block;
.icon { .icon {
background-image: url("~@/assets/board/equipment/icon.png"); background-image: url("~@/assets/board/equipment/icon.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
position: absolute; position: absolute;
top: 21%; top: 21%;
left: 5.8%; left: 5.8%;
width: 14.5%; width: 14.5%;
@ -676,7 +676,7 @@ export default {
top: 50%; top: 50%;
left: 30%; left: 30%;
transform: translateY(-50%); transform: translateY(-50%);
font-size: 1vw; font-size: 0.6vw;
color: #1facf4; color: #1facf4;
} }
@ -704,10 +704,11 @@ export default {
.item { .item {
position: relative; position: relative;
width: 100%; width: 50%;
margin-bottom: 12px; margin-bottom: 12px;
height: 18vh; height: 9vh;
padding: 1vh 0; padding: 0.5vh 0;
display: inline-block;
.iconBg { .iconBg {
background-image: url("~@/assets/board/equipment/iconBg.png"); background-image: url("~@/assets/board/equipment/iconBg.png");
@ -716,8 +717,8 @@ export default {
position: absolute; position: absolute;
top: 16%; top: 16%;
left: 5%; left: 5%;
width: 16vh; width: 8vh;
height: 16vh; height: 8vh;
} }
.icon { .icon {
@ -725,10 +726,10 @@ export default {
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
position: absolute; position: absolute;
top: calc(16% + 1vh); top: calc(16% + 0.5vh);
left: calc(5% + 0.5vw); left: calc(5% + 0.25vw);
width: 14vh; width: 7vh;
height: 14vh; height: 7vh;
} }
.rightBg { .rightBg {
@ -737,9 +738,9 @@ export default {
background-size: 100% 100%; background-size: 100% 100%;
position: absolute; position: absolute;
top: 16%; top: 16%;
left: calc(10% + 16vh); left: calc(10% + 8vh);
width: calc(90% - 16vh);; width: calc(90% - 8vh);
height: 16vh; height: 8vh;
.title { .title {
position: absolute; position: absolute;
@ -747,13 +748,13 @@ export default {
left: 12%; left: 12%;
color: #1facf4; color: #1facf4;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
font-size: 1vw; font-size: 0.6vw;
} }
.infoItem { .infoItem {
display: inline-block; display: inline-block;
position: relative; position: relative;
width: 6vw; width: 3vw;
height: 50%; height: 50%;
.spanBg { .spanBg {
@ -773,7 +774,7 @@ export default {
bottom: 55%; bottom: 55%;
left: 12%; left: 12%;
color: #f4f4f4; color: #f4f4f4;
font-size: 0.7vw; font-size: 0.5vw;
} }
.num { .num {
@ -781,7 +782,7 @@ export default {
top: 55%; top: 55%;
left: 12%; left: 12%;
color: #f4f4f4; color: #f4f4f4;
font-size: 0.7vw; font-size: 0.5vw;
} }
} }

130
ruoyi-ui/src/views/board/index/index.vue
Unescape Escape View File

@ -134,9 +134,17 @@
</vue-seamless-scroll> </vue-seamless-scroll>
</div> </div>
<el-button type="primary" class="exTable" <div class="exTable">
@click="exTable">导出告警信息 <el-date-picker
</el-button> 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"> <div v-if="isMap">
<Chart ref="mapChart" class="mapChart"></Chart> <Chart ref="mapChart" class="mapChart"></Chart>
<el-button type="primary" style="position:absolute;bottom: 4%;left: 50%;transform: translateX(-50%)" <el-button type="primary" style="position:absolute;bottom: 4%;left: 50%;transform: translateX(-50%)"
@ -144,7 +152,7 @@
</el-button> </el-button>
</div> </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 :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="名称"> <el-form-item label="名称">
<el-input v-model="formInline.name" placeholder="名称"></el-input> <el-input v-model="formInline.name" placeholder="名称"></el-input>
@ -153,12 +161,35 @@
<el-button type="primary" @click="searchMap">查询</el-button> <el-button type="primary" @click="searchMap">查询</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-switch
v-model="isRail"
@change="RailChange"
active-text="显示点位"
inactive-text="隐藏点位">
</el-switch>
<div id="map" class="map"></div> <div id="map" class="map"></div>
</el-dialog> </el-dialog>
<el-dialog <el-dialog
:visible.sync="isDispose" :visible.sync="isDispose"
width="30%"> 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> <span>备注</span>
<el-input <el-input
style="margin-top: 12px;margin-bottom:12px" style="margin-top: 12px;margin-bottom:12px"
@ -173,6 +204,34 @@
<el-button type="primary" @click="disposeAll">处理所有</el-button> <el-button type="primary" @click="disposeAll">处理所有</el-button>
</span> </span>
</el-dialog> </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> </div>
</template> </template>
@ -212,7 +271,13 @@ export default {
data() { data() {
return { return {
containerPic, containerPic,
formInline:{}, isRail: true,
monitorUnitId: null,
equipmentInfoDialog: false,
exTableTime: [new Date(new Date().getTime() - 1000 * 60 * 60 * 24), new Date()],
equipmentInfo: {},
warInfo: {},
formInline: {},
textarea: '', textarea: '',
disposeNo: null, disposeNo: null,
isDispose: false, isDispose: false,
@ -437,6 +502,7 @@ export default {
const {rows: data} = await getAlarmInfos() const {rows: data} = await getAlarmInfos()
this.table1Data = data.map((e, i) => { this.table1Data = data.map((e, i) => {
return { return {
...e,
no: e.alarmInfoId, no: e.alarmInfoId,
type: e.alarmTypeName, type: e.alarmTypeName,
location: e.monitorUnitName, location: e.monitorUnitName,
@ -516,6 +582,8 @@ export default {
this.$refs.chart3.setData(option3) this.$refs.chart3.setData(option3)
}, },
dispose(e) { dispose(e) {
this.warInfo = e
console.log(e)
this.textarea = '' this.textarea = ''
this.isDispose = true this.isDispose = true
this.disposeNo = e.no this.disposeNo = e.no
@ -776,12 +844,15 @@ export default {
}) })
}, },
setMarker(e) { setMarker(e) {
if (!this.isRail) {
return
}
let marker = new AMap.Marker({ let marker = new AMap.Marker({
position: [e.longitude, e.latitude], position: [e.longitude, e.latitude],
title: `信息\n经度：${e.longitude}\n纬度：${e.latitude}\n名称：${e.deviceName}\n`, title: `信息\n经度：${e.longitude}\n纬度：${e.latitude}\n名称：${e.deviceName}\n`,
offset: new AMap.Pixel(-15, -30), 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;"> 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>` </path></svg></div>`
}); });
marker.on('click', async () => { marker.on('click', async () => {
@ -802,11 +873,17 @@ export default {
}) })
}) })
marker.on('dblclick', () => { 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); map.add(marker);
markers.push(marker) markers.push(marker)
}, },
getDeviceInfo() {
this.$router.push({path: '/board/equipment', query: {monitorUnitId: this.monitorUnitId}})
},
setPolygon(e, val) { setPolygon(e, val) {
// let e = position.map(val => { // let e = position.map(val => {
// return [val.longitude, val.latitude] // return [val.longitude, val.latitude]
@ -845,21 +922,34 @@ export default {
center: this.centerGeo, center: this.centerGeo,
}); });
}, },
async searchMap(){ async searchMap() {
const {data} = await selectDeviceByName(this.formInline) const {data} = await selectDeviceByName(this.formInline)
map.remove(markers) map.remove(markers)
map.remove(polygons) map.remove(polygons)
map.remove(circles) map.remove(circles)
console.log(data) markers = []
data.forEach(e=>{ data.forEach(e => {
if(e.latitude && e.longitude){ if (e.latitude && e.longitude) {
this.setMarker(e) this.setMarker(e)
} }
}) })
map.setFitView(markers) map.setFitView(markers)
}, },
exTable(){ exTable() {
exTableData({}, '告警信息') 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 { .table1 {
position: absolute; position: absolute;
width: 21%; width: 21%;
height: 50%; height: 45%;
top: 45.5%; top: 50.5%;
left: 76.3%; left: 76.3%;
} }
@ -1002,10 +1092,12 @@ export default {
width: 100%; width: 100%;
height: 80vh; height: 80vh;
} }
.exTable{
.exTable {
position: absolute; position: absolute;
bottom: 0%; top: 46%;
left: 87%; left: 76.3%;
transform: translateX(-50%); width: 21%;
/*transform: translateX(-50%);*/
} }
</style> </style>

Write Preview
Loading…
Cancel
Save