<template>
|
<div style="padding: 20px">
|
<el-row>
|
<el-col :span="18">
|
<div class="weather-bound">
|
<p class="weather-show">{{ dataForm.city }}</p>
|
<p class="weather-show">温度：{{ dataForm.temperature }}℃</p>
|
<p class="weather-show">湿度：{{ dataForm.humidity }}%RH</p>
|
<p class="weather-show"> 亮度：{{ dataForm.brightness }}lux</p>
|
<p class="weather-show">风速：{{ dataForm.windSpeed }}m/s</p>
|
<p class="weather-show">CO2：{{ dataForm.eco2 }}ppm</p>
|
<p class="weather-show">甲醛：{{ dataForm.ech2o }}mg/m³</p>
|
<p class="weather-show">TVOC：{{ dataForm.tvoc }}mg/m³</p>
|
<p class="weather-show">PM25：{{ dataForm.pm25 }}mg/m³</p>
|
<p class="weather-show">PM10：{{ dataForm.pm10 }}mg/m³</p>
|
</div>
|
</el-col>
|
<el-col :span="6">
|
<div>
|
<button class="btn" @click="pushLED"></button>
|
</div>
|
</el-col>
|
</el-row>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
data () {
|
return {
|
dataForm: {
|
city: '',
|
temperature: 0,
|
humidity: 0,
|
pm25: 0,
|
brightness: 0,
|
pm10: 0,
|
ech2o: 0,
|
eco2: 0,
|
tvoc: 0,
|
windSpeed: 0
|
}
|
}
|
},
|
computed: {
|
lightemitStateId () {
|
return this.$store.state.led.lightemitId
|
}
|
},
|
watch: {
|
lightemitStateId (curVal, oldVal) {
|
this.getSensorInfo(curVal)
|
}
|
},
|
methods: {
|
getSensorInfo (lightemitId) {
|
this.$http({
|
url: this.$http.adornUrl(`/pole/polesensor/getInfoByLightemitId/${lightemitId}`),
|
method: 'get',
|
params: this.$http.adornParams()
|
}).then(({data}) => {
|
if (data && data.code === 0) {
|
this.dataForm.city = data.city.replace('市', '')
|
this.dataForm.temperature = data.sensor.temperature
|
this.dataForm.humidity = data.sensor.humidity
|
this.dataForm.pm25 = data.sensor.pm25
|
this.dataForm.brightness = data.sensor.brightness
|
this.dataForm.pm10 = data.sensor.pm10
|
this.dataForm.ech2o = data.sensor.ech2o
|
this.dataForm.eco2 = data.sensor.eco2
|
this.dataForm.tvoc = data.sensor.tvoc
|
this.dataForm.windSpeed = data.sensor.windSpeed
|
} else {
|
this.dataForm.city = ''
|
this.dataForm.temperature = 0
|
this.dataForm.humidity = 0
|
this.dataForm.pm25 = 0
|
this.dataForm.brightness = 0
|
this.dataForm.pm10 = 0
|
this.dataForm.ech2o = 0
|
this.dataForm.eco2 = 0
|
this.dataForm.tvoc = 0
|
this.dataForm.windSpeed = 0
|
this.$message.error(data.msg)
|
}
|
})
|
},
|
// 推送天气数据
|
pushLED () {
|
var ids = [this.lightemitStateId]
|
this.$http({
|
url: this.$http.adornUrl(`/pole/polelightemit/pushLED`),
|
method: 'post',
|
data: this.$http.adornData({
|
lightemitIds: ids
|
})
|
}).then(({data}) => {
|
if (data && data.code === 0) {
|
this.$message({
|
message: '操作成功',
|
type: 'success',
|
duration: 1500,
|
onClose: () => {
|
this.visible = false
|
this.$emit('refreshDataList')
|
}
|
})
|
} else {
|
this.$message.error(data.msg)
|
}
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.weather-bound {
|
height: 100%;
|
width: 60%;
|
}
|
.weather-show {
|
font-size: 1.2em;
|
line-height: 85%;
|
color: #fff;
|
}
|
.btn {
|
border-style: none;
|
width: 100px;
|
height: 35px;
|
background: url(~@/assets/img/btn-config.png);
|
background-repeat:no-repeat;
|
border-style: none;
|
background-size: 100%;
|
color: #fff;
|
font-size: 1.4em;
|
font-weight: 550;
|
};
|
</style>
|
