quanyawei
2024-02-04 7beb37c5170f93a33c059c72fac3233b82865481
src/views/deviceDetail/index.vue
@@ -38,7 +38,10 @@
            :key="i"
            style="flex: 1; display: flex"
          >
            <span style="width: 33%; font-size: 0.9rem" @click="chuan(val)">{{
            <span
              style="width: 33%; font-size: 0.9rem"
              @click="chuan(val)"
            >{{
              val.sensorCode | sensorFilter
            }}</span>
            <span
@@ -75,7 +78,10 @@
            "
          >
            <div style="position: relative">
              <img style="width: 5.5rem; height: 5.5rem" :src="compassBg">
              <img
                style="width: 5.5rem; height: 5.5rem"
                :src="compassBg"
              >
              <img
                style="
                  font-size: 2rem;
@@ -111,7 +117,9 @@
              justify-content: center;
            "
          >
            <div style="font-size: 0.9rem">空气质量指数(小时平均)</div>
            <div style="font-size: 0.9rem">
              空气质量指数(小时平均)
            </div>
            <div style="font-size: 1.5rem; margin-top: 7px">
              {{ aqi }}<span style="font-size: 0.8rem">(AQI)</span>
            </div>
@@ -119,11 +127,15 @@
        </div>
      </el-main>
    </el-aside>
    <el-container class="border-left border-right" style="margin: 0 10px">
    <el-container
      class="border-left border-right"
      style="margin: 0 10px"
    >
      <el-header
        class="title0"
        style="text-align: center; display: unset !important; margin-top: 10px"
      ><h1
      >
        <h1
        style="
            text-align: center;
            text-align: center;
@@ -134,7 +146,8 @@
        @click="websocketData()"
      >
        {{ deviceName ? deviceName : '停机' }}
      </h1></el-header>
        </h1>
      </el-header>
      <el-main
        style="
          padding-left: 0;
@@ -211,8 +224,15 @@
            </div>
          </div>
        </div>
        <div class="border-top" style="display: flex; height: 50%">
          <div ref="main" class="middle1" style="flex: 1; padding-top: 2rem" />
        <div
          class="border-top"
          style="display: flex; height: 50%"
        >
          <div
            ref="main"
            class="middle1"
            style="flex: 1; padding-top: 2rem"
          />
          <!-- <line-chart :chart-data="lineChartData" /> -->
          <div
            class="border-left middle2"
@@ -223,9 +243,13 @@
              margin-left: 10px;
            "
          >
            <h3 style="font-size: 0.9rem">本月平均值</h3>
            <h3 style="font-size: 0.9rem">
              本月平均值
            </h3>
            <div>
              <div style="font-size: 0.9rem">{{ chartSensorName }}</div>
              <div style="font-size: 0.9rem">
                {{ chartSensorName }}
              </div>
              <div
                style="padding: 8px 0 0; font-size: 2.3rem; font-weight: bold"
              >
@@ -265,17 +289,30 @@
        >
          <div style="height: 100%; display: flex; flex-direction: column">
            <div style="height: 30%">
              <h3 v-if="macLat" style="text-align: center; font-size: 0.9rem">
              <h3
                v-if="macLat"
                style="text-align: center; font-size: 0.9rem"
              >
                <span>坐标:</span> {{ macLat }}, {{ macLng }}
              </h3>
              <h3 style="font-size: 0.9rem">实时监测超标预警</h3>
              <h3 style="font-size: 0.9rem">
                实时监测超标预警
              </h3>
            </div>
            <div style="height: 70%">
              <!--              padding-top: 4%-->
              <img :src="url1" alt="" style="width: 70%">
              <img
                :src="url1"
                alt=""
                style="width: 70%"
              >
            </div>
            <div>
              <img style="width: 75%" :src="url2" alt="">
              <img
                style="width: 75%"
                :src="url2"
                alt=""
              >
            </div>
          </div>
        </div>
@@ -284,7 +321,9 @@
          class="right1"
          style="height: 40%; display: flex; flex-direction: column"
        >
          <h3 style="text-align: center; font-size: 0.9rem">设备列表</h3>
          <h3 style="text-align: center; font-size: 0.9rem">
            设备列表
          </h3>
          <ul
            class="listUl"
            style="
@@ -310,7 +349,9 @@
          class="right1"
          style="height: 40%; display: flex; flex-direction: column"
        >
          <h3 style="text-align: center; font-size: 0.9rem">标准值</h3>
          <h3 style="text-align: center; font-size: 0.9rem">
            标准值
          </h3>
          <ul
            class="listUl"
            style="
@@ -336,7 +377,7 @@
<script>
// 这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
// 例如:import《组件名称》from'《组件路径》';
import { WWindUtil } from '@/components/Wind/WRatingArr.js'
import json from '@/assets/json/sensor.json'
import * as echarts from 'echarts'
// import { parse } from 'path-to-regexp'
@@ -752,20 +793,8 @@
          that.windDeg = windDirs
          if (windDirs === 0) {
            that.windDir = '北风'
          } else if (windDirs > 0 && windDirs < 90) {
            that.windDir = '东北风'
          } else if (windDirs === 90) {
            that.windDir = '东风'
          } else if (windDirs > 90 && windDirs < 180) {
            that.windDir = '东南风'
          } else if (windDirs === 180) {
            that.windDir = '南风'
          } else if (windDirs > 180 && windDirs < 270) {
            that.windDir = '西南风'
          } else if (windDirs === 270) {
            that.windDir = '西风'
          } else if (windDirs > 270 && windDirs < 360) {
            that.windDir = '西北风'
          } else {
            that.windDir = WWindUtil.windValueFormat(windDirs)
          }
        }
        that.alarmColour = {}