U 修改最大值 最小值标示颜色

he wei

2024-11-13 9862e1be04889c584540abdd3eeb80e1a2d9807b

 src/views/test/jhyRtInfo.vue

@@ -1,5 +1,5 @@
<script setup>
import { ref, computed, watch, onMounted } from "vue";
import { ref, computed, watch, onMounted, nextTick } from "vue";
import ycCard from "@/components/ycCard.vue";
import jhyInfo from "./jhyInfo.vue";
import useWebSocket from "@/hooks/useWebSocket.js";
@@ -7,6 +7,11 @@
import iconPower from "@/components/icons/iconPower.vue";
import formatSeconds from "@/assets/js/tools/formatSeconds.js";
import IconDot from "@/components/icons/IconDot.vue";

import toFixed from "@/assets/js/tools/toFixed.js";
import const_digits from "@/assets/js/const/const_digits";
const { VOL, GROUPVOL, CURR_YT, CURR_JH } = const_digits;

const infoTab = ref(0);
const { sendData, message } = useWebSocket("rtstateSocket");

@@ -18,7 +23,7 @@
  onlyOneGroup: {
    type: Boolean,
    default: false,
  }
  },
});

const headers = [
@@ -51,7 +56,7 @@

const battVolChart = ref();

const groupCount = computed(() => props.onlyOneGroup ? 1 : 2);
const groupCount = computed(() => (props.onlyOneGroup ? 1 : 2));

const rtDatas = computed(() => {
  if (message.value) {
@@ -69,12 +74,16 @@
      devStates = [{}, {}];
    }

    monStates0.forEach(v => {
      v.monState = v.needTest==0 ? '--' : v.monState;
    monStates0.forEach((v) => {
      v.monState = v.needTest == 0 ? "--" : v.monState;
      v.monVol = toFixed(v.monVol, VOL);
      v.monCurr = toFixed(v.monCurr, CURR_JH);
    });

    monStates1.forEach(v => {
      v.monState = v.needTest==0 ? '--' : v.monState;
    monStates1.forEach((v) => {
      v.monState = v.needTest == 0 ? "--" : v.monState;
      v.monVol = toFixed(v.monVol, VOL);
      v.monCurr = toFixed(v.monCurr, CURR_JH);
    });

    return { monStates0, monStates1, devStates, eventList };
@@ -109,7 +118,6 @@
    if (reg.test(v)) {
      sendData(JSON.stringify({ devId: props.devId, devType: 2 }));
    }

  },
  { immediate: true }
);
@@ -117,6 +125,18 @@
watch(message, (val) => {
  changeTab();
});

watch(
  () => props.onlyOneGroup,
  (val) => {
    nextTick(() => {
      if (battVolChart.value) {
        battVolChart.value[0].resize();
        battVolChart.value[1]?.resize();
      }
    });
  }
);

function changeTab() {
  if (infoTab.value == 2) {
@@ -147,7 +167,12 @@
}

onMounted(() => {
  // sendData(JSON.stringify({ devId: props.devId, devType: 1 }));
  // console.log('devId,' , props.devId, 'onMounted', '=============');

  let reg = /^2/;
  if (reg.test(props.devId)) {
    sendData(JSON.stringify({ devId: props.devId, devType: 2 }));
  }
});
</script>

@@ -173,12 +198,14 @@
            class="group"
            :datas="rtDatas.devStates[0]"
            :rtdata="rtDatas.monStates0"
            :idx="0"
          ></jhy-info>
          <jhy-info
            class="group"
            v-if="!onlyOneGroup"
            :datas="rtDatas.devStates[1]"
            :rtdata="rtDatas.monStates1"
            :idx="1"
          ></jhy-info>
        </div>
        <!-- 单体列表 -->
@@ -224,7 +251,8 @@
              ]"
            >
              <div class="index">
                #{{ rtDatas.devStates[idx].batteryStorageIndex + 1 }}
                <!-- #{{ rtDatas.devStates[idx].batteryStorageIndex + 1 }} -->
                #{{ i }}
              </div>
              <div class="state">
                <el-icon class="ico"><icon-dot /></el-icon>
@@ -263,15 +291,15 @@
            <div class="chart-info">
              <div class="label">最大值</div>
              <div class="value max">
                {{ rtDatas["devStates"][idx].maxBatteryVoltage }}V
                {{ toFixed(rtDatas["devStates"][idx].maxBatteryVoltage, VOL) }}V
              </div>
              <div class="label">最小值</div>
              <div class="value min">
                {{ rtDatas["devStates"][idx].minBatteryVoltage }}V
                {{ toFixed(rtDatas["devStates"][idx].minBatteryVoltage, VOL) }}V
              </div>
              <div class="label">平均值</div>
              <div class="value">
                {{ rtDatas["devStates"][idx].avgMonVol }}V
                {{ toFixed(rtDatas["devStates"][idx].avgMonVol, VOL) }}V
              </div>
            </div>
            <div class="chart-wrap1">
@@ -385,10 +413,10 @@
        text-align: center;
        background: #02a7f0;
        &.max {
          background: #d9001b;
          background: #438D29;
        }
        &.min {
          background: #f59a23;
          background: #DBD608;
        }
      }
    }
@@ -422,10 +450,10 @@
        text-align: center;
        background: #02a7f0;
        &.max {
          background: #d9001b;
          background: #438D29;
        }
        &.min {
          background: #f59a23;
          background: #DBD608;
        }
      }
    }
@@ -457,10 +485,10 @@
            padding: 2px 10px;
            border-radius: 6px;
            &.max {
              background: #d9001b;
              background: #438D29;
            }
            &.min {
              background: #f59a23;
              background: #DBD608;
            }
          }
        }