修改设备和传感器

master
夜笙歌 2 years ago
parent e8441ac890
commit ec355bf39a

@ -26,3 +26,12 @@ export function getMonitorById(query=0) {
data:query data:query
}) })
} }
// 切换状态
export function publishControlCommand(query=0) {
return request({
// baseURL:'/monitoring-api',
url: '/business/monitorPlatform/publishControlCommand',
method: 'POST',
data:query
})
}

@ -43,14 +43,18 @@
<div class="terminalList"> <div class="terminalList">
<div v-for="(i,k) in controlList" class="item"> <div v-for="(i,k) in controlList" class="item">
<div class="icon"></div> <div class="icon"></div>
<div class="title">{{ i.deviceName }}</div> <div class="title">{{ i.deviceName + ' - ' + i.deviceModeFunction.functionName }}</div>
<div class="switch"> <div class="switch">
<el-switch <el-button
v-model="i.deviceType==='1'" @click="switchChange(i.deviceModeFunction.functionIdentifier,i.deviceId,i.deviceCode,i.deviceModeFunction.modeFunctionId)" type="primary" size="mini">执行
active-color="#1165a1"
inactive-color="#1facf4" </el-button>
@change="switchChange(k)"> <!-- <el-switch-->
</el-switch> <!-- v-model="i.deviceType==='1'"-->
<!-- active-color="#1165a1"-->
<!-- inactive-color="#1facf4"-->
<!-- @change="switchChange(i.deviceModeFunction.functionIdentifier,i.deviceId,i.deviceCode,i.deviceModeFunction.modeFunctionId)">-->
<!-- </el-switch>-->
</div> </div>
</div> </div>
</div> </div>
@ -58,19 +62,23 @@
<div class="right"> <div class="right">
<div v-for="i in acquisitionList" class="item"> <div v-for="i in acquisitionList" class="item">
<div class="iconBg"></div> <div class="iconBg"></div>
<div class="icon"></div> <div
:style="'background-image: url('+i.deviceDataMap[Object.keys(i.deviceDataMap).find(e=> i.deviceDataMap[e].toString().includes('http'))]+')'"
class="icon"></div>
<div class="rightBg"> <div class="rightBg">
<div class="title">{{ i.deviceName }}</div> <div class="title">{{ i.deviceName }}</div>
<div style="position: absolute;left: 24%;top: 0px;width: 75%;height: 100%;"> <div style="position: absolute;left: 24%;top: 0px;width: 55%;height: 100%;">
<!-- <div v-for="val in Object.keys(i.deviceDataMaps[0])" class="infoItem">--> <div
<!-- <div class="span">{{ val }}:</div>--> v-for="val in Object.keys(i.deviceDataMap).slice(0,6).filter(e=> !(i.deviceDataMap[e].toString().includes('http')))"
<!-- <div class="spanBg"></div>--> class="infoItem">
<!-- <div class="num">{{ i.deviceDataMaps[0][val] }}</div>--> <div class="span">{{ val }}:</div>
<!-- </div>--> <div class="spanBg"></div>
<div class="num">{{ i.deviceDataMap[val] }}</div>
</div>
</div> </div>
<div class="btn"> <div class="btn">
<div class="btnC" style="top: 50%"> <div class="btnC" style="top: 50%">
<el-button type="primary" @click="toHistory"></el-button> <el-button type="primary" @click="toHistory(i.deviceId,i.deviceModeId)"></el-button>
</div> </div>
</div> </div>
@ -84,14 +92,14 @@
import { import {
treeList, treeList,
selectDevicesByMonitorUnitId, selectDevicesByMonitorUnitId,
getMonitorById getMonitorById,
publishControlCommand
} from '@/api/board/equipment' } from '@/api/board/equipment'
let getDeviceInterval = null let getDeviceInterval = null
export default { export default {
components: { components: {},
},
data() { data() {
return { return {
show: false, show: false,
@ -111,26 +119,42 @@ export default {
async mounted() { async mounted() {
await this.getData() await this.getData()
this.sceneId = this.$store.getters.sceneId this.sceneId = this.$store.getters.sceneId
if(this.$route.query.monitorUnitId){ if (this.$route.query.monitorUnitId) {
this.deviceId = this.$route.query.monitorUnitId this.deviceId = this.$route.query.monitorUnitId
await this.treeClick({id:this.$route.query.monitorUnitId}) await this.treeClick({id: this.$route.query.monitorUnitId})
} }
}, },
methods: { methods: {
async getData() { async getData() {
await this.getTree() await this.getTree()
}, },
switchChange(e) { switchChange(functionIdentifier, deviceId, deviceCode,modeFunctionId) {
this.$confirm((this.controlList[e].deviceType === '1' ? '关闭' : '开启') + '该设备?', '提示', { console.log(this.controlList)
console.log(this.controlList)
this.$confirm('确定执行么?', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning' type: 'warning'
}).then(() => { }).then(() => {
this.$message({ publishControlCommand({
type: 'success', deviceId:deviceId,
message: '成功!' modeFunctionId:modeFunctionId,
}); deviceCode:deviceCode,
this.controlList[e].deviceType === '1' ? this.controlList[e].deviceType = '0' : this.controlList[e].deviceType = '1' type:functionIdentifier,
}).then(e => {
if (e.code === 200) {
this.$message({
type: 'success',
message: '成功!'
});
this.controlList.find(e => e.deviceId === deviceId).deviceType === '1' ? this.controlList.find(e => e.deviceId === deviceId).deviceType = '0' : this.controlList.find(e => e.deviceId === deviceId).deviceType = '1'
}else{
this.$message({
type: 'info',
message: '网络错误'
});
}
})
}).catch(() => { }).catch(() => {
this.$message({ this.$message({
type: 'info', type: 'info',
@ -166,8 +190,9 @@ export default {
const {data} = await getMonitorById(e.id) const {data} = await getMonitorById(e.id)
this.MonitorInfo = data this.MonitorInfo = data
}, },
toHistory() { toHistory(e,i) {
this.$router.push({path: "/board/senso"}); console.log(i)
this.$router.push({path: "/board/senso",query:{id:e,deviceModeId:i}});
} }
}, },
beforeDestroy() { beforeDestroy() {
@ -283,10 +308,10 @@ export default {
.terminalList { .terminalList {
position: absolute; position: absolute;
top: 12%; top: 1%;
left: 0%; left: 0%;
width: 100%; width: 100%;
height: 85%; height: 95%;
overflow: auto; overflow: auto;
::-webkit-scrollbar { ::-webkit-scrollbar {
@ -362,6 +387,17 @@ export default {
height: 16vh; height: 16vh;
} }
.icon {
background-repeat: no-repeat;
background-size: 100% 100%;
position: absolute;
top: calc(16% + 1vh);
left: calc(5% + 0.5vw);
width: 14vh;
height: 14vh;
}
.rightBg { .rightBg {
background-image: url("~@/assets/board/equipment/right.png"); background-image: url("~@/assets/board/equipment/right.png");
background-repeat: no-repeat; background-repeat: no-repeat;

@ -37,34 +37,36 @@
:header-cell-style="{ textAlign: 'center',backgroundColor:'#0a457d' }" :header-cell-style="{ textAlign: 'center',backgroundColor:'#0a457d' }"
:max-height="maxHeight"> :max-height="maxHeight">
style="width: 100%"> style="width: 100%">
<el-table-column <el-table-column v-for="i in deviceDataColumns" :label="i.columnName" :prop="i.columnKey">
label="rssi"
prop="rssi">
</el-table-column>
<el-table-column
label="value1"
prop="value1">
</el-table-column>
<el-table-column
label="编号"
prop="devicecode">
</el-table-column>
<el-table-column
label="alias"
prop="alias">
</el-table-column>
<el-table-column
label="设备名称"
prop="devicename">
</el-table-column>
<el-table-column
label="ts"
prop="ts">
</el-table-column>
<el-table-column
label="voltage"
prop="voltage">
</el-table-column> </el-table-column>
<!-- <el-table-column-->
<!-- label="rssi"-->
<!-- prop="rssi">-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="value1"-->
<!-- prop="value1">-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="编号"-->
<!-- prop="devicecode">-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="alias"-->
<!-- prop="alias">-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="设备名称"-->
<!-- prop="devicename">-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="ts"-->
<!-- prop="ts">-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="voltage"-->
<!-- prop="voltage">-->
<!-- </el-table-column>-->
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
@ -76,7 +78,7 @@
</el-table> </el-table>
</div> </div>
<div ref="pagination" style="margin-top: 12px;height: 36px;"> <div ref="pagination" style="margin-top: 12px;height: 36px;">
<el-pagination :current-page="offset" :total="total" background layout="prev, pager, next" style="display: inline-block;float:right;"> <el-pagination :current-page="offset" :total="total" background layout="prev, pager, next" style="display: inline-block;float:right;" :pageSize="10" @current-change="currentChange">
</el-pagination> </el-pagination>
</div> </div>
</div> </div>
@ -105,27 +107,32 @@ export default {
tableData: [], tableData: [],
deviceList:[], deviceList:[],
sceneId: 0, sceneId: 0,
offset:0, offset:1,
limit:10, limit:10,
total:0 total:0,
deviceDataColumns:[],
} }
}, },
async mounted() { async mounted() {
this.maxHeight = this.$refs.right.clientHeight - this.$refs.search.clientHeight - this.$refs.pagination.clientHeight - 12 this.maxHeight = this.$refs.right.clientHeight - this.$refs.search.clientHeight - this.$refs.pagination.clientHeight - 12
this.tableShow = true
await this.getData() await this.getData()
}, },
methods: { methods: {
async currentChange(){
await this.getRightData()
},
async getRightData(e){ async getRightData(e){
this.loading = true this.loading = true
await this.setSelectLatestDataByDeviceMode({ await this.setSelectLatestDataByDeviceMode({
"sceneId": this.$store.getters.sceneId, "sceneId": this.$store.getters.sceneId,
"deviceModeId": e.deviceModeId, "deviceModeId": e.deviceModeId,
"startTime": 0, "startTime": 0,
"offset": this.offset, "offset": this.offset-1,
"limit": 10 "limit": 10
}) })
this.loading = false this.loading = false
this.tableShow = false
this.tableShow = true
}, },
async getData() { async getData() {
await this.setDeviceModesBySceneId() await this.setDeviceModesBySceneId()
@ -139,6 +146,7 @@ export default {
}, },
async setSelectLatestDataByDeviceMode(e){ async setSelectLatestDataByDeviceMode(e){
const {data} = await selectLatestDataByDeviceMode(e) const {data} = await selectLatestDataByDeviceMode(e)
this.deviceDataColumns = data.deviceDataColumns
this.tableData = data.latestData || [] this.tableData = data.latestData || []
this.total=data.total this.total=data.total
}, },

@ -3,7 +3,7 @@
<div class="centerImg"></div> <div class="centerImg"></div>
<div class="collapse"> <div class="collapse">
<div style="margin-bottom: 24px"> <div style="margin-bottom: 24px">
<el-collapse accordion> <el-collapse v-model="collapseNo" accordion>
<el-collapse-item name="1"> <el-collapse-item name="1">
<template slot="title"> <template slot="title">
<div class="itemBg"> <div class="itemBg">
@ -12,16 +12,16 @@
<div :style="'background-image: url('+(topData&&topData.devicePic)+')'" class="icon2"></div> <div :style="'background-image: url('+(topData&&topData.devicePic)+')'" class="icon2"></div>
<div class="title"> {{ topData.monitorUnitName }}</div> <div class="title"> {{ topData.monitorUnitName }}</div>
<div class="info"> <div class="info">
<div class="info1">所属区域</div> <div class="info1">设备编号:</div>
<div class="info2"> {{ topData.deviceName }}</div> <div class="info2"> {{ topData.deviceCode }}</div>
</div> </div>
<div class="info" style="left: 70vh;"> <div class="info" style="left: 70vh;">
<div class="info1">位置:</div> <div class="info1">设备名称:</div>
<div class="info2">深圳</div> <div class="info2">{{ topData.deviceName }}</div>
</div> </div>
<div class="info" style="left: 80vh;"> <div class="info" style="left: 80vh;">
<div class="info1">日期:</div> <div class="info1">设备位置:</div>
<div class="info2">2023-01-01 00:00:00</div> <div class="info2">{{ topData.deviceLocation }}</div>
</div> </div>
</div> </div>
</template> </template>
@ -47,24 +47,24 @@
<!-- </el-col>--> <!-- </el-col>-->
<!-- </el-row>--> <!-- </el-row>-->
<el-table :cell-style="setStyle" :data="tableData" <el-table :cell-style="setStyle" :data="tableData"
:header-cell-style="{ textAlign: 'center',backgroundColor:'#0a457d' }" :header-cell-style="{ textAlign: 'center',backgroundColor:'#0a457d' }" v-if="show"
style="width: 100%;margin-top: 12px;"> style="width: 100%;margin-top: 12px;">
<el-table-column label="设备ID" prop="columnName"> <el-table-column v-for="i in deviceDataColumns" :label="i.columnName" :prop="i.columnKey">
</el-table-column>
<el-table-column label="传感器编号" prop="columnKey">
</el-table-column>
<el-table-column label="alias" prop="alias">
</el-table-column>
<el-table-column label="rssi" prop="rssi">
</el-table-column>
<el-table-column label="ts" prop="ts">
</el-table-column>
<el-table-column label="value1" prop="value1">
</el-table-column>
<el-table-column label="voltage" prop="voltage">
</el-table-column> </el-table-column>
<!-- <el-table-column label="传感器编号" prop="columnKey">-->
<!-- </el-table-column>-->
<!-- <el-table-column label="alias" prop="alias">-->
<!-- </el-table-column>-->
<!-- <el-table-column label="rssi" prop="rssi">-->
<!-- </el-table-column>-->
<!-- <el-table-column label="ts" prop="ts">-->
<!-- </el-table-column>-->
<!-- <el-table-column label="value1" prop="value1">-->
<!-- </el-table-column>-->
<!-- <el-table-column label="voltage" prop="voltage">-->
<!-- </el-table-column>-->
</el-table> </el-table>
<el-pagination :total="1000" background layout="prev, pager, next"> <el-pagination :currentPage="currentPage" :pageSize="5" :total="total" background layout="prev, pager, next" @current-change="currentChange">
</el-pagination> </el-pagination>
</div> </div>
</div> </div>
@ -114,15 +114,30 @@ export default {
return { return {
topData: {}, topData: {},
bottomData: [], bottomData: [],
collapseNo:'1',
radio: '日统计报表', radio: '日统计报表',
tableData: [], tableData: [],
sceneId:0 sceneId:0,
deviceId:0,
deviceModeId:0,
total:0,
currentPage:1,
deviceDataColumns:[],
show:false
} }
}, },
async mounted() { async mounted() {
if(this.$route.query.id){
this.deviceId = this.$route.query.id
this.deviceModeId = this.$route.query.deviceModeId
}
await this.getData() await this.getData()
}, },
methods: { methods: {
async currentChange(e){
this.currentPage = e
await this.setHistoryData()
},
async getData() { async getData() {
await this.setDeviceInfo() await this.setDeviceInfo()
await this.setLinkDevices() await this.setLinkDevices()
@ -136,26 +151,28 @@ export default {
} }
}, },
async setDeviceInfo() { async setDeviceInfo() {
const {data} = await getDeviceInfo(this.$store.getters.sceneId) const {data} = await getDeviceInfo(this.deviceId)
this.topData = data || {} this.topData = data || {}
}, },
async setHistoryData() { async setHistoryData() {
this.show = false
const {data} = await getHistoryData({ const {data} = await getHistoryData({
"sceneId":this.$store.getters.sceneId, "sceneId":this.$store.getters.sceneId,
"deviceId": 2, "deviceId": this.deviceId,
"offset": 0, deviceModeId:this.deviceModeId,
"limit": 5, "offset": this.currentPage -1,
"startTime": 1266666666666 "limit": 1,
"startTime": 0
}) })
this.tableData = (data?.historyData?.rows || []).map((e, i) => { this.tableData = data.historyData.dataList
return { this.total = data.historyData.count
...e, this.deviceDataColumns = data.deviceDataColumns
...data.deviceDataColumns[i] this.$nextTick(()=>{
} this.show = true
}) })
}, },
async setLinkDevices() { async setLinkDevices() {
const {data} = await getLinkDevices(this.$store.getters.sceneId) const {data} = await getLinkDevices(this.deviceId)
this.bottomData = data this.bottomData = data
} }
} }
@ -261,9 +278,9 @@ export default {
background-size: 100% 100%; background-size: 100% 100%;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 10vh; left: 6.2vh;
width: 2.6vh; width: 10.6vh;
height: 3.3vh; height: 10.3vh;
transform: translateY(-50%); transform: translateY(-50%);
} }

Loading…
Cancel
Save