diff --git a/src/api/harmonic-boot/cockpit/cockpit.ts b/src/api/harmonic-boot/cockpit/cockpit.ts index fa3524f..ef50e90 100644 --- a/src/api/harmonic-boot/cockpit/cockpit.ts +++ b/src/api/harmonic-boot/cockpit/cockpit.ts @@ -70,6 +70,14 @@ export function limitExtentData(data: any) { data: data }) } +// 指标日趋势图数据 +export function limitExtentDayData(data: any) { + return request({ + url: '/harmonic-boot/limitRateDetailD/limitExtentDayData', + method: 'post', + data: data + }) +} diff --git a/src/components/cockpit/F47Curve/index.vue b/src/components/cockpit/F47Curve/index.vue index 6011c86..fc07852 100644 --- a/src/components/cockpit/F47Curve/index.vue +++ b/src/components/cockpit/F47Curve/index.vue @@ -12,12 +12,20 @@ ref="chartRef" class="tall" :options="echartList" - :style="{ width: prop.width, height: `calc(${prop.height} - 80px - ${headerHeight}px + ${fullscreen ? 0 : 56}px)` }" + :style="{ + width: prop.width, + height: `calc(${prop.height} - 80px - ${headerHeight}px + ${fullscreen ? 0 : 56}px)` + }" @chart-click="handleChartClick" /> - + @@ -27,10 +35,11 @@ import TableStore from '@/utils/tableStore' import MyEchart from '@/components/echarts/MyEchart.vue' import { ElMessage, ElMessageBox } from 'element-plus' import { getTimeOfTheMonth } from '@/utils/formatTime' -import waveFormAnalysis from '@/views/govern/device/control/tabs/components/waveFormAnalysis.vue'; +import waveFormAnalysis from '@/views/govern/device/control/tabs/components/waveFormAnalysis.vue' import TableHeader from '@/components/table/header/index.vue' import { useRoute } from 'vue-router' import { useTimeCacheStore } from '@/stores/timeCache' +import { analyseWave } from '@/api/common' const prop = defineProps({ w: { type: String }, @@ -79,7 +88,10 @@ const loading = ref(false) const wp = ref({}) -const OverLimitDetailsRef = ref() +const boxoList: any = ref({}) + +const waveFormAnalysisRef: any = ref(null) + const data = reactive({ name: '事件个数', gs: 0, @@ -93,7 +105,7 @@ const tableStore: any = new TableStore({ showPage: false, column: [], - beforeSearchFun: () => { + beforeSearchFun: () => { // 尝试从缓存获取时间值 let beginTime, endTime @@ -419,7 +431,6 @@ onMounted(() => { // 点击事件处理函数 const handleChartClick = (params: any) => { - if (params.seriesName === '可容忍事件') { // 处理可容忍事件点击 ElMessage.info(`点击了可容忍事件: 持续时间${params.value[0]}s, 幅值${params.value[1].toFixed(2)}%`) @@ -432,9 +443,30 @@ const handleChartClick = (params: any) => { } // 可容忍事件点击处理函数 -const handleTolerableEventClick = (params: any) => { - console.log('可容忍事件详情:', params) +const handleTolerableEventClick = async (row: any) => { + console.log('可容忍事件详情:', row) isWaveCharts.value = true + loading.value = true + isWaveCharts.value = true + await analyseWave(row.id) + .then(res => { + row.loading1 = false + if (res != undefined) { + boxoList.value = row + boxoList.value.featureAmplitude = row.evtParamVVaDepth != '-' ? row.evtParamVVaDepth - 0 : null + boxoList.value.systemType = 'WX' + wp.value = res.data + } + loading.value = false + }) + .catch(() => { + row.loading1 = false + loading.value = false + }) + + nextTick(() => { + waveFormAnalysisRef.value && waveFormAnalysisRef.value.getWpData(wp.value, boxoList.value, true) + }) } // 不可容忍事件点击处理函数 diff --git a/src/components/cockpit/exceedanceLevel/components/dailyTrendChart.vue b/src/components/cockpit/exceedanceLevel/components/dailyTrendChart.vue index da7f3a3..12a3056 100644 --- a/src/components/cockpit/exceedanceLevel/components/dailyTrendChart.vue +++ b/src/components/cockpit/exceedanceLevel/components/dailyTrendChart.vue @@ -1,11 +1,9 @@ @@ -13,6 +11,9 @@ import { ref, onMounted, provide, reactive, watch, h } from 'vue' import MyEchart from '@/components/echarts/MyEchart.vue' import { useConfig } from '@/stores/config' +import { mainHeight } from '@/utils/layout' +import { limitExtentDayData } from '@/api/harmonic-boot/cockpit/cockpit' + const prop = defineProps({ width: { type: String }, height: { type: String }, @@ -20,70 +21,130 @@ const prop = defineProps({ timeValue: { type: Object } }) +const pageHeight = ref(mainHeight(332)) + const dialogVisible: any = ref(false) +const dialogTitle = ref('') const config = useConfig() -const echartList = ref({ - title: { - text: '指标日趋势图', - }, - xAxis: { - type: 'category', - data: [ - '00:00', '01:00', '02:00', '03:00', '04:00', '05:00', - '06:00', '07:00', '08:00', '09:00', '10:00', '11:00', - '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', - '18:00', '19:00', '20:00', '21:00', '22:00', '23:00' - ], - axisLabel: { - interval: 1 - } - }, - yAxis: { - type: 'value', - name: '数值' - }, - grid: { - left: '10px', - right: '20px', - containLabel: true - }, - options: { - series: [ - { - name: '指标值', - type: 'line', - showSymbol: true, - smooth: true, - data: [ - 10, 12, 15, 18, 22, 28, - 35, 45, 60, 75, 88, 95, - 100, 98, 90, 80, 70, 60, - 50, 40, 30, 25, 20, 15 - ], - itemStyle: { - normal: { - color: config.layout.elementUiPrimary[0] +const dialogText = ref('') + +const echartList = ref() + +const init = () => { + echartList.value = { + title: { + text: dialogText.value, + textStyle: { + fontSize: 14, + rich: { + lineName: { + color: '#333', + fontSize: 14 + }, + timeLabel: { + color: '#333', + fontSize: 14, + padding: [0, 0, 0, 10] + }, + name: { + color: '#333', + fontSize: 14, + padding: [0, 0, 0, 10] } - }, - areaStyle: { - opacity: 0.3 } } - ] + }, + xAxis: { + type: 'category', + data: [] + }, + yAxis: { + type: 'value', + name: '数值' + }, + grid: { + left: '1%', + right: '45px', + bottom: '40px', + top: '15%', + containLabel: true + }, + dataZoom: [ + { + type: 'inside', + height: 13, + start: 0, + bottom: '20px', + end: 100 + }, + { + start: 0, + height: 13, + bottom: '20px', + end: 100 + } + ], + options: { + series: [] + } } -}) +} +const initData = async (row: any) => { + limitExtentDayData({ code: row.code, lineId: row.lineId, time: row.time }).then(res => { + if (res.data && res.data.length > 0) { + // 重新初始化图表 + init() -onMounted(() => { - -}) + // 从第一条数据中提取时间作为x轴数据 + const firstItem = res.data[0] + const xAxisData = firstItem.time.split(',') + // 定义相位颜色映射 + const phaseColors: any = { + A: '#DAA520', + B: '#2E8B57', + C: '#A52a2a' + } + + // 处理每条相位数据 + const seriesData = res.data.map((item: any) => { + const values = item.value.split(',').map((v: string) => parseFloat(v) || 0) + + return { + name: `${item.phasic}相`, + type: 'line', + showSymbol: true, + smooth: true, + data: values, + itemStyle: { + normal: { + // 根据相位设置对应颜色 + color: phaseColors[item.phasic] || config.layout.elementUiPrimary[0] + } + } + } + }) + + // 更新图表配置 + echartList.value.xAxis.data = xAxisData + echartList.value.options.series = seriesData + } + }) +} + +onMounted(() => {}) const open = async (row: any) => { dialogVisible.value = true + dialogTitle.value = row.name + '日趋势图' + dialogText.value = `{lineName|${row.lineName}}{timeLabel|${row.time}}{name|${row.name}日趋势图}` + nextTick(() => { + initData(row) + }) } defineExpose({ open }) diff --git a/src/components/cockpit/exceedanceLevel/index.vue b/src/components/cockpit/exceedanceLevel/index.vue index 4c8778e..99575d5 100644 --- a/src/components/cockpit/exceedanceLevel/index.vue +++ b/src/components/cockpit/exceedanceLevel/index.vue @@ -66,34 +66,6 @@ const fullscreen = computed(() => { const echartList = ref() -// const echartList = ref({ -// title: { -// text: '指标越限严重度' -// }, - -// xAxis: { -// data: ['闪变', '谐波电压', '谐波电流', '电压偏差', '三相不平衡'] -// }, - -// yAxis: { -// name: '%', // 给X轴加单位 -// interval: 20 -// }, -// grid: { -// left: '10px', -// right: '20px' -// }, -// options: { -// series: [ -// { -// type: 'bar', -// name: '越限占比', -// data: [0, 7.5, 36, 0, 80], -// barMaxWidth: 30 -// } -// ] -// } -// }) const dailyTrendChartRef = ref() const tableStore: any = new TableStore({ url: '/harmonic-boot/limitRateDetailD/limitExtentData', @@ -122,7 +94,7 @@ const tableStore: any = new TableStore({ minWidth: '60', render: 'customTemplate', customTemplate: (row: any) => { - return `${row.type}` + return `${row.maxValue}` } }, { @@ -138,12 +110,32 @@ const tableStore: any = new TableStore({ { title: '发生日期', field: 'time', - minWidth: '100' + minWidth: '60', + render: 'customTemplate', + customTemplate: (row: any) => { + if ( + row.time !== null && + row.time !== undefined && + row.time !== '' + ) { + return `${row.time}` + } else { + return `/` + } + } }, { title: '越限最高监测点', field: 'lineName', - minWidth: '90' + minWidth: '90', + render: 'customTemplate', + customTemplate: (row: any) => { + if (row.lineName !== null && row.lineName !== undefined && row.lineName !== '') { + return `${row.lineName}` + } else { + return `/` + } + } } ], beforeSearchFun: () => { @@ -166,12 +158,12 @@ const tableStore: any = new TableStore({ // 定义 x 轴标签顺序 const xAxisLabels = ['闪变', '谐波电压', '谐波电流', '电压偏差', '三相不平衡'] - // 根据指标名称顺序提取对应的 maxValue 数据 + // 根据指标名称顺序提取对应的 extent 数据 const chartData = xAxisLabels.map(label => { // 在表格数据中查找对应指标名称的数据项 const item = tableStore.table.data.find((row: any) => row.name === label) - // 如果找到对应项，则返回 maxValue 值，否则返回 0 - return item ? parseFloat(item.maxValue) || 0 : 0 + // 如果找到对应项，则返回 extent 值，否则返回 0 + return item ? item.extent || 0 : 0 }) echartList.value = { title: { @@ -183,8 +175,8 @@ const tableStore: any = new TableStore({ }, yAxis: { - name: '%', // 给X轴加单位 - interval: 20 + name: '%' // 给X轴加单位 + // interval: 20 }, grid: { left: '10px', @@ -211,8 +203,7 @@ provide('tableStore', tableStore) // 点击行 const cellClickEvent = ({ row, column }: any) => { - if (column.field != 'name') { - console.log(row) + if (column.field == 'maxValue' && row.lineId) { dailyTrendChartRef.value.open(row) } } diff --git a/src/components/cockpit/indicatorFittingChart/components/harmonicRatio‌.vue b/src/components/cockpit/indicatorFittingChart/components/harmonicRatio‌.vue index 375c9be..34e966b 100644 --- a/src/components/cockpit/indicatorFittingChart/components/harmonicRatio‌.vue +++ b/src/components/cockpit/indicatorFittingChart/components/harmonicRatio‌.vue @@ -1,5 +1,5 @@