liu_li
/
yxk-storeroom-system
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

3D库房 温湿度感应器数值的显示

master
z_yu 3 years ago
parent
4a09e5c984
commit
11b09e9564
3 changed files with 150 additions and 38 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      src/views/storeManage/warehouse3D/archivesStorage/index.vue
  2. 86
      src/views/storeManage/warehouse3D/collateRoom/index.vue
  3. 96
      src/views/storeManage/warehouse3D/readRoom/index.vue

6
src/views/storeManage/warehouse3D/archivesStorage/index.vue
View File

@ -162,14 +162,14 @@ export default {
window.getIframeLoading = this.getIframeLoading // 把vue实例中的方法引用给window对象
this.allDisplayConfigData = await displayConfigApi.list({ storeroomId: this.roomId })
this.allDisplayConfigData.forEach(element => {
if (element.isDisplay && element.bindState) {
if (element.isDisplay && element.bindState && element.deviceInfo && (element.divPosition.includes('OAO') || element.divPosition.includes('TOP'))) {
this.allDeviceIds.push(element.deviceInfo.deviceId)
if (!this.url) {
this.url = 'http://' + element.deviceInfo.deviceIp + ':' + element.deviceInfo.devicePort
}
}
})
this.displayConfigData = this.allDisplayConfigData.filter((item) => { return item.isDisplay && item.bindState })
this.displayConfigData = this.allDisplayConfigData.filter((item) => { return item.isDisplay && item.bindState && item.deviceInfo && (item.divPosition.includes('OAO') || item.divPosition.includes('TOP')) })
await this.getRealTimeData()
},
mounted() {
@ -184,7 +184,7 @@ export default {
this.timer = setInterval(async() => {
await _this.getRealTimeData()
_this.handleAQI()
}, 4000)
}, 10000)
},
beforeDestroy() {
clearInterval(this.timer)

86
src/views/storeManage/warehouse3D/collateRoom/index.vue
View File

@ -19,16 +19,33 @@
<script>
import WarehouseWarning from '@/views/components/WarehouseWarning'
import displayConfigApi from '@/api/storeManage/displayConfig'
import thirdApi from '@/api/thirdApi'
export default {
name: 'CollateRoom',
components: { WarehouseWarning },
data() {
return {
roomId: 'D5C48B49DF66183CF24974'
roomId: 'D5C48B49DF66183CF24974',
allDeviceIds: [],
oaoMessage: [],
allDisplayConfigData: [],
displayConfigData: []
}
},
created() {
async created() {
window.getIframeLoading = this.getIframeLoading // 把vue实例中的方法引用给window对象
this.allDisplayConfigData = await displayConfigApi.list({ storeroomId: this.roomId })
this.allDisplayConfigData.forEach(element => {
if (element.isDisplay && element.bindState && element.deviceInfo && element.divPosition.includes('OAO')) {
this.allDeviceIds.push(element.deviceInfo.deviceId)
if (!this.url) {
this.url = 'http://' + element.deviceInfo.deviceIp + ':' + element.deviceInfo.devicePort
}
}
})
this.displayConfigData = this.allDisplayConfigData.filter((item) => { return item.isDisplay && item.bindState && item.deviceInfo && item.divPosition.includes('OAO') })
await this.getRealTimeData()
},
mounted() {
const _this = this
@ -38,31 +55,78 @@ export default {
_this.deviceState()
}
// window.addEventListener('message', this.handleMessageDevice)
// 定时请求第三方数据，更新页面数据
this.timer = setInterval(async() => {
await _this.getRealTimeData()
_this.handleAQI()
}, 10000)
},
beforeDestroy() {
clearInterval(this.timer)
},
methods: {
// 加载完成状态传值
getIframeLoading(value) {
// console.log(`我是iframe传过来的参数：${value}`)
if (value === 'false') {
this.handleHide('ZLS_MO_OAO_001')
console.log(this.allDisplayConfigData)
this.allDisplayConfigData.forEach(element => {
if ((!element.isDisplay || !element.bindState) && element.divPosition.includes('OAO')) {
this.handleHide(element.divPosition)
}
})
// this.handleAlarm('DAK_MO_OAO_003')
this.deviceState()
}
},
// 传入设备状态data / 给iframe传初始值
deviceState(e) {
this.iframeWin.postMessage({
data: [
{
id: 'ZLS_MO_OAO_001',
wendu: 6,
sidu: 10,
alarmState: false
}
]
data: this.oaoMessage
}, '*')
},
// 设置是否显示
handleHide(deviceId) {
window.frames['iframeMap'].setYangGanCanshow(deviceId, false)
},
// 设置温湿度
handleAQI(deviceId, wendu, sidu) {
this.oaoMessage.forEach(element => {
window.frames['iframeMap'].setAlertValue(element.id, element.wendu, element.sidu)
})
},
getRealTimeData() {
if (this.allDeviceIds.length > 0) {
thirdApi.getRealTimeData({ ids: this.allDeviceIds, url: this.url }).then((data) => {
this.oaoMessage.splice(0, this.oaoMessage.length)
console.log(this.displayConfigData)
this.displayConfigData.forEach(element => {
if (element.divPosition.includes('OAO') && element.deviceSpecParams[0]) {
// 获取3D弹窗显示的数据
const wenduParamId = element.deviceSpecParams.find((item) => { return item.paramName === '温度' })?.paramId
const siduParamId = element.deviceSpecParams.find((item) => { return item.paramName === '湿度' })?.paramId
let wendu = {}
let sidu = {}
if (wenduParamId) {
wendu = data.find((item) => {
return item.property_id === wenduParamId && item.device_id === element.deviceInfo.deviceId
})
}
if (siduParamId) {
sidu = data.find((item) => {
return item.property_id === siduParamId && item.device_id === element.deviceInfo.deviceId
})
}
this.oaoMessage.push({
id: element.divPosition,
wendu: (wendu?.curvalue) ? (Math.round(wendu?.curvalue)) : '-',
sidu: (sidu?.curvalue) ? (Math.round(sidu?.curvalue)) : '-',
alarmState: (wendu && wendu.curstatus === '1') || (sidu && sidu.curstatus === '1')
})
}
})
})
}
}
// 点击查看设备状况
// handleMessageDevice(event) {

96
src/views/storeManage/warehouse3D/readRoom/index.vue
View File

@ -13,30 +13,49 @@
<script>
import WarehouseWarning from '@/views/components/WarehouseWarning'
import displayConfigApi from '@/api/storeManage/displayConfig'
import thirdApi from '@/api/thirdApi'
export default {
name: 'ReadRoom',
components: { WarehouseWarning },
data() {
return {
tableData: [],
roomId: '9E0A527462BB8A060EB165',
allDeviceIds: [],
oaoMessage: [],
allDisplayConfigData: [],
displayConfigData: []
}
},
created() {
async created() {
window.getIframeLoading = this.getIframeLoading // 把vue实例中的方法引用给window对象
displayConfigApi.list({ storeroomId: this.roomId }).then((data) => {
this.displayConfigData = data
this.allDisplayConfigData = await displayConfigApi.list({ storeroomId: this.roomId })
this.allDisplayConfigData.forEach(element => {
if (element.isDisplay && element.bindState && element.deviceInfo && element.divPosition.includes('OAO')) {
this.allDeviceIds.push(element.deviceInfo.deviceId)
if (!this.url) {
this.url = 'http://' + element.deviceInfo.deviceIp + ':' + element.deviceInfo.devicePort
}
}
})
this.displayConfigData = this.allDisplayConfigData.filter((item) => { return item.isDisplay && item.bindState && item.deviceInfo && item.divPosition.includes('OAO') })
await this.getRealTimeData()
},
mounted() {
// const _this = this
const _this = this
this.iframeWin = this.$refs.myIframe.contentWindow
// inframe 加载完成之后
// document.getElementById('myIframe').onload = function() {
// _this.deviceState()
// }
document.getElementById('myIframe').onload = function() {
_this.deviceState()
}
// window.addEventListener('message', this.handleMessageDevice)
// 定时请求第三方数据，更新页面数据
this.timer = setInterval(async() => {
await _this.getRealTimeData()
_this.handleAQI()
}, 10000)
},
beforeDestroy() {
clearInterval(this.timer)
},
methods: {
// 加载完成状态传值
@ -47,34 +66,63 @@ export default {
// }
// this.deviceState()
if (value === 'false') {
console.log(this.displayConfigData)
this.displayConfigData.forEach(element => {
if (element.divPosition.includes('OAO')) {
if (element.isDisplay) {
console.log(element.divPosition)
} else {
this.handleHide(element.divPosition)
}
console.log(this.allDisplayConfigData)
this.allDisplayConfigData.forEach(element => {
if ((!element.isDisplay || !element.bindState) && element.divPosition.includes('OAO')) {
this.handleHide(element.divPosition)
}
})
this.deviceState()
}
},
// 传入设备状态data / 给iframe传初始值
deviceState(e) {
this.iframeWin.postMessage({
data: [
{
id: 'YLS_MO_OAO_001',
wendu: 3,
sidu: 6,
alarmState: false
}
]
data: this.oaoMessage
}, '*')
},
// 设置是否显示
handleHide(deviceId) {
window.frames['iframeMap'].setYangGanCanshow(deviceId, false)
},
// 设置温湿度
handleAQI(deviceId, wendu, sidu) {
this.oaoMessage.forEach(element => {
window.frames['iframeMap'].setAlertValue(element.id, element.wendu, element.sidu)
})
},
getRealTimeData() {
if (this.allDeviceIds.length > 0) {
thirdApi.getRealTimeData({ ids: this.allDeviceIds, url: this.url }).then((data) => {
this.oaoMessage.splice(0, this.oaoMessage.length)
console.log(this.displayConfigData)
this.displayConfigData.forEach(element => {
if (element.divPosition.includes('OAO') && element.deviceSpecParams[0]) {
// 获取3D弹窗显示的数据
const wenduParamId = element.deviceSpecParams.find((item) => { return item.paramName === '温度' })?.paramId
const siduParamId = element.deviceSpecParams.find((item) => { return item.paramName === '湿度' })?.paramId
let wendu = {}
let sidu = {}
if (wenduParamId) {
wendu = data.find((item) => {
return item.property_id === wenduParamId && item.device_id === element.deviceInfo.deviceId
})
}
if (siduParamId) {
sidu = data.find((item) => {
return item.property_id === siduParamId && item.device_id === element.deviceInfo.deviceId
})
}
this.oaoMessage.push({
id: element.divPosition,
wendu: (wendu?.curvalue) ? (Math.round(wendu?.curvalue)) : '-',
sidu: (sidu?.curvalue) ? (Math.round(sidu?.curvalue)) : '-',
alarmState: (wendu && wendu.curstatus === '1') || (sidu && sidu.curstatus === '1')
})
}
})
})
}
}
// 点击查看设备状况
// handleMessageDevice(event) {

Write Preview
Loading…
Cancel
Save