修改 表头下拉

This commit is contained in:
GGJ
2025-04-16 09:43:27 +08:00
parent 8bca1bfd38
commit 0063c53ec6
9 changed files with 146 additions and 80 deletions

View File

@@ -1,6 +1,5 @@
<template>
<div class="default-main">
<TableHeader area showExport>
<template #select>
<!-- <el-form-item label="统计类型:">
@@ -11,55 +10,100 @@
</el-form-item> -->
<el-form-item label="电压等级:">
<el-select v-model="tableStore.table.params.scale" filterable multiple collapse-tags clearable
placeholder="请选择电压等级" value-key="id">
<el-option v-for="item in voltageleveloption" :key="item.id" :label="item.name" :value="item">
</el-option>
<el-select
v-model="tableStore.table.params.scale"
filterable
multiple
collapse-tags
clearable
placeholder="请选择电压等级"
value-key="id"
>
<el-option
v-for="item in voltageleveloption"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="终端厂家:">
<el-select v-model="tableStore.table.params.manufacturer" filterable multiple collapse-tags
clearable placeholder="请选择终端厂家" value-key="id">
<el-option v-for="item in terminaloption" :key="item.id" :label="item.name" :value="item">
</el-option>
<el-select
v-model="tableStore.table.params.manufacturer"
filterable
multiple
collapse-tags
clearable
placeholder="请选择终端厂家"
value-key="id"
>
<el-option
v-for="item in terminaloption"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="干扰源类型:">
<el-select v-model="tableStore.table.params.loadType" filterable multiple collapse-tags clearable
placeholder="请选择干扰源类型" value-key="id">
<el-option v-for="item in interfereoption" :key="item.id" :label="item.name" :value="item">
</el-option>
<el-select
v-model="tableStore.table.params.loadType"
filterable
multiple
collapse-tags
clearable
placeholder="请选择干扰源类型"
value-key="id"
>
<el-option
v-for="item in interfereoption"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="通讯状态:">
<el-select v-model="tableStore.table.params.comFlag" filterable multiple collapse-tags clearable
placeholder="请选择通讯状态">
<el-option v-for="item in communicationstatus" :key="item.value" :label="item.label"
:value="item.value">
</el-option>
<el-select
v-model="tableStore.table.params.comFlag"
filterable
multiple
collapse-tags
clearable
placeholder="请选择通讯状态"
>
<el-option
v-for="item in communicationstatus"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="终端状态:">
<el-select v-model="tableStore.table.params.runFlag" filterable multiple collapse-tags clearable
placeholder="请选择终端状态">
<el-option v-for="item in terminalstatus" :key="item.value" :label="item.label"
:value="item.value">
</el-option>
<el-select
v-model="tableStore.table.params.runFlag"
filterable
multiple
collapse-tags
clearable
placeholder="请选择终端状态"
>
<el-option
v-for="item in terminalstatus"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="评价筛选">
<el-input v-model="tableStore.table.params.evaluate" clearable placeholder="输入关键字筛选" />
</el-form-item>
</template>
</TableHeader>
<Table ref="tableRef" />
</div>
</template>
<script setup lang="ts">
@@ -73,19 +117,19 @@ defineOptions({
name: 'harmonic-boot/run/terminalmessage'
})
const view = ref(true)
const classificationData = dictData.getBasicData('Statistical_Type', ["Report_Type", "Voltage_Level", "Load_Type"])
const classificationData = dictData.getBasicData('Statistical_Type', ['Report_Type', 'Voltage_Level', 'Load_Type'])
const voltageleveloption = dictData.getBasicData('Dev_Voltage_Stand')
const terminaloption = dictData.getBasicData('Dev_Manufacturers')
const interfereoption = dictData.getBasicData('Interference_Source')
const communicationstatus = [
{ value: 0, label: "中断" },
{ value: 1, label: "正常" },
{ value: 0, label: '中断' },
{ value: 1, label: '正常' }
]
const terminalstatus = [
{ value: 0, label: "投运" },
{ value: 1, label: "热备用" },
{ value: 2, label: "停运" },
{ value: 0, label: '投运' },
{ value: 1, label: '热备用' },
{ value: 2, label: '停运' }
]
const tableStore = new TableStore({
url: '/device-boot/runManage/getRuntimeData',
@@ -100,17 +144,17 @@ const tableStore = new TableStore({
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ field: 'areaName', title: '区域', minWidth: 100},
{ field: 'gdName', title: '地级区' ,minWidth: 100},
{ field: 'areaName', title: '区域', minWidth: 100 },
{ field: 'gdName', title: '地级区', minWidth: 100 },
{
field: 'bdName',
title: '供电公司',
minWidth: 100
minWidth: 100
},
{ field: 'manufacturer', title: '厂家' , minWidth: 100},
{ field: 'manufacturer', title: '厂家', minWidth: 100 },
{ field: 'devName', title: '终端名称', minWidth: 80 },
{ field: 'ip', title: '网络参数' , minWidth: 100},
{ field: 'ip', title: '网络参数', minWidth: 100 },
{ field: 'loginTime', title: '投运时间', minWidth: 100 },
{ field: 'devType', title: '终端型号', minWidth: 100 },
{ field: 'port', title: '端口', minWidth: 100 },
@@ -118,51 +162,61 @@ const tableStore = new TableStore({
{
field: 'runFlag',
title: '终端状态',
effect: 'dark',
render: 'tag',minWidth: 100,
// effect: 'dark',
render: 'tag',
minWidth: 100,
custom: {
'投运': 'success',
'热备用': 'warning',
'停运': 'danger',
},
投运: 'success',
热备用: 'warning',
停运: 'danger'
}
},
{
field: 'comFlag',
title: '通讯状态',
render: 'tag',
effect: 'dark',minWidth: 100,
// effect: 'dark',
minWidth: 100,
custom: {
'正常': 'success',
'中断': 'danger',
},
正常: 'success',
中断: 'danger'
}
},
{
field: 'onlineEvaluate',
title: '在线率评价',
render: 'tag',
effect: 'dark',minWidth: 100,
// effect: 'dark',
minWidth: 100,
custom: {
'/': 'info',
'优': 'success',
'良': 'warning',
'差': 'danger',
},
},
: 'success',
: 'warning',
: 'danger'
}
}
],
loadCallback: () => {
tableStore.table.data.map((item: any) => {
item.onlineEvaluate == 3.14159 ? item.onlineEvaluate = '/' : item.onlineEvaluate <= 0.6 ? item.onlineEvaluate = '差' : item.onlineEvaluate <= 0.9 ? item.onlineEvaluate = '良' : item.onlineEvaluate <= 1 ? item.onlineEvaluate = '优' : '/'
tableStore.table.webPagingData.map((item1: any) => {
item1.map((item: any) => {
item.onlineEvaluate == 3.14159
? (item.onlineEvaluate = '/')
: item.onlineEvaluate <= 0.6
? (item.onlineEvaluate = '差')
: item.onlineEvaluate <= 0.9
? (item.onlineEvaluate = '良')
: item.onlineEvaluate <= 1
? (item.onlineEvaluate = '优')
: '/'
})
})
}
})
tableStore.table.params.statisticalType = classificationData[0]
tableStore.table.params.serverName = "harmonic-boot"
tableStore.table.params.serverName = 'harmonic-boot'
tableStore.table.params.comFlag = []
tableStore.table.params.runFlag = []
tableStore.table.params.evaluate = ''
@@ -177,9 +231,4 @@ provide('tableStore', tableStore)
onMounted(() => {
tableStore.index()
})
</script>