Files
admin-govern/src/components/cockpit/sensitiveLoad/index.vue
guanj 676bb37bbe 驾驶舱页面绘制
绘制2、稳态电能质量分析、稳态治理效果分析、暂态电能质量分析页面
2025-10-20 13:25:30 +08:00

120 lines
3.1 KiB
Vue

<template>
<div>
<!--敏感负荷列表 -->
<Table ref="tableRef" @cell-click="cellClickEvent" :height="`calc(${prop.height})`" isGroup></Table>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide, reactive, watch, h } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import MyEchart from '@/components/echarts/MyEchart.vue'
import { useDictData } from '@/stores/dictData'
import { ElMessage, ElMessageBox } from 'element-plus'
import { getTimeOfTheMonth } from '@/utils/formatTime'
const prop = defineProps({
width: { type: String },
height: { type: String },
timeKey: { type: String },
timeValue: { type: Object }
})
const OverLimitDetailsRef = ref()
const tableStore: any = new TableStore({
url: '/user-boot/dept/deptTree',
method: 'POST',
showPage: false,
column: [
{
field: 'index',
title: '序号',
width: '60',
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{
title: '敏感负荷名称',
field: 'name',
minWidth: '90'
},
{
title: '敏感负荷类型',
field: 'type',
minWidth: '70'
},
{
title: '是否监测',
field: 'type1',
minWidth: '80'
},
{
title: '是否治理',
field: 'type2',
minWidth: '80'
}
],
beforeSearchFun: () => {
tableStore.table.params.searchBeginTime = prop.timeValue?.[0] || getTimeOfTheMonth(prop.timeKey)[0]
tableStore.table.params.searchEndTime = prop.timeValue?.[1] || getTimeOfTheMonth(prop.timeKey)[1]
},
loadCallback: () => {
tableStore.table.data = [
{
name: '10kV1#变压器',
type: '机房',
type1: '是',
type2: '100A APF'
},
{
name: '380kV1#母线',
type: 'PLC',
type1: '是',
type2: 'UPS'
}
]
}
})
const tableRef = ref()
provide('tableRef', tableRef)
provide('tableStore', tableStore)
// 点击行
const cellClickEvent = ({ row, column }: any) => {
if (column.field != 'name') {
console.log(row)
OverLimitDetailsRef.value.open(row)
}
}
onMounted(() => {
setTimeout(() => {
tableStore.index()
}, 500)
})
watch(
() => prop.timeKey,
val => {
tableStore.index()
}
)
watch(
() => prop.timeValue, // 监听的目标(函数形式避免直接传递 props 导致的警告)
(newVal, oldVal) => {
tableStore.index()
},
{
deep: true // 若 timeValue 是对象/数组,需开启深度监听
}
)
const addMenu = () => {}
</script>
<style lang="scss" scoped></style>