feat: Fit Peaks and Baseline接口对接及相关功能，Interactive Analyse Tools图表刷选、删除Peak、控制点的增加和删除、Energy的Insert功能

src/utils/chartHelper.js

@@ -94,3 +94,14 @@ export function buildLineSeries(name, data, color, extra = {}) {
 export function findSeriesByName(series, seriesName) {
     return series.find(item => item.name == seriesName)
 }
+
+/**
+ * 限定数字在一定范围
+ * @param {Number} min
+ * @param {Number} max
+ */
+export function rangeNumber(min, max) {
+  return num => {
+    return num > max ? max : num < min ? min : num
+  }
+}

src/utils/request.js

@@ -17,7 +17,7 @@ let apiBaseUrl = window._CONFIG['domianURL'] || "/jeecg-boot";
 const service = axios.create({
   //baseURL: '/jeecg-boot',
   baseURL: apiBaseUrl, // api base_url
-  timeout: 60 * 1000 // 请求超时时间
+  timeout: 2 * 60 * 1000 // 请求超时时间
 })
 
 const err = (error) => {

src/views/spectrumAnalysis/components/BetaGammaSpectrumChart.vue

@@ -45,7 +45,7 @@
 <script>
 import Custom3DChart from '@/components/Custom3DChart/index.vue'
 import ColorPalette from './ColorPalette.vue'
-import { getXAxisAndYAxisByPosition } from '@/utils/chartHelper.js'
+import { getXAxisAndYAxisByPosition, rangeNumber } from '@/utils/chartHelper.js'
 
 const buttons = ['2D', '3D Surface', '3D Scatter']
 
@@ -426,7 +426,7 @@ export default {
 
         const [x1, y2, x2, y1] = [...point1, ...point2] // 根据解析出的数据确定真实的范围
 
-        const rangeNumberFunc = this.rangeNumber(0, 256)
+        const rangeNumberFunc = rangeNumber(0, 256)
 
         this.twoDOption.xAxis.min = rangeNumberFunc(x1)
         this.twoDOption.xAxis.max = rangeNumberFunc(x2)
@@ -441,17 +441,6 @@ export default {
       this.clearBrush(chart)
     },
 
-    /**
-     * 限定数字在一定范围
-     * @param {Number} min
-     * @param {Number} max
-     */
-    rangeNumber(min, max) {
-      return num => {
-        return num > max ? max : num < min ? min : num
-      }
-    },
-
     // 通知上层范围改变
     emitRangeChange(range) {
       this.$emit('rangeChange', range)

src/views/spectrumAnalysis/components/Modals/AnalyzeInteractiveToolModal/components/FitPeaksAndBaselineModal.vue

@@ -1,7 +1,7 @@
 <template>
   <custom-modal centered v-model="visible" :width="1200" title="Fit Peaks and Baseline">
     <a-spin :spinning="isLoading">
-      <custom-table :columns="columns" :list="list">
+      <custom-table :columns="columns" :list="list" :canSelect="false">
         <template v-for="(slot, index) in slots" :slot="slot.slotName" slot-scope="{ record }">
           <a-checkbox v-if="slot.isCheckbox" :key="index" v-model="record[slot.dataIndex]">
             Fixed
@@ -9,18 +9,20 @@
           <a-input v-else :key="index" v-model="record[slot.dataIndex]" :readOnly="slot.isStatic"></a-input>
         </template>
       </custom-table>
-      <div slot="custom-footer">
-        <a-space>
-          <a-button type="primary" @click="handlePeaks">Peaks</a-button>
-          <a-button @click="visible = false">Cancel</a-button>
-        </a-space>
-      </div>
     </a-spin>
+    <div slot="custom-footer">
+      <a-space>
+        <a-button type="primary" :disabled="isCanceling || isLoading" :loading="isAcceptting" @click="handlePeaks">
+          Peaks
+        </a-button>
+        <a-button :disabled="isAcceptting || isLoading" :loading="isCanceling" @click="handleCancel">Cancel</a-button>
+      </a-space>
+    </div>
   </custom-modal>
 </template>
 
 <script>
-import { getAction } from '@/api/manage'
+import { getAction, postAction } from '@/api/manage'
 import ModalMixin from '@/mixins/ModalMixin'
 import SampleDataMixin from '@/views/spectrumAnalysis/SampleDataMixin'
 
@@ -121,12 +123,55 @@ export default {
   data() {
     this.columns = columns
     return {
-      list: []
+      list: [],
+      isAcceptting: false,
+      isCanceling: false
     }
   },
   methods: {
-    handlePeaks() {
+    // 接收
-      this.visible = false
+    async handlePeaks() {
+      try {
+        this.isAcceptting = true
+        const { inputFileName: fileName } = this.sampleData
+        const { success, result, message } = await postAction('/gamma/acceptResults', {
+          fileName,
+          accept: true
+        })
+        if (success) {
+          this.visible = false
+          this.$emit('result', result)
+        } else {
+          this.$message.error(message)
+        }
+      } catch (error) {
+        console.error(error)
+      } finally {
+        this.isAcceptting = false
+      }
+    },
+
+    // 取消
+    async handleCancel() {
+      try {
+        this.isCanceling = true
+        const { inputFileName: fileName } = this.sampleData
+        const { success, result, message } = await postAction('/gamma/acceptResults', {
+          fileName,
+          accept: false,
+          oldPeak: this.oldPeaks
+        })
+        if (success) {
+          this.visible = false
+          this.$emit('cancel', result)
+        } else {
+          this.$message.error(message)
+        }
+      } catch (error) {
+        console.error(error)
+      } finally {
+        this.isCanceling = false
+      }
     },
 
     async getData() {
@@ -138,13 +183,15 @@ export default {
           fileName: inputFileName,
           curChan: Math.ceil(this.curChan)
         })
-        if(success) {
+        if (success) {
-          result.forEach(item => {
+          const { oldPeaks, tablePeaksList } = result
+          tablePeaksList.forEach(item => {
             item.energy = Number(item.energy).toPrecision(6)
             item.netArea = Number(item.netArea).toPrecision(6)
             item.fwhm = Number(item.fwhm).toPrecision(6)
           })
-          this.list = result
+          this.list = tablePeaksList
+          this.oldPeaks = oldPeaks
         } else {
           this.$message.error(message)
         }

src/views/spectrumAnalysis/components/Modals/AnalyzeInteractiveToolModal/index.vue

@@ -4,7 +4,15 @@
       <div class="interactive-analysis-tools">
         <div class="interactive-analysis-tools-left">
           <div class="chart">
-            <CustomChart ref="chartRef" :option="option" :opts="opts" @zr:click="handleChartClick" />
+            <CustomChart
+              ref="chartRef"
+              :option="option"
+              :opts="opts"
+              @zr:mousedown="handleMouseDown"
+              @zr:mouseup="handleMouseUp"
+              @brushEnd="handleBrushEnd"
+              @zr:click="handleChartClick"
+            />
           </div>
           <!-- 缩略图 -->
           <div class="thumbnail">
@@ -94,7 +102,7 @@
             </div>
           </title-over-border>
           <div class="reset-btn-box">
-            <a-button type="primary">Reset Chart</a-button>
+            <a-button type="primary" @click="handleResetChart">Reset Chart</a-button>
           </div>
           <div class="identify-box">
             <title-over-border title="Nuclide Identify">
@@ -154,7 +162,12 @@
     <comment-modal v-model="commentModalVisible" :type="commentType" />
     <!-- Comment弹窗 结束 -->
     <!-- Fit Peaks and Baseline弹窗 开始 -->
-    <fit-peaks-and-base-line-modal v-model="fitPeaksAndBaselineModalVisible" :curChan="currChannel" />
+    <fit-peaks-and-base-line-modal
+      v-model="fitPeaksAndBaselineModalVisible"
+      :curChan="currChannel"
+      @result="handleInsertSuccess"
+      @cancel="handleCancelSuccess"
+    />
     <!-- Fit Peaks and Baseline弹窗 结束 -->
     <!-- Nuclide Review 弹窗开始 -->
     <nuclide-review-modal v-model="nuclideReviewModalVisible" :sampleId="sampleId" :channel="currChannel" />
@@ -172,7 +185,7 @@ import ModalMixin from '@/mixins/ModalMixin'
 import { getAction } from '@/api/manage'
 import { cloneDeep } from 'lodash'
 import Response from './Response.json'
-import { findSeriesByName, getXAxisAndYAxisByPosition } from '@/utils/chartHelper'
+import { findSeriesByName, getXAxisAndYAxisByPosition, rangeNumber } from '@/utils/chartHelper'
 import SampleDataMixin from '@/views/spectrumAnalysis/SampleDataMixin'
 
 // 初始配置
@@ -206,11 +219,7 @@ const initialOption = {
         width: 1
       }
     },
-    formatter: params => {
+    formatter: undefined,
-      const [channel] = params[0].value
-      return `<div class="channel">Channel: ${channel}</div>
-              <div class="energy">Energy: ${(0).toFixed(2)}</div>`
-    },
     className: 'figure-chart-option-tooltip'
   },
   xAxis: {
@@ -277,31 +286,46 @@ const columns = [
   {
     title: 'Energy (keV)',
     dataIndex: 'energy',
-    width: 120
+    width: 120,
+    customRender: text => {
+      return text.toFixed(3)
+    }
   },
   {
     title: 'Centroid (C)',
     dataIndex: 'peakCentroid',
-    width: 120
+    width: 120,
+    customRender: text => {
+      return text.toFixed(3)
+    }
   },
   {
     title: 'FWHM (keV)',
     dataIndex: 'fwhm',
-    width: 120
+    width: 120,
+    customRender: text => {
+      return text.toFixed(3)
+    }
   },
   {
     title: 'Area',
     dataIndex: 'area',
-    width: 120
+    width: 120,
+    customRender: text => {
+      return text.toFixed(3)
+    }
   },
   {
     title: 'Detectability',
-    dataIndex: 'detectability',
+    dataIndex: 'significance',
-    width: 120
+    width: 120,
+    customRender: text => {
+      return text.toFixed(3)
+    }
   },
   {
-    title: 'Cmnt',
+    title: '#Cmnt',
-    dataIndex: 'cmnt',
+    dataIndex: 'comments',
     width: 120
   },
   {
@@ -347,9 +371,10 @@ const thumbnailOption = {
     axisLabel: {
       show: false
     },
-    min: 1
+    min: 0.1,
+    max: 'dataMax'
   },
-  series: []
+  series: null
 }
 export default {
   mixins: [ModalMixin, SampleDataMixin],
@@ -368,6 +393,12 @@ export default {
       thumbnailOption: cloneDeep(thumbnailOption),
 
       isLoading: false,
+
+      channelBaseCPChart: [],
+      channelBaseLineChart: [],
+      channelCountChart: [],
+      channelPeakChart: [],
+      energy: [],
       list: [],
       sampleId: -1,
 
@@ -388,7 +419,17 @@ export default {
       },
 
       currChannel: undefined, // 当currChannel前选中的channel
-      selectedTableItem: undefined // 当前选中的表格项
+      selectedTableItem: undefined, // 当前选中的表格项
+
+      isModifying: false // 正在修改控制点
+    }
+  },
+  created() {
+    this.option.tooltip.formatter = params => {
+      const channel = parseInt(params[0].value[0])
+      const energy = this.energy[channel - 1]
+      return `<div class="channel">Channel: ${channel}</div>
+              <div class="energy">Energy: ${energy.toFixed(2)}</div>`
     }
   },
   methods: {
@@ -397,26 +438,30 @@ export default {
         this.isLoading = true
         this.option.series = []
 
-        const { success, result, message } = Response
+        // const { success, result, message } = Response
-        // const { success, result, message } = await getAction('/gamma/InteractiveTool', {
+        const { success, result, message } = await getAction('/gamma/InteractiveTool', {
-        //   sampleId: this.sampleId,
+          sampleId: this.sampleId,
-        //   fileName: this.fileName
+          fileName: this.fileName
-        // })
+        })
         if (success) {
+          this.isLoading = false
           const {
             barChart,
             channelBaseCPChart,
             channelBaseLineChart,
             channelCountChart,
             channelPeakChart,
+            energy,
             table
           } = result
-          this.isLoading = false
 
           console.log('%c [  ]-374', 'font-size:13px; background:pink; color:#bf2c9f;', result)
 
-          this.channelPeakChart = channelPeakChart
           this.channelBaseCPChart = channelBaseCPChart
+          this.channelBaseLineChart = channelBaseLineChart
+          this.channelCountChart = channelCountChart
+          this.channelPeakChart = channelPeakChart
+          this.energy = energy
 
           const series = []
 
@@ -484,15 +529,13 @@ export default {
             zlevel: 20
           })
 
-          this.thumbnailOption.series.push(
+          this.thumbnailOption.series = this.buildSeriesOption(
-            this.buildSeriesOption(
+            'BarChart',
-              'BarChart',
+            barChart.map(({ x, y }) => [x, y]),
-              barChart.map(({ x, y }) => [x, y]),
+            '#fff',
-              '#fff',
+            {
-              {
+              silent: true
-                silent: true
+            }
-              }
-            )
           )
 
           this.list = table
@@ -677,6 +720,185 @@ export default {
       this.fitPeaksAndBaselineModalVisible = true
     },
 
+    // 点击 Fit Peak XXX 弹窗中的 Peaks 按钮
+    handleInsertSuccess(result) {
+      const {
+        allData,
+        barChart,
+        channelBaseLineChart,
+        channelPeakChart,
+        shadowChannelChart,
+        shadowEnergyChart,
+        shapeChannelData,
+        shapeEnergyData,
+        table
+      } = result
+
+      this.$emit('refresh', {
+        allData,
+        channelPeakChart,
+        shadowChannelChart,
+        shadowEnergyChart,
+        shapeChannelData,
+        shapeEnergyData
+      })
+
+      this.channelPeakChart = channelPeakChart
+      this.channelBaseLineChart = channelBaseLineChart
+
+      const series = []
+
+      // 推入BaseLine
+      series.push({
+        ...this.buildSeriesOption(
+          'BaseLine',
+          channelBaseLineChart.pointlist.map(({ x, y }) => [x, y]),
+          `rgb(${channelBaseLineChart.color})`
+        ),
+        markLine: {
+          silent: true,
+          symbol: 'none',
+          label: {
+            show: false
+          },
+          lineStyle: {
+            color: 'red',
+            width: 1
+          },
+          data: [{ xAxis: -1 }]
+        },
+        zlevel: 10
+      })
+
+      // 推入旧的Count
+      series.push(
+        this.buildSeriesOption(
+          'CountChart',
+          this.channelCountChart.pointlist.map(({ x, y }) => [x, y]),
+          `rgb(${this.channelCountChart.color})`
+        )
+      )
+
+      // 推入Peak
+      const peakSeries = []
+      channelPeakChart.forEach((item, index) => {
+        peakSeries.push(
+          this.buildSeriesOption(
+            'Peak_' + (index + 1),
+            item.pointlist.map(({ x, y }) => [x, y]),
+            `rgb(${item.color})`
+          )
+        )
+      })
+
+      series.push(...peakSeries)
+
+      // 推入旧的基线控制点
+      series.push({
+        name: 'BaseLine_Ctrl_Point',
+        type: 'scatter',
+        data: this.channelBaseCPChart.map(({ size, color, point: { x, y } }) => {
+          return {
+            value: [x, y],
+            itemStyle: {
+              color: 'transparent',
+              borderColor: color,
+              borderWidth: size / 2
+            }
+          }
+        }),
+        silent: true,
+        animation: false,
+        zlevel: 20
+      })
+
+      this.thumbnailOption.series = this.buildSeriesOption(
+        'BarChart',
+        barChart.map(({ x, y }) => [x, y]),
+        '#fff',
+        {
+          silent: true
+        }
+      )
+
+      this.list = table
+      this.option.series = series
+    },
+
+    // 点击 Fit Peak XXX 弹窗中的 Cancel 按钮
+    handleCancelSuccess(result) {
+      const { channelPeakChart, table } = result
+      this.channelPeakChart = channelPeakChart
+      const series = []
+
+      // 推入旧的BaseLine
+      series.push({
+        ...this.buildSeriesOption(
+          'BaseLine',
+          this.channelBaseLineChart.pointlist.map(({ x, y }) => [x, y]),
+          `rgb(${this.channelBaseLineChart.color})`
+        ),
+        markLine: {
+          silent: true,
+          symbol: 'none',
+          label: {
+            show: false
+          },
+          lineStyle: {
+            color: 'red',
+            width: 1
+          },
+          data: [{ xAxis: -1 }]
+        },
+        zlevel: 10
+      })
+
+      // 推入旧的Count
+      series.push(
+        this.buildSeriesOption(
+          'CountChart',
+          this.channelCountChart.pointlist.map(({ x, y }) => [x, y]),
+          `rgb(${this.channelCountChart.color})`
+        )
+      )
+
+      // 推入Peak
+      const peakSeries = []
+      channelPeakChart.forEach((item, index) => {
+        peakSeries.push(
+          this.buildSeriesOption(
+            'Peak_' + (index + 1),
+            item.pointlist.map(({ x, y }) => [x, y]),
+            `rgb(${item.color})`
+          )
+        )
+      })
+
+      series.push(...peakSeries)
+
+      // 推入旧的基线控制点
+      series.push({
+        name: 'BaseLine_Ctrl_Point',
+        type: 'scatter',
+        data: this.channelBaseCPChart.map(({ size, color, point: { x, y } }) => {
+          return {
+            value: [x, y],
+            itemStyle: {
+              color: 'transparent',
+              borderColor: color,
+              borderWidth: size / 2
+            }
+          }
+        }),
+        silent: true,
+        animation: false,
+        zlevel: 20
+      })
+
+      this.list = table
+      this.option.series = series
+    },
+
     // 删除
     handleDel() {
       if (!this.selectedKeys.length) {
@@ -687,23 +909,124 @@ export default {
       this.$warning({
         title: 'Warning',
         content: 'Are you sure to delete this peak?',
-        onOk: () => {
+        onOk: async () => {
           const [willDelKey] = this.selectedKeys
           const findIndex = this.list.findIndex(item => item.index == willDelKey)
-          this.list.splice(findIndex, 1)
+          // this.list.splice(findIndex, 1)
-          this.selectedKeys = []
+          // this.selectedKeys = []
 
-          const seriesIndex = this.option.series.findIndex(item => {
+          // const seriesIndex = this.option.series.findIndex(item => {
-            return item.name == 'Peak_' + willDelKey
+          //   return item.name == 'Peak_' + willDelKey
-          })
+          // })
 
-          this.opts.notMerge = true
+          // this.opts.notMerge = true
-          this.option.series.splice(seriesIndex, 1)
+          // this.option.series.splice(seriesIndex, 1)
-          this.channelPeakChart.splice(findIndex, 1)
+          // this.channelPeakChart.splice(findIndex, 1)
 
-          this.$nextTick(() => {
+          // this.$nextTick(() => {
-            this.resetChartOpts()
+          //   this.resetChartOpts()
-          })
+          // })
+          try {
+            const { inputFileName: fileName } = this.sampleData
+            const { success, result, message } = await getAction('/gamma/deletePeak', {
+              fileName,
+              curRow: findIndex
+            })
+            if (success) {
+              console.log('%c [  ]-935', 'font-size:13px; background:pink; color:#bf2c9f;', result)
+              const {
+                allData,
+                channelPeakChart,
+                shadowChannelChart,
+                shadowEnergyChart,
+                shapeChannelData,
+                shapeEnergyData,
+                table
+              } = result
+
+              this.$emit('refresh', {
+                allData,
+                channelPeakChart,
+                shadowChannelChart,
+                shadowEnergyChart,
+                shapeChannelData,
+                shapeEnergyData
+              })
+
+              this.channelPeakChart = channelPeakChart
+              const series = []
+              // 推入旧的BaseLine
+              series.push({
+                ...this.buildSeriesOption(
+                  'BaseLine',
+                  this.channelBaseLineChart.pointlist.map(({ x, y }) => [x, y]),
+                  `rgb(${this.channelBaseLineChart.color})`
+                ),
+                markLine: {
+                  silent: true,
+                  symbol: 'none',
+                  label: {
+                    show: false
+                  },
+                  lineStyle: {
+                    color: 'red',
+                    width: 1
+                  },
+                  data: [{ xAxis: -1 }]
+                },
+                zlevel: 10
+              })
+
+              // 推入旧的Count
+              series.push(
+                this.buildSeriesOption(
+                  'CountChart',
+                  this.channelCountChart.pointlist.map(({ x, y }) => [x, y]),
+                  `rgb(${this.channelCountChart.color})`
+                )
+              )
+
+              // 推入Peak
+              const peakSeries = []
+              channelPeakChart.forEach((item, index) => {
+                peakSeries.push(
+                  this.buildSeriesOption(
+                    'Peak_' + (index + 1),
+                    item.pointlist.map(({ x, y }) => [x, y]),
+                    `rgb(${item.color})`
+                  )
+                )
+              })
+
+              series.push(...peakSeries)
+
+              // 推入旧的基线控制点
+              series.push({
+                name: 'BaseLine_Ctrl_Point',
+                type: 'scatter',
+                data: this.channelBaseCPChart.map(({ size, color, point: { x, y } }) => {
+                  return {
+                    value: [x, y],
+                    itemStyle: {
+                      color: 'transparent',
+                      borderColor: color,
+                      borderWidth: size / 2
+                    }
+                  }
+                }),
+                silent: true,
+                animation: false,
+                zlevel: 20
+              })
+
+              this.list = table
+              this.option.series = series
+            } else {
+              this.$message.error(message)
+            }
+          } catch (error) {
+            console.error(error)
+          }
         }
       })
     },
@@ -740,6 +1063,10 @@ export default {
 
     // 鼠标按下时开启可刷选状态
     handleMouseDown() {
+      if (this.isModifying) {
+        return
+      }
+
       const chart = this.$refs.chartRef.getChartInstance()
       chart.dispatchAction({
         type: 'takeGlobalCursor',
@@ -752,6 +1079,86 @@ export default {
       })
     },
 
+    handleMouseUp() {
+      setTimeout(() => {
+        const chart = this.$refs.chartRef.getChartInstance()
+        this.clearBrush(chart)
+      }, 0)
+    },
+
+    clearBrush(chart) {
+      // 清理刷选的范围
+      chart.dispatchAction({
+        type: 'brush',
+        areas: []
+      })
+
+      // 改为不可刷选状态
+      chart.dispatchAction({
+        type: 'takeGlobalCursor'
+      })
+    },
+
+    // 刷选完毕时
+    handleBrushEnd(param) {
+      const chart = this.$refs.chartRef.getChartInstance()
+      const areas = param.areas[0]
+      if (areas) {
+        const range = areas.range
+        const [[minX, maxX], [minY, maxY]] = range
+        const point1 = chart.convertFromPixel({ seriesIndex: 0 }, [minX, minY]).map(num => parseInt(num.toFixed()))
+        const point2 = chart.convertFromPixel({ seriesIndex: 0 }, [maxX, maxY]).map(num => parseInt(num.toFixed()))
+        const xAxisMax = chart.getModel().getComponent('xAxis').axis.scale._extent[1]
+        const yAxisMax = this.option.yAxis.max
+        let [x1, y2, x2, y1] = [...point1, ...point2] // 根据解析出的数据确定真实的范围
+        const xAxisLimit = rangeNumber(1, xAxisMax)
+        const yAxisLimit = rangeNumber(0.1, yAxisMax)
+        x1 = xAxisLimit(x1)
+        x2 = xAxisLimit(x2)
+        y1 = yAxisLimit(y1)
+        y2 = yAxisLimit(y2)
+        this.option.xAxis.min = x1
+        this.option.xAxis.max = x2
+        this.option.yAxis.min = y1
+        this.option.yAxis.max = y2
+
+        this.thumbnailOption.xAxis.min = x1
+        this.thumbnailOption.xAxis.max = x2
+        this.thumbnailOption.yAxis.min = y1
+        this.thumbnailOption.yAxis.max = y2
+
+        if (this.btnGroupType == 2) {
+          this.$nextTick(() => {
+            this.option.graphic = this._channelBaseCPChart.map(({ point: { x, y } }, dataIndex) => {
+              return this.buildGraphicPoint(chart, x, y, dataIndex)
+            })
+          })
+        }
+      }
+      this.clearBrush(chart)
+    },
+
+    handleResetChart() {
+      this.option.xAxis.min = 1
+      this.option.xAxis.max = 'dataMax'
+      this.option.yAxis.min = 0.1
+      this.option.yAxis.max = 'dataMax'
+
+      this.thumbnailOption.xAxis.min = 1
+      this.thumbnailOption.xAxis.max = 'dataMax'
+      this.thumbnailOption.yAxis.min = 0.1
+      this.thumbnailOption.yAxis.max = 'dataMax'
+
+      if (this.btnGroupType == 2) {
+        const chart = this.$refs.chartRef.getChartInstance()
+        this.$nextTick(() => {
+          this.option.graphic = this._channelBaseCPChart.map(({ point: { x, y } }, dataIndex) => {
+            return this.buildGraphicPoint(chart, x, y, dataIndex)
+          })
+        })
+      }
+    },
+
     // 切换操作
     handleSwitchOperation() {
       // 切换到Base Line 和 Control Point 操作
@@ -771,6 +1178,8 @@ export default {
         this.option.graphic = this.channelBaseCPChart.map(({ point: { x, y } }, dataIndex) => {
           return this.buildGraphicPoint(chart, x, y, dataIndex)
         })
+
+        this._channelBaseCPChart = cloneDeep(this.channelBaseCPChart)
       }
       // 切换回 Peak 操作
       else {
@@ -814,6 +1223,8 @@ export default {
           const baseLineEditSeries = findSeriesByName(this.option.series, 'BaseLine_Edit')
 
           baseLineEditSeries.data[parseInt(xAxis) - 1] = [x, yAxis]
+
+          this._channelBaseCPChart[dataIndex].point.y = yAxis
         },
         zlevel: 100
       }
@@ -826,6 +1237,7 @@ export default {
       this.option.graphic.forEach(item => {
         item.draggable = draggable
       })
+      this.isModifying = draggable
     },
 
     // 在当前选中的红线位置新增控制点
@@ -839,11 +1251,64 @@ export default {
       }
 
       const chart = this.$refs.chartRef.getChartInstance()
-      this.option.graphic.push(this.buildGraphicPoint(chart, this.currChannel, 10, this.option.graphic.length))
+
+      const controlPointList = this.option.graphic
+      const find = controlPointList.find(item => {
+        return item.position[0] == xPix
+      })
+      if (find) {
+        return
+      }
+
+      let i = 0 // 记录新控制点在列表中的位置
+      const [xPix] = chart.convertToPixel('grid', [this.currChannel, 0])
+      for (; i < controlPointList.length; ++i) {
+        const currCP = controlPointList[i].position[0]
+        if (currCP >= xPix) {
+          if (currCP == xPix) {
+            this.$message.warn(`The new control point in channel ${this.currChannel} exists, can't introduce twice`)
+            return
+          }
+          break
+        }
+      }
+
+      const baseLineEditSeries = findSeriesByName(this.option.series, 'BaseLine_Edit')
+
+      const yAxis = baseLineEditSeries.data[this.currChannel - 1][1]
+      this.option.graphic.splice(
+        i,
+        0,
+        this.buildGraphicPoint(chart, this.currChannel, yAxis, this.option.graphic.length)
+      )
+
+      this._channelBaseCPChart.splice(i, 0, { point: { x: this.currChannel, y: yAxis } })
     },
 
     // 移除控制点
-    handleRemoveCP() {},
+    handleRemoveCP() {
+      // find nearest control-point
+      const chart = this.$refs.chartRef.getChartInstance()
+      const controlPointList = this.option.graphic
+      let i = 1
+      for (; i < controlPointList.length; ++i) {
+        const [currX, currY] = controlPointList[i].position
+        const [currXAxis] = getXAxisAndYAxisByPosition(chart, currX, currY)
+        if (currXAxis >= this.currChannel) {
+          const [prevX, prevY] = controlPointList[i - 1].position
+          const [prevXAxis] = getXAxisAndYAxisByPosition(chart, prevX, prevY)
+          if (currXAxis - this.currChannel > this.currChannel - prevXAxis) --i
+          break
+        }
+      }
+
+      if (i == 0 || i >= controlPointList.length - 1) {
+        this.$message.warn("Can't remove first/last control point")
+        return
+      }
+
+      controlPointList.splice(i, 1)
+    },
 
     // 修改控制点
     handleModifyCP() {

src/views/spectrumAnalysis/components/Modals/AnalyzeSettingModal.vue

@@ -109,15 +109,11 @@
 import { getAction } from '@/api/manage'
 import TitleOverBorder from '../TitleOverBorder.vue'
 import ModalMixin from '@/mixins/ModalMixin'
+import SampleDataMixin from '../../SampleDataMixin'
 
 export default {
   components: { TitleOverBorder },
-  mixins: [ModalMixin],
+  mixins: [ModalMixin, SampleDataMixin],
-  props: {
-    sampleId: {
-      type: Number
-    }
-  },
   data() {
     return {
       isLoading: false,
@@ -128,8 +124,10 @@ export default {
     async getInfo() {
       try {
         this.isLoading = true
+        const { sampleId, inputFileName: fileName } = this.sampleData
         const { success, result, message } = await getAction('/gamma/configure', {
-          sampleId: this.sampleId
+          sampleId,
+          fileName
         })
         this.isLoading = false
         if (success) {

src/views/spectrumAnalysis/components/Modals/EnergyCalibrationModal.vue

@@ -22,10 +22,10 @@
                 }"
               >
                 <a-form-model-item label="Channel">
-                  <a-input v-model="model.channel"></a-input>
+                  <a-input type="number" v-model="model.channel"></a-input>
                 </a-form-model-item>
                 <a-form-model-item label="Energy">
-                  <a-input v-model="model.energy"></a-input>
+                  <a-input type="number" v-model="model.energy"></a-input>
                 </a-form-model-item>
                 <a-form-model-item :label="' '">
                   <a-button type="primary" @click="handleInsert">Insert</a-button>
@@ -78,7 +78,7 @@
               <div class="content">
                 <div
                   class="item"
-                  :class="item == currSelectedDataSource? 'active': ''"
+                  :class="item == currSelectedDataSource ? 'active' : ''"
                   v-for="(item, index) in dataSourceList"
                   :key="index"
                   @click="handleDataSourceClick(item)"
@@ -105,6 +105,7 @@ import CustomChart from '@/components/CustomChart/index.vue'
 import { getAction } from '@/api/manage'
 import { cloneDeep } from 'lodash'
 import { buildLineSeries } from '@/utils/chartHelper'
+import SampleDataMixin from '../../SampleDataMixin'
 
 const columns = [
   {
@@ -185,12 +186,7 @@ const initialOption = {
 
 export default {
   components: { TitleOverBorder, CustomChart },
-  mixins: [ModalMixin],
+  mixins: [ModalMixin, SampleDataMixin],
-  props: {
-    sampleId: {
-      type: Number
-    }
-  },
   data() {
     this.columns = columns
     return {
@@ -209,8 +205,10 @@ export default {
     async getData() {
       try {
         this.isLoading = true
+        const { sampleId, inputFileName: fileName } = this.sampleData
         const { success, result, message } = await getAction('/gamma/energyCalibration', {
-          sampleId: this.sampleId
+          sampleId,
+          fileName
         })
         this.isLoading = false
         if (success) {
@@ -274,7 +272,38 @@ export default {
     },
 
     // 插入
-    handleInsert() {},
+    handleInsert() {
+      const centroid = parseFloat(this.model.channel)
+      const energy = parseFloat(this.model.energy)
+
+      if (Number.isNaN(centroid) || Number.isNaN(energy)) {
+        this.$message.warn('Format is invalid.')
+        return
+      }
+
+      if (centroid <= 100 || centroid >= 16342) {
+        this.$message.warn('Centroid must be in the range of analysis!')
+        return
+      }
+
+      let i,
+        num = this.list.length
+      for (i = 0; i < num; ++i) {
+        const channel = this.list[i].channel
+        if (Math.abs(channel - centroid) < 0.01) {
+          this.$message.warn('The centroid has already existed!')
+          return
+        } else if (channel > centroid) {
+          break
+        }
+      }
+
+      console.log('%c [ 在位置插入 ]-297', 'font-size:13px; background:pink; color:#bf2c9f;', i)
+      this.list.splice(i, 0, {
+        channel: centroid,
+        energy
+      })
+    },
 
     // 修改
     handleModify() {},

src/views/spectrumAnalysis/gamma-analysis.vue

@@ -70,7 +70,7 @@ import NuclearLibrary from './components/SubOperators/NuclearLibrary.vue'
 import ButtonWithSwitchIcon from './components/SubOperators/ButtonWithSwitchIcon.vue'
 import { getAction } from '@/api/manage'
 import Response from './response.json'
-import { getXAxisAndYAxisByPosition } from '@/utils/chartHelper'
+import { getXAxisAndYAxisByPosition, rangeNumber } from '@/utils/chartHelper'
 import { cloneDeep } from 'lodash'
 
 // 初始配置
@@ -166,7 +166,7 @@ const initialOption = {
     max: 'dataMax',
     animation: false,
     axisLabel: {
-      formatter: (value) => {
+      formatter: value => {
         return value.toFixed(1)
       }
     }
@@ -209,7 +209,7 @@ const thumbnailOption = {
       show: false
     },
     min: 1,
-    max: 'dataMax',
+    max: 'dataMax'
   },
   series: []
 }
@@ -326,7 +326,9 @@ export default {
           this.shapeEnergyData = shapeEnergyData
 
           this.option.yAxis.max = Math.ceil(Math.max(...shadowChannelChart.pointlist.map(item => item.y)) * 1.1)
-          this.thumbnailOption.yAxis.max = Math.ceil(Math.max(...shadowChannelChart.pointlist.map(item => item.y)) * 1.1)
+          this.thumbnailOption.yAxis.max = Math.ceil(
+            Math.max(...shadowChannelChart.pointlist.map(item => item.y)) * 1.1
+          )
 
           const series = []
 
@@ -766,8 +768,8 @@ export default {
 
         let [x1, y2, x2, y1] = [...point1, ...point2] // 根据解析出的数据确定真实的范围
 
-        const xAxisLimit = this.rangeNumber(1, xAxisMax)
+        const xAxisLimit = rangeNumber(1, xAxisMax)
-        const yAxisLimit = this.rangeNumber(1, yAxisMax)
+        const yAxisLimit = rangeNumber(1, yAxisMax)
 
         x1 = xAxisLimit(x1)
         x2 = xAxisLimit(x2)
@@ -844,17 +846,16 @@ export default {
 
         const xAxisMax = thumbnailChart.getModel().getComponent('xAxis').axis.scale._extent[1]
 
-        const xAxisLimit = this.rangeNumber(1 + halfWidth, xAxisMax - halfWidth)
+        const xAxisLimit = rangeNumber(1 + halfWidth, xAxisMax - halfWidth)
 
         const halfHeightPixel = this.halfHeightPixel
-        const yAxisLimit = this.rangeNumber(maxYAxisPixel + halfHeightPixel, minYAxisPixel - halfHeightPixel)
+        const yAxisLimit = rangeNumber(maxYAxisPixel + halfHeightPixel, minYAxisPixel - halfHeightPixel)
 
         xAxis = xAxisLimit(xAxis)
 
-        let [,yAxisPixel] = thumbnailChart.convertToPixel({ seriesIndex: 0 }, [0, yAxis])
+        let [, yAxisPixel] = thumbnailChart.convertToPixel({ seriesIndex: 0 }, [0, yAxis])
         yAxisPixel = yAxisLimit(yAxisPixel)
 
-
         const minYAxis = thumbnailChart.convertFromPixel({ seriesIndex: 0 }, [0, yAxisPixel + halfHeightPixel])[1] // 再把y轴最小值从pix转为yAxis
         const maxYAxis = thumbnailChart.convertFromPixel({ seriesIndex: 0 }, [0, yAxisPixel - halfHeightPixel])[1]
 
@@ -887,6 +888,61 @@ export default {
       this.thumbnailChartRect = []
     },
 
+    // 从分析工具刷新部分数据
+    refresh(data) {
+      console.log('%c [ data ]-892', 'font-size:13px; background:pink; color:#bf2c9f;', data)
+      const { allData, shadowChannelChart, shadowEnergyChart, shapeChannelData, shapeEnergyData } = data
+
+      const channelPeakGroup = allData.filter(item => item.name == 'Peak' && item.group == 'channel')
+      const energyPeakGroup = allData.filter(item => item.name == 'Peak' && item.group == 'energy')
+
+      const channelBaseLine = allData.find(item => item.name == 'BaseLine' && item.group == 'channel')
+      const energyBaseLine = allData.find(item => item.name == 'BaseLine' && item.group == 'energy')
+
+      const channelLcLine = allData.find(item => item.name == 'Lc' && item.group == 'channel')
+      const energyLcLine = allData.find(item => item.name == 'Lc' && item.group == 'energy')
+
+      const channelScacLine = allData.find(item => item.name == 'Scac' && item.group == 'channel')
+      const energyScacLine = allData.find(item => item.name == 'Scac' && item.group == 'energy')
+
+      this.allEnergy = allData.find(item => item.name == 'Energy' && item.group == 'energy')
+      this.allChannel = allData.find(item => item.name == 'Count' && item.group == 'channel')
+
+      // 保存Peak Line
+      this.channelPeakGroup = channelPeakGroup
+      this.energyPeakGroup = energyPeakGroup
+
+      // 保存 Spectrum Line
+      this.shadowChannelChart = shadowChannelChart
+      this.shadowEnergyChart = shadowEnergyChart
+
+      // 保存基线
+      this.channelBaseLine = channelBaseLine
+      this.energyBaseLine = energyBaseLine
+
+      // 保存Lc
+      this.channelLcLine = channelLcLine
+      this.energyLcLine = energyLcLine
+
+      // 保存Scac
+      this.channelScacLine = channelScacLine
+      this.energyScacLine = energyScacLine
+
+      // 保存 基线控制点
+      this.shapeChannelData = shapeChannelData
+      this.shapeEnergyData = shapeEnergyData
+
+      this.redrawPeakLine()
+      this.redrawCtrlPointBySeriesName()
+
+      this.redrawLineBySeriesName('BaseLine', this.energyBaseLine, this.channelBaseLine, this.graphAssistance.Baseline)
+      this.redrawLineBySeriesName('LcLine', this.energyLcLine, this.channelLcLine, this.graphAssistance.Lc)
+      this.redrawLineBySeriesName('ScacLine', this.energyScacLine, this.channelScacLine, this.graphAssistance.SCAC)
+      this.redrawLineBySeriesName('Spectrum', this.shadowEnergyChart, this.shadowChannelChart)
+
+      this.redrawThumbnailChart()
+    },
+
     // 根据name查找series
     findSeriesByName(seriesName) {
       return this.option.series.find(item => item.name == seriesName)
@@ -908,17 +964,6 @@ export default {
       ]
     },
 
-    /**
-     * 限定数字在一定范围
-     * @param {Number} min
-     * @param {Number} max
-     */
-    rangeNumber(min, max) {
-      return num => {
-        return num > max ? max : num < min ? min : num
-      }
-    },
-
     getChannelByEnergy(energy) {
       let channel = 0
       for (let index = 1; index < this.allEnergy.pointlist.length; index++) {

src/views/spectrumAnalysis/index.vue

@@ -76,7 +76,7 @@
     <!-- 分析-设置弹窗结束 -->
 
     <!-- 分析工具弹窗开始 -->
-    <analyze-interactive-tool-modal v-model="analyzeInteractiveToolModalVisible" :sampleId="sampleData.sampleId" />
+    <analyze-interactive-tool-modal v-model="analyzeInteractiveToolModalVisible" :sampleId="sampleData.sampleId" @refresh="handleRefreshGamma" />
     <!-- 分析工具弹窗结束 -->
 
     <!-- Korsum 弹窗开始 -->
@@ -96,7 +96,7 @@
     <!-- Efficiency Calibration 弹窗结束 -->
 
     <!-- Energy Calibration 弹窗开始 -->
-    <energy-calibration-modal v-model="energyCalibrationModalShow" :sampleId="sampleData.sampleId" />
+    <energy-calibration-modal v-model="energyCalibrationModalShow" />
     <!-- Energy Calibration 弹窗结束 -->
 
     <!-- Resolution Calibration 弹窗开始 -->
@@ -467,6 +467,11 @@ export default {
       this.$refs.betaGammaAnalysisRef && this.$refs.betaGammaAnalysisRef.resize()
     },
 
+    // 从分析工具刷新gamma图表
+    handleRefreshGamma(data) {
+      this.$refs.gammaAnalysisRef.refresh(data)
+    },
+
     // Beta-Gamma Energy Calibration 的重新分析
     handleReanalyse(...data) {
       this.$refs.betaGammaAnalysisRef.reanalyse(data)