riku
2024-08-23 1788c96aea9247cc36ef8b82734997f1a6a92fb4
src/components/monitor/WeatherData.vue
@@ -2,10 +2,10 @@
  <el-row class="wrap">
    <el-form :inline="true" class="form">
      <el-form-item label="温度:" class="w-tag">
        {{ temprature }}
        {{ temprature }}℃
      </el-form-item>
      <el-form-item label="湿度:" class="w-tag">
        {{ humidity }}
        {{ humidity }}%
      </el-form-item>
    </el-form>
    <!-- <div class="w-tag">{{ temprature }}</div>
@@ -14,10 +14,10 @@
  <el-row class="wrap">
    <el-form :inline="true" class="form">
      <el-form-item label="风向:" class="w-tag">
        {{ windDirection }}
        {{ _windDir }}
      </el-form-item>
      <el-form-item label="风速:" class="w-tag">
        {{ windSpeed }}
        {{ windSpeed }}m/s
      </el-form-item>
    </el-form>
    <!-- <div class="w-tag">{{ windDirection }}</div>
@@ -26,31 +26,48 @@
</template>
<script>
import { FactorDatas } from '@/model/FactorDatas';
import { windDir } from '@/constant/wind-dir';
export default {
  props: {
    loading: Boolean,
    factorDatas: FactorDatas
    factorDatas: FactorDatas,
    temprature: {
      type: String,
      default: '--'
    },
    humidity: {
      type: String,
      default: '--'
    },
    windDirection: {
      type: String,
      default: '--'
    },
    windSpeed: {
      type: String,
      default: '--'
    }
  },
  data() {
    return {
      temprature: '--℃',
      humidity: '--%',
      windDirection: '--',
      windSpeed: '--m/s'
    };
    return {};
  },
  watch: {
    factorDatas: {
      handler(nV) {
        this.temprature = this.lastOne(nV, '8') + '℃';
        this.humidity = this.lastOne(nV, '9') + '%';
        this.windDirection = this.lastOne(nV, '17');
        this.windSpeed = this.lastOne(nV, '16') + 'm/s';
        // this.temprature = this.lastOne(nV, '8') + '℃';
        // this.humidity = this.lastOne(nV, '9') + '%';
        // this.windDirection = this.lastOne(nV, '17');
        // this.windSpeed = this.lastOne(nV, '16') + 'm/s';
      },
      deep: true
    }
  },
  computed: {
    _windDir() {
      return windDir(this.windDirection);
    }
  },
  methods: {
    lastOne(factorDatas, key) {
      const f = factorDatas.factor[key];