模型库

This commit is contained in:
sjl
2025-09-11 13:14:36 +08:00
parent db6594cdf4
commit 8b23cea38d
4 changed files with 120 additions and 106 deletions

View File

@@ -1,17 +1,17 @@
<template>
<div class="default-main">
<TableHeader>
<TableHeader ref="TableHeaderRef">
<template v-slot:select>
<el-form-item label="筛选数据">
<el-input
v-model="tableStore.table.params.searchValue"
placeholder="根据名称,容量查询"
/>
<el-form-item label="名称">
<el-input v-model="tableStore.table.params.searchValue" clearable
placeholder="请输入搜索名称" maxlength="32" show-word-limit/>
</el-form-item>
</template>
</TableHeader>
<Table ref="tableRef" />
<Table ref="tableRef" isGroup/>
</div>
</template>
<script setup lang="tsx">
@@ -23,37 +23,51 @@ import { useDictData } from '@/stores/dictData'
const tableRef = ref()
const tableStore = new TableStore({
url: '/event-boot/report/getEventReport',
url: '/supervision-boot/libModel/pageLibModelQuery',
method: 'POST',
showPage: true, // 确保启用分页
column: [
// 第一层:主标题(跨列)
{
title: '典型设备',
width: 300,
children: [
{ field: 'gdName', title: '名称' },
{ field: 'subName', title: '电压等级' },
{ field: 'ip', title: '容量' }
{ field: 'name', title: '名称',minWidth: 200 },
{ field: 'voltage', title: '电压等级',minWidth: 100 },
{ field: 'capacity', title: '容量',minWidth: 100 }
]
},
{
title: '各次谐波阻抗 (Ω)',
width: 1800, // 根据实际列数调整
width: 1800,
children: Array.from({ length: 24 }, (_, i) => ({
field: `harm${i + 2}`,
title: `${i + 2}`
field: `i${i + 2}`,
title: `${i + 2}`,
minWidth: 100
}))
}
],
resetCallback: () => {
}
// 在请求发送前处理参数
beforeSearchFun: () => {
tableStore.table.params.pageSize = 100
},
resetCallback: () => {
tableStore.table.params.searchValue = ''
},
})
tableStore.table.params.type = 0
provide('tableStore', tableStore)
onMounted(() => {
// 暴露查询方法给父组件调用
const queryData = () => {
tableStore.index()
}
defineExpose({
queryData
})
</script>

View File

@@ -2,16 +2,14 @@
<div class="default-main">
<TableHeader>
<template v-slot:select>
<el-form-item label="筛选数据">
<el-input
v-model="tableStore.table.params.searchValue"
placeholder="根据名称,容量查询"
/>
<el-form-item label="名称">
<el-input v-model="tableStore.table.params.searchValue" clearable
placeholder="请输入搜索名称" maxlength="32" show-word-limit/>
</el-form-item>
</template>
</TableHeader>
<Table ref="tableRef" />
<Table ref="tableRef" isGroup/>
</div>
</template>
<script setup lang="tsx">
@@ -23,58 +21,46 @@ import { useDictData } from '@/stores/dictData'
const tableRef = ref()
const tableStore = new TableStore({
url: '',
url: '/supervision-boot/libModel/pageLibModelQuery',
method: 'POST',
column: [
// 第一层:主标题(跨列)
column: [
{
title: '谐波源',
width: 300,
children: [
{ field: 'gdName', title: '名称' },
{ field: 'subName', title: '电压等级' },
{ field: 'ip', title: '容量' }
{ field: 'name', title: '名称',minWidth: 200 },
{ field: 'voltage', title: '电压等级',minWidth: 200 },
{ field: 'capacity', title: '容量',minWidth: 200 }
]
},
{
title: '各次谐波电流含量(%',
width: 1800, // 根据实际列数调整
width: 1800,
children: Array.from({ length: 24 }, (_, i) => ({
field: `harm${i + 2}`,
title: `${i + 2}`
field: `i${i + 2}`,
title: `${i + 2}`,
minWidth: 100
}))
}
],
// 在请求发送前处理参数
beforeSearchFun: () => {
tableStore.table.params.pageSize = 100
},
resetCallback: () => {
tableStore.table.params.searchValue = ''
},
})
tableStore.table.params.type = 1
provide('tableStore', tableStore)
const mockData = [
{
gdName: '变压器A',
subName: '10kV',
ip: '1000kVA',
...Array.from({ length: 24 }, (_, i) => ({ [`harm${i + 2}`]: (Math.random() * 10).toFixed(2) }))
.reduce((acc, cur) => ({ ...acc, ...cur }), {})
},
{
gdName: '电机B',
subName: '35kV',
ip: '2000kVA',
...Array.from({ length: 24 }, (_, i) => ({ [`harm${i + 2}`]: (Math.random() * 10).toFixed(2) }))
.reduce((acc, cur) => ({ ...acc, ...cur }), {})
},
{
gdName: '整流器C',
subName: '110kV',
ip: '5000kVA',
...Array.from({ length: 24 }, (_, i) => ({ [`harm${i + 2}`]: (Math.random() * 10).toFixed(2) }))
.reduce((acc, cur) => ({ ...acc, ...cur }), {})
}
]
onMounted(() => {
// 暴露查询方法给父组件调用
const queryData = () => {
tableStore.index()
}
defineExpose({
queryData
})
</script>

View File

@@ -1,11 +1,11 @@
<template>
<div class="default-main">
<el-tabs v-model="activeName" type="border-card">
<el-tab-pane label="谐波阻抗数据库" name="1">
<HarmonicImpedanceTable />
<el-tabs v-model="activeName" type="border-card" @tab-change="handleTabChange">
<el-tab-pane label="谐波阻抗" name="1">
<HarmonicImpedanceTable ref="harmonicImpedanceRef" />
</el-tab-pane>
<el-tab-pane label="谐波源数据库" name="2">
<HarmonicSourcesTable />
<el-tab-pane label="谐波源" name="2">
<HarmonicSourcesTable ref="harmonicSourcesRef" />
</el-tab-pane>
</el-tabs>
</div>
@@ -22,16 +22,26 @@ defineOptions({
})
const activeName = ref('1')
const layout = mainHeight(63) as any
</script>
// 获取子组件引用
const harmonicImpedanceRef = ref<InstanceType<typeof HarmonicImpedanceTable>>()
const harmonicSourcesRef = ref<InstanceType<typeof HarmonicSourcesTable>>()
<style lang="scss" scoped>
.bars_w {
width: 100%;
height: 500px;
const layout = mainHeight(63) as any
// 添加 tab 切换处理函数
const handleTabChange = (tabName: string) => {
if (tabName === '1') {
// 调用谐波阻抗数据库查询接口
harmonicImpedanceRef.value?.queryData()
} else if (tabName === '2') {
// 调用谐波源数据库查询接口
harmonicSourcesRef.value?.queryData()
}
}
:deep(.el-tabs__content) {
height: v-bind('layout.height');
overflow-y: auto;
}
</style>
// 组件挂载时初始化数据
onMounted(() => {
// 默认加载第一个 tab 的数据
handleTabChange(activeName.value)
})
</script>

View File

@@ -65,33 +65,36 @@
</TableHeader>
<div v-loading="tableStore.table.loading" class="table-container">
<vxe-table
class="full-height-table"
ref="positioningtableRef"
auto-resize
:data="tableStore.table.data"
v-bind="defaultAttribute"
:height="tableHeight"
>
<vxe-column title="序号" width="80" type="seq" align="center"></vxe-column>
<vxe-column field="gdName" title="供电公司" align="center"></vxe-column>
<vxe-column field="subStationName" :show-overflow="true" title="变电站" align="center" width="230"></vxe-column>
<vxe-column field="devName" title="终端名称" align="center"></vxe-column>
<vxe-column field="devType" title="终端型号" align="center" width="200"></vxe-column>
<vxe-column field="loginTime" title="投运时间" align="center"></vxe-column>
<vxe-column field="lineName" title="监测点名称" align="center"></vxe-column>
<vxe-column field="powerFlag" title="监测位置" align="center"></vxe-column>
<vxe-column field="lineVoltage" title="监测点电压等级" align="center"></vxe-column>
<vxe-column field="loadType" title="干扰源类型" align="center"></vxe-column>
<vxe-column field="objName" title="监测对象名称" align="center" width="200"></vxe-column>
<vxe-column field="onlineRate" title="在线率" align="center"></vxe-column>
<vxe-column field="integrity" title="完整率" align="center"></vxe-column>
<vxe-column field="harmonicValue" title="谐波电压污染值" align="center"></vxe-column>
<vxe-column field="upCounts" title="暂升次数(次)" align="center"></vxe-column>
<vxe-column field="downCounts" title="电压暂降(次)" align="center"></vxe-column>
<vxe-column field="breakCounts" title="短时中断(次)" align="center"></vxe-column>
<vxe-column field="monitorId" title="一类监测点" align="center" :formatter="formatMonitorId"></vxe-column>
</vxe-table>
<vxe-table
class="full-height-table"
ref="positioningtableRef"
auto-resize
:data="tableStore.table.data"
v-bind="defaultAttribute"
:height="tableHeight"
resizable
show-overflow
>
<vxe-column title="序号" width="80" type="seq" align="center"></vxe-column>
<vxe-column field="gdName" title="供电公司" align="center" min-width="120"></vxe-column>
<vxe-column field="subStationName" :show-overflow="true" title="变电站" align="center" min-width="150" width="230"></vxe-column>
<vxe-column field="devName" title="终端名称" align="center" min-width="120"></vxe-column>
<vxe-column field="devType" title="终端型号" align="center" min-width="150" width="200"></vxe-column>
<vxe-column field="loginTime" title="投运时间" align="center" min-width="120"></vxe-column>
<vxe-column field="lineName" title="监测点名称" align="center" min-width="150"></vxe-column>
<vxe-column field="powerFlag" title="监测位置" align="center" min-width="100"></vxe-column>
<vxe-column field="lineVoltage" title="监测点电压等级" align="center" min-width="120"></vxe-column>
<vxe-column field="loadType" title="干扰源类型" align="center" min-width="120"></vxe-column>
<vxe-column field="objName" title="监测对象名称" align="center" min-width="150" width="200"></vxe-column>
<vxe-column field="onlineRate" title="在线率" align="center" min-width="100"></vxe-column>
<vxe-column field="integrity" title="完整率" align="center" min-width="100"></vxe-column>
<vxe-column field="harmonicValue" title="谐波电压污染值" align="center" min-width="120"></vxe-column>
<vxe-column field="upCounts" title="暂升次数(次)" align="center" min-width="100"></vxe-column>
<vxe-column field="downCounts" title="电压暂降(次)" align="center" min-width="100"></vxe-column>
<vxe-column field="breakCounts" title="短时中断(次)" align="center" min-width="100"></vxe-column>
<vxe-column field="monitorId" title="一类监测点" align="center" min-width="120" :formatter="formatMonitorId"></vxe-column>
</vxe-table>
<!-- 修改分页控件 -->
<div class="pagination-container">
<el-pagination
@@ -373,6 +376,7 @@ onBeforeUnmount(() => {
window.removeEventListener('resize', debouncedCalculateTableHeight)
})
</script>
<style scoped lang="scss">
.full-height {
/* 使用视口高度确保占满整个屏幕 */