diff --git a/src/components/CustomChart/index.vue b/src/components/CustomChart/index.vue index c38f28c..8dac754 100644 --- a/src/components/CustomChart/index.vue +++ b/src/components/CustomChart/index.vue @@ -6,7 +6,7 @@ import * as echarts from 'echarts' import 'echarts-gl' const events = ['click', 'brushEnd'] -const zrEvents = ['mousemove', 'mousedown', 'mouseup', 'click', 'dblclick'] +const zrEvents = ['mousemove', 'mousedown', 'mouseup', 'click', 'dblclick', 'contextmenu'] export default { props: { option: { diff --git a/src/views/spectrumAnalysis/components/Modals/BetaGammaModals/BetaGammaExtrapolationModal.vue b/src/views/spectrumAnalysis/components/Modals/BetaGammaModals/BetaGammaExtrapolationModal.vue index 4e4e193..62837f1 100644 --- a/src/views/spectrumAnalysis/components/Modals/BetaGammaModals/BetaGammaExtrapolationModal.vue +++ b/src/views/spectrumAnalysis/components/Modals/BetaGammaModals/BetaGammaExtrapolationModal.vue @@ -30,9 +30,21 @@
-
Gamma Spectrum:Sample
+
+
Gamma Spectrum:Sample
+
+ Total Counts: + {{ totalCount[0] }} + {{ totalCount[1] }} +
+
- +
Channel: {{ customToolTip.channel }}
Energy: {{ customToolTip.energy }}
+
+
Channel: {{ customToolTip2.channel }}
+
Energy: {{ customToolTip2.energy }}
+
@@ -66,18 +89,18 @@
Gamma Window Setting
Gamma Window Begin:
- Channel + Channel
Gamma Window End:
- Channel + Channel
Parameter Setting
Min of Energy:
- keV + keV
Half Life:
- Day + Day
@@ -174,6 +197,7 @@ import { getAction } from '@/api/manage' import { useBaseChartSetting } from '../../../useChart' import TitleOverBorder from '../../TitleOverBorder.vue' import SampleDataMixin from '@/views/spectrumAnalysis/SampleDataMixin' +import { isNullOrUndefined } from '@/utils/util' const initialGammaChartOption = { grid: { @@ -226,7 +250,8 @@ const initialGammaChartOption = { }, axisLabel: { color: '#ade6ee' - } + }, + animation: false }, series: [ { @@ -248,8 +273,9 @@ const initialGammaChartOption = { lineStyle: { color: '#f00' }, - data: [] - } + data: [{ xAxis: -1 }, { xAxis: -1 }] + }, + animation: false }, { type: 'line', @@ -257,7 +283,8 @@ const initialGammaChartOption = { color: '#A8DA56' }, symbol: 'none', - data: [] + data: [], + animation: false } ] } @@ -313,7 +340,8 @@ const initialBetaChartOption = { }, axisLabel: { color: '#ade6ee' - } + }, + animation: false }, series: [ { @@ -336,7 +364,8 @@ const initialBetaChartOption = { color: '#f00' }, data: [] - } + }, + animation: false }, { type: 'line', @@ -344,7 +373,8 @@ const initialBetaChartOption = { color: '#A8DA56' }, symbol: 'none', - data: [] + data: [], + animation: false } ] } @@ -417,6 +447,14 @@ const columns = [ } ] +const initialModel = { + windowBegin: null, + windowEnd: null, + energy: 0.1, + halfLife: 5.243, + fittingType: '1' +} + export default { mixins: [ModalMixin, SampleDataMixin], components: { @@ -437,28 +475,37 @@ export default { channel: '', energy: '' }, + customToolTip2: { + top: 0, + left: 0, + visible: false, + channel: '', + energy: '' + }, + + totalCount: [0, 0], + isLoading: false, detail: {}, gammaChannelEnergy: [], - model: { - fittingType: '1' - }, + model: cloneDeep(initialModel), tableList: [] } }, methods: { beforeModalOpen() { this.customToolTip.visible = false - const gammaSeries = this.gammaSpectrumChartOption.series - gammaSeries[0].data = [] - gammaSeries[1].data = [] + this.customToolTip2.visible = false + this.gammaSpectrumChartOption = cloneDeep(initialGammaChartOption) + + this.betaSpectrumChartOption = cloneDeep(initialBetaChartOption) + + this.model = cloneDeep(initialModel) + + this.calculateTotalCount() - const betaSeries = this.betaSpectrumChartOption.series - betaSeries[0].data = [] - betaSeries[1].data = [] - this.getDetail() }, @@ -518,23 +565,71 @@ export default { } }, // 图表点击 - handleChartClick(param) { - const { offsetX, offsetY } = param + handleChartClick({ offsetX, offsetY, event }, isMouseLeft) { + event.preventDefault() + const point = getXAxisAndYAxisByPosition(this.$refs.gammaSpectrumChart.getChartInstance(), offsetX, offsetY) if (point) { + const markLineData = this.gammaSpectrumChartOption.series[0].markLine.data const xAxis = parseInt(point[0].toFixed()) - this.gammaSpectrumChartOption.series[0].markLine.data = [{ xAxis }] + + let currToolTip = this.customToolTip2 - this.customToolTip.top = offsetY - if (xAxis > 225) { - this.customToolTip.left = offsetX - 125 - } else { - this.customToolTip.left = offsetX + 20 + // 如果是左键 + if (isMouseLeft) { + // 如果有右值且左值大于等于右值,清空 + if(!isNullOrUndefined(this.model.windowEnd) && xAxis >= this.model.windowEnd) { + this.clearMarkLineAndToolTip() + return + } + + currToolTip = this.customToolTip + + markLineData[0].xAxis = xAxis + this.model.windowBegin = xAxis + } + // 如果是右键 + else { + if(!isNullOrUndefined(this.model.windowBegin) && xAxis <= this.model.windowBegin) { + this.clearMarkLineAndToolTip() + return + } + + markLineData[1].xAxis = xAxis + this.model.windowEnd = xAxis } - this.customToolTip.visible = true - this.customToolTip.channel = xAxis + + currToolTip.top = offsetY + if (xAxis > 225) { + currToolTip.left = offsetX - 125 + } else { + currToolTip.left = offsetX + 20 + } + currToolTip.visible = true + currToolTip.channel = xAxis const energy = this.gammaChannelEnergy[xAxis] || 0 - this.customToolTip.energy = parseInt(energy) + 'keV' + currToolTip.energy = parseInt(energy) + 'keV' + + this.calculateTotalCount() + } + }, + + clearMarkLineAndToolTip() { + const markLineData = this.gammaSpectrumChartOption.series[0].markLine.data + markLineData[0].xAxis = -1 + markLineData[1].xAxis = -1 + + this.customToolTip.visible = false + this.customToolTip2.visible = false + + this.model.windowBegin = null + this.model.windowEnd = null + }, + + calculateTotalCount() { + if(!this.model.windowBegin || !this.model.windowEnd) { + this.totalCount = [0, 0] + return } }, @@ -551,6 +646,21 @@ export default { .title { color: @primary-color; + display: flex; + justify-content: space-between; +} + +.total-counts { + .count-1 { + color: @primary-color; + margin-left: 15px; + } + + .count-2 { + color: #ffc90e; + margin-left: 15px; + margin-right: 15px; + } } .sample-infomation { @@ -570,6 +680,7 @@ export default { padding: 5px; width: 200px; height: 100%; + line-height: 22px; } } } @@ -635,7 +746,7 @@ export default { width: 100%; &:last-child { - margin-top: 10px; + margin-top: 10px; } } }