修复国标配置的bug

zhangzengfei

2022-07-20 4a800a8fc83c6bd1f86a8e847b079a51a7532c09

 src/components/subComponents/SystemInfo.vue

@@ -1,22 +1,22 @@
<template>
  <div :class="showClass">
    <div class="card-box" :style="`width:${borderWidth}`">
    <div class="card-box" :style="`width:${borderWidth};min-width:456px`">
      <ul>
        <li style="max-width:30px;" v-if="ShowLocalVedio">
        <li style="max-width: 30px" v-if="ShowLocalVedio">
          <div class="total-box">
            <div style="width:100%;margin-top:28px;">
            <div style="width: 100%; margin-top: 28px">
              <div class="top-text">
                <em>{{"总算力"}}</em>
                <em>{{ "总算力" }}</em>
              </div>
              <div class="mid-text">
                <em>{{` ${PollData.channelTotal}`}}</em>
                <em>{{ ` ${PollData.channelTotal}` }}</em>
              </div>
            </div>
          </div>
        </li>
        <li style="max-width:120px" v-if="showRealPoll">
        <li style="max-width: 120px" v-if="showRealPoll">
          <DataStackCard
            style="width:95%"
            style="width: 95%"
            title="实时算力"
            fourTip="故障导致未处理"
            fourIcon="iconicon-test21"
@@ -27,12 +27,15 @@
            :NoDeal="`${PollData.RealTimeNoDeal}路`"
          />
        </li>
        <li style="max-width:120px" v-if="showRealPoll">
        <li
          style="max-width: 120px"
          v-if="showRealPoll && isShowPolling === 'show'"
        >
          <DataStackCard
            title="轮询算力"
            fourTip="等待轮询处理"
            fourIcon="iconicon-test2"
            style="width:95%"
            style="width: 95%"
            :total="`${PollData.PollValidCount}路`"
            :ValidCount="`${PollData.PollSum}路`"
            :InValidCount="`${PollData.PollInvalid}路`"
@@ -40,7 +43,7 @@
            :NoDeal="`${PollData.PollNoDeal}路`"
          />
        </li>
        <li style="max-width:120px" v-if="ShowLocalVedio">
        <li style="max-width: 120px" v-if="ShowLocalVedio">
          <!-- <local-vedio-card
            title="本地算力"
            style="width:95%"
@@ -49,8 +52,9 @@
            :warning="`${PollData.PollInvalid}路`"
          />-->
          <DataStackCard
            v-if="isShowPolling === 'show'"
            title="数据栈算力"
            style="width:95%"
            style="width: 95%"
            fourTip="未知原因导致未处理"
            fourIcon="iconicon-test5"
            :total="`${PollData.stackChannelCount}路`"
@@ -75,15 +79,18 @@
        </li> 
      </ul>
    </div>-->
    <div class="eCharts-box" v-if="PollData.barCharts.length>0">
      <eChartsBar ref="cpuMeneryCharts" :xAxisData="PollData.barCharts"></eChartsBar>
    <div class="eCharts-box" v-if="PollData.barCharts.length > 0">
      <eChartsBar
        ref="cpuMeneryCharts"
        :xAxisData="PollData.barCharts"
      ></eChartsBar>
    </div>
  </div>
</template>

<script>
import DataStackCard from "@/components/subComponents/DataStackCard"
import eChartsBar from '@/components/subComponents/eChartsBar'
import DataStackCard from "@/components/subComponents/DataStackCard";
import eChartsBar from "@/components/subComponents/eChartsBar";

export default {
  name: "SystemInfo",
@@ -91,43 +98,51 @@
    DataStackCard,
    eChartsBar,
  },
  data() {
    return {
      isShowPolling: sessionStorage.getItem("isShowPolling"),
    };
  },
  props: {
    showTask: {
      type: Boolean,
      default: false
      default: false,
    },
    showClass: {
      type: String,
      default: 'sysinfo-box flex-box'
      default: "sysinfo-box flex-box",
    },
    ShowLocalVedio: {
      type: Boolean,
      default: false
      default: false,
    },
    showRealPoll: {
      type: Boolean,
      default: true
      default: true,
    },
    marginTop: {
      type: String,
      default: 'ma'
      default: "ma",
    },
    borderWidth: {
      type: String,
      default: '70%'
      default: "64%",
    },
    liquidWidth: {
      type: String,
      default: '30%'
    }
      default: "30%",
    },
  },
  methods: {
    initCpuCharts() {
      this.$forceUpdate();
    }
  }
  
}
    },
  },
  mounted() {
    console.log(this.PollData);
    // console.log('PollData.RealTimeValidCount',this.PollData.RealTimeValidCount)
  },
};
</script>
<style lang="scss">
.sysinfo-box {
@@ -174,22 +189,23 @@
        font-weight: 700;
      }
    }
    ul{
    ul {
      padding-left: 0;
    }
  }
  .eCharts-box {
    width: 28%;
    float: right;
    width: 46%;
    float: left;
    box-sizing: border-box;
    height: 100%;
    margin-left: 5px;
    @media screen and (min-width: 1280px) and (max-width: 1440px) {
      width: 35%;
    }
    @media screen and (max-width: 1279px) {
      width: 30%;
    }
    padding-left: 10px;
    //margin-left: 10px;
    // @media screen and (min-width: 1280px) and (max-width: 1440px) {
    //   width: 35%;
    // }
    // @media screen and (max-width: 1279px) {
    //   width: 30%;
    // }
  }
  .chart-box {
    float: left;