feat: 增加beta下右下角的放大镜功能，修改左侧图表上层叠方框的颜色

src/views/spectrumAnalysis/beta-gamma-analysis.vue

@@ -102,7 +102,7 @@
           <div class="result-display">
             <beta-gamma-chart-container>
               <template slot="title"> Result display </template>
-              <result-display :data="resultDisplay" @sendFlag="handleGetFlag"></result-display>
+              <result-display :data="resultDisplay" @sendFlag="handleGetFlag" @zoom="handleZoom"></result-display>
             </beta-gamma-chart-container>
           </div>
           <!-- 结果显示结束 -->
@@ -506,6 +506,53 @@ export default {
         }
       })
     },
+
+    // 右下角放大镜
+    handleZoom(nuclideName) {
+      let ROI_nums = []
+      switch (nuclideName) {
+        case 'Xe131m':
+          ROI_nums = [5]
+          break
+        case 'Xe133m':
+          ROI_nums = [6]
+          break
+        case 'Xe133':
+          ROI_nums = [3, 4]
+          break
+        case 'Xe135':
+          ROI_nums = [2]
+          break
+      }
+
+      if (this.boundaryList.length) {
+        let left = 0,
+          right = 0,
+          top = 0,
+          bottom = 0
+        for (let i = 0; i < ROI_nums.length; ++i) {
+          const ROI_line = this.boundaryList[ROI_nums[i]]
+          left = Math.min(left, ROI_line.minX)
+          right = Math.max(right, ROI_line.maxX)
+          top = Math.max(top, ROI_line.maxY)
+          bottom = Math.min(bottom, ROI_line.minY)
+        }
+
+        const minX = left - 10,
+              maxX = right + 10,
+              minY = bottom - 10,
+              maxY = top + 10
+
+        this.$refs.betaGammaChartRef.setRange(minX, maxX, 'x')
+        this.$refs.betaGammaChartRef.setRange(minY, maxY, 'y')
+
+        this.$refs.lineChart1Ref.setRange(minY, maxY)
+        this.$refs.lineChart2Ref.setRange(minY, maxY)
+
+        this.$refs.lineChart3Ref.setRange(minX, maxX)
+        this.$refs.lineChart4Ref.setRange(minX, maxX)
+      }
+    },
   },
   watch: {
     sample: {
@@ -527,6 +574,7 @@ export default {
             this.getSampleDetail_file()
           }
         }
+        this.$refs.betaGammaChartRef.handleUnzoom()
       },
       immediate: true,
       deep: true,

src/views/spectrumAnalysis/components/BetaGammaSpectrumChart.vue

@@ -48,6 +48,7 @@ import ColorPalette from './ColorPalette.vue'
 import { getXAxisAndYAxisByPosition, rangeNumber } from '@/utils/chartHelper.js'
 
 const buttons = ['2D', '3D Surface', '3D Scatter']
+const rectColorList = ['#99CA53', '#F6A625', '#6D5FD5', '#BF593E', '#1F9DDB']
 
 // 2D 配置
 const twoDOption = {
@@ -133,7 +134,7 @@ const twoDOption = {
   },
   series: {
     type: 'scatterGL',
-    symbolSize: 5,
+    symbolSize: 4,
     data: [],
     itemStyle: {
       color: '#fff'
@@ -757,8 +758,8 @@ export default {
     // 2D 图表 上的 矩形
     boundary: {
       handler(newVal) {
-        newVal.forEach(item => {
-          item.color = this.getRandomColor()
+        newVal.forEach((item, index) => {
+          item.color = rectColorList[index%5]
         })
         this.boundaryData = newVal
         this.reDrawRect()

src/views/spectrumAnalysis/components/ResultDisplay.vue

@@ -17,8 +17,8 @@
           {{ text }}
         </div>
       </template>
-      <template slot="operator">
-        <div class="search"></div>
+      <template slot="operator" slot-scope="text, record">
+        <div class="search" @click="handleSearch(record.nuclideName)"></div>
       </template>
     </a-table>
     <a-table :data-source="source2" rowKey="id" :columns="columns" :pagination="false">
@@ -38,8 +38,8 @@
           {{ text }}
         </div>
       </template>
-      <template slot="operator">
-        <div class="search"></div>
+      <template slot="operator" slot-scope="text, record">
+        <div class="search" @click="handleSearch(record.nuclideName)"></div>
       </template>
     </a-table>
   </div>
@@ -112,6 +112,10 @@ export default {
     handleCheckboxChange(e, obj) {
       this.$emit('sendFlag', e.target.checked, obj)
     },
+
+    handleSearch(nuclideName) {
+      this.$emit('zoom', nuclideName)
+    },
   },
   watch: {
     data: {