diff --git a/jsconfig.json b/jsconfig.json new file mode 100644 index 0000000..0ab6ee7 --- /dev/null +++ b/jsconfig.json @@ -0,0 +1,13 @@ +{ + "compilerOptions": { + "baseUrl": ".", + "paths": { + "@/*": ["src/*"] + }, + "target": "ES6", + "module": "CommonJS", + "allowSyntheticDefaultImports": true + }, + "include": ["src/**/*"], + "exclude": ["node_modules"] +} diff --git a/src/style.less b/src/style.less index 1fce78a..effa50f 100644 --- a/src/style.less +++ b/src/style.less @@ -24,6 +24,12 @@ @text-color: #fff; +@component-background: @modalBg; +@heading-color: #fff; + +@input-bg: @formInputBgColor; +@input-border-color: @formInputBorderColor; + .ant-btn:hover, .ant-btn:active, .ant-btn:focus { @@ -69,6 +75,8 @@ body { @table-padding-vertical-sm: 2px; @table-padding-vertical: 6px; @table-padding-horizontal: 8px; +@table-row-hover-bg: #0e505f; + .ant-table { color: #ade6ee; font-size: 16px; @@ -89,15 +97,12 @@ body { &:nth-child(2n) { background-color: #08373a; } + td { padding: 10px 8px !important; border-bottom: none; } - &:hover { - td { - background-color: #0e505f !important; - } - } + &.ant-table-row-selected { td { background-color: #0d4e5c !important; @@ -337,9 +342,11 @@ body { @time-picker-selected-bg: @primary-color; @item-hover-bg: @primary-color; .ant-time-picker { + width: 100%; + &-input { - background: @modalBg; border-radius: 0; + &::placeholder { color: #fff; } @@ -347,7 +354,6 @@ body { &-clear, &-clock-icon { - background-color: @modalBg !important; color: #01b6e3 !important; } @@ -370,8 +376,6 @@ body { // 输入框样式 .ant-input { - background-color: @formInputBgColor !important; - border-color: @formInputBorderColor !important; border-radius: 0; color: #fff; &::placeholder { diff --git a/src/views/spectrumAnalysis/components/BetaGammaSpectrumChart.vue b/src/views/spectrumAnalysis/components/BetaGammaSpectrumChart.vue index 4e4cadc..2536365 100644 --- a/src/views/spectrumAnalysis/components/BetaGammaSpectrumChart.vue +++ b/src/views/spectrumAnalysis/components/BetaGammaSpectrumChart.vue @@ -12,7 +12,7 @@ Unzoom
- +
[] + }, + boundary: { + type: Array, + default: () => [] } }, components: { @@ -317,6 +378,13 @@ export default { // 点击改变Beta-Gamma Spectrum: Sample图表类型 handleChange(index) { this.active = index + + // 因第一个二维的图表采用的v-show，而在该图表不显示的时候，且改变了浏览器大小触发resize时，大小会变为0, 故在切换回来的时候resize一下 + if (this.active == 0) { + this.$nextTick(() => { + this.resize() + }) + } }, // 点击unzoom @@ -359,19 +427,23 @@ export default { handleMouseUp() { setTimeout(() => { const chart = this.$refs.chartRef.getChartInstance() - // 清理刷选的范围 - chart.dispatchAction({ - type: 'brush', - areas: [] - }) - - // 改为不可刷选状态 - chart.dispatchAction({ - type: 'takeGlobalCursor' - }) + this.clearBrush(chart) }, 0) }, + clearBrush(chart) { + // 清理刷选的范围 + chart.dispatchAction({ + type: 'brush', + areas: [] + }) + + // 改为不可刷选状态 + chart.dispatchAction({ + type: 'takeGlobalCursor' + }) + }, + // 刷选完毕时 handleBrushEnd(param) { const chart = this.$refs.chartRef.getChartInstance() @@ -393,16 +465,7 @@ export default { this.emitRangeChange([x1, x2, y1, y2]) } - // 清理刷选的范围 - chart.dispatchAction({ - type: 'brush', - areas: [] - }) - - // 改为不可刷选状态 - chart.dispatchAction({ - type: 'takeGlobalCursor' - }) + this.clearBrush(chart) }, // 通知上层范围改变 @@ -435,14 +498,16 @@ export default { } }, watch: { + // 2D 图表 histogramDataList: { handler(newVal) { this.active = 0 - this.twoDOption.series.data = newVal.filter(item => item.c).map(item => [item.b, item.g, item.c]) // 设置2D Scatter数据 + this.twoDOption.series[0].data = newVal.filter(item => item.c).map(item => [item.b, item.g, item.c]) // 设置2D Scatter数据 }, immediate: true }, + // 3D 图表 histogramDataDList: { handler(newVal) { const maxCount = Math.max(...newVal.map(item => item.c)) @@ -457,6 +522,15 @@ export default { immediate: true }, + // 2D 图表 上的 矩形 + boundary: { + handler(newVal) { + console.log('%c [ ]-462', 'font-size:13px; background:pink; color:#bf2c9f;', newVal) + this.twoDOption.series[1].data = newVal.map(({ minX, minY, maxX, maxY }) => [minX, minY, maxX, maxY]) + }, + immediate: true + }, + currCount: { handler(val) { if (val <= this.maxCount) { @@ -466,9 +540,9 @@ export default { val / this.maxCount ) - this.twoDOption.series.itemStyle.color = `rgb(${r}, ${g}, ${b})` + this.twoDOption.series[0].itemStyle.color = `rgb(${r}, ${g}, ${b})` } else { - this.twoDOption.series.itemStyle.color = '#fff' + this.twoDOption.series[0].itemStyle.color = '#fff' } }, immediate: true diff --git a/src/views/spectrumAnalysis/components/Modals/AnalyzeSettingModal.vue b/src/views/spectrumAnalysis/components/Modals/AnalyzeSettingModal.vue index db568f1..57d5fca 100644 --- a/src/views/spectrumAnalysis/components/Modals/AnalyzeSettingModal.vue +++ b/src/views/spectrumAnalysis/components/Modals/AnalyzeSettingModal.vue @@ -4,7 +4,7 @@ :width="900" title="Analysis Settings" class="analysis-settings" - :okHanlder="handleOk" + :okHandler="handleOk" >
diff --git a/src/views/spectrumAnalysis/components/Modals/ArrRrrModal.vue b/src/views/spectrumAnalysis/components/Modals/ArrRrrModal.vue index 32b455f..086c2e9 100644 --- a/src/views/spectrumAnalysis/components/Modals/ArrRrrModal.vue +++ b/src/views/spectrumAnalysis/components/Modals/ArrRrrModal.vue @@ -1,9 +1,8 @@