修改 表头下拉

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

@@ -130,7 +130,7 @@
<template #append>MVA</template>
</el-input>
</el-form-item>
<el-form-item for="-" label="装机容量:">
<el-form-item for="-" label="装机容量:" prop="ratePower">
<el-input
v-model.trim="form.ratePower"
oninput="value=value.replace(/[^\-?\d.]/g,'')
@@ -753,6 +753,7 @@ const rules = ref({
}
],
devId: [{ required: true, message: '请选择关联终端', trigger: 'change' }],
ratePower: [{ required: true, message: '请输入装机容量', trigger: 'blur' }],
lineId: [{ required: true, message: '请选择关联监测点', trigger: 'change' }],
agreementCapacity: [{ required: true, message: '请选择用户协议容量', trigger: 'blur' }],
nonlinearDeviceType: [{ required: true, message: '请选择非线性终端类型', trigger: 'change' }],

View File

@@ -101,7 +101,7 @@ const tableStore = new TableStore({
}
},
{ field: 'responsibleDepartment', title: '归口管理部门', minWidth: 130 },
// { field: 'responsibleDepartment', title: '归口管理部门', minWidth: 130 },
{ field: 'ratePower', title: '装机容量(MW)', minWidth: 130 },
{
field: 'createBy',

View File

@@ -35,13 +35,13 @@
<el-tab-pane label="谐波频谱" name="4" lazy v-if="!isReload">
<Xiebopingpu v-if="activeName == '4'" />
</el-tab-pane>
<!-- <el-tab-pane label="告警数据统计" name="5" lazy v-if="!isReload ">
<Gaojingshujutongji v-if=" activeName == '5'"/>
</el-tab-pane> -->
<el-tab-pane label="告警数据统计" name="5" lazy v-if="!isReload && VITE_FLAG">
<Gaojingshujutongji v-if="activeName == '5'" />
</el-tab-pane>
<el-tab-pane label="监测点运行状态" name="6" lazy v-if="!isReload">
<Yunxingzhuangtai v-if="activeName == '6'" />
</el-tab-pane>
<el-tab-pane label="实时数据" name="7" lazy v-if="!isReload">
<el-tab-pane label="实时数据" name="7" lazy v-if="!isReload && !VITE_FLAG">
<Shishishuju v-if="activeName == '7'" />
</el-tab-pane>
</el-tabs>
@@ -70,10 +70,11 @@ import Xiebopingpu from './xiebopingpu/index.vue'
import Gaojingshujutongji from './gaojingshujutongji/index.vue'
import Yunxingzhuangtai from './yunxingzhuangtai/index.vue'
import Shishishuju from './shishishuju/index.vue'
const VITE_FLAG = import.meta.env.VITE_NAME == 'jibei'
import router from '@/router'
defineOptions({
// name: 'harmonic-boot/monitor/online'
name: 'harmonic-boot/monitor/online'
})
const monitoringPoint = useMonitoringPoint()
@@ -94,6 +95,7 @@ const handleNodeClick = (data: any, node: any) => {
monitoringPoint.setValue('lineId', data.id)
monitoringPoint.setValue('pid', data.pids)
monitoringPoint.setValue('lineName', data.alias)
monitoringPoint.setValue('comFlag', data.comFlag)
}
}
const handleCheckChange = (data: any, node: any) => {

View File

@@ -345,6 +345,7 @@ import spectrum from './spectrum.vue'
import trend from './trend.vue'
import { getLineDetail } from '@/api/device-boot/communicate'
import { mainHeight } from '@/utils/layout'
import { ElMessage } from 'element-plus'
// import { getRealTimeTableList } from '@/api/cs-device-boot/EquipmentDelivery'
const height = ref(mainHeight(580))
const monitoringPoint = useMonitoringPoint()
@@ -755,6 +756,12 @@ const init = () => {
console.error('WebSocket 客户端实例不存在')
return
}
if (monitoringPoint.state.comFlag == 0) {
return ElMessage({
message: '所选监测点离线!',
type: 'warning'
})
}
let pids = monitoringPoint.state.pid.split(',')
dataSocket.socketServe.connect(`${adminInfo.id},${monitoringPoint.state.lineId},${pids[pids.length - 2]}`)
dataSocket.socketServe.registerCallBack('message', (res: any) => {

View File

@@ -121,7 +121,7 @@ const tableStore = new TableStore({
title: '通讯状态',
render: 'tag',
minWidth: 100,
effect: 'dark',
// effect: 'dark',
custom: {
'正常': 'success',
'中断': 'danger',

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>