jiangping
2025-02-18 754f0eea0b16985a4dc8e8448e1bde7a8aec6f26
screen/src/views/EnergyConsum.vue
@@ -85,9 +85,9 @@
                    src="@/assets/images/ic_up.webp" alt="" />
                  <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
                  <span class="val"
                    v-if="data1.electricityQuantity.totalNum && data1.electricityQuantity.totalNum != 0">{{
                    v-if="data1.electricityQuantity.sameNum && data1.electricityQuantity.sameNum != 0">{{
                      Math.abs(((data1.electricityQuantity.totalNum -
                        data1.electricityQuantity.sameNum) / data1.electricityQuantity.totalNum * 100).toFixed(1))
                        data1.electricityQuantity.sameNum) / data1.electricityQuantity.sameNum * 100).toFixed(1))
                    }}%</span>
                  <span class="val" v-else style="margin-left: 4px;"> -</span>
                  <span class="lab">环比</span>
@@ -95,9 +95,9 @@
                    src="@/assets/images/ic_up.webp" alt="" />
                  <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
                  <span class="val"
                    v-if="data1.electricityQuantity.totalNum && data1.electricityQuantity.totalNum != 0">{{
                    v-if="data1.electricityQuantity.ringNum && data1.electricityQuantity.ringNum != 0">{{
                      Math.abs(((data1.electricityQuantity.totalNum -
                        data1.electricityQuantity.ringNum) / data1.electricityQuantity.totalNum * 100).toFixed(1))
                        data1.electricityQuantity.ringNum) / data1.electricityQuantity.ringNum * 100).toFixed(1))
                    }}%</span>
                  <span class="val" v-else style="margin-left: 4px;"> -</span>
                </div>
@@ -146,8 +146,8 @@
                  <img v-if="data1.gasQuantity.totalNum > data1.gasQuantity.sameNum" class="icon"
                    src="@/assets/images/ic_up.webp" alt="" />
                  <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
                  <span class="val" v-if="data1.gasQuantity.totalNum && data1.gasQuantity.totalNum != 0">{{
                    Math.abs(((data1.gasQuantity.totalNum - data1.gasQuantity.sameNum) / data1.gasQuantity.totalNum
                  <span class="val" v-if="data1.gasQuantity.sameNum && data1.gasQuantity.sameNum != 0">{{
                    Math.abs(((data1.gasQuantity.totalNum - data1.gasQuantity.sameNum) / data1.gasQuantity.sameNum
                      * 100).toFixed(1))
                  }}%</span>
                  <span class="val" v-else style="margin-left: 4px;">-</span>
@@ -155,8 +155,8 @@
                  <img v-if="data1.gasQuantity.totalNum > data1.gasQuantity.ringNum" class="icon"
                    src="@/assets/images/ic_up.webp" alt="" />
                  <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
                  <span class="val" v-if="data1.gasQuantity.totalNum && data1.gasQuantity.totalNum != 0">{{
                    Math.abs(((data1.gasQuantity.totalNum - data1.gasQuantity.ringNum) / data1.gasQuantity.totalNum
                  <span class="val" v-if="data1.gasQuantity.ringNum && data1.gasQuantity.ringNum != 0">{{
                    Math.abs(((data1.gasQuantity.totalNum - data1.gasQuantity.ringNum) / data1.gasQuantity.ringNum
                      * 100).toFixed(1))
                  }}%</span>
                  <span class="val" v-else style="margin-left: 4px;">-</span>
@@ -346,11 +346,25 @@
      },
      data: data5.value.map(i => dayjs(i.timeData).format('M'))
    },
    // tooltip: {
    //   trigger: 'axis',
    //   axisPointer: {
    //     type: 'line'
    //   },
    // },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'line'
      },
      formatter: function (params) {
        // 遍历悬浮时的所有点,定制化显示内容
        let result = `<div>
          <div style="width: 120px">${params[0].name}月</div>
          <div style="display: flex;align-items: center;;margin-top: 2px;">
            <div style="display: flex;align-items: center;"><div style="width: 10px;height: 10px; border-radius: 50%;background-color: #f6d047;margin-right: 6px;"></div></div>
            <div><strong>${params[0].value} L</strong></div>
          </div>
        </div>`
        return result
      }
    },
    yAxis: {
      type: 'value',
@@ -634,9 +648,17 @@
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'line'
      },
      formatter: function (params) {
        // 遍历悬浮时的所有点,定制化显示内容
        let result = `<div>
          <div style="width: 120px">${params[0].name}月</div>
          <div style="display: flex;align-items: center;;margin-top: 2px;">
            <div style="display: flex;align-items: center;"><div style="width: 10px;height: 10px; border-radius: 50%;background-color: #61a1c4;margin-right: 6px;"></div></div>
            <div><strong>${params[0].value} </strong></div>
          </div>
        </div>`
        return result
      }
    },
    xAxis: {
      type: 'category',