修改设备和传感器

dev
夜笙歌 1 year ago
parent e8441ac890
commit ec355bf39a

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

@ -37,34 +37,36 @@
:header-cell-style="{ textAlign: 'center',backgroundColor:'#0a457d' }"
:max-height="maxHeight">
style="width: 100%">
<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 v-for="i in deviceDataColumns" :label="i.columnName" :prop="i.columnKey">
</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">
<template slot-scope="scope">
<el-button
@ -76,7 +78,7 @@
</el-table>
</div>
<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>
</div>
</div>
@ -105,27 +107,32 @@ export default {
tableData: [],
deviceList:[],
sceneId: 0,
offset:0,
offset:1,
limit:10,
total:0
total:0,
deviceDataColumns:[],
}
},
async mounted() {
this.maxHeight = this.$refs.right.clientHeight - this.$refs.search.clientHeight - this.$refs.pagination.clientHeight - 12
this.tableShow = true
await this.getData()
},
methods: {
async currentChange(){
await this.getRightData()
},
async getRightData(e){
this.loading = true
await this.setSelectLatestDataByDeviceMode({
"sceneId": this.$store.getters.sceneId,
"deviceModeId": e.deviceModeId,
"startTime": 0,
"offset": this.offset,
"offset": this.offset-1,
"limit": 10
})
this.loading = false
this.tableShow = false
this.tableShow = true
},
async getData() {
await this.setDeviceModesBySceneId()
@ -139,6 +146,7 @@ export default {
},
async setSelectLatestDataByDeviceMode(e){
const {data} = await selectLatestDataByDeviceMode(e)
this.deviceDataColumns = data.deviceDataColumns
this.tableData = data.latestData || []
this.total=data.total
},

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

Loading…
Cancel
Save