模型库
This commit is contained in:
@@ -1,17 +1,17 @@
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="default-main">
|
<div class="default-main">
|
||||||
<TableHeader>
|
<TableHeader ref="TableHeaderRef">
|
||||||
<template v-slot:select>
|
<template v-slot:select>
|
||||||
<el-form-item label="筛选数据">
|
<el-form-item label="名称">
|
||||||
<el-input
|
<el-input v-model="tableStore.table.params.searchValue" clearable
|
||||||
v-model="tableStore.table.params.searchValue"
|
placeholder="请输入搜索名称" maxlength="32" show-word-limit/>
|
||||||
placeholder="根据名称,容量查询"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
</TableHeader>
|
</TableHeader>
|
||||||
<Table ref="tableRef" />
|
|
||||||
|
<Table ref="tableRef" isGroup/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="tsx">
|
<script setup lang="tsx">
|
||||||
@@ -23,37 +23,51 @@ import { useDictData } from '@/stores/dictData'
|
|||||||
|
|
||||||
const tableRef = ref()
|
const tableRef = ref()
|
||||||
const tableStore = new TableStore({
|
const tableStore = new TableStore({
|
||||||
url: '/event-boot/report/getEventReport',
|
url: '/supervision-boot/libModel/pageLibModelQuery',
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
|
showPage: true, // 确保启用分页
|
||||||
column: [
|
column: [
|
||||||
// 第一层:主标题(跨列)
|
|
||||||
{
|
{
|
||||||
title: '典型设备',
|
title: '典型设备',
|
||||||
width: 300,
|
|
||||||
children: [
|
children: [
|
||||||
{ field: 'gdName', title: '名称' },
|
{ field: 'name', title: '名称',minWidth: 200 },
|
||||||
{ field: 'subName', title: '电压等级' },
|
{ field: 'voltage', title: '电压等级',minWidth: 100 },
|
||||||
{ field: 'ip', title: '容量' }
|
{ field: 'capacity', title: '容量',minWidth: 100 }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '各次谐波阻抗 (Ω)',
|
title: '各次谐波阻抗 (Ω)',
|
||||||
width: 1800, // 根据实际列数调整
|
width: 1800,
|
||||||
children: Array.from({ length: 24 }, (_, i) => ({
|
children: Array.from({ length: 24 }, (_, i) => ({
|
||||||
field: `harm${i + 2}`,
|
field: `i${i + 2}`,
|
||||||
title: `${i + 2}次`
|
title: `${i + 2}次`,
|
||||||
|
minWidth: 100
|
||||||
}))
|
}))
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
|
// 在请求发送前处理参数
|
||||||
|
beforeSearchFun: () => {
|
||||||
|
tableStore.table.params.pageSize = 100
|
||||||
|
},
|
||||||
resetCallback: () => {
|
resetCallback: () => {
|
||||||
|
tableStore.table.params.searchValue = ''
|
||||||
}
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
|
tableStore.table.params.type = 0
|
||||||
provide('tableStore', tableStore)
|
provide('tableStore', tableStore)
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
|
// 暴露查询方法给父组件调用
|
||||||
|
const queryData = () => {
|
||||||
tableStore.index()
|
tableStore.index()
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
queryData
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -2,16 +2,14 @@
|
|||||||
<div class="default-main">
|
<div class="default-main">
|
||||||
<TableHeader>
|
<TableHeader>
|
||||||
<template v-slot:select>
|
<template v-slot:select>
|
||||||
<el-form-item label="筛选数据">
|
<el-form-item label="名称">
|
||||||
<el-input
|
<el-input v-model="tableStore.table.params.searchValue" clearable
|
||||||
v-model="tableStore.table.params.searchValue"
|
placeholder="请输入搜索名称" maxlength="32" show-word-limit/>
|
||||||
placeholder="根据名称,容量查询"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
</TableHeader>
|
</TableHeader>
|
||||||
<Table ref="tableRef" />
|
<Table ref="tableRef" isGroup/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="tsx">
|
<script setup lang="tsx">
|
||||||
@@ -23,58 +21,46 @@ import { useDictData } from '@/stores/dictData'
|
|||||||
|
|
||||||
const tableRef = ref()
|
const tableRef = ref()
|
||||||
const tableStore = new TableStore({
|
const tableStore = new TableStore({
|
||||||
url: '',
|
url: '/supervision-boot/libModel/pageLibModelQuery',
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
column: [
|
column: [
|
||||||
// 第一层:主标题(跨列)
|
|
||||||
{
|
{
|
||||||
title: '谐波源',
|
title: '谐波源',
|
||||||
width: 300,
|
|
||||||
children: [
|
children: [
|
||||||
{ field: 'gdName', title: '名称' },
|
{ field: 'name', title: '名称',minWidth: 200 },
|
||||||
{ field: 'subName', title: '电压等级' },
|
{ field: 'voltage', title: '电压等级',minWidth: 200 },
|
||||||
{ field: 'ip', title: '容量' }
|
{ field: 'capacity', title: '容量',minWidth: 200 }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '各次谐波电流含量(%)',
|
title: '各次谐波电流含量(%)',
|
||||||
width: 1800, // 根据实际列数调整
|
width: 1800,
|
||||||
children: Array.from({ length: 24 }, (_, i) => ({
|
children: Array.from({ length: 24 }, (_, i) => ({
|
||||||
field: `harm${i + 2}`,
|
field: `i${i + 2}`,
|
||||||
title: `${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)
|
provide('tableStore', tableStore)
|
||||||
|
|
||||||
const mockData = [
|
// 暴露查询方法给父组件调用
|
||||||
{
|
const queryData = () => {
|
||||||
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(() => {
|
|
||||||
tableStore.index()
|
tableStore.index()
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
queryData
|
||||||
})
|
})
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -1,11 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="default-main">
|
<div class="default-main">
|
||||||
<el-tabs v-model="activeName" type="border-card">
|
<el-tabs v-model="activeName" type="border-card" @tab-change="handleTabChange">
|
||||||
<el-tab-pane label="谐波阻抗数据库" name="1">
|
<el-tab-pane label="谐波阻抗" name="1">
|
||||||
<HarmonicImpedanceTable />
|
<HarmonicImpedanceTable ref="harmonicImpedanceRef" />
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
<el-tab-pane label="谐波源数据库" name="2">
|
<el-tab-pane label="谐波源" name="2">
|
||||||
<HarmonicSourcesTable />
|
<HarmonicSourcesTable ref="harmonicSourcesRef" />
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
</div>
|
</div>
|
||||||
@@ -22,16 +22,26 @@ defineOptions({
|
|||||||
})
|
})
|
||||||
const activeName = ref('1')
|
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>
|
const layout = mainHeight(63) as any
|
||||||
.bars_w {
|
|
||||||
width: 100%;
|
// 添加 tab 切换处理函数
|
||||||
height: 500px;
|
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>
|
||||||
@@ -65,6 +65,7 @@
|
|||||||
</TableHeader>
|
</TableHeader>
|
||||||
|
|
||||||
<div v-loading="tableStore.table.loading" class="table-container">
|
<div v-loading="tableStore.table.loading" class="table-container">
|
||||||
|
|
||||||
<vxe-table
|
<vxe-table
|
||||||
class="full-height-table"
|
class="full-height-table"
|
||||||
ref="positioningtableRef"
|
ref="positioningtableRef"
|
||||||
@@ -72,25 +73,27 @@
|
|||||||
:data="tableStore.table.data"
|
:data="tableStore.table.data"
|
||||||
v-bind="defaultAttribute"
|
v-bind="defaultAttribute"
|
||||||
:height="tableHeight"
|
:height="tableHeight"
|
||||||
|
resizable
|
||||||
|
show-overflow
|
||||||
>
|
>
|
||||||
<vxe-column title="序号" width="80" type="seq" align="center"></vxe-column>
|
<vxe-column title="序号" width="80" type="seq" align="center"></vxe-column>
|
||||||
<vxe-column field="gdName" title="供电公司" 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" width="230"></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"></vxe-column>
|
<vxe-column field="devName" title="终端名称" align="center" min-width="120"></vxe-column>
|
||||||
<vxe-column field="devType" title="终端型号" align="center" width="200"></vxe-column>
|
<vxe-column field="devType" title="终端型号" align="center" min-width="150" width="200"></vxe-column>
|
||||||
<vxe-column field="loginTime" title="投运时间" align="center"></vxe-column>
|
<vxe-column field="loginTime" title="投运时间" align="center" min-width="120"></vxe-column>
|
||||||
<vxe-column field="lineName" title="监测点名称" align="center"></vxe-column>
|
<vxe-column field="lineName" title="监测点名称" align="center" min-width="150"></vxe-column>
|
||||||
<vxe-column field="powerFlag" title="监测位置" align="center"></vxe-column>
|
<vxe-column field="powerFlag" title="监测位置" align="center" min-width="100"></vxe-column>
|
||||||
<vxe-column field="lineVoltage" title="监测点电压等级" align="center"></vxe-column>
|
<vxe-column field="lineVoltage" title="监测点电压等级" align="center" min-width="120"></vxe-column>
|
||||||
<vxe-column field="loadType" title="干扰源类型" align="center"></vxe-column>
|
<vxe-column field="loadType" title="干扰源类型" align="center" min-width="120"></vxe-column>
|
||||||
<vxe-column field="objName" title="监测对象名称" align="center" width="200"></vxe-column>
|
<vxe-column field="objName" title="监测对象名称" align="center" min-width="150" width="200"></vxe-column>
|
||||||
<vxe-column field="onlineRate" title="在线率" align="center"></vxe-column>
|
<vxe-column field="onlineRate" title="在线率" align="center" min-width="100"></vxe-column>
|
||||||
<vxe-column field="integrity" title="完整率" align="center"></vxe-column>
|
<vxe-column field="integrity" title="完整率" align="center" min-width="100"></vxe-column>
|
||||||
<vxe-column field="harmonicValue" title="谐波电压污染值" align="center"></vxe-column>
|
<vxe-column field="harmonicValue" title="谐波电压污染值" align="center" min-width="120"></vxe-column>
|
||||||
<vxe-column field="upCounts" title="暂升次数(次)" align="center"></vxe-column>
|
<vxe-column field="upCounts" title="暂升次数(次)" align="center" min-width="100"></vxe-column>
|
||||||
<vxe-column field="downCounts" title="电压暂降(次)" align="center"></vxe-column>
|
<vxe-column field="downCounts" title="电压暂降(次)" align="center" min-width="100"></vxe-column>
|
||||||
<vxe-column field="breakCounts" title="短时中断(次)" align="center"></vxe-column>
|
<vxe-column field="breakCounts" title="短时中断(次)" align="center" min-width="100"></vxe-column>
|
||||||
<vxe-column field="monitorId" title="一类监测点" align="center" :formatter="formatMonitorId"></vxe-column>
|
<vxe-column field="monitorId" title="一类监测点" align="center" min-width="120" :formatter="formatMonitorId"></vxe-column>
|
||||||
</vxe-table>
|
</vxe-table>
|
||||||
<!-- 修改分页控件 -->
|
<!-- 修改分页控件 -->
|
||||||
<div class="pagination-container">
|
<div class="pagination-container">
|
||||||
@@ -373,6 +376,7 @@ onBeforeUnmount(() => {
|
|||||||
window.removeEventListener('resize', debouncedCalculateTableHeight)
|
window.removeEventListener('resize', debouncedCalculateTableHeight)
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.full-height {
|
.full-height {
|
||||||
/* 使用视口高度确保占满整个屏幕 */
|
/* 使用视口高度确保占满整个屏幕 */
|
||||||
|
|||||||
Reference in New Issue
Block a user