| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <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> |