稳态、暂态电能质量,稳态质量效果各个弹框
This commit is contained in:
@@ -8,10 +8,16 @@
|
||||
<el-descriptions-item align="center" label="不可容忍">{{ data.bkrr }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<my-echart
|
||||
ref="chartRef"
|
||||
class="tall"
|
||||
:options="echartList"
|
||||
:style="{ width: prop.width, height: `calc(${prop.height} - 80px)` }"
|
||||
@chart-click="handleChartClick"
|
||||
/>
|
||||
<el-dialog v-model="isWaveCharts" draggable title="瞬时/RMS波形" append-to-body width="70%">
|
||||
<waveFormAnalysis v-loading="loading" v-if="isWaveCharts" ref="waveFormAnalysisRef"
|
||||
@handleHideCharts="isWaveCharts = false" :wp="wp" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
@@ -22,6 +28,7 @@ import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import { getTimeOfTheMonth } from '@/utils/formatTime'
|
||||
import waveFormAnalysis from '@/views/govern/device/control/tabs/components/waveFormAnalysis.vue';
|
||||
const prop = defineProps({
|
||||
width: { type: String },
|
||||
height: { type: String },
|
||||
@@ -30,6 +37,15 @@ const prop = defineProps({
|
||||
})
|
||||
|
||||
const echartList = ref({})
|
||||
|
||||
const chartRef = ref()
|
||||
// 波形
|
||||
const isWaveCharts = ref(false)
|
||||
|
||||
const loading = ref(false)
|
||||
|
||||
const wp = ref({})
|
||||
|
||||
const OverLimitDetailsRef = ref()
|
||||
const data = reactive({
|
||||
name: '事件个数',
|
||||
@@ -64,7 +80,11 @@ const tableStore: any = new TableStore({
|
||||
text: `F47曲线`
|
||||
},
|
||||
legend: {
|
||||
data: ['上限', '下限', '可容忍事件', '不可容忍事件']
|
||||
// data: ['上限', '下限', '可容忍事件', '不可容忍事件'],
|
||||
data: ['可容忍事件', '不可容忍事件'],
|
||||
itemWidth: 10,
|
||||
itemHeight: 10,
|
||||
itemGap: 15
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
@@ -141,13 +161,40 @@ const tableStore: any = new TableStore({
|
||||
name: '可容忍事件',
|
||||
type: 'scatter',
|
||||
symbol: 'circle',
|
||||
data: gongData.pointF
|
||||
symbolSize: 8,
|
||||
// data: gongData.pointF,
|
||||
data: [
|
||||
[0.2, 10, '2023-01-01 10:00:00'],
|
||||
[0.4, 50, '2023-01-01 11:00:00']
|
||||
],
|
||||
legendSymbol: 'circle',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
itemStyle: {
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2,
|
||||
shadowBlur: 10,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
show: true,
|
||||
trigger: 'item',
|
||||
formatter: function (params: any) {
|
||||
return `<strong>可容忍事件</strong><br/>
|
||||
持续时间: ${params.value[0]}s<br/>
|
||||
特征幅值: ${params.value[1].toFixed(2)}%<br/>
|
||||
发生时间: ${params.value[2] || 'N/A'}`
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '不可容忍事件',
|
||||
type: 'scatter',
|
||||
symbol: 'circle',
|
||||
data: gongData.pointFun
|
||||
symbol: 'rect',
|
||||
symbolSize: 8,
|
||||
data: gongData.pointFun,
|
||||
legendSymbol: 'rect'
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -323,6 +370,32 @@ onMounted(() => {
|
||||
tableStore.index()
|
||||
}, 100)
|
||||
})
|
||||
|
||||
// 点击事件处理函数
|
||||
const handleChartClick = (params: any) => {
|
||||
|
||||
if (params.seriesName === '可容忍事件') {
|
||||
// 处理可容忍事件点击
|
||||
ElMessage.info(`点击了可容忍事件: 持续时间${params.value[0]}s, 幅值${params.value[1].toFixed(2)}%`)
|
||||
handleTolerableEventClick(params)
|
||||
} else if (params.seriesName === '不可容忍事件') {
|
||||
// 处理不可容忍事件点击
|
||||
ElMessage.info(`点击了不可容忍事件: 持续时间${params.value[0]}s, 幅值${params.value[1].toFixed(2)}%`)
|
||||
handleIntolerableEventClick(params)
|
||||
}
|
||||
}
|
||||
|
||||
// 可容忍事件点击处理函数
|
||||
const handleTolerableEventClick = (params: any) => {
|
||||
console.log('可容忍事件详情:', params)
|
||||
isWaveCharts.value = true
|
||||
}
|
||||
|
||||
// 不可容忍事件点击处理函数
|
||||
const handleIntolerableEventClick = (params: any) => {
|
||||
console.log('不可容忍事件详情:', params)
|
||||
}
|
||||
|
||||
watch(
|
||||
() => prop.timeKey,
|
||||
val => {
|
||||
|
||||
Reference in New Issue
Block a user