1
This commit is contained in:
surida
parent
62d7ce0f41
commit
95653bc7ff
|
|
@ -11,13 +11,40 @@
|
|||
QC Flags
|
||||
<beta-gamma-qc-flags slot="content" :data="qcFlags" @click="handleQcFlagClick" />
|
||||
</pop-over-with-icon>
|
||||
<custom-select
|
||||
v-model="spectraType"
|
||||
:options="SampleType"
|
||||
@change="changeChartByType"
|
||||
style="width: 246px"
|
||||
class="sample-select"
|
||||
></custom-select>
|
||||
<custom-select v-model="spectraType" :options="SampleType" @change="changeChartByType" style="width: 246px" class="sample-select"></custom-select>
|
||||
<div class="spectrum-analysis-sub-operators-roi">
|
||||
<div class="spectrum-analysis-sub-operators-roi-name">ROI1</div>
|
||||
<a-input-group>
|
||||
<a-input v-model:value="roiValues[0]" class="spectrum-analysis-sub-operators-roi-input" placeholder="Beta1" />
|
||||
<a-input class="spectrum-analysis-sub-operators-roi-split site-input-split" placeholder="," disabled />
|
||||
<a-input v-model:value="roiValues[1]" class="spectrum-analysis-sub-operators-roi-input site-input-right" placeholder="Beta2" />
|
||||
</a-input-group>
|
||||
</div>
|
||||
<div class="spectrum-analysis-sub-operators-roi">
|
||||
<div class="spectrum-analysis-sub-operators-roi-name">ROI2</div>
|
||||
<a-input-group>
|
||||
<a-input v-model:value="roiValues[2]" class="spectrum-analysis-sub-operators-roi-input" placeholder="Beta1" />
|
||||
<a-input class="spectrum-analysis-sub-operators-roi-split site-input-split" placeholder="," disabled />
|
||||
<a-input v-model:value="roiValues[3]" class="spectrum-analysis-sub-operators-roi-input site-input-right" placeholder="Beta2" />
|
||||
</a-input-group>
|
||||
</div>
|
||||
<div class="spectrum-analysis-sub-operators-roi">
|
||||
<div class="spectrum-analysis-sub-operators-roi-name">ROI3</div>
|
||||
<a-input-group>
|
||||
<a-input v-model:value="roiValues[4]" class="spectrum-analysis-sub-operators-roi-input" placeholder="Beta1" />
|
||||
<a-input class="spectrum-analysis-sub-operators-roi-split site-input-split" placeholder="," disabled />
|
||||
<a-input v-model:value="roiValues[5]" class="spectrum-analysis-sub-operators-roi-input site-input-right" placeholder="Beta2" />
|
||||
</a-input-group>
|
||||
</div>
|
||||
<div class="spectrum-analysis-sub-operators-roi">
|
||||
<div class="spectrum-analysis-sub-operators-roi-name">ROI4</div>
|
||||
<a-input-group>
|
||||
<a-input v-model:value="roiValues[6]" class="spectrum-analysis-sub-operators-roi-input" placeholder="Beta1" />
|
||||
<a-input class="spectrum-analysis-sub-operators-roi-split site-input-split" placeholder="," disabled />
|
||||
<a-input v-model:value="roiValues[7]" class="spectrum-analysis-sub-operators-roi-input site-input-right" placeholder="Beta2" />
|
||||
</a-input-group>
|
||||
</div>
|
||||
<div class="spectrum-analysis-sub-operators-button" @click="reDrawRectOri">Update</div>
|
||||
</div>
|
||||
<!-- 二级交互栏结束 -->
|
||||
|
||||
|
|
@ -28,22 +55,14 @@
|
|||
<div class="beta-gamma-analysis-main-charts-left">
|
||||
<beta-gamma-chart-container>
|
||||
<template slot="title"> Beta-Gamma Spectrum: {{ currSpectrum }} </template>
|
||||
<beta-gamma-spectrum
|
||||
ref="betaChartRef"
|
||||
:betaEnergyData="betaEnergyData"
|
||||
:gammaEnergyData="gammaEnergyData"
|
||||
:histogramDataList="histogramDataList"
|
||||
:boundary="boundaryList"
|
||||
:isLoading.sync="isLoading"
|
||||
:currIdx="currIdx"
|
||||
@refreshRoi="refreshRoi"
|
||||
/>
|
||||
<beta-gamma-spectrum ref="betaChartRef" :betaEnergyData="betaEnergyData" :roiValues="roiValues" :gammaEnergyData="gammaEnergyData" :histogramDataList="histogramDataList" :boundary="boundaryList" :isLoading.sync="isLoading" :currIdx="currIdx" @refreshRoi="refreshRoi" />
|
||||
</beta-gamma-chart-container>
|
||||
</div>
|
||||
<div class="beta-gamma-analysis-main-charts-right">
|
||||
<beta-gamma-chart-container>
|
||||
|
||||
<template slot="title"> ROI LIMITS </template>
|
||||
<roi-limits ref="RoiChartRef" :ROILists="ROILists" :gammaEnergyData="gammaEnergyData" />
|
||||
<roi-limits ref="RoiChartRef" :ROILists="ROILists" :ROIAnalyzeLists="ROIAnalyzeLists" :gammaEnergyData="gammaEnergyData" />
|
||||
</beta-gamma-chart-container>
|
||||
<!-- 底部显示 -->
|
||||
<div class="beta-gamma-analysis-main-bottom">
|
||||
|
|
@ -53,12 +72,6 @@
|
|||
<result-display-beta :data="resultDisplay" @sendFlag="handleGetFlag"></result-display-beta>
|
||||
</beta-gamma-chart-container>
|
||||
</div>
|
||||
<!-- <div class="beta-gamma-analysis-main-bottom-right">
|
||||
<beta-gamma-chart-container>
|
||||
<template slot="title"> ROI Param </template>
|
||||
<roi-param :roiParamList="roiParamList" />
|
||||
</beta-gamma-chart-container>
|
||||
</div> -->
|
||||
</div>
|
||||
<!-- 底部显示结束 -->
|
||||
</div>
|
||||
|
|
@ -81,6 +94,7 @@ import BetaGammaSpectrum from './components/BetaGammaSpectrum.vue'
|
|||
import RoiLimits from './components/RoiLimits.vue'
|
||||
import RoiParam from './components/RoiParam.vue'
|
||||
import axios from 'axios'
|
||||
import store from '@/store/'
|
||||
import { getAction, postAction, deleteAction } from '../../api/manage'
|
||||
import { addSampleData, getSampleData } from '@/utils/SampleStore'
|
||||
const SampleType = [
|
||||
|
|
@ -121,18 +135,20 @@ export default {
|
|||
gammaEnergyData: [],
|
||||
betaEnergyData: [],
|
||||
ROILists: [],
|
||||
ROIAnalyzeLists: [],
|
||||
roiParamList: [],
|
||||
boundaryList: [],
|
||||
sampleDetail: {},
|
||||
qcFlags: {},
|
||||
resultDisplay: [],
|
||||
currIdx: 0,
|
||||
roiValues:[],
|
||||
timerStamp: Date.now(),
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
sample: {
|
||||
async handler(newVal, oldVal) {
|
||||
// this.resultDisplay = []
|
||||
const sampleData = getSampleData(newVal.inputFileName)
|
||||
if (sampleData) {
|
||||
const { data, from } = sampleData
|
||||
|
|
@ -157,7 +173,20 @@ export default {
|
|||
},
|
||||
},
|
||||
methods: {
|
||||
getAnalyzeCurrentSpectrum() {
|
||||
async getAnalyzeCurrentSpectrum() {
|
||||
|
||||
const { inputFileName, detFileName } = this.sample
|
||||
var userId = store.getters.userInfo.id
|
||||
const { success, result, message } = await postAction(`/selfStation/Reprocessing?fileName=${inputFileName}&processKey=${userId}_${this.timerStamp}`)
|
||||
console.log(userId,success, result, message)
|
||||
if(success){
|
||||
var _result = []
|
||||
_result.push(result.ROI1)
|
||||
_result.push(result.ROI2)
|
||||
_result.push(result.ROI3)
|
||||
_result.push(result.ROI4)
|
||||
this.ROIAnalyzeLists = _result
|
||||
}
|
||||
let XeData = [
|
||||
{
|
||||
sampleId: null,
|
||||
|
|
@ -273,6 +302,10 @@ export default {
|
|||
this.roiParamList.splice(this.currIdx, 1, currRoiParam)
|
||||
this.boundaryList.splice(this.currIdx, 1, currBoundary)
|
||||
},
|
||||
reDrawRectOri(){
|
||||
this.$refs.betaChartRef.reDrawRect()
|
||||
|
||||
},
|
||||
getIndex(val) {
|
||||
this.currIdx = val
|
||||
},
|
||||
|
|
@ -380,7 +413,7 @@ export default {
|
|||
}
|
||||
})
|
||||
},
|
||||
resize() {},
|
||||
resize() { },
|
||||
},
|
||||
destroyed() {
|
||||
this.cancelLastRequest()
|
||||
|
|
@ -391,6 +424,7 @@ export default {
|
|||
<style lang="less" scoped>
|
||||
.beta-gamma-analysis {
|
||||
height: 100%;
|
||||
|
||||
.ant-spin-nested-loading {
|
||||
height: 100%;
|
||||
|
||||
|
|
@ -400,6 +434,7 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sample-select {
|
||||
::v-deep {
|
||||
.ant-select-selection {
|
||||
|
|
@ -408,37 +443,45 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-main {
|
||||
height: calc(100% - 55px);
|
||||
overflow: auto hidden;
|
||||
|
||||
&-charts {
|
||||
height: 100% ;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
gap: 30px;
|
||||
overflow: auto hidden;
|
||||
|
||||
&-left {
|
||||
flex: 1;
|
||||
width: 790px;
|
||||
}
|
||||
|
||||
&-right {
|
||||
flex: 1;
|
||||
.betagamma-chart{
|
||||
height: calc(100% - 260px);
|
||||
|
||||
.betagamma-chart {
|
||||
height: calc(100% - 200px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-bottom {
|
||||
margin-top: 20px;
|
||||
height: 234px;
|
||||
height: 194px;
|
||||
overflow: auto hidden;
|
||||
|
||||
&-left {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
&-right {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 二级操作栏开始
|
||||
.spectrum-analysis-sub-operators {
|
||||
flex-shrink: 0;
|
||||
|
|
@ -462,6 +505,48 @@ export default {
|
|||
width: 125px;
|
||||
}
|
||||
}
|
||||
|
||||
&-roi {
|
||||
display: flex;
|
||||
|
||||
&-name {
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
&-input {
|
||||
width: 80px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&-input:not(.site-input-right) {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
&-input.site-input-right {
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
&-split {
|
||||
width: 5px;
|
||||
padding: 0;
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
pointer-events: none;
|
||||
background-color: #03353f;
|
||||
}
|
||||
|
||||
}
|
||||
&-button{
|
||||
text-align: center;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
min-width: 94px;
|
||||
padding: 0 10px;
|
||||
font-size: 16px;
|
||||
margin-left: 16px;
|
||||
background-color: #406979;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
// 二级操作栏结束
|
||||
</style>
|
||||
|
||||
// 二级操作栏结束</style>
|
||||
|
|
@ -6,7 +6,7 @@
|
|||
</span>
|
||||
<span @click="handleUnzoom">Unzoom</span>
|
||||
<span @click="handleROI">ROI</span>
|
||||
<span @click="handleUpdate">Update</span>
|
||||
<span @click="handleLOG">Log</span>
|
||||
</div>
|
||||
<div class="beta-gamma-spectrum-chart-main">
|
||||
<!-- 2D 图表，为了相应Unzoom采用的v-show -->
|
||||
|
|
@ -22,8 +22,8 @@
|
|||
</div> -->
|
||||
</div>
|
||||
<!-- 2D图表结束 -->
|
||||
<CustomChart v-if="active == 1" key="1" ref="gammaLineChartRef" :option="gammaOption" />
|
||||
<CustomChart v-if="active == 2" key="2" ref="betaLineChartRef" :option="betaOption" />
|
||||
<CustomChart v-if="active == 0" key="1" ref="gammaLineChartRef" :option="gammaOption" />
|
||||
<CustomChart v-if="active == 1" key="2" ref="betaLineChartRef" :option="betaOption" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -34,7 +34,7 @@ import ColorPalette from './ColorPalette.vue'
|
|||
import { getXAxisAndYAxisByPosition, rangeNumber } from '@/utils/chartHelper.js'
|
||||
import { putAction } from '../../../api/manage'
|
||||
import SampleDataMixin from '../SampleDataMixin'
|
||||
const buttons = ['Beta-Gamma', 'Gamma', 'Beta']
|
||||
const buttons = ['Gamma', 'Beta']
|
||||
// Beta-Gamma 的配置
|
||||
const twoDOption = {
|
||||
grid: {
|
||||
|
|
@ -389,6 +389,10 @@ export default {
|
|||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
roiValues: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
currIdx: {
|
||||
type: Number,
|
||||
},
|
||||
|
|
@ -433,7 +437,7 @@ export default {
|
|||
currIdx: {
|
||||
handler(newVal) {
|
||||
// this.boundaryData = this.boundary[newVal]
|
||||
this.reDrawRect()
|
||||
this.initDrawRectOri()
|
||||
},
|
||||
// immediate: true,
|
||||
},
|
||||
|
|
@ -501,7 +505,7 @@ export default {
|
|||
data() {
|
||||
this.buttons = buttons
|
||||
return {
|
||||
active: 0,
|
||||
active: -1,
|
||||
twoDOption,
|
||||
dragOption,
|
||||
gammaOption,
|
||||
|
|
@ -589,17 +593,29 @@ export default {
|
|||
// },
|
||||
}
|
||||
},
|
||||
initDrawRectOri() {
|
||||
for (var i = 0; i < 4; i++) {
|
||||
const data = this.boundary[i]
|
||||
if (data) {
|
||||
this.$set(this.roiValues, i * 2, data.minX);
|
||||
this.$set(this.roiValues, i * 2 + 1, data.maxX);
|
||||
}
|
||||
}
|
||||
this.reDrawRect();
|
||||
},
|
||||
// 重绘矩形框区域
|
||||
reDrawRect() {
|
||||
console.log(this.roiValues)
|
||||
if (this.showROI) {
|
||||
// rect 遵循 左下 右下 右上 左上 左下 的顺序
|
||||
const colors = ['#0CB4C1', '#1B88E5', '#43960C', '#D09324']
|
||||
for (var i = 0; i < 4; i++) {
|
||||
const data = this.boundary[i]
|
||||
if(data)
|
||||
{
|
||||
const rect = [[data.minX, data.minY], [data.maxX, data.minY], [data.maxX, data.maxY], [data.minX, data.maxY], [data.minX, data.minY],]
|
||||
this.twoDOption.series[i + 1].data = this.drawOneRect(rect, colors[i]).data
|
||||
if (this.roiValues.length > 7) {
|
||||
var _minx = this.roiValues[i*2]
|
||||
var _maxX = this.roiValues[i*2+1]
|
||||
const rect = [[_minx, data.minY], [_maxX, data.minY], [_maxX, data.maxY], [_minx, data.maxY], [_minx, data.minY],]
|
||||
this.twoDOption.series[i + 1].data = this.drawOneRect(rect, colors[i]).data
|
||||
}
|
||||
}
|
||||
// lineSeries2.data = this.drawOneRect(rect2, color2).data
|
||||
|
|
@ -632,7 +648,6 @@ export default {
|
|||
this.twoDOption.yAxis.max = 4096
|
||||
|
||||
// this.emitRangeChange([0, 256, 0, 256])
|
||||
this.reDrawRect()
|
||||
this.buildScatterList()
|
||||
this.$nextTick(() => {
|
||||
const myChart = this.$refs.chartTwoDRef.getChartInstance()
|
||||
|
|
@ -728,8 +743,6 @@ export default {
|
|||
})
|
||||
|
||||
// this.emitRangeChange([x1, x2, y1, y2])
|
||||
|
||||
// this.reDrawRect()
|
||||
}
|
||||
|
||||
this.clearBrush(chart)
|
||||
|
|
@ -750,7 +763,8 @@ export default {
|
|||
// 点击ROI
|
||||
handleROI() {
|
||||
this.showROI = !this.showROI
|
||||
this.reDrawRect()
|
||||
},
|
||||
handleLOG() {
|
||||
},
|
||||
// 点击Update
|
||||
async handleUpdate() {
|
||||
|
|
@ -784,7 +798,6 @@ export default {
|
|||
minY: 0,
|
||||
maxY: 4096,
|
||||
}
|
||||
// this.reDrawRect()
|
||||
} else {
|
||||
this.$emit('update:isLoading', false)
|
||||
}
|
||||
|
|
@ -816,6 +829,7 @@ export default {
|
|||
text-align: right;
|
||||
overflow: auto;
|
||||
height: 26px;
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 9px;
|
||||
|
|
@ -830,7 +844,8 @@ export default {
|
|||
text-align: center;
|
||||
height: 100%;
|
||||
line-height: 26px;
|
||||
width: 100px;
|
||||
min-width: 94px;
|
||||
padding: 0 10px;
|
||||
background-color: #406979;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
|
|
|
|||
|
|
@ -1,273 +1,316 @@
|
|||
<template>
|
||||
<div class="beta-gamma-spectrum">
|
||||
<div :class="ismax[index] ? 'beta-gamma-spectrum-chart max' : 'beta-gamma-spectrum-chart'" v-for="(item, index) in buttons" :key="item" v-show="!ismaxed || ismax[index]">
|
||||
<div class="beta-gamma-spectrum-chart-operators" ref="operatorsRef">
|
||||
<a-row>
|
||||
<a-col :span="4">
|
||||
<div :style="{ background: colors[index], width: '80px', marginLeft: '60px', textAlign: 'center' }">{{ item }}</div>
|
||||
</a-col>
|
||||
<a-col :span="20">
|
||||
<div style="float: right;width: 40px;">
|
||||
<img v-show="!ismax[index]" src="@/assets/maximize.png" @click="maximize(true, index)" />
|
||||
<img v-show="ismax[index]" src="@/assets/normal.png" @click="maximize(false, index)" />
|
||||
<div class="beta-gamma-spectrum">
|
||||
<div :class="ismax[index] ? 'beta-gamma-spectrum-chart max' : 'beta-gamma-spectrum-chart'" v-for="(item, index) in buttons" :key="item" v-show="!ismaxed || ismax[index]">
|
||||
<div class="beta-gamma-spectrum-chart-operators" ref="operatorsRef">
|
||||
<a-row>
|
||||
<a-col :span="4">
|
||||
<div :style="{ background: colors[index] }" class="beta-gamma-spectrum-chart-operators-button">{{ item }}</div>
|
||||
</a-col>
|
||||
<a-col :span="20">
|
||||
<div style="float: right;width: 40px;">
|
||||
<img v-show="!ismax[index]" src="@/assets/maximize.png" @click="maximize(true, index)" />
|
||||
<img v-show="ismax[index]" src="@/assets/normal.png" @click="maximize(false, index)" />
|
||||
</div>
|
||||
<div style="float: right;color:#AD4140;width: 120px;">{{ 'Energy:' + eValue[index] }}</div>
|
||||
<div style="float: right;color:#8EC0C8;width: 80px;">{{ 'Count:' + yValue[index] }}</div>
|
||||
<div style="float: right;color:#8EC0C8;width: 95px;">{{ 'Channel:' + xValue[index] }}</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<div style="float: right;color:#AD4140;width: 150px;">{{ 'Ener gy:' + eValue[index] }}</div>
|
||||
<div style="float: right;color:#8EC0C8;width: 100px;">{{ 'Count:' + yValue[index] }}</div>
|
||||
<div style="float: right;color:#8EC0C8;width: 120px;">{{ 'Channel:' + xValue[index] }}</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<div class="beta-gamma-spectrum-chart-main">
|
||||
<CustomChart ref="containerRef" :option="roiLimitsOptions[index]" />
|
||||
</div>
|
||||
<div class="beta-gamma-spectrum-chart-main">
|
||||
<CustomChart ref="containerRef" :option="roiLimitsOptions[index]" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CustomChart from '@/components/CustomChart/index.vue'
|
||||
const buttons = ['ROI1', 'ROI2', 'ROI3', 'ROI4']
|
||||
const colors = ['#0CB4C1', '#1B88E5', '#43960C', '#D09324']
|
||||
|
||||
// 折线图配置
|
||||
export default {
|
||||
components: {
|
||||
CustomChart,
|
||||
},
|
||||
props: {
|
||||
ROILists: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
components: {
|
||||
CustomChart,
|
||||
},
|
||||
gammaEnergyData: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
props: {
|
||||
ROILists: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
ROIAnalyzeLists: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
gammaEnergyData: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
ROILists: {
|
||||
handler(newVal) {
|
||||
this.newVal = newVal
|
||||
this.buildOneLineList()
|
||||
},
|
||||
immediate: true,
|
||||
watch: {
|
||||
ROILists: {
|
||||
handler(newVal) {
|
||||
this.newVal = newVal
|
||||
this.buildOneLineList()
|
||||
},
|
||||
immediate: true,
|
||||
},
|
||||
ROIAnalyzeLists: {
|
||||
handler(newVal) {
|
||||
this.newAnalyzeVal = newVal
|
||||
this.buildAnalyzeList()
|
||||
},
|
||||
immediate: false,
|
||||
},
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
// const myChart = this.$refs.roiLimitsRef.getChartInstance()
|
||||
// myChart.dispose()
|
||||
},
|
||||
data() {
|
||||
this.buttons = buttons
|
||||
this.colors = colors
|
||||
return {
|
||||
active: 0,
|
||||
xValue: ['', '', '', ''],
|
||||
yValue: ['', '', '', ''],
|
||||
eValue: ['', '', '', ''],
|
||||
ismax: [false, false, false, false],
|
||||
ismaxed:false,
|
||||
roiLimitsOptions: [
|
||||
this.createRoiLimitsOption(0),
|
||||
this.createRoiLimitsOption(1),
|
||||
this.createRoiLimitsOption(2),
|
||||
this.createRoiLimitsOption(3),
|
||||
],
|
||||
charts: [],
|
||||
newVal: [],
|
||||
opts: {
|
||||
notMerge: true,
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
buildOneLineList() {
|
||||
for (var i = 0; i < 4; i++) {
|
||||
var val = this.newVal[i]
|
||||
if (val) {
|
||||
this.roiLimitsOptions[i].series.data = val.map((item) => [item.x, item.y])
|
||||
} else {
|
||||
this.roiLimitsOptions[i].series.data = []
|
||||
beforeDestroy() {
|
||||
// const myChart = this.$refs.roiLimitsRef.getChartInstance()
|
||||
// myChart.dispose()
|
||||
},
|
||||
data() {
|
||||
this.buttons = buttons
|
||||
this.colors = colors
|
||||
return {
|
||||
active: 0,
|
||||
xValue: ['', '', '', ''],
|
||||
yValue: ['', '', '', ''],
|
||||
eValue: ['', '', '', ''],
|
||||
ismax: [false, false, false, false],
|
||||
ismaxed: false,
|
||||
roiLimitsOptions: [
|
||||
this.createRoiLimitsOption(0),
|
||||
this.createRoiLimitsOption(1),
|
||||
this.createRoiLimitsOption(2),
|
||||
this.createRoiLimitsOption(3),
|
||||
],
|
||||
charts: [],
|
||||
newVal: [],
|
||||
newAnalyzeVal: [],
|
||||
opts: {
|
||||
notMerge: true,
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
handleTooltipFormat(params, index) {
|
||||
this.$set(this.xValue, index, params[0].value[0]);
|
||||
this.$set(this.yValue, index, params[0].value[1]);
|
||||
this.$set(this.eValue, index, this.gammaEnergyData[params[0].value[0]].toFixed(3));
|
||||
},
|
||||
maximize(bl, index) {
|
||||
this.$set(this.ismax, index, bl);
|
||||
this.ismaxed = this.ismax.includes(true);
|
||||
this.$nextTick(() => {
|
||||
this.$refs['containerRef'][index].getChartInstance().resize();
|
||||
})
|
||||
},
|
||||
showTooltip(i) {
|
||||
const chartRef = this.$refs['containerRef'][i].getChartInstance();
|
||||
chartRef.dispatchAction({
|
||||
type: 'showTip',
|
||||
seriesIndex: 0,
|
||||
dataIndex: 110 // 指定要显示 tooltip 的数据索引
|
||||
});
|
||||
},
|
||||
createRoiLimitsOption(index) {
|
||||
const self = this
|
||||
return {
|
||||
grid: {
|
||||
top: 10,
|
||||
left: 60,
|
||||
right: 20,
|
||||
bottom: 50,
|
||||
methods: {
|
||||
buildOneLineList() {
|
||||
for (var i = 0; i < 4; i++) {
|
||||
var val = this.newVal[i]
|
||||
if (val) {
|
||||
this.roiLimitsOptions[i].series.data = val.map((item) => [item.x, item.y])
|
||||
} else {
|
||||
this.roiLimitsOptions[i].series.data = []
|
||||
}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
show: true,
|
||||
trigger: 'axis',
|
||||
formatter: (params) => {
|
||||
self.handleTooltipFormat(params, index)
|
||||
let content = ''
|
||||
params.forEach((item) => {
|
||||
// 提示框的内容样式及数据
|
||||
content += `
|
||||
<!-- 圆点样式 -->
|
||||
<span style="color: #424864;">Channel ${item.axisValueLabel}</span><br>
|
||||
<span style="display: inline-block; margin-right: 10px; border-radius: 50%; width: 8px; height: 8px;background-color: ${item.color};"></span>
|
||||
<span >${item.value[1]}</span>
|
||||
`
|
||||
buildAnalyzeList() {
|
||||
for (var i = 0; i < 4; i++) {
|
||||
var val = this.newAnalyzeVal[i].allData
|
||||
var newseries = []
|
||||
var _series = this.roiLimitsOptions[i].series
|
||||
newseries.push(_series)
|
||||
val.forEach(item => {
|
||||
if (item.name != 'Count') {
|
||||
var _ser = {
|
||||
type: 'line',
|
||||
data: item.pointlist.map((item) => [item.x, item.y]),
|
||||
color: item.color,
|
||||
symbol: 'none'
|
||||
}
|
||||
newseries.push(_ser)
|
||||
}
|
||||
})
|
||||
this.roiLimitsOptions[i].series = newseries
|
||||
}
|
||||
},
|
||||
handleTooltipFormat(params, index) {
|
||||
if (Number.isInteger(params[0].value[0])) {
|
||||
this.$set(this.xValue, index, params[0].value[0]);
|
||||
this.$set(this.yValue, index, params[0].value[1]);
|
||||
this.$set(this.eValue, index, this.gammaEnergyData[params[0].value[0]].toFixed(3));
|
||||
}
|
||||
|
||||
},
|
||||
maximize(bl, index) {
|
||||
this.$set(this.ismax, index, bl);
|
||||
this.ismaxed = this.ismax.includes(true);
|
||||
this.$nextTick(() => {
|
||||
this.$refs['containerRef'][index].getChartInstance().resize();
|
||||
})
|
||||
return content
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
name: 'Gamma Channel',
|
||||
nameTextStyle: {
|
||||
color: '#5b9cba',
|
||||
fontSize: 16,
|
||||
},
|
||||
nameLocation: 'center',
|
||||
nameGap: 30,
|
||||
boundaryGap: false,
|
||||
splitLine: {
|
||||
show: true,
|
||||
interval: 'auto',
|
||||
lineStyle: {
|
||||
color: 'rgba(119, 181, 213, .3)',
|
||||
},
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: 'rgba(119, 181, 213, .3)',
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
fontSize: 12,
|
||||
color: '#ade6ee',
|
||||
},
|
||||
showTooltip(i) {
|
||||
const chartRef = this.$refs['containerRef'][i].getChartInstance();
|
||||
chartRef.dispatchAction({
|
||||
type: 'showTip',
|
||||
seriesIndex: 0,
|
||||
dataIndex: 110 // 指定要显示 tooltip 的数据索引
|
||||
});
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: 'Count',
|
||||
nameTextStyle: {
|
||||
color: '#5b9cba',
|
||||
fontSize: 16,
|
||||
},
|
||||
nameLocation: 'center',
|
||||
nameGap: 40,
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: 'rgba(119, 181, 213, .3)',
|
||||
},
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: 'rgba(119, 181, 213, .3)',
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
fontSize: 12,
|
||||
color: '#ade6ee',
|
||||
},
|
||||
createRoiLimitsOption(index) {
|
||||
const self = this
|
||||
return {
|
||||
grid: {
|
||||
top: 10,
|
||||
left: 60,
|
||||
right: 20,
|
||||
bottom: 50,
|
||||
},
|
||||
tooltip: {
|
||||
show: true,
|
||||
trigger: 'axis',
|
||||
formatter: (params) => {
|
||||
self.handleTooltipFormat(params, index)
|
||||
// let content = ''
|
||||
// params.forEach((item) => {
|
||||
// // 提示框的内容样式及数据
|
||||
// content += `
|
||||
// <!-- 圆点样式 -->
|
||||
// <span style="color: #424864;">Channel ${item.axisValueLabel}</span><br>
|
||||
// <span style="display: inline-block; margin-right: 10px; border-radius: 50%; width: 8px; height: 8px;background-color: ${item.color};"></span>
|
||||
// <span >${item.value[1]}</span>
|
||||
// `
|
||||
// })
|
||||
// return content
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
name: 'Gamma Channel',
|
||||
nameTextStyle: {
|
||||
color: '#5b9cba',
|
||||
fontSize: 14,
|
||||
},
|
||||
nameLocation: 'center',
|
||||
nameGap: 30,
|
||||
boundaryGap: false,
|
||||
splitLine: {
|
||||
show: true,
|
||||
interval: 'auto',
|
||||
lineStyle: {
|
||||
color: 'rgba(119, 181, 213, .3)',
|
||||
},
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: 'rgba(119, 181, 213, .3)',
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
fontSize: 12,
|
||||
color: '#ade6ee',
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: 'Count',
|
||||
nameTextStyle: {
|
||||
color: '#5b9cba',
|
||||
fontSize: 14,
|
||||
},
|
||||
nameLocation: 'center',
|
||||
nameGap: 40,
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: 'rgba(119, 181, 213, .3)',
|
||||
},
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: 'rgba(119, 181, 213, .3)',
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
fontSize: 12,
|
||||
color: '#ade6ee',
|
||||
},
|
||||
},
|
||||
series: {
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
showSymbol: false,
|
||||
// symbol: 'circle',
|
||||
// symbolSize: 6,
|
||||
data: [],
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#baaa3d',
|
||||
},
|
||||
},
|
||||
lineStyle: {
|
||||
normal: {
|
||||
width: 2,
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
},
|
||||
series: {
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
showSymbol: false,
|
||||
// symbol: 'circle',
|
||||
// symbolSize: 6,
|
||||
data: [],
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#baaa3d',
|
||||
},
|
||||
},
|
||||
lineStyle: {
|
||||
normal: {
|
||||
width: 2,
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.beta-gamma-spectrum {
|
||||
height: 100%;
|
||||
|
||||
&-chart {
|
||||
height: 50%;
|
||||
width: 50%;
|
||||
float: left;
|
||||
|
||||
&-operators {
|
||||
overflow: auto;
|
||||
margin-bottom: -16px;
|
||||
|
||||
.ant-space-item:first-child {
|
||||
span {
|
||||
width: 70px;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
span {
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
line-height: 26px;
|
||||
width: 100px;
|
||||
background-color: #406979;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
|
||||
&.active {
|
||||
background-color: #1397a3;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-main {
|
||||
height: calc(100% - 40px);
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
&-chart.max {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
transform-origin: right top;
|
||||
}
|
||||
|
||||
&-chart {
|
||||
height: 50%;
|
||||
width: 50%;
|
||||
float: left;
|
||||
|
||||
&-operators {
|
||||
overflow: auto;
|
||||
margin-bottom: -16px;
|
||||
font-size: 13px;
|
||||
|
||||
&-button {
|
||||
width: 50px;
|
||||
margin-left: 60px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ant-space-item:first-child {
|
||||
span {
|
||||
width: 70px;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
span {
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
line-height: 26px;
|
||||
width: 100px;
|
||||
background-color: #406979;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
|
||||
&.active {
|
||||
background-color: #1397a3;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-main {
|
||||
height: calc(100% - 40px);
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
&-chart.max {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
transform-origin: right top;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user