quanyawei
2024-02-01 d515dcda54bde1e779df761c23205427a72b18a4
fix:断线监控
2 files modified
19 ■■■■■ changed files
src/views/onlineRate/detailBox.vue 15 ●●●●● patch | view | raw | blame | history
src/views/onlineRate/index.vue 4 ●●●● patch | view | raw | blame | history
src/views/onlineRate/detailBox.vue
@@ -101,7 +101,8 @@
              label-class-name="itemSpan"
            >
              <template slot-scope="scope">
                <span>{{ scope.row.mun }}</span>{{ time }}
                <span v-if="scope.row.mun!=='-'">{{ scope.row.mun }}{{ time }}</span>
                <span v-else>-</span>
              </template>
            </el-table-column>
          </el-table>
@@ -198,7 +199,6 @@
  },
  computed: {
    onlineRate () {
      console.log('///', ((this.macOnlineDetailData.pieChart2) / this.sum))
      return (this.macOnlineDetailData.pieChart2 / this.sum) * 100 || 0
    }
  },
@@ -211,7 +211,6 @@
        this.type = 'hour'
        this.lineType = 'hour'
      } else if (newValue === '分钟') {
        this.lineType = 'hour'
        this.type = 'minute'
      }
    }
@@ -311,12 +310,12 @@
          echarts.dispose(dom)
          var myChart = echarts.init(dom)
          let starTiem = params.data[0]
          console.log('starTiem', dayjs(starTiem).format('YYYY.MM.DD  HH:mm:ss'))
          let endTiem = dayjs(starTiem).add(1, 'hour')
          let data = dayjs(starTiem).add(1, 'hour')
          let endTiem = dayjs(data).isAfter(dayjs()) ? dayjs() : data
          console.log('.isAfter(now)', dayjs(endTiem).isAfter(dayjs()))
          this.getLineData(dayjs(starTiem).format('YYYY-MM-DD  HH:mm:ss'), dayjs(endTiem).format('YYYY-MM-DD  HH:mm:ss'), 'minute')
          myChart.setOption(option, true)
        }
        console.log('this.lineType', this.lineType)
      })
    },
    renderBack () {
@@ -361,7 +360,6 @@
        tooltip: {
          trigger: 'item',
          formatter: function (params) {
            console.log(params)
            var value = params.data[0]
            let tip = params.value[1] === 1 ? '在线: ' + value : '离线: ' + value
            return tip
@@ -394,7 +392,7 @@
            height: 20, // 时间滚动条的高度
            type: 'slider', // type的作用是指定数据缩放的类型,slider表示使用滑动条进行缩放,inside表示使用鼠标滚轮进行缩放。
            xAxisIndex: 0, // 作用在x轴的下标(因为x轴可以有多个)
            filterMode: 'filter', // 间滚动条的过滤模式,'filter'表示滑动时间条时会直接过滤掉不在时间范围内的数据,'weakFilter'表示滑动时间条时会逐渐过滤掉不在时间范围内的数据。
            filterMode: 'weakFilter', // 间滚动条的过滤模式,'filter'表示滑动时间条时会直接过滤掉不在时间范围内的数据,'weakFilter'表示滑动时间条时会逐渐过滤掉不在时间范围内的数据。
            start: 0, // 默认开始位置(百分比)
            end: 100, // 默认结束位置(百分比)
          },
@@ -434,7 +432,6 @@
          this.sData = data.map((item, index) => {
            return [ this.xData[index], item ]
          })
          console.log(this.sData)
          this.$nextTick(() => {
            this.renderLine()
          })
src/views/onlineRate/index.vue
@@ -69,7 +69,7 @@
      </el-form>
    </div>
    <div>
      <p>实时在线率:共<span class="greenClor">{{ tableData.length }}</span>台,在线<span class="greenClor">{{ onlineData }}</span>台,在线率 <span :class=" onlineRate<90 ?'redClor':'greenClor'">{{ onlineRate }}%</span></p>
      <p>实时在线率:共<span class="greenClor">{{ tableData.length }}</span>台,在线<span class="greenClor">{{ onlineData }}</span>台,在线率 <span :class=" onlineRate<90 ?'redClor':'greenClor'">{{ onlineRate.toFixed(2) }}%</span></p>
      <div>
        <el-table
          v-loading="loading"
@@ -259,7 +259,7 @@
      return this.tableData.filter(item => item.state !== '0').length || 0
    },
    onlineRate () {
      return Math.floor((this.onlineData / this.tableData.length) * 100) || 0
      return (this.onlineData / this.tableData.length) * 100 || 0
    }
  },
  watch: {