Xxxu
2020-07-07 4f953ffc89fc95f83b152e914c5e65938b440f17
src/views/modules/led/led-controller/weather-upload.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,139 @@
<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>