fix: 移动ROI方框时容易误操作的问题，及ROI ITEM刷选时鼠标悬浮的异常

src/views/spectrumAnalysis/components/BetaGammaSpectrum.vue

@@ -30,7 +30,7 @@
       <!-- 2D图表结束 -->
       <!-- 图表上面的四边形 -->
       <div
-        class="boundary-list"
+        :class="['boundary-list', currBoundaryItem ? 'is-moving' : '']"
         :style="{
           left: boundaryContainerPosition.left + 'px',
           top: boundaryContainerPosition.top + 'px',
@@ -51,8 +51,8 @@
             borderColor: boundaryItem.borderColor,
           }"
         >
-          <div class="boundary-item-left" @mousedown="handleBorderMouseDown(boundaryItem, 'left', index)"></div>
+          <div :class="['boundary-item-left']" @mousedown="handleBorderMouseDown(boundaryItem, 'left', index)"></div>
-          <div class="boundary-item-right" @mousedown="handleBorderMouseDown(boundaryItem, 'right', index)"></div>
+          <div :class="['boundary-item-right']" @mousedown="handleBorderMouseDown(boundaryItem, 'right', index)"></div>
         </div>
       </div>
       <!-- 图表上面的四边形结束 -->
@@ -149,7 +149,7 @@ const twoDOption = {
       show: false,
     },
     min: 0,
-    max: 4096,
+    max: 2300,
     interval: 512,
   },
   series: {
@@ -262,6 +262,7 @@ export default {
       boundaryList: [], // 最终生成的框
       boundaryContainerPosition: {},
       isLog: true, // 当前右侧的图表是否是log
+      currBoundaryItem: null, // 当前正在操作的方框
     }
   },
   created() {
@@ -287,7 +288,7 @@ export default {
       } = this.twoDOption
 
       //点大小
-      this.twoDOption.series.symbolSize = 5
+      this.twoDOption.series.symbolSize = 2
       this.twoDOption.series.data = this.histogramDataList
         .filter(({ b, g, c }) => c && b >= minX && b <= maxX && g >= minY && g <= maxY)
         .map(({ b, g, c }) => this.buildScatterItem(b, g, c))
@@ -301,9 +302,9 @@ export default {
     },
 
     setVisialMapParams() {
-      const counts = this.histogramDataList.map(({ c }) => c)
+      const counts = this.histogramDataList.filter(({ c }) => c).map(({ c }) => c)
       if (counts.length) {
-        this.twoDOption.visualMap.max = Math.max(...counts)
+        this.twoDOption.visualMap.max = counts.sort((a, b) => b - a)[0]
       } else {
         this.twoDOption.visualMap.max = 0
       }
@@ -350,7 +351,7 @@ export default {
 
     setVisualMapHeight() {
       const chartContainerRef = this.$refs.chartContainerRef
-      this.twoDOption.visualMap.itemHeight = chartContainerRef.offsetHeight - 75
+      this.twoDOption.visualMap.itemHeight = chartContainerRef.offsetHeight - 40
     },
 
     handleChartResize() {
@@ -397,7 +398,7 @@ export default {
 
     // 鼠标按下时开启可刷选状态
     handleMouseDown() {
-      if (this.boundaryItem) {
+      if (this.currBoundaryItem) {
         return
       }
 
@@ -472,56 +473,56 @@ export default {
     // 矩形周边点击
     handleBorderMouseDown(boundaryItem, direction, index) {
       this.boundaryRight = boundaryItem.left + boundaryItem.width
-      this.boundaryItem = boundaryItem
+      this.currBoundaryItem = boundaryItem
       this.boundaryIndex = index
       this.direction = direction
     },
 
     // 矩形周边移动
     handleBorderMouseMove({ movementX }) {
-      if (!this.boundaryItem) {
+      if (!this.currBoundaryItem) {
         return
       }
 
-      const prevLeft = this.boundaryItem.left
+      const prevLeft = this.currBoundaryItem.left
       // 移动的形式是在左侧移动，则改变left定位
       if (this.direction == 'left') {
         const nextLeft = prevLeft + movementX
-        const nextWidth = this.boundaryItem.width - movementX
+        const nextWidth = this.currBoundaryItem.width - movementX
         // 如果移动到的位置将要超过右边线
         if (nextLeft >= this.boundaryRight) {
-          this.boundaryItem.left = this.boundaryRight
+          this.currBoundaryItem.left = this.boundaryRight
-          this.boundaryItem.width = nextLeft - this.boundaryRight
+          this.currBoundaryItem.width = nextLeft - this.boundaryRight
           this.direction = 'right'
         } else {
-          this.boundaryItem.left = nextLeft
+          this.currBoundaryItem.left = nextLeft
-          this.boundaryItem.width = nextWidth
+          this.currBoundaryItem.width = nextWidth
           this.direction = 'left'
         }
       }
       // 移动的形式是在右侧移动，则改变宽度
       else {
-        const nextWidth = this.boundaryItem.width + movementX
+        const nextWidth = this.currBoundaryItem.width + movementX
         // 如果移动到的位置将要超过左边线
         if (nextWidth <= 0) {
           this.direction = 'left'
-          this.boundaryItem.left = prevLeft + nextWidth
+          this.currBoundaryItem.left = prevLeft + nextWidth
-          this.boundaryItem.width = -nextWidth
+          this.currBoundaryItem.width = -nextWidth
         } else {
-          this.boundaryItem.width = nextWidth
+          this.currBoundaryItem.width = nextWidth
           this.direction = 'right'
         }
       }
 
-      this.boundaryRight = this.boundaryItem.left + this.boundaryItem.width
+      this.boundaryRight = this.currBoundaryItem.left + this.currBoundaryItem.width
     },
 
     // 鼠标离开图表
     handleBorderMouseLeave() {
       // 如果是改变矩形范围的情况
-      if (this.boundaryItem) {
+      if (this.currBoundaryItem) {
         // 物理坐标转换回坐标系坐标
-        const { left, width } = this.boundaryItem
+        const { left, width } = this.currBoundaryItem
         const realLeft = left + this.boundaryContainerPosition.left
 
         const chart = this.$refs.chartTwoDRef.getChartInstance()
@@ -534,7 +535,7 @@ export default {
           start: parseInt(start.toFixed()),
           end: parseInt(end.toFixed()),
         })
-        this.boundaryItem = null
+        this.currBoundaryItem = null
       }
     },
   },
@@ -587,6 +588,12 @@ export default {
     position: absolute;
     overflow: hidden;
     pointer-events: none;
+    user-select: none;
+
+    &.is-moving {
+      pointer-events: all;
+      cursor: w-resize;
+    }
   }
 
   .boundary-item {

src/views/spectrumAnalysis/components/RoiLimits/components/RoiLimitItem.vue

@@ -42,10 +42,9 @@ import { buildLineSeries, findSeriesByName, getAxisMax, rangeNumber } from '@/ut
 const option = {
   grid: {
     top: 10,
-    left: 20,
+    left: 60,
     right: 20,
     bottom: 25,
-    containLabel: true,
   },
   tooltip: {
     show: true,
@@ -194,7 +193,7 @@ export default {
       this.axisInfo = {
         channel: Math.round(xAxis),
         count: this.channelData.all ? this.channelData.all.pointlist[channel].y : count,
-        energy: this.energys[channel].toFixed(3),
+        energy: (this.energys[channel] || 0).toFixed(3),
       }
     },