优化表格

This commit is contained in:
guanj
2026-01-14 13:30:23 +08:00
parent 63433aa6dc
commit 054d84778b
37 changed files with 1237 additions and 1142 deletions

View File

@@ -82,7 +82,7 @@ const tableStore: any = new TableStore({
// },
},
{
title: '操作',
title: '操作', fixed: 'right',
width: '100',
render: 'buttons',
buttons: [

View File

@@ -1,123 +1,123 @@
<!-- 解析列表 -->
<template>
<el-dialog v-model.trim="dialogVisible" title="详情" width="70%" draggable @closed="close">
<div :style="tableHeight">
<vxe-table border auto-resize height="auto" :data="tableData" v-bind="defaultAttribute">
<vxe-column field="name" align="center" title="文件名称"></vxe-column>
<vxe-column field="createTime" align="center" title="导入时间"></vxe-column>
<vxe-column field="allCount" align="center" title="数据总数(条)" width="120"></vxe-column>
<vxe-column field="realCount" align="center" title="已入库总数(条)" width="120"></vxe-column>
<vxe-column field="state" align="center" title="解析状态" width="100">
<template v-slot:default="scoped">
<el-tag type="warning" v-if="scoped.row.state == 0">未解析</el-tag>
<el-tag type="success" v-if="scoped.row.state == 1">解析成功</el-tag>
<el-tag type="danger" v-if="scoped.row.state == 2">解析失败</el-tag>
<el-tag type="primary" v-if="scoped.row.state == 3">文件不存在</el-tag>
</template>
</vxe-column>
</vxe-table>
</div>
</el-dialog>
</template>
<script lang="ts" setup>
import { ref, onMounted, onBeforeUnmount } from 'vue'
import TableStore from '@/utils/tableStore'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { mainHeight } from '@/utils/layout'
const emit = defineEmits(['back'])
const dialogVisible = ref(false)
const tableHeight = mainHeight(440)
const height = ref(0)
height.value = window.innerHeight < 1080 ? 230 : 450
const tableStore: any = new TableStore({
url: '',
// publicHeight: height.value,
showPage: false,
column: [
{ width: '60', type: 'checkbox', fixed: 'left' },
{
title: '序号', width: 80, formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ field: 'name', title: '文件名称', minWidth: 170 },
{ field: 'createTime', title: '导入时间', minWidth: 170 , sortable: true},
{ field: 'allCount', title: '数据总数(条)', minWidth: 170 , sortable: true},
{ field: 'realCount', title: '已入库总数(条)', minWidth: 170, sortable: true },
{
title: '解析状态',
field: 'state',
width: 100,
render: 'tag',
custom: {
0: 'warning',
1: 'success',
2: 'danger',
3: 'primary'
},
replaceValue: {
0: '未解析',
1: '解析成功',
2: '解析失败',
3: '文件不存在'
}
},
{
title: '操作',
width: '180',
render: 'buttons',
buttons: [
{
name: 'edit',
title: '详情',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: row => {
// console.log(row.portableOfflLogList)
}
}
]
}
],
loadCallback: () => {
tableStore.table.data = []
}
})
//返回
const handleBack = () => {
emit('back')
}
const tableData: any = ref()
const open = (val: any) => {
dialogVisible.value = true
tableData.value = val
setTimeout(() => {
tableStore.index()
}, 10)
}
const close = () => {
dialogVisible.value = false
}
const updateViewportHeight = async () => {
height.value = window.innerHeight < 1080 ? 230 : 450
tableStore.table.publicHeight = height.value
}
onMounted(() => {
updateViewportHeight() // 初始化视口高度
window.addEventListener('resize', updateViewportHeight) // 监听窗口大小变化
})
onBeforeUnmount(() => {
window.removeEventListener('resize', updateViewportHeight) // 移除监听
})
defineExpose({ open })
</script>
<style lang="scss" scoped>
::v-deep .el-dialog__body {
overflow-y: none !important;
max-height: 70vh !important;
}
</style>
<!-- 解析列表 -->
<template>
<el-dialog v-model.trim="dialogVisible" title="详情" width="70%" draggable @closed="close">
<div :style="tableHeight">
<vxe-table border auto-resize height="auto" :data="tableData" v-bind="defaultAttribute">
<vxe-column field="name" align="center" title="文件名称"></vxe-column>
<vxe-column field="createTime" align="center" title="导入时间"></vxe-column>
<vxe-column field="allCount" align="center" title="数据总数(条)" width="120"></vxe-column>
<vxe-column field="realCount" align="center" title="已入库总数(条)" width="120"></vxe-column>
<vxe-column field="state" align="center" title="解析状态" width="100">
<template v-slot:default="scoped">
<el-tag type="warning" v-if="scoped.row.state == 0">未解析</el-tag>
<el-tag type="success" v-if="scoped.row.state == 1">解析成功</el-tag>
<el-tag type="danger" v-if="scoped.row.state == 2">解析失败</el-tag>
<el-tag type="primary" v-if="scoped.row.state == 3">文件不存在</el-tag>
</template>
</vxe-column>
</vxe-table>
</div>
</el-dialog>
</template>
<script lang="ts" setup>
import { ref, onMounted, onBeforeUnmount } from 'vue'
import TableStore from '@/utils/tableStore'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { mainHeight } from '@/utils/layout'
const emit = defineEmits(['back'])
const dialogVisible = ref(false)
const tableHeight = mainHeight(440)
const height = ref(0)
height.value = window.innerHeight < 1080 ? 230 : 450
const tableStore: any = new TableStore({
url: '',
// publicHeight: height.value,
showPage: false,
column: [
{ width: '60', type: 'checkbox', fixed: 'left' },
{
title: '序号', width: 80, formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ field: 'name', title: '文件名称', minWidth: 170 },
{ field: 'createTime', title: '导入时间', minWidth: 170 , sortable: true},
{ field: 'allCount', title: '数据总数(条)', minWidth: 170 , sortable: true},
{ field: 'realCount', title: '已入库总数(条)', minWidth: 170, sortable: true },
{
title: '解析状态',
field: 'state',
width: 100,
render: 'tag',
custom: {
0: 'warning',
1: 'success',
2: 'danger',
3: 'primary'
},
replaceValue: {
0: '未解析',
1: '解析成功',
2: '解析失败',
3: '文件不存在'
}
},
{
title: '操作', fixed: 'right',
width: '180',
render: 'buttons',
buttons: [
{
name: 'edit',
title: '详情',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: row => {
// console.log(row.portableOfflLogList)
}
}
]
}
],
loadCallback: () => {
tableStore.table.data = []
}
})
//返回
const handleBack = () => {
emit('back')
}
const tableData: any = ref()
const open = (val: any) => {
dialogVisible.value = true
tableData.value = val
setTimeout(() => {
tableStore.index()
}, 10)
}
const close = () => {
dialogVisible.value = false
}
const updateViewportHeight = async () => {
height.value = window.innerHeight < 1080 ? 230 : 450
tableStore.table.publicHeight = height.value
}
onMounted(() => {
updateViewportHeight() // 初始化视口高度
window.addEventListener('resize', updateViewportHeight) // 监听窗口大小变化
})
onBeforeUnmount(() => {
window.removeEventListener('resize', updateViewportHeight) // 移除监听
})
defineExpose({ open })
</script>
<style lang="scss" scoped>
::v-deep .el-dialog__body {
overflow-y: none !important;
max-height: 70vh !important;
}
</style>

View File

@@ -50,10 +50,18 @@
</el-descriptions-item> -->
<el-descriptions-item label="PT变比" width="160">
{{ devData.ptRatio || '/' }}
{{
devData.ptRatio == null
? '/'
: devData.ptRatio + (devData.pt2Ratio == null ? '' : ':' + devData.pt2Ratio)
}}
</el-descriptions-item>
<el-descriptions-item label="CT变比" width="160">
{{ devData.ctRatio || '/' }}
{{
devData.ctRatio == null
? '/'
: devData.ctRatio + (devData.ct2Ratio == null ? '' : ':' + devData.ct2Ratio)
}}
</el-descriptions-item>
<!-- <el-descriptions-item label="名称">

View File

@@ -236,7 +236,7 @@ const tableStore = new TableStore({
// },
},
{
title: '操作',
title: '操作', fixed: 'right',
align: 'center',
width: '180',
render: 'buttons',

View File

@@ -56,11 +56,11 @@ const tableStore: any = new TableStore({
}
},
{ field: 'startTime', title: '发生时刻', minWidth: 170, sortable: true },
{ field: 'showName', title: '事件描述', minWidth: 170 },
{ field: 'showName', title: '事件描述', minWidth: 120 },
{
field: 'phaseType',
title: '相别',
minWidth: 100,
minWidth: 80,
formatter: (row: any) => {
row.cellValue = row.cellValue ? row.cellValue : '/'
return row.cellValue
@@ -69,7 +69,7 @@ const tableStore: any = new TableStore({
{
field: 'persistTime',
title: '持续时间(s)',
minWidth: 100,
minWidth: 110,
formatter: (row: any) => {
console.log('row.cellValue', row.cellValue)
row.cellValue = row.cellValue ? row.cellValue.toFixed(2) : '/'
@@ -80,7 +80,7 @@ const tableStore: any = new TableStore({
{
field: 'featureAmplitude',
title: '暂降(聚升)幅值(%)',
width: 100,
minWidth: 130,
formatter: (row: any) => {
//row.cellValue = row.cellValue + '' ? row.cellValue.toFixed(2) : '/'
row.cellValue = row.cellValue != null ? Number(row.cellValue).toFixed(2) : '/'
@@ -91,10 +91,10 @@ const tableStore: any = new TableStore({
}
},
{
title: '操作',
title: '操作', fixed: 'right',
width: 180,
render: 'buttons',
fixed: 'right',
buttons: [
{
name: 'edit',
@@ -118,7 +118,9 @@ const tableStore: any = new TableStore({
boxoList.value = row
boxoList.value.systemType = 'YPT'
boxoList.value.engineeringName = tableParams.value.engineeringName
console.log("🚀 ~ tableParams.value.engineeringName:", tableParams.value.engineeringName)
boxoList.value.featureAmplitude =
row.featureAmplitude != null ? Number(row.featureAmplitude / 100) : '-'
boxoList.value.persistTime = row.persistTime ? row.persistTime.toFixed(2) : '-'
wp.value = res.data
view.value = false
view2.value = true