监测点列表详情
This commit is contained in:
@@ -1,10 +1,27 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 主要监测点列表查询
|
||||
// 主要监测点列表查询>>分页
|
||||
export function mainLineList(data: any) {
|
||||
return request({
|
||||
url: '/harmonic-boot/mainLine/list',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
// 主要监测点指标越限详情
|
||||
export function statLimitRateDetails(data: any) {
|
||||
return request({
|
||||
url: '/harmonic-boot/mainLine/statLimitRateDetails',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 查询监测点列表=全部>>不分页
|
||||
export function cslineList(data: any) {
|
||||
return request({
|
||||
url: '/cs-device-boot/csline/list',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
@@ -0,0 +1,430 @@
|
||||
<template>
|
||||
<!-- 总体指标占比详情谐波含有率 -->
|
||||
<el-dialog draggable title="谐波电压/电流含有率" v-model="dialogVisible" append-to-body width="70%">
|
||||
<TableHeader
|
||||
datePicker
|
||||
showExport
|
||||
:showReset="false"
|
||||
@selectChange="selectChange"
|
||||
ref="tableHeaderRef"
|
||||
>
|
||||
<template v-slot:select>
|
||||
<el-form-item label="谐波次数">
|
||||
<el-select
|
||||
v-model="tableStore.table.params.searchValue"
|
||||
placeholder="请选择谐波次数"
|
||||
style="width: 150px"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in harmonicOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="指标类型" v-show="!tableStore.table.params.checked">
|
||||
<el-select
|
||||
v-model="tableStore.table.params.indicatorType"
|
||||
placeholder="请选择指标类型"
|
||||
style="width: 150px"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in indicatorList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="指标类型1" v-show="tableStore.table.params.checked == true">
|
||||
<el-select
|
||||
v-model="tableStore.table.params.indicatorType1"
|
||||
placeholder="请选择指标类型1"
|
||||
style="width: 150px"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in indicatorList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="指标类型2" v-show="tableStore.table.params.checked == true">
|
||||
<el-select
|
||||
v-model="tableStore.table.params.indicatorType2"
|
||||
placeholder="请选择指标类型2"
|
||||
style="width: 150px"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in indicatorList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-checkbox v-model="tableStore.table.params.checked">指标对比分析</el-checkbox>
|
||||
</el-form-item>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<my-echart
|
||||
class="tall"
|
||||
v-if="!tableStore.table.params.checked"
|
||||
:options="echartList"
|
||||
style="width: 98%; height: 320px"
|
||||
/>
|
||||
<my-echart class="tall" v-else :options="echartContrastList" style="width: 98%; height: 320px" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, provide, reactive, watch, h } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
|
||||
|
||||
|
||||
const dialogVisible: any = ref(false)
|
||||
|
||||
const tableHeaderRef = ref()
|
||||
|
||||
|
||||
const harmonicOptions = Array.from({ length: 25 }, (_, i) => ({
|
||||
value: String(i + 1),
|
||||
label: `${i + 1}次谐波`
|
||||
}))
|
||||
|
||||
const exceedingTheLimitList: any = ref([
|
||||
{
|
||||
label: '越限',
|
||||
value: '1'
|
||||
},
|
||||
{
|
||||
label: '不越限',
|
||||
value: '0'
|
||||
}
|
||||
])
|
||||
const indicatorList: any = ref([
|
||||
{
|
||||
label: '闪变',
|
||||
value: '1'
|
||||
},
|
||||
{
|
||||
label: '各次谐波电压',
|
||||
value: '2'
|
||||
},
|
||||
{
|
||||
label: '各次谐波电压',
|
||||
value: '3'
|
||||
},
|
||||
{
|
||||
label: '三相电压不平衡',
|
||||
value: '4'
|
||||
}
|
||||
])
|
||||
const echartList = ref({
|
||||
title: {
|
||||
text: '谐波电压含有率'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'time',
|
||||
axisLabel: {
|
||||
formatter: {
|
||||
day: '{MM}-{dd}',
|
||||
month: '{MM}',
|
||||
year: '{yyyy}'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: [{}, {}],
|
||||
grid: {
|
||||
left: '10px',
|
||||
right: '20px'
|
||||
},
|
||||
options: {
|
||||
series: [
|
||||
{
|
||||
name: 'A相',
|
||||
type: 'line',
|
||||
showSymbol: false,
|
||||
smooth: true,
|
||||
data: [
|
||||
['2025-10-16 07:00:00', 0.5],
|
||||
['2025-10-16 07:15:00', 0.6],
|
||||
['2025-10-16 07:30:00', 0.4],
|
||||
['2025-10-16 07:45:00', 0.7],
|
||||
['2025-10-16 08:00:00', 1.2],
|
||||
['2025-10-16 08:15:00', 1.5],
|
||||
['2025-10-16 08:30:00', 1.8],
|
||||
['2025-10-16 08:45:00', 2.1],
|
||||
['2025-10-16 09:00:00', 2.5],
|
||||
['2025-10-16 09:15:00', 2.8],
|
||||
['2025-10-16 09:30:00', 3.0],
|
||||
['2025-10-16 09:45:00', 2.7],
|
||||
['2025-10-16 10:00:00', 2.2],
|
||||
['2025-10-16 10:15:00', 1.9],
|
||||
['2025-10-16 10:30:00', 1.6],
|
||||
['2025-10-16 10:45:00', 1.3],
|
||||
['2025-10-16 11:00:00', 1.1],
|
||||
['2025-10-16 11:15:00', 0.8],
|
||||
['2025-10-16 11:30:00', 0.6],
|
||||
['2025-10-16 11:45:00', 0.4],
|
||||
['2025-10-16 12:00:00', 0.3],
|
||||
['2025-10-16 12:15:00', 0.2],
|
||||
['2025-10-16 12:30:00', 0.3],
|
||||
['2025-10-16 12:45:00', 0.4]
|
||||
],
|
||||
yAxisIndex: 0
|
||||
},
|
||||
{
|
||||
name: 'B相',
|
||||
type: 'line',
|
||||
showSymbol: false,
|
||||
smooth: true,
|
||||
data: [
|
||||
['2025-10-16 07:00:00', 0.4],
|
||||
['2025-10-16 07:15:00', 0.5],
|
||||
['2025-10-16 07:30:00', 0.3],
|
||||
['2025-10-16 07:45:00', 0.6],
|
||||
['2025-10-16 08:00:00', 1.0],
|
||||
['2025-10-16 08:15:00', 1.3],
|
||||
['2025-10-16 08:30:00', 1.6],
|
||||
['2025-10-16 08:45:00', 1.9],
|
||||
['2025-10-16 09:00:00', 2.2],
|
||||
['2025-10-16 09:15:00', 2.5],
|
||||
['2025-10-16 09:30:00', 2.7],
|
||||
['2025-10-16 09:45:00', 2.4],
|
||||
['2025-10-16 10:00:00', 2.0],
|
||||
['2025-10-16 10:15:00', 1.7],
|
||||
['2025-10-16 10:30:00', 1.4],
|
||||
['2025-10-16 10:45:00', 1.1],
|
||||
['2025-10-16 11:00:00', 0.9],
|
||||
['2025-10-16 11:15:00', 0.7],
|
||||
['2025-10-16 11:30:00', 0.5],
|
||||
['2025-10-16 11:45:00', 0.3],
|
||||
['2025-10-16 12:00:00', 0.2],
|
||||
['2025-10-16 12:15:00', 0.1],
|
||||
['2025-10-16 12:30:00', 0.2],
|
||||
['2025-10-16 12:45:00', 0.3]
|
||||
],
|
||||
yAxisIndex: 0
|
||||
},
|
||||
{
|
||||
name: 'C相',
|
||||
type: 'line',
|
||||
showSymbol: false,
|
||||
smooth: true,
|
||||
data: [
|
||||
['2025-10-16 07:00:00', 0.6],
|
||||
['2025-10-16 07:15:00', 0.7],
|
||||
['2025-10-16 07:30:00', 0.5],
|
||||
['2025-10-16 07:45:00', 0.8],
|
||||
['2025-10-16 08:00:00', 1.4],
|
||||
['2025-10-16 08:15:00', 1.7],
|
||||
['2025-10-16 08:30:00', 2.0],
|
||||
['2025-10-16 08:45:00', 2.3],
|
||||
['2025-10-16 09:00:00', 2.8],
|
||||
['2025-10-16 09:15:00', 3.1],
|
||||
['2025-10-16 09:30:00', 3.3],
|
||||
['2025-10-16 09:45:00', 3.0],
|
||||
['2025-10-16 10:00:00', 2.5],
|
||||
['2025-10-16 10:15:00', 2.1],
|
||||
['2025-10-16 10:30:00', 1.8],
|
||||
['2025-10-16 10:45:00', 1.5],
|
||||
['2025-10-16 11:00:00', 1.3],
|
||||
['2025-10-16 11:15:00', 1.0],
|
||||
['2025-10-16 11:30:00', 0.8],
|
||||
['2025-10-16 11:45:00', 0.6],
|
||||
['2025-10-16 12:00:00', 0.5],
|
||||
['2025-10-16 12:15:00', 0.4],
|
||||
['2025-10-16 12:30:00', 0.5],
|
||||
['2025-10-16 12:45:00', 0.6]
|
||||
],
|
||||
yAxisIndex: 0
|
||||
},
|
||||
{
|
||||
name: '暂降触发点',
|
||||
type: 'line',
|
||||
showSymbol: false,
|
||||
smooth: true,
|
||||
data: [
|
||||
['2025-10-16 07:00:00', 3.14159],
|
||||
['2025-10-16 07:15:00', 3.14159],
|
||||
['2025-10-16 07:30:00', 3.14159],
|
||||
['2025-10-16 07:45:00', 3.14159],
|
||||
['2025-10-16 08:00:00', 3.14159],
|
||||
['2025-10-16 08:15:00', 3.14159],
|
||||
['2025-10-16 08:30:00', 3.14159],
|
||||
['2025-10-16 08:45:00', 3.14159],
|
||||
['2025-10-16 09:00:00', 3.14159],
|
||||
['2025-10-16 09:15:00', 3.14159],
|
||||
['2025-10-16 09:30:00', 3.14159],
|
||||
['2025-10-16 09:45:00', 3.14159],
|
||||
['2025-10-16 10:00:00', 3.14159],
|
||||
['2025-10-16 10:15:00', 3.14159],
|
||||
['2025-10-16 10:30:00', 3.14159],
|
||||
['2025-10-16 10:45:00', 3.14159],
|
||||
['2025-10-16 11:00:00', 3.14159],
|
||||
['2025-10-16 11:15:00', 3.14159],
|
||||
['2025-10-16 11:30:00', 3.14159],
|
||||
['2025-10-16 11:45:00', 3.14159],
|
||||
['2025-10-16 12:00:00', 3.14159],
|
||||
['2025-10-16 12:15:00', 3.14159],
|
||||
['2025-10-16 12:30:00', 3.14159],
|
||||
['2025-10-16 12:45:00', 3.14159]
|
||||
],
|
||||
lineStyle: {
|
||||
type: 'dashed',
|
||||
color: '#ff0000' // 红色
|
||||
},
|
||||
itemStyle: {
|
||||
color: '#ff0000' // 红色
|
||||
},
|
||||
yAxisIndex: 0
|
||||
}
|
||||
]
|
||||
}
|
||||
})
|
||||
|
||||
const echartContrastList = ref({
|
||||
title: {
|
||||
text: 'A相谐波电压和A相谐波电流对比趋势图'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'time',
|
||||
axisLabel: {
|
||||
formatter: {
|
||||
day: '{MM}-{dd}',
|
||||
month: '{MM}',
|
||||
year: '{yyyy}'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: [{}, {}],
|
||||
grid: {
|
||||
left: '10px',
|
||||
right: '20px'
|
||||
},
|
||||
options: {
|
||||
series: [
|
||||
{
|
||||
name: 'A相谐波电压',
|
||||
type: 'line',
|
||||
showSymbol: false,
|
||||
smooth: true,
|
||||
data: [
|
||||
['2025-10-16 07:00:00', 0],
|
||||
['2025-10-16 07:15:00', 0],
|
||||
['2025-10-16 07:30:00', 0],
|
||||
['2025-10-16 07:45:00', 0],
|
||||
['2025-10-16 08:00:00', 0],
|
||||
['2025-10-16 08:15:00', 0.1],
|
||||
['2025-10-16 08:30:00', 0.1],
|
||||
['2025-10-16 08:45:00', 0.1],
|
||||
['2025-10-16 09:00:00', 1],
|
||||
['2025-10-16 09:15:00', 1],
|
||||
['2025-10-16 09:30:00', 1],
|
||||
['2025-10-16 09:45:00', 1],
|
||||
['2025-10-16 10:00:00', 0.8],
|
||||
['2025-10-16 10:15:00', 0.8],
|
||||
['2025-10-16 10:30:00', 0.8],
|
||||
['2025-10-16 10:45:00', 0.8],
|
||||
['2025-10-16 11:00:00', 0.8],
|
||||
['2025-10-16 11:15:00', 0.1],
|
||||
['2025-10-16 11:30:00', 0.1],
|
||||
['2025-10-16 11:45:00', 0.1],
|
||||
['2025-10-16 12:00:00', 0],
|
||||
['2025-10-16 12:15:00', 0],
|
||||
['2025-10-16 12:30:00', 0],
|
||||
['2025-10-16 12:45:00', 0]
|
||||
],
|
||||
yAxisIndex: 0
|
||||
},
|
||||
{
|
||||
name: 'A相谐波电流',
|
||||
type: 'line',
|
||||
showSymbol: false,
|
||||
smooth: true,
|
||||
data: [
|
||||
['2025-10-16 07:00:00', 0],
|
||||
['2025-10-16 07:15:00', 0],
|
||||
['2025-10-16 07:30:00', 0],
|
||||
['2025-10-16 07:45:00', 0],
|
||||
['2025-10-16 08:00:00', 0],
|
||||
['2025-10-16 08:15:00', 0.05],
|
||||
['2025-10-16 08:30:00', 0.05],
|
||||
['2025-10-16 08:45:00', 0.05],
|
||||
['2025-10-16 09:00:00', 0.5],
|
||||
['2025-10-16 09:15:00', 0.5],
|
||||
['2025-10-16 09:30:00', 0.5],
|
||||
['2025-10-16 09:45:00', 0.5],
|
||||
['2025-10-16 10:00:00', 0.4],
|
||||
['2025-10-16 10:15:00', 0.4],
|
||||
['2025-10-16 10:30:00', 0.4],
|
||||
['2025-10-16 10:45:00', 0.4],
|
||||
['2025-10-16 11:00:00', 0.4],
|
||||
['2025-10-16 11:15:00', 0.05],
|
||||
['2025-10-16 11:30:00', 0.05],
|
||||
['2025-10-16 11:45:00', 0.05],
|
||||
['2025-10-16 12:00:00', 0],
|
||||
['2025-10-16 12:15:00', 0],
|
||||
['2025-10-16 12:30:00', 0],
|
||||
['2025-10-16 12:45:00', 0]
|
||||
],
|
||||
yAxisIndex: 1
|
||||
}
|
||||
]
|
||||
}
|
||||
})
|
||||
|
||||
const headerHeight = ref(57)
|
||||
const selectChange = (showSelect: any, height: any) => {
|
||||
headerHeight.value = height
|
||||
}
|
||||
const tableStore: any = new TableStore({
|
||||
url: '/harmonic-boot/mainLine/statLimitRateDetails11',
|
||||
method: 'POST',
|
||||
|
||||
showPage: false,
|
||||
exportName: '主要监测点列表',
|
||||
column: [],
|
||||
beforeSearchFun: () => {},
|
||||
loadCallback: () => {
|
||||
}
|
||||
})
|
||||
|
||||
const tableRef = ref()
|
||||
provide('tableRef', tableRef)
|
||||
tableStore.table.params.power = '1'
|
||||
tableStore.table.params.indicator = '1'
|
||||
tableStore.table.params.exceedingTheLimit = '1'
|
||||
tableStore.table.params.checked = false
|
||||
tableStore.table.params.indicatorType = '' // 指标类型
|
||||
tableStore.table.params.indicatorType1 = '' // 指标类型1
|
||||
tableStore.table.params.indicatorType2 = '' // 指标类型2
|
||||
provide('tableStore', tableStore)
|
||||
|
||||
const openDialog = async (row: any, value: any) => {
|
||||
dialogVisible.value = true
|
||||
tableStore.table.params.searchValue = value
|
||||
|
||||
nextTick(() => {
|
||||
// 默认当天
|
||||
tableHeaderRef.value.setInterval(5)
|
||||
tableHeaderRef.value.setTimeInterval([row.time, row.time])
|
||||
|
||||
tableStore.index()
|
||||
})
|
||||
}
|
||||
|
||||
defineExpose({ openDialog })
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
:deep(.el-select) {
|
||||
min-width: 80px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,20 +1,20 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 综合评估详情 -->
|
||||
<el-dialog draggable title="指标合格率统计" v-model="dialogVisible" append-to-body width="70%">
|
||||
<TableHeader datePicker showExport :showReset="false">
|
||||
<!-- 指标越限详情 -->
|
||||
<el-dialog draggable title="指标越限详情" v-model="dialogVisible" append-to-body width="70%">
|
||||
<TableHeader datePicker showExport :showReset="false" ref="tableHeaderRef">
|
||||
<template v-slot:select>
|
||||
<el-form-item label="监测点名称">
|
||||
<el-form-item label="监测点">
|
||||
<el-select
|
||||
v-model="tableStore.table.params.searchValue"
|
||||
placeholder="请选择监测点名称"
|
||||
v-model="tableStore.table.params.lineId"
|
||||
placeholder="请选择监测点"
|
||||
style="width: 150px"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
:key="item.lineId"
|
||||
:label="item.name"
|
||||
:value="item.lineId"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
@@ -23,43 +23,41 @@
|
||||
<Table ref="tableRef" @cell-click="cellClickEvent" isGroup :height="height"></Table>
|
||||
</el-dialog>
|
||||
<!-- 谐波电流、谐波电压占有率 -->
|
||||
<HarmonicRatio ref="harmonicRatioRef" />
|
||||
<HarmonicRatio ref="harmonicRatioRef" @close="onHarmonicRatioClose" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, provide } from 'vue'
|
||||
import { ref, provide,nextTick } from 'vue'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import HarmonicRatio from '@/components/cockpit/listOfMainMonitoringPoints/components/harmonicRatio.vue'
|
||||
import HarmonicRatio from '@/components/cockpit/indicatorFittingChart/components/harmonicRatio.vue'
|
||||
import { cslineList } from '@/api/harmonic-boot/cockpit/cockpit'
|
||||
|
||||
const dialogVisible: any = ref(false)
|
||||
const harmonicRatioRef: any = ref(null)
|
||||
const options = [
|
||||
{
|
||||
value: '35kV进线',
|
||||
label: '35kV进线'
|
||||
}
|
||||
]
|
||||
|
||||
const options = ref()
|
||||
const height = mainHeight(0, 2).height as any
|
||||
const tableHeaderRef = ref()
|
||||
const loop50 = (key: string) => {
|
||||
let list: any[] = []
|
||||
for (let i = 2; i < 51; i++) {
|
||||
for (let i = 2; i < 26; i++) {
|
||||
list.push({
|
||||
title: i + '次',
|
||||
// field: key + i,
|
||||
field: 'flicker',
|
||||
field: key + i + 'Overtime',
|
||||
width: '80',
|
||||
// render: 'customTemplate',
|
||||
// customTemplate: (row: any) => {
|
||||
// return `<span style='cursor: pointer;text-decoration: underline;'>${row.flicker}</span>`
|
||||
// }
|
||||
render: 'customTemplate',
|
||||
customTemplate: (row: any) => {
|
||||
return `<span style='cursor: pointer;text-decoration: underline;'>${row[key + i + 'Overtime']}</span>`
|
||||
}
|
||||
})
|
||||
}
|
||||
return list
|
||||
}
|
||||
const tableStore: any = new TableStore({
|
||||
url: '/user-boot/role/selectRoleDetail?id=0',
|
||||
url: '/harmonic-boot/mainLine/statLimitRateDetails',
|
||||
method: 'POST',
|
||||
publicHeight: 30,
|
||||
showPage: false,
|
||||
@@ -76,82 +74,96 @@ const tableStore: any = new TableStore({
|
||||
{
|
||||
title: '日期',
|
||||
field: 'time',
|
||||
width: '150'
|
||||
width: '150',
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
title: '名称',
|
||||
field: 'name',
|
||||
field: 'lineName',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
title: '闪变越限(分钟)',
|
||||
field: 'flicker',
|
||||
field: 'flickerOvertime',
|
||||
width: '80',
|
||||
// render: 'customTemplate',
|
||||
// customTemplate: (row: any) => {
|
||||
// return `<span style='cursor: pointer;text-decoration: underline;'>${row.flicker}</span>`
|
||||
// }
|
||||
render: 'customTemplate',
|
||||
customTemplate: (row: any) => {
|
||||
return `<span style='cursor: pointer;text-decoration: underline;'>${row.flickerOvertime}</span>`
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '谐波电压越限(分钟)',
|
||||
children: loop50('voltage')
|
||||
children: loop50('uharm')
|
||||
},
|
||||
{
|
||||
title: '谐波电流越限(分钟)',
|
||||
children: loop50('harmonicCurrent')
|
||||
children: loop50('iharm')
|
||||
},
|
||||
{
|
||||
title: '三相不平衡度越限(分钟)',
|
||||
field: 'flicker',
|
||||
field: 'ubalanceOvertime',
|
||||
width: '100'
|
||||
},
|
||||
{
|
||||
title: '电压偏差越限(分钟)',
|
||||
field: 'flicker',
|
||||
field: 'uaberranceOvertime',
|
||||
width: '100'
|
||||
},
|
||||
{
|
||||
title: '频率偏差越限(分钟)',
|
||||
field: 'flicker',
|
||||
field: 'freqDevOvertime',
|
||||
width: '100'
|
||||
}
|
||||
],
|
||||
beforeSearchFun: () => {},
|
||||
beforeSearchFun: () => {
|
||||
},
|
||||
loadCallback: () => {
|
||||
tableStore.table.data = [
|
||||
{
|
||||
time: '2024-01-01 00:00:00',
|
||||
name: '35kV进线',
|
||||
flicker: '0'
|
||||
},
|
||||
{
|
||||
time: '2024-01-01 00:00:00',
|
||||
name: '35kV进线',
|
||||
flicker: '0'
|
||||
},
|
||||
{
|
||||
time: '2024-01-01 00:00:00',
|
||||
name: '35kV进线',
|
||||
flicker: '0'
|
||||
}
|
||||
]
|
||||
}
|
||||
})
|
||||
|
||||
tableStore.table.params.searchValue = ''
|
||||
|
||||
provide('tableStore', tableStore)
|
||||
const open = async (row: any) => {
|
||||
tableStore.table.params.sortBy = ''
|
||||
tableStore.table.params.orderBy = ''
|
||||
const open = async (row: any,searchBeginTime:any,searchEndTime:any) => {
|
||||
dialogVisible.value = true
|
||||
tableStore.index()
|
||||
initCSlineList()
|
||||
tableStore.table.params.lineId = row.lineId
|
||||
|
||||
nextTick(() => {
|
||||
tableHeaderRef.value.setTimeInterval([searchBeginTime, searchEndTime])
|
||||
tableStore.table.params.searchBeginTime =searchBeginTime
|
||||
tableStore.table.params.searchEndTime = searchEndTime
|
||||
tableStore.index()
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
// 点击行
|
||||
const cellClickEvent = ({ row, column }: any) => {
|
||||
if (column.field != 'name' && column.field != 'time') {
|
||||
harmonicRatioRef.value.openDialog(row)
|
||||
dialogVisible.value = false
|
||||
if(column.title && column.title=='闪变越限(分钟)'){
|
||||
column.title = '1次'
|
||||
}
|
||||
harmonicRatioRef.value.openDialog(row,column.title.replace(/次/g, ""))
|
||||
}
|
||||
}
|
||||
|
||||
// 谐波弹窗关闭时的回调
|
||||
const onHarmonicRatioClose = () => {
|
||||
// 重新打开指标越限详情弹窗
|
||||
nextTick(() => {
|
||||
dialogVisible.value = true
|
||||
})
|
||||
}
|
||||
|
||||
const initCSlineList = async () => {
|
||||
const res = await cslineList({})
|
||||
options.value = res.data
|
||||
}
|
||||
|
||||
|
||||
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
|
||||
@@ -1,14 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<!--主要监测点列表 -->
|
||||
<TableHeader
|
||||
:showReset="false"
|
||||
@selectChange="selectChange"
|
||||
v-if="fullscreen"
|
||||
datePicker
|
||||
:initialInterval="getInitialInterval()"
|
||||
:initialTimeValue="getInitialTimeValue()"
|
||||
>
|
||||
<TableHeader :showReset="false" @selectChange="selectChange" v-if="fullscreen" datePicker ref="tableHeaderRef">
|
||||
<template v-slot:select>
|
||||
<el-form-item label="关键词">
|
||||
<el-input v-model="tableStore.table.params.keywords" clearable placeholder="请输关键字" />
|
||||
@@ -18,14 +11,14 @@
|
||||
<Table
|
||||
ref="tableRef"
|
||||
@cell-click="cellClickEvent"
|
||||
:height="`calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px )`"
|
||||
:height="`calc(${prop.height} - ${headerHeight}px + ${fullscreen ? -50 : 56}px )`"
|
||||
></Table>
|
||||
<!-- 指标越限详情 -->
|
||||
<OverLimitDetails ref="OverLimitDetailsRef" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, provide, reactive, watch, h } from 'vue'
|
||||
import { ref, onMounted, provide, reactive, watch, nextTick } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
@@ -48,16 +41,7 @@ const headerHeight = ref(57)
|
||||
const route = useRoute()
|
||||
const timeCacheStore = useTimeCacheStore()
|
||||
|
||||
const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
|
||||
headerHeight.value = height
|
||||
|
||||
// 如果有传入 datePicker 的值
|
||||
if (datePickerValue) {
|
||||
// 更新表格参数
|
||||
tableStore.table.params.searchBeginTime = datePickerValue.timeValue?.[0]
|
||||
tableStore.table.params.searchEndTime = datePickerValue.timeValue?.[1]
|
||||
}
|
||||
}
|
||||
const tableHeaderRef = ref()
|
||||
|
||||
// 计算是否全屏展示
|
||||
const fullscreen = computed(() => {
|
||||
@@ -71,11 +55,21 @@ const fullscreen = computed(() => {
|
||||
}
|
||||
})
|
||||
|
||||
const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
|
||||
headerHeight.value = height
|
||||
|
||||
// 如果有传入 datePicker 的值
|
||||
if (datePickerValue) {
|
||||
// 更新表格参数
|
||||
tableStore.table.params.searchBeginTime = datePickerValue.timeValue?.[0]
|
||||
tableStore.table.params.searchEndTime = datePickerValue.timeValue?.[1]
|
||||
}
|
||||
}
|
||||
|
||||
const tableStore: any = new TableStore({
|
||||
url: '/harmonic-boot/mainLine/list',
|
||||
method: 'POST',
|
||||
showPage: false,
|
||||
showPage: fullscreen.value ? true : false,
|
||||
exportName: '主要监测点列表',
|
||||
column: [
|
||||
{
|
||||
@@ -107,7 +101,7 @@ const tableStore: any = new TableStore({
|
||||
minWidth: '70'
|
||||
},
|
||||
|
||||
{ title: '主要存在的电能质量问题', field: 'problems', minWidth: '150' }
|
||||
{ title: '主要存在的电能质量问题', field: 'problems', minWidth: '150', showOverflow: true }
|
||||
],
|
||||
beforeSearchFun: () => {
|
||||
// 尝试从缓存获取时间值
|
||||
@@ -122,9 +116,8 @@ const tableStore: any = new TableStore({
|
||||
}
|
||||
|
||||
// 如果缓存中没有则使用默认值
|
||||
tableStore.table.params.searchBeginTime = beginTime || prop.timeValue?.[0] || getTimeOfTheMonth(prop.timeKey)[0]
|
||||
|
||||
tableStore.table.params.searchEndTime = endTime || prop.timeValue?.[1] || getTimeOfTheMonth(prop.timeKey)[1]
|
||||
tableStore.table.params.searchBeginTime = beginTime || prop.timeValue?.[0]
|
||||
tableStore.table.params.searchEndTime = endTime || prop.timeValue?.[1]
|
||||
},
|
||||
loadCallback: () => {
|
||||
tableStore.table.height = `calc(${prop.height} - 80px)`
|
||||
@@ -139,21 +132,24 @@ provide('tableStore', tableStore)
|
||||
// 点击行
|
||||
const cellClickEvent = ({ row, column }: any) => {
|
||||
if (column.field == 'lineName') {
|
||||
console.log(row)
|
||||
OverLimitDetailsRef.value.open(row)
|
||||
OverLimitDetailsRef.value.open(
|
||||
row,
|
||||
tableStore.table.params.searchBeginTime || prop.timeValue?.[0],
|
||||
tableStore.table.params.searchEndTime || prop.timeValue?.[1]
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
// 获取缓存的初始值
|
||||
// 获取缓存的初始值
|
||||
const getInitialInterval = (): 3 => {
|
||||
if (fullscreen.value) {
|
||||
const cached = timeCacheStore.getCache(route.path);
|
||||
const cached = timeCacheStore.getCache(route.path)
|
||||
if (cached && cached.interval !== undefined) {
|
||||
return cached.interval as 3; // 强制断言为 3 或根据实际类型调整
|
||||
return cached.interval as 3 // 强制断言为 3 或根据实际类型调整
|
||||
}
|
||||
}
|
||||
return 3; // 明确返回字面量类型 3
|
||||
};
|
||||
return 3 // 明确返回字面量类型 3
|
||||
}
|
||||
// 外部总的时间值
|
||||
const getInitialTimeValue = () => {
|
||||
if (fullscreen.value) {
|
||||
|
||||
@@ -14,8 +14,6 @@
|
||||
ref="datePickerRef"
|
||||
:nextFlag="nextFlag"
|
||||
:theCurrentTime="theCurrentTime"
|
||||
:initialInterval="initialInterval"
|
||||
:initialTimeValue="initialTimeValue"
|
||||
@change="handleDatePickerChange"
|
||||
></DatePicker>
|
||||
</el-form-item>
|
||||
@@ -90,8 +88,6 @@ interface Props {
|
||||
theCurrentTime?: boolean //控制时间前3天展示上个月时间
|
||||
showReset?: boolean //是否显示重置
|
||||
showExport?: boolean //导出控制
|
||||
initialInterval?: 3
|
||||
initialTimeValue?: undefined
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
@@ -101,14 +97,11 @@ const props = withDefaults(defineProps<Props>(), {
|
||||
nextFlag: false,
|
||||
theCurrentTime: true,
|
||||
showReset: true,
|
||||
showExport: false,
|
||||
initialInterval: 3,
|
||||
initialTimeValue: undefined
|
||||
showExport: false
|
||||
})
|
||||
|
||||
// 处理 DatePicker 值变化事件
|
||||
const handleDatePickerChange = (value: any) => {
|
||||
|
||||
// 将值缓存到 timeCache
|
||||
if (value) {
|
||||
timeCacheStore.setCache(route.path, value.interval, value.timeValue)
|
||||
@@ -139,15 +132,6 @@ const headerFormSecondStyleClose = {
|
||||
onMounted(() => {
|
||||
// 设置初始值到 DatePicker
|
||||
if (props.datePicker && datePickerRef.value) {
|
||||
// 如果有传入的初始值,则设置到 DatePicker
|
||||
if (props.initialInterval !== undefined) {
|
||||
datePickerRef.value.setInterval(props.initialInterval)
|
||||
}
|
||||
|
||||
if (props.initialTimeValue) {
|
||||
datePickerRef.value.timeValue = props.initialTimeValue
|
||||
}
|
||||
|
||||
// 从缓存中获取值并设置
|
||||
const cached = timeCacheStore.getCache(route.path)
|
||||
if (cached) {
|
||||
@@ -245,12 +229,29 @@ const onResetForm = () => {
|
||||
const setInterval = (val: any) => {
|
||||
datePickerRef.value.setInterval(val)
|
||||
}
|
||||
|
||||
const setTimeInterval = (val: any) => {
|
||||
datePickerRef.value.timeValue = val
|
||||
tableStore.table.params.searchBeginTime = val[0]
|
||||
tableStore.table.params.searchEndTime = val[1]
|
||||
tableStore.table.params.startTime = val[0]
|
||||
tableStore.table.params.endTime = val[1]
|
||||
}
|
||||
// 导出
|
||||
const onExport = () => {
|
||||
tableStore.onTableAction('export', { showAllFlag: true })
|
||||
}
|
||||
|
||||
defineExpose({ onComSearch, areaRef, setDatePicker, setInterval, datePickerRef, showSelectChange, computedSearchRow })
|
||||
defineExpose({
|
||||
onComSearch,
|
||||
areaRef,
|
||||
setDatePicker,
|
||||
setInterval,
|
||||
setTimeInterval,
|
||||
datePickerRef,
|
||||
showSelectChange,
|
||||
computedSearchRow
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
Reference in New Issue
Block a user