邓洁 : 传感器接口对接
This commit is contained in:
@@ -39,13 +39,13 @@ watch(() => props.airData, (now) => {
|
|||||||
getAirInfo(now.sensorList)
|
getAirInfo(now.sensorList)
|
||||||
}, {deep: true});
|
}, {deep: true});
|
||||||
|
|
||||||
const changeData = (item, flag) => {
|
const changeData = (item) => {
|
||||||
return {
|
return {
|
||||||
equipmentId: item.equipmentId,
|
equipmentId: item.equipmentId,
|
||||||
icon: changeIcon(item.equipmentType),
|
icon: changeIcon(item.equipmentType),
|
||||||
name: item.equipmentName.slice(0, 2),
|
name: item.equipmentName.slice(0, 2),
|
||||||
max: 120,
|
max: 120,
|
||||||
value: flag ? flag.value : item.value,
|
value: item.value,
|
||||||
point: item.valueThreshold,
|
point: item.valueThreshold,
|
||||||
unit: item.unit
|
unit: item.unit
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -2,70 +2,52 @@
|
|||||||
<div id="bad-gas-info">
|
<div id="bad-gas-info">
|
||||||
<div class="title">有害气体</div>
|
<div class="title">有害气体</div>
|
||||||
<div class="info-list">
|
<div class="info-list">
|
||||||
<gas-info-item :gasInfo="gasInfo" />
|
<gas-info-item v-for="item in badGasList" :gasInfo="item" />
|
||||||
<gas-info-item :gasInfo="gasInfo2" />
|
|
||||||
<gas-info-item :gasInfo="gasInfo3" />
|
|
||||||
<gas-info-item :gasInfo="gasInfo4" />
|
|
||||||
<gas-info-item :gasInfo="gasInfo5" />
|
|
||||||
<gas-info-item :gasInfo="gasInfo6" />
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { reactive } from "vue";
|
|
||||||
import GasInfoItem from "./childComps/GasInfoItem.vue";
|
import GasInfoItem from "./childComps/GasInfoItem.vue";
|
||||||
const gasInfo = reactive({
|
|
||||||
name: "一氧化硫", //气体名称
|
|
||||||
max: 100, //最大值
|
|
||||||
value: 60, //传感器值
|
|
||||||
point: 50, //阈值
|
|
||||||
});
|
|
||||||
const gasInfo2 = reactive({
|
|
||||||
name: "一氧化氮", //气体名称
|
|
||||||
max: 100, //最大值
|
|
||||||
value: 40, //传感器值
|
|
||||||
point: 10, //阈值
|
|
||||||
});
|
|
||||||
const gasInfo3 = reactive({
|
|
||||||
name: "一氧化碳", //气体名称
|
|
||||||
max: 100, //最大值
|
|
||||||
value: 15, //传感器值
|
|
||||||
point: 70, //阈值
|
|
||||||
});
|
|
||||||
const gasInfo4 = reactive({
|
|
||||||
name: "二氧化碳", //气体名称
|
|
||||||
max: 100, //最大值
|
|
||||||
value: 25, //传感器值
|
|
||||||
point: 40, //阈值
|
|
||||||
});
|
|
||||||
const gasInfo5 = reactive({
|
|
||||||
name: "硫化氢", //气体名称
|
|
||||||
max: 100, //最大值
|
|
||||||
value: 30, //传感器值
|
|
||||||
point: 20, //阈值
|
|
||||||
});
|
|
||||||
const gasInfo6 = reactive({
|
|
||||||
name: "二氧化硫", //气体名称
|
|
||||||
max: 100, //最大值
|
|
||||||
value: 20, //传感器值
|
|
||||||
point: 20, //阈值
|
|
||||||
});
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
list: Array
|
list: Array,
|
||||||
|
badGasData:Array
|
||||||
});
|
});
|
||||||
|
const badGasList=ref([])
|
||||||
watch(() => props.list, (now, old) => {
|
watch(() => props.list, (now, old) => {
|
||||||
console.log('传感器 ', now, old)
|
badGasList.value.forEach(item=>{
|
||||||
// wpList.value=now
|
now.forEach(newItem=>{
|
||||||
|
if(item.equipmentId === newItem.equipmentId){
|
||||||
|
item.value = newItem.value
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
}, {deep: true});
|
}, {deep: true});
|
||||||
// setInterval(() => {
|
|
||||||
// gasInfo.value = parseInt(Math.random() * 10) * 10;
|
watch(() => props.badGasData, (now) => {
|
||||||
// gasInfo2.value = parseInt(Math.random() * 10) * 10;
|
getBadGasInfo(now.sensorList)
|
||||||
// gasInfo3.value = parseInt(Math.random() * 10) * 10;
|
}, {deep: true});
|
||||||
// gasInfo4.value = parseInt(Math.random() * 10) * 10;
|
const getBadGasInfo = (now) => {
|
||||||
// gasInfo6.value = parseInt(Math.random() * 10) * 10;
|
let windPressureObj = {}
|
||||||
// gasInfo5.value = parseInt(Math.random() * 10) * 10;
|
let windPressureArr = []
|
||||||
// }, 2000);
|
now.map(item => {
|
||||||
|
if (item.equipmentType === "carbonDioxide" || item.equipmentType === "carbonMonoxide" || item.equipmentType === "hydrogenSulfide" || item.equipmentType === "sulfurDioxide"|| item.equipmentType === "sulfurMonoxide"|| item.equipmentType === "nitrogenDioxide") {
|
||||||
|
windPressureObj = changeData(item)
|
||||||
|
windPressureArr.push(windPressureObj)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
badGasList.value = windPressureArr
|
||||||
|
}
|
||||||
|
const changeData = (item) => {
|
||||||
|
return {
|
||||||
|
equipmentId: item.equipmentId,
|
||||||
|
name: item.equipmentName.slice(0, item.equipmentName.length-2),
|
||||||
|
max: 120,
|
||||||
|
value: item.value,
|
||||||
|
point: item.valueThreshold,
|
||||||
|
unit: item.unit
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@@ -3,7 +3,6 @@
|
|||||||
<div class="point" ref="point">
|
<div class="point" ref="point">
|
||||||
<div class="info" ref="container"></div>
|
<div class="info" ref="container"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="name">{{ gasInfo.name }}</div>
|
<div class="name">{{ gasInfo.name }}</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -37,9 +37,9 @@
|
|||||||
:close-on-click-modal="false"
|
:close-on-click-modal="false"
|
||||||
:close-on-press-escape="false"
|
:close-on-press-escape="false"
|
||||||
>
|
>
|
||||||
<wind-pressure-list v-if="showFan" :list="socketData.windPressure" :winData="largeScreenData"/>
|
<wind-pressure-list v-if="showFan" :list="socketData.windPressure" :win-data="largeScreenData"/>
|
||||||
<air-info v-if="showFan" :list="socketData.sensor" :airData="largeScreenData"/>
|
<air-info v-if="showFan" :list="socketData.sensor" :air-data="largeScreenData"/>
|
||||||
<bad-gas-info v-if="showFan" :list="socketData.sensor"/>
|
<bad-gas-info v-if="showFan" :list="socketData.sensor" :bad-gas-data="largeScreenData"/>
|
||||||
</el-drawer>
|
</el-drawer>
|
||||||
<div v-if="drawerRight" class="right-arrow" @click="closeRight"></div>
|
<div v-if="drawerRight" class="right-arrow" @click="closeRight"></div>
|
||||||
<div v-else class="shrink-right" @click="closeRight"></div>
|
<div v-else class="shrink-right" @click="closeRight"></div>
|
||||||
|
|||||||
Reference in New Issue
Block a user