table列表操作处按钮添加按钮样式效果、服务器管理详情

1、table列表操作处按钮添加按钮样式效果
2、服务器管理图形监控和详情按钮权限修改
3、服务器管理详情网卡信息和虚拟网卡信息的form表单改为table列表
4、服务器管理详情流量图切换单双列优化、添加定时刷新功能
This commit is contained in:
康冉冉
2026-01-08 18:23:46 +08:00
parent 6f96bdc406
commit c6eced0841
42 changed files with 405 additions and 226 deletions
+5
View File
@@ -106,6 +106,11 @@
delete window.detailsVal;
},
methods: {
resizeChart() {
if (this.lineDataListIntance) {
this.lineDataListIntance.resize();
}
},
getList(title, dataXY) {
let that = this;
if (that.lineDataListIntance) {
+8 -5
View File
@@ -105,7 +105,7 @@
<template v-for="item of config.tableButton.line">
<template v-if="item && item.more && item.more.length > 0 && checkPermi(item.hasPermi)">
<el-dropdown size="mini" trigger="click" @command="(command) => handleClick({fnCode: command}, scope.row)">
<el-button size="mini" type="text" icon="el-icon-d-arrow-right"><span style="margin-left: -5px;">{{item && item.title ? item.title : '更多'}}</span></el-button>
<el-button size="mini" type="primary" plain icon="el-icon-d-arrow-right"><span style="margin-left: -5px;">{{item && item.title ? item.title : '更多'}}</span></el-button>
<el-dropdown-menu slot="dropdown">
<!-- <el-dropdown-item v-for="dropBut of item.more" :command="dropBut.fnCode" :icon="dropBut.icon" :hasPermi="[dropBut.hasPermi]">{{dropBut.content}}</el-dropdown-item>-->
<el-dropdown-item v-for="dropBut of item.more" :command="dropBut.fnCode" :icon="dropBut.icon" v-show="dropBut && dropBut.showName ? dropBut.showVal.includes(scope.row[dropBut.showName]) : true" v-if="checkPermi([dropBut.hasPermi])">{{dropBut.content}}</el-dropdown-item>
@@ -115,7 +115,7 @@
<template v-else>
<!-- <el-tooltip v-if="item && item.content" :content="item.content" placement="top">-->
<template v-if="item && item.content">
<el-button size="mini" link :type="item.type" :icon="item.icon" v-show="item && item.showName ? item.showVal.includes(scope.row[item.showName]) : true" @click="handleClick(item, scope.row)" v-if="item && item.hasPermi ? checkPermi([item.hasPermi]) : true">{{item.content}}</el-button>
<el-button size="mini" plain link :type="item.type || 'primary'" :icon="item.icon" v-show="item && item.showName ? item.showVal.includes(scope.row[item.showName]) : true" @click="handleClick(item, scope.row)" v-if="item && item.hasPermi ? checkPermi([item.hasPermi]) : true">{{item.content}}</el-button>
</template>
<!-- <el-button v-if="item && item.content" size="mini" link :type="item.type" :icon="item.icon" v-show="item && item.showName ? item.showVal.includes(scope.row[item.showName]) : true" @click="handleClick(item, scope.row)" :hasPermi="[item.hasPermi]">{{item.content}}</el-button>-->
<!-- </el-tooltip>-->
@@ -207,7 +207,7 @@
},
created() {
if (!(this.config && this.config.colTopHiddenIcon)) {
this.$modal.loading();
// this.$modal.loading();
}
},
methods: {
@@ -246,8 +246,8 @@
buttonConfigs.forEach(config => {
// 判断按钮是否显示
if (this.isButtonVisible(config, row)) {
// 12是图标的宽度
const btnWidth = this.calculateButtonWidth(config) + 14;
// 12是图标的宽度 8是按钮padding宽度
const btnWidth = this.calculateButtonWidth(config) + 14 + 8;
currentLineWidth += btnWidth;
visibleButtonCount++;
}
@@ -507,6 +507,9 @@
text-overflow: ellipsis; /* 溢出显示... */
word-break: keep-all; /* 避免英文单词截断 */
}
::v-deep .el-table .fixed-width .el-button--mini {
padding: 4px!important;
}
/* 自定义tooltip样式:支持换行+限制宽度 */
::v-deep .el-tooltip__popper {
+2 -2
View File
@@ -379,7 +379,7 @@ export const dynamicRoutes = [
path: '/resource/serverRegister/details',
component: Layout,
hidden: true,
permissions: ['resource:serverRegister:details'],
permissions: ['rocketmq:traffic'], // resource:serverRegister:details
children: [
{
path: ':id?',
@@ -393,7 +393,7 @@ export const dynamicRoutes = [
path: '/resource/serverRegister/monitorChart',
component: Layout,
hidden: true,
permissions: ['rocketmq:traffic'],
permissions: ['resource:serverRegister:echartView'], // rocketmq:traffic
children: [
{
path: ':id?',
+1 -1
View File
@@ -60,7 +60,7 @@
{content: '导出', fnCode: 'export', type: 'primary', icon: 'el-icon-download', hasPermi: 'agentCollect:cpuData:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'agentCollect:cpuData:edit'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'agentCollect:cpuData:edit'},
]
}
},
+1 -1
View File
@@ -57,7 +57,7 @@
{content: '导出', fnCode: 'export', type: 'primary', icon: 'el-icon-download', hasPermi: 'agentCollect:diskData:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'agentCollect:diskData:edit'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'agentCollect:diskData:edit'},
]
}
},
@@ -54,7 +54,7 @@
{content: '导出', fnCode: 'export', type: 'primary', icon: 'el-icon-download', hasPermi: 'agentCollect:dockerData:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'agentCollect:dockerData:edit'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'agentCollect:dockerData:edit'},
]
}
},
@@ -54,7 +54,7 @@
{content: '导出', fnCode: 'export', type: 'primary', icon: 'el-icon-download', hasPermi: 'agentCollect:memoryData:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'agentCollect:memoryData:edit'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'agentCollect:memoryData:edit'},
]
}
},
@@ -53,7 +53,7 @@
{content: '导出', fnCode: 'export', type: 'primary', icon: 'el-icon-download', hasPermi: 'agentCollect:mountPointData:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'agentCollect:mountPointData:edit'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'agentCollect:mountPointData:edit'},
]
}
},
@@ -59,7 +59,7 @@
{content: '导出', fnCode: 'export', type: 'primary', icon: 'el-icon-download', hasPermi: 'agentCollect:systemData:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'agentCollect:systemData:edit'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'agentCollect:systemData:edit'},
]
}
},
@@ -88,10 +88,9 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'earnManage:busValueCount:export'},
],
line: [
{content: '相关数据', fnCode: 'edit', type: 'text', icon: 'el-icon-tickets', hasPermi: 'earnManage:busValueCount:relevantData'},
{content: '重新计算', fnCode: 'calculate', type: 'text', icon: 'el-icon-brush', hasPermi: 'earnManage:busValueCount:calculate'},
{content: '图形查看', fnCode: 'echartView', type: 'text', icon: 'el-icon-data-analysis', hasPermi: 'earnManage:busValueCount:graphicAnalysis'},
{},{}
{content: '相关数据', fnCode: 'edit', type: 'primary', icon: 'el-icon-tickets', hasPermi: 'earnManage:busValueCount:relevantData'},
{content: '重新计算', fnCode: 'calculate', type: 'primary', icon: 'el-icon-brush', hasPermi: 'earnManage:busValueCount:calculate'},
{content: '图形查看', fnCode: 'echartView', type: 'primary', icon: 'el-icon-data-analysis', hasPermi: 'earnManage:busValueCount:graphicAnalysis'},
]
}
},
@@ -65,11 +65,11 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'earnManage:businessIssued:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', showName: 'reviewStatus', showVal: ['0', '3'], hasPermi: 'earnManage:businessIssued:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'earnManage:businessIssued:details'},
{content: '删除', fnCode: 'delete', type: 'text', icon: 'el-icon-delete', showName: 'reviewStatus', showVal: ['0', '3'], hasPermi: 'earnManage:businessIssued:delete'},
{content: '审核', fnCode: 'audit', type: 'text', showName: 'reviewStatus', showVal: '1', icon: 'el-icon-document-add', hasPermi: 'earnManage:businessIssued:audit'},
{content: '提交审核', fnCode: 'upAudit', type: 'text', showName: 'reviewStatus', showVal: ['0', '3'], icon: 'el-icon-document-checked', hasPermi: 'earnManage:businessIssued:upAudit'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', showName: 'reviewStatus', showVal: ['0', '3'], hasPermi: 'earnManage:businessIssued:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'earnManage:businessIssued:details'},
{content: '删除', fnCode: 'delete', type: 'danger', icon: 'el-icon-delete', showName: 'reviewStatus', showVal: ['0', '3'], hasPermi: 'earnManage:businessIssued:delete'},
{content: '审核', fnCode: 'audit', type: 'primary', showName: 'reviewStatus', showVal: '1', icon: 'el-icon-document-add', hasPermi: 'earnManage:businessIssued:audit'},
{content: '提交审核', fnCode: 'upAudit', type: 'primary', showName: 'reviewStatus', showVal: ['0', '3'], icon: 'el-icon-document-checked', hasPermi: 'earnManage:businessIssued:upAudit'},
]
}
}
@@ -55,9 +55,9 @@
{content: '新增', fnCode: 'add', type: 'primary', icon: 'el-icon-plus', hasPermi: 'earnManage:businessScript:add'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'earnManage:businessScript:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'earnManage:businessScript:details'},
{content: '删除', fnCode: 'delete', type: 'text', icon: 'el-icon-delete', hasPermi: 'earnManage:businessScript:delete'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'earnManage:businessScript:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'earnManage:businessScript:details'},
{content: '删除', fnCode: 'delete', type: 'danger', icon: 'el-icon-delete', hasPermi: 'earnManage:businessScript:delete'},
]
}
}
+3 -4
View File
@@ -198,13 +198,12 @@
tableButton: {
top: [
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'earnManage:server:export'},
{content: '图形分析', fnCode: 'echartView', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'rocketmq:traffic'},
{content: '图形分析', fnCode: 'echartView', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'rocketmq:trafficAnalysis'},
// {content: '生成月均日95值', fnCode: 'createData', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'earnManage:server:add'},
],
line: [
{content: '相关数据', fnCode: 'edit', type: 'text', icon: 'el-icon-tickets', hasPermi: 'earnManage:server:relevantData'},
{content: '重新计算', fnCode: 'calculate', type: 'text', icon: 'el-icon-brush', hasPermi: 'earnManage:server:calculate'},
{}
{content: '相关数据', fnCode: 'edit', type: 'primary', icon: 'el-icon-tickets', hasPermi: 'earnManage:server:relevantData'},
{content: '重新计算', fnCode: 'calculate', type: 'primary', icon: 'el-icon-brush', hasPermi: 'earnManage:server:calculate'},
]
}
},
+1 -1
View File
@@ -122,7 +122,7 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'earnManage:serverRevenue:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-tickets', hasPermi: 'earnManage:serverRevenue:edit'}
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-tickets', hasPermi: 'earnManage:serverRevenue:edit'}
]
}
},
+2 -3
View File
@@ -245,9 +245,8 @@
// {content: '生成接口月均日95值', fnCode: 'createData', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'earnManage:switch:add'},
],
line: [
{content: '相关数据', fnCode: 'edit', type: 'text', icon: 'el-icon-tickets', hasPermi: 'earnManage:switch:relevantData'},
{content: '重新计算', fnCode: 'calculate', type: 'text', icon: 'el-icon-brush', hasPermi: 'earnManage:switch:calculate'},
{}
{content: '相关数据', fnCode: 'edit', type: 'primary', icon: 'el-icon-tickets', hasPermi: 'earnManage:switch:relevantData'},
{content: '重新计算', fnCode: 'calculate', type: 'primary', icon: 'el-icon-brush', hasPermi: 'earnManage:switch:calculate'},
]
}
},
@@ -88,10 +88,9 @@
{content: '配置更新策略', fnCode: 'add', type: 'primary', icon: 'el-icon-plus', hasPermi: 'resource:agentUpdate:add'},
],
line: [
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:agentUpdate:details'},
{content: '修改更新策略', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:agentUpdate:edit'},
// {content: '手动更新', fnCode: 'update', type: 'text', icon: 'el-icon-refresh-right', hasPermi: 'disRevenue:resource:agentUpdate:update'},
{}
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:agentUpdate:details'},
{content: '修改更新策略', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:agentUpdate:edit'},
// {content: '手动更新', fnCode: 'update', type: 'primary', icon: 'el-icon-refresh-right', hasPermi: 'disRevenue:resource:agentUpdate:update'},
]
}
}
+1 -1
View File
@@ -77,7 +77,7 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:alarmLog:export'},
],
line: [
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:alarmLog:details'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:alarmLog:details'},
]
}
}
@@ -82,10 +82,10 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:alarmManage:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:alarmManage:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:alarmManage:details'},
{content: '复制', fnCode: 'copy', type: 'text', icon: 'el-icon-document-copy', hasPermi: 'resource:alarmManage:copy'},
{content: '下发策略', fnCode: 'strategy', type: 'text', icon: 'el-icon-sort-down', hasPermi: 'resource:alarmManage:strategy'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:alarmManage:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:alarmManage:details'},
{content: '复制', fnCode: 'copy', type: 'primary', icon: 'el-icon-document-copy', hasPermi: 'resource:alarmManage:copy'},
{content: '下发策略', fnCode: 'strategy', type: 'primary', icon: 'el-icon-sort-down', hasPermi: 'resource:alarmManage:strategy'},
]
}
}
+6 -6
View File
@@ -157,12 +157,12 @@
{content: '移动', fnCode: 'move', type: 'warning', icon: 'el-icon-sort', hasPermi: 'resource:fileManage:move'},
],
line: [
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:fileManage:details'},
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:fileManage:edit'},
{content: '删除', fnCode: 'delete', type: 'text', icon: 'el-icon-delete', hasPermi: 'resource:fileManage:delete'},
{content: '移动', fnCode: 'move', type: 'text', icon: 'el-icon-sort', hasPermi: 'resource:fileManage:move'},
{content: '复制', fnCode: 'copy', type: 'text', icon: 'el-icon-document-copy', hasPermi: 'resource:fileManage:copy'},
{content: '下载', fnCode: 'download', type: 'text', icon: 'el-icon-download', hasPermi: 'resource:fileManage:download'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:fileManage:details'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:fileManage:edit'},
{content: '删除', fnCode: 'delete', type: 'danger', icon: 'el-icon-delete', hasPermi: 'resource:fileManage:delete'},
{content: '移动', fnCode: 'move', type: 'primary', icon: 'el-icon-sort', hasPermi: 'resource:fileManage:move'},
{content: '复制', fnCode: 'copy', type: 'primary', icon: 'el-icon-document-copy', hasPermi: 'resource:fileManage:copy'},
{content: '下载', fnCode: 'download', type: 'primary', icon: 'el-icon-download', hasPermi: 'resource:fileManage:download'},
]
}
},
@@ -87,7 +87,7 @@
{content: '修改FRP服务端配置', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:frpServerManage:edit'},
],
line: [
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:frpServerManage:details'}
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:frpServerManage:details'}
]
}
}
+1 -1
View File
@@ -65,7 +65,7 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:group:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:group:edit'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:group:edit'},
]
}
}
@@ -67,8 +67,8 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:messagePush:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:messagePush:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:messagePush:details'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:messagePush:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:messagePush:details'},
]
}
}
+4 -4
View File
@@ -82,10 +82,10 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:monitorStategy:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:monitorStategy:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:monitorStategy:details'},
// {content: '复制', fnCode: 'copy', type: 'text', icon: 'el-icon-document-copy', hasPermi: 'disRevenue:resource:monitorStategy:copy'},
{content: '下发策略', fnCode: 'strategy', type: 'text', showName: 'status', showVal: '0', icon: 'el-icon-sort-down', hasPermi: 'resource:monitorStategy:strategy'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:monitorStategy:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:monitorStategy:details'},
// {content: '复制', fnCode: 'copy', type: 'primary', icon: 'el-icon-document-copy', hasPermi: 'disRevenue:resource:monitorStategy:copy'},
{content: '下发策略', fnCode: 'strategy', type: 'primary', showName: 'status', showVal: '0', icon: 'el-icon-sort-down', hasPermi: 'resource:monitorStategy:strategy'},
{}
]
}
+3 -3
View File
@@ -64,9 +64,9 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:monitorTemp:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:monitorTemp:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:monitorTemp:details'},
// {content: '复制', fnCode: 'copy', type: 'text', icon: 'el-icon-document-copy', hasPermi: 'disRevenue:resource:monitorTemp:copy'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:monitorTemp:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:monitorTemp:details'},
// {content: '复制', fnCode: 'copy', type: 'primary', icon: 'el-icon-document-copy', hasPermi: 'disRevenue:resource:monitorTemp:copy'},
]
}
}
+3 -3
View File
@@ -136,9 +136,9 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:mtrAgent:export'},
],
line: [
{content: '查看丢包率趋势', fnCode: 'echartView', type: 'text', icon: 'el-icon-data-analysis', hasPermi: 'resource:mtrAgent:echartView'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:mtrAgent:details'},
{title: '更多', hasPermi: ['resource:mtrAgent:update', 'resource:mtrAgent:addMtrProbe'], more: [
{content: '查看丢包率趋势', fnCode: 'echartView', type: 'primary', icon: 'el-icon-data-analysis', hasPermi: 'resource:mtrAgent:echartView'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:mtrAgent:details'},
{title: '更多', type: 'primary', hasPermi: ['resource:mtrAgent:update', 'resource:mtrAgent:addMtrProbe'], more: [
{content: '配置更新策略', fnCode: 'update', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'resource:mtrAgent:update'},
{content: '新建MTR探测策略', fnCode: 'addMtrProbe', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'resource:mtrAgent:addMtrProbe'},
]
+3 -3
View File
@@ -69,9 +69,9 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:mtrProbe:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:mtrProbe:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:mtrProbe:details'},
{content: '删除', fnCode: 'delete', type: 'text', icon: 'el-icon-delete', hasPermi: 'resource:mtrProbe:delete'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:mtrProbe:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:mtrProbe:details'},
{content: '删除', fnCode: 'delete', type: 'danger', icon: 'el-icon-delete', hasPermi: 'resource:mtrProbe:delete'},
]
}
},
+3 -3
View File
@@ -138,9 +138,9 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:register:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:register:edit'},
{content: '注册', fnCode: 'enroll', showName: 'registrationStatus', showVal: '0', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'resource:register:enroll'},
{content: '取消注册', fnCode: 'unenroll', showName: 'registrationStatus', showVal: '1', type: 'text', icon: 'el-icon-circle-close', hasPermi: 'resource:register:unenroll'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:register:edit'},
{content: '注册', fnCode: 'enroll', showName: 'registrationStatus', showVal: '0', type: 'primary', icon: 'el-icon-circle-check', hasPermi: 'resource:register:enroll'},
{content: '取消注册', fnCode: 'unenroll', showName: 'registrationStatus', showVal: '1', type: 'primary', icon: 'el-icon-circle-close', hasPermi: 'resource:register:unenroll'},
]
}
},
@@ -131,10 +131,9 @@
// expand: true, // 表格下拉
tableButton: {
line: [
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:fileManage:details'},
// {content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'disRevenue:resource:fileManage:edit'},
{content: '查看脚本执行结果', fnCode: 'result', type: 'text', icon: 'el-icon-s-check', hasPermi: 'resource:fileManage:result'},
{}
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:fileManage:details'},
// {content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'disRevenue:resource:fileManage:edit'},
{content: '查看脚本执行结果', fnCode: 'result', type: 'primary', icon: 'el-icon-s-check', hasPermi: 'resource:fileManage:result'},
]
}
},
+1 -1
View File
@@ -145,7 +145,7 @@
// {content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'disRevenue:resource:resMonitor:export'},
// ],
line: [
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:resMonitor:details'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:resMonitor:details'},
]
}
},
@@ -78,10 +78,9 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:serverMonitorStrat:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', showName: 'status', showVal: '0', icon: 'el-icon-edit', hasPermi: 'resource:serverMonitorStrat:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:serverMonitorStrat:details'},
{content: '删除', fnCode: 'delete', type: 'text', showName: 'status', showVal: '0', icon: 'el-icon-delete', hasPermi: 'resource:serverMonitorStrat:delete'},
{}
{content: '修改', fnCode: 'edit', type: 'primary', showName: 'status', showVal: '0', icon: 'el-icon-edit', hasPermi: 'resource:serverMonitorStrat:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:serverMonitorStrat:details'},
{content: '删除', fnCode: 'delete', type: 'danger', showName: 'status', showVal: '0', icon: 'el-icon-delete', hasPermi: 'resource:serverMonitorStrat:delete'},
]
}
}
@@ -1,7 +1,7 @@
<template>
<div style="padding: 0 30px;">
<el-button type="primary" style="position: absolute;right: 100px;z-index: 9999;" @click="formSubmit()">{{readonly ? '编辑' : '保存'}}</el-button>
<el-button v-if="!readonly" style="position: absolute;right: 20px;z-index: 9999;" @click="formSubmit(-1)">取消</el-button>
<el-button v-if="!readonly" style="position: absolute;right: 20px;z-index: 9999;" @click="formSubmit('-1')">取消</el-button>
<Form ref="formRef" :formList="formList" :ruleFormData="ruleForm" :config="{labelWidth: '140px', buttonGroup: []}" @fnClick="callback">
<template #tempPoeConfigRules="{ field, model, formModel }">
<div v-if="!readonly">
@@ -87,6 +87,7 @@
}
},
ipList: [],
loadingBool: false,
}
},
created() {
@@ -100,9 +101,9 @@
controls: {
id: {label: 'ID', hidden: true},
clientId: {label: 'clientId', hidden: true},
pppoeEnabled: {label: '启用PPPoE', span: readonly ? 12 : 24, type: 'radio', options: this.dict.type.pppoe_enabled, required: true},
pppoeConfigMode: {label: 'PPPoE配置方式', span: readonly ? 10 : 24, type: 'select', options: this.dict.type.pppoe_config_mode, warningTitle: '使用multi_wan_conntrack.sh', required: true},
pppoeInterface: {label: 'PPPoE网卡', span: readonly ? 12 : 24, type: 'select', options: this.ipList || [], required: true},
pppoeEnabled: {label: '启用PPPoE', span: readonly ? 12 : 24, type: 'radio', options: this.dict.type.pppoe_enabled, required: readonly ? false : true},
pppoeConfigMode: {label: 'PPPoE配置方式', span: readonly ? 10 : 24, type: 'select', options: this.dict.type.pppoe_config_mode, warningTitle: '使用multi_wan_conntrack.sh', required: readonly ? false : true},
pppoeInterface: {label: 'PPPoE网卡', span: readonly ? 12 : 24, type: 'select', options: this.ipList || [], required: readonly ? false : true},
subList: {label: 'PPPoE配置规则', span: 24, slotName: 'tempPoeConfigRules'},
}
}];
@@ -119,20 +120,59 @@
};
},
poeInterfaceList() {
if (this.loadingBool) return;
this.loadingBool = true;
networkList({clientIds: this.ruleForm.clientId, newFlag: 1}).then(res => {
this.ipList = [];
res && res.data.map(item => {
this.ipList.push({label: item.interfaceName, value: item.interfaceName});
});
this.formList[0].controls.pppoeInterface['options'] = this.ipList;
this.loadingBool = false;
});
},
// 切换编辑和保存
formSubmit(num) {
if (num === '-1') {
this.ruleForm = Object.assign({}, this.modelVal, {typeName: 111});
// this.readonly = true;
// this.fnFormList(this.readonly);
// this.ruleForm = Object.assign({}, this.modelVal[0], {typeName: 111});
// 1. 获取表单引用
const formRef = this.$refs.formRef;
// console.log('gggg===', formRef.$refs.ruleForm);
// 2. 先清除所有表单校验
if (formRef && formRef.$refs.ruleForm) {
formRef.$refs.ruleForm.clearValidate(); // 清除校验提示
}
// 3. 重置为只读模式
this.readonly = true;
this.fnFormList(this.readonly);
// 4. 恢复原始数据(而不是清空)
if (this.modelVal && this.modelVal[0]) {
// 深度复制原始数据
const originalData = JSON.parse(JSON.stringify(this.modelVal[0]));
// 将 pppoeEnabled 转换为字符串(如果需要)
if (originalData.pppoeEnabled || originalData.pppoeEnabled === 0) {
originalData.pppoeEnabled = originalData.pppoeEnabled.toString();
}
this.ruleForm = originalData;
} else {
// 如果没有原始数据,重置为空对象
this.ruleForm = {};
}
// 5. 重置表格数据
if (this.modelVal && this.modelVal[0] && this.modelVal[0].subList) {
this.roleList = JSON.parse(JSON.stringify(this.modelVal[0].subList));
this.roleList.forEach((item, index) => {
item.targetIndexNum = index + 1;
if (index !== 0) {
item.showNum = '1';
}
});
} else {
this.roleList = [];
}
} else {
if (!this.readonly) {
this.ruleForm = Object.assign({}, this.ruleForm, this.$refs.formRef.$refs.ruleForm.model);
@@ -145,8 +185,31 @@
}
}
},
// form验证
fnFormValid() {
return new Promise((resolve) => {
this.ruleForm = {};
const formValid = this.$refs.formRef.$refs.ruleForm;
// 3. 操作form(如验证)
formValid.validate((valid) => {
if (valid) {
this.ruleForm = formValid.model;
resolve(true);
} else {
resolve(false);
}
});
});
},
// 新增判断
submitPoeModel() {
async submitPoeModel() {
let formValidateBool = true;
if (this.ruleForm.pppoeEnabled && this.ruleForm.pppoeEnabled === '1') {
if (!await this.fnFormValid()) {
formValidateBool = false;
}
}
if (!formValidateBool) return;
let params = {
clientId: this.ruleForm.clientId,
pppoeEnabled: this.ruleForm.pppoeEnabled,
@@ -197,7 +260,7 @@
this.roleList.splice(this.roleList.findIndex(item => item.targetIndexNum === dataVal.targetIndexNum), 1);
break;
case 'submit':
console.log('contentList===',this.contentList, 'dataVal===',dataVal);
// console.log('contentList===',this.contentList, 'dataVal===',dataVal);
// this.$emit("dialogResult", {open: false});
break;
case 'cancel':
+65 -34
View File
@@ -69,11 +69,11 @@
</el-tab-pane>
<!-- 网卡信息 -->
<el-tab-pane label="网卡信息" name="网卡信息">
<serRegisFormOther v-if="activeName === '网卡信息'" :key="activeName" :activeName="activeName" :modelVal="[ruleForm]"></serRegisFormOther>
<serRegisTable v-if="activeName === '网卡信息'" :key="activeName" :activeName="activeName" :modelVal="mapDataList['网卡信息']"></serRegisTable>
</el-tab-pane>
<!-- 虚拟网卡信息 -->
<el-tab-pane label="虚拟网卡信息" name="虚拟网卡信息">
<serRegisFormOther v-if="activeName === '虚拟网卡信息'" :key="activeName" :activeName="activeName" :modelVal="mapDataList['虚拟网卡信息']"></serRegisFormOther>
<serRegisTable v-if="activeName === '虚拟网卡信息'" :key="activeName" :activeName="activeName" :modelVal="mapDataList['虚拟网卡信息']"></serRegisTable>
</el-tab-pane>
<!-- 收益查看 -->
<el-tab-pane label="收益查看" name="收益查看">
@@ -100,7 +100,7 @@
import memoryImg from '@/assets/images/memory.svg';
import {getHandle, trafficSerDetails, agentIsNew, virNetInterfaceChild, frpMsgByClient, getPppoeConfig, updateAgentManage, postInterFaceName,
mountNameList, diskAllNames, trafficEcharts, spaceRate, speedEcharts, trafficIPv4Echarts, trafficIPv6Echarts,
cpuLoadData, memoryUtilization, serverMonitorData} from "@/api/disRevenue/resource";
cpuLoadData, memoryUtilization, serverMonitorData, networkList} from "@/api/disRevenue/resource";
import {listBandWidth} from "@/api/disRevenue/earnManage";
import serRegisFormOther from './formOther';
import serRegisTable from './table';
@@ -331,23 +331,25 @@
},
// tab栏点击事件
handleClick() {
if (!this.mapDataList[this.activeName] || this.mapDataList[this.activeName].length <= 0) {
if (this.activeName === '网卡流量监控') {
this.fnSwitchNetNames('网卡流量监控');
} else if (this.activeName === '挂载文件系统监控') {
this.fnInterFaceNameList('挂载文件系统监控');
} else if (this.activeName === '硬盘设备监控') {
this.fnDiskNames('硬盘设备监控');
} else if (this.activeName === '虚拟网卡信息') {
this.virtualNetCard(this.activeName);
} else if (this.activeName === 'FRP信息') {
this.fnFRPData(this.activeName);
} else if (this.activeName === '收益查看') {
this.serverBandWidth(this.activeName);
} else if (this.activeName === 'PPPoE配置') {
this.fnPppoeConfig(this.activeName);
}
if (this.activeName === '网卡流量监控') {
this.fnSwitchNetNames('网卡流量监控');
} else if (this.activeName === '挂载文件系统监控') {
this.fnInterFaceNameList('挂载文件系统监控');
} else if (this.activeName === '硬盘设备监控') {
this.fnDiskNames('硬盘设备监控');
} else if (this.activeName === '网卡信息') {
this.interNetCard(this.activeName);
} else if (this.activeName === '虚拟网卡信息') {
this.virtualNetCard(this.activeName);
} else if (this.activeName === 'FRP信息') {
this.fnFRPData(this.activeName);
} else if (this.activeName === '收益查看') {
this.serverBandWidth(this.activeName);
} else if (this.activeName === 'PPPoE配置') {
this.fnPppoeConfig(this.activeName);
}
// if (!this.mapDataList[this.activeName] || this.mapDataList[this.activeName].length <= 0) {
// }
},
// 收益信息的分页回调
fnPaging(val) {
@@ -369,14 +371,40 @@
}
});
},
// 网卡信息
interNetCard(keyName) {
networkList({clientId: this.ruleForm.clientId, newFlag: 1}).then(res => {
let newList = [];
let oneData = [];
let twoData = [];
res && res.data.map(item => {
if (item.ipv4Address && item.ipv4Address !== 'N/A') {
oneData.push(item);
} else {
twoData.push(item);
}
});
newList = oneData.concat(twoData);
this.$set(this.mapDataList, keyName, [{tableList: newList, queryParams: {total: newList.length}}]);
});
},
// 虚拟网卡信息
virtualNetCard(keyName) {
let newData = [];
virNetInterfaceChild({clientId: this.paramsData.clientId}).then(resVal => {
resVal && resVal.data.forEach(item => {
newData.push({title: item.interfaceName, formModel: item});
});
this.$set(this.mapDataList, keyName, newData);
if (resVal && resVal.data) {
let newList = [];
let oneData = [];
let twoData = [];
resVal.data.forEach(item => {
if (item.ipv4Address && item.ipv4Address !== 'N/A') {
oneData.push(item);
} else {
twoData.push(item);
}
});
newList = oneData.concat(twoData);
this.$set(this.mapDataList, keyName, [{tableList: newList, queryParams: {total: newList.length}}]);
}
});
},
// PPPoE配置
@@ -397,8 +425,8 @@
'CPU使用率': {title: 'CPU使用率(%)', titleTo: 'CPU使用率(%)', clientId: this.paramsData.clientId},
'内存使用率': {title: '内存使用率(%)', titleTo: '内存使用率(%)', clientId: this.paramsData.clientId}
});
this.getMonitorData();
postInterFaceName({clientId: this.paramsData.clientId,resourceType: 1}).then(res => {
// this.getMonitorData();
this.interNetCardList().then(res => {
if (res && res.length > 0) {
this.interCartList = {};
res && res.forEach(async(item,index) => {
@@ -407,13 +435,17 @@
}
});
},
getMonitorData() {
serverMonitorData({clientId: this.paramsData.clientId}).then(res => {
if (res && res.data) {
this.systemModel = res.data;
}
});
// 网卡信息数据
interNetCardList() {
return postInterFaceName({clientId: this.paramsData.clientId,resourceType: 1});
},
// getMonitorData() {
// serverMonitorData({clientId: this.paramsData.clientId}).then(res => {
// if (res && res.data) {
// this.systemModel = res.data;
// }
// });
// },
// 挂载文件 === 接口名称
fnInterFaceNameList(keyName) {
mountNameList({clientId: this.paramsData.clientId}).then(res => {
@@ -470,7 +502,7 @@
} else {
Object.keys(this.mapDataList[keyVal]).forEach(async (keyName,index) => {
if (keyName === '网卡信息') {
this.mapDataList[keyVal][keyName].echartList = [];
// this.mapDataList[keyVal][keyName].echartList = [];
if (await this.getNetEcharts(time, keyVal, keyName, interCardName)) {
if (this.interCartList[interCardName].businessFlag) {
if (await this.getNetIPv4Echarts(time, keyVal, keyName, interCardName)) {
@@ -608,7 +640,6 @@
}
mountCollect['echartList'][2] = netEcharts;
this.$set(this.mapDataList[keyVal], titleName, mountCollect);
console.log('mapDataList===',this.mapDataList);
}
return true;
}).catch(() => {
+20 -56
View File
@@ -1,32 +1,6 @@
<template>
<div class="w100 h100">
<TableList v-if="activeName === '收益查看'" class="w100 h100" :columns="columns" :config="config" :queryParams="queryParams" :tableList="modelVal" @fnClick="callback">
<template #tempDay="{ valueKey, row, column }">
<span v-if="row && row[valueKey] || row[valueKey] === 0">{{row[valueKey]}}/{{row.createTime}}</span>
</template>
<template #tempMonth="{ valueKey, row, column }">
<span v-if="row && row[valueKey] || row[valueKey] === 0">{{row[valueKey]}}/{{row.createTime.slice(0, 7)}}</span>
</template>
</TableList>
<div v-else-if="activeName === '虚拟网卡信息'">
<el-collapse v-model="activeShowList">
<template v-for="(val, index) of modelVal">
<el-collapse-item :title="`【${val && val.title || ''}】${val && val.serverIp || ''}`" :name="index">
<div class="mt10 w100">
<div class="w100 plr-20" style="font-size: 14px">
<div v-for="(item,key,index) of collFormList || []" :key="`${key}-${index}`" class="disInlineBlock p10" style="width: calc(100% / 3);">
<div class="disInlineBlock" style="width: 120px;color: #C0C4CC;">{{item}}</div>
<div style="width: calc(100% - 120px);vertical-align: top;" class="disInlineBlock">{{val && val.formModel[key] || '-'}}</div>
</div>
</div>
</div>
</el-collapse-item>
</template>
</el-collapse>
</div>
<template v-else>
<Form v-if="modelVal && modelVal.length > 0" :key="activeName" :formList="formList" :ruleFormData="modelVal[0]" :config=" {labelWidth: '140px', buttonGroup: []}" @fnClick="callback"></Form>
</template>
<Form v-if="formList && formList.length > 0" :key="activeName" :formList="formList" :ruleFormData="dataModelList[0]" :config=" {labelWidth: '140px', buttonGroup: []}" @fnClick="callback"></Form>
</div>
</template>
@@ -49,10 +23,25 @@
},
watch: {
activeName: {
handler(newVal, oldVal) {
handler(newVal) {
// tab
if (newVal && newVal !== oldVal && newVal !== '虚拟网卡信息') {
this.formListData(newVal);
if (newVal) {
this.$nextTick(() => {
this.formListData(newVal);
});
}
},
deep: true,
immediate: true
},
modelVal: {
handler(newVal) {
// tab
if (newVal && newVal.length > 0) {
newVal[0]['frpcConnectionStatus'] = newVal[0] && (newVal[0]['frpcConnectionStatus'] || newVal[0]['frpcConnectionStatus'] === 0) ? newVal[0]['frpcConnectionStatus'].toString() : newVal[0]['frpcConnectionStatus'];
newVal[0]['frpcStatus'] = newVal[0] && (newVal[0]['frpcStatus'] || newVal[0]['frpcStatus'] === 0) ? newVal[0]['frpcStatus'].toString() : newVal[0]['frpcStatus'];
let newModel = JSON.parse(JSON.stringify(newVal[0]));
this.$set(this.dataModelList, 0, newModel);
}
},
deep: true,
@@ -62,33 +51,8 @@
data() {
return {
activeShowList: [0,1,2,3,4,5,6,7,8,9],
dataModelList: [],
formList: [],
//
columns: {
id: {label: `ID`, width: '50'},
clientId: {label: `ClientID`, minWidth: '280', visible: true},
businessName: {label: `业务名称`, minWidth: '150', visible: true},
bandwidth95Daily: {label: `95带宽值/日(Mbit)`, minWidth: '150', slotName: 'tempDay',visible: true},
bandwidth95Monthly: {label: `95带宽值/月(Mbit)`, minWidth: '150', slotName: 'tempMonth',visible: true},
avgMonthlyBandwidth95: {label: `月均日95值(Mbit)`, minWidth: '150',slotName: 'tempDay',visible: true},
},
config: {
colHiddenCheck: true, colTopHiddenIcon: true,
tableButton: {
line: [
{content: '相关数据', fnCode: 'edit', type: 'text', icon: 'el-icon-tickets', hasPermi: 'earnManage:server:relevantData'},
]
}
},
queryParams: {
pageNum: 1,
pageSize: 8,
total: 0,
},
collFormList: {
interfaceName: '接口名称', interfaceType: '接口类型', macAddress: 'MAC地址',publicIp: '公网地址',
isp: '运营商', province: '省', city: '市', ipv4Address: 'IPv4地址', ipv4Gateway: 'IPv4网关', ipv6Address: 'IPv6全球单播地址'
},
}
},
created() {
+3 -3
View File
@@ -298,9 +298,9 @@
{content: '下架', fnCode: 'unShelve', type: 'danger', icon: 'el-icon-bottom', hasPermi: 'resource:serverRegister:unShelve'},
],
line: [
{content: '选择业务IP', fnCode: 'pubilcNet', type: 'text', icon: 'el-icon-thumb', showName: 'multiPublicIpStatus', showVal: '0', hasPermi: 'resource:serverRegister:pubilcNet'},
{content: '图形监控', fnCode: 'echartView', type: 'text', icon: 'el-icon-data-analysis', hasPermi: 'rocketmq:traffic'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:serverRegister:details'},
{content: '选择业务IP', fnCode: 'pubilcNet', type: 'primary', icon: 'el-icon-thumb', showName: 'multiPublicIpStatus', showVal: '0', hasPermi: 'resource:serverRegister:pubilcNet'},
{content: '图形监控', fnCode: 'echartView', type: 'primary', icon: 'el-icon-data-analysis', hasPermi: 'resource:serverRegister:echartView'},// rocketmq:traffic
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'rocketmq:traffic'}, // resource:serverRegister:details
{title: '更多', hasPermi: ['system:businessDeploy', 'rocketmq:policy', 'rocketmq:monitorPolicy', 'rocketmq:remote', 'resource:serverRegister:tagRemarkEdit', 'resource:serverRegister:mtrChartVew', 'resource:serverRegister:cancelFlash', 'resource:serverRegister:createFrpAddr', 'resource:serverRegister:showFrpAddr'], more: [
{content: '下发业务', fnCode: 'issueBusiness', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'system:businessDeploy'},
{content: '下发脚本策略', fnCode: 'issueScript', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'rocketmq:policy'},
+87 -18
View File
@@ -1,19 +1,23 @@
<template>
<div class="w100 h100">
<div>
<div v-if="activeName === '收益查看'">
<span style="display: inline-block;font-size: 14px;font-weight: 600;">计算方式</span>
<el-select v-model="typeNum" @change="handleSelect">
<el-option key="1000" :value="'1000'" :label="'1000'">1000计算方式</el-option>
<el-option key="1024" :value="'1024'" :label="'1024'">1024计算方式</el-option>
</el-select>
</div>
<TableList class="w100 h100" :columns="columns" :config="config" :queryParams="queryParams" :tableList="tableList" @fnRenderList="fnRenderList" @fnClick="callback">
<TableList ref="tabref" class="w100 h100" :columns="columns" :config="config" :queryParams="queryParams" :tableList="tableList" @fnRenderList="fnRenderList" @fnClick="callback">
<template #tempDay="{ valueKey, row, column }">
<span v-if="row && row[valueKey] || row[valueKey] === 0">{{row[valueKey]}}/{{row.createTime}}</span>
</template>
<template #tempMonth="{ valueKey, row, column }">
<span v-if="row && row[valueKey] || row[valueKey] === 0">{{row[valueKey]}}/{{row.createTime.slice(0, 7)}}</span>
</template>
<template #tempStatus="{ valueKey, row, column }">
<span v-if="row[valueKey] === '0'">未连通</span>
<span v-if="row[valueKey] === '1'">已连通</span>
</template>
</TableList>
<el-dialog title="相关数据" :visible.sync="listOpen" width="900px" append-to-body style="padding-bottom: 20px;">
<relevantData :rowDataList="rowDataList" @closeDialog="closeDialog"></relevantData>
@@ -38,6 +42,17 @@
}
},
watch: {
activeName: {
handler(newVal, oldVal) {
if (newVal && newVal !== oldVal) {
this.$nextTick(() => {
this.columnsList();
});
}
},
deep: true,
immediate: true
},
modelVal: {
handler(newVal) {
if (newVal && newVal.length > 0) {
@@ -53,22 +68,8 @@
return {
typeNum: '1000',
//
columns: {
id: {label: `ID`, width: '50'},
clientId: {label: `ClientID`, minWidth: '280', visible: true},
businessName: {label: `业务名称`, minWidth: '150', visible: true},
bandwidth95Daily: {label: `95带宽值/日(Mbit)`, minWidth: '150', slotName: 'tempDay',visible: true},
bandwidth95Monthly: {label: `95带宽值/月(Mbit)`, minWidth: '150', slotName: 'tempMonth',visible: true},
avgMonthlyBandwidth95: {label: `月均日95值(Mbit)`, minWidth: '150',slotName: 'tempDay',visible: true},
},
config: {
colHiddenCheck: true, colTopHiddenIcon: true,
tableButton: {
line: [
{content: '相关数据', fnCode: 'edit', type: 'text', icon: 'el-icon-tickets', hasPermi: 'earnManage:server:relevantData'},
]
}
},
columns: {},
config: {},
tableList: [],
queryParams: {
pageNum: 1,
@@ -91,6 +92,74 @@
closeDialog() {
this.listOpen = false;
},
columnsList() {
this.columns = {};
this.config = {};
if (this.activeName === '收益查看') {
//
this.columns = {
id: {label: `ID`, width: '50'},
clientId: {label: `ClientID`, minWidth: '280', visible: true},
businessName: {label: `业务名称`, minWidth: '150', visible: true},
bandwidth95Daily: {label: `95带宽值/日(Mbit)`, minWidth: '150', slotName: 'tempDay',visible: true},
bandwidth95Monthly: {label: `95带宽值/月(Mbit)`, minWidth: '150', slotName: 'tempMonth',visible: true},
avgMonthlyBandwidth95: {label: `月均日95值(Mbit)`, minWidth: '150',slotName: 'tempDay',visible: true},
};
this.config = {
colHiddenCheck: true,
colTopHiddenIcon: true,
tableButton: {
line: [
{content: '相关数据', fnCode: 'edit', type: 'text', icon: 'el-icon-tickets', hasPermi: 'earnManage:server:relevantData'},
]
}
};
} else if (this.activeName === '虚拟网卡信息') {
//
this.columns = {
id: {label: `ID`, width: '50'},
clientId: {label: `clientID`, minWidth: '280'},
isp: {label: `运营商`, minWidth: '60', visible: true},
province: {label: ``, minWidth: '60', visible: true},
city: {label: ``, minWidth: '80',visible: true},
publicIp: {label: `公网地址`, minWidth: '100',visible: true},
ipv4Address: {label: `IPv4`, minWidth: '120',visible: true},
gateway: {label: `网关`, minWidth: '120',visible: true},
interfaceName: {label: `接口名称`, minWidth: '100',visible: true},
interfaceType: {label: `接口类型`, minWidth: '80',visible: true},
macAddress: {label: `MAC地址`, minWidth: '150',visible: true},
ipv6Address: {label: `IPv6`, minWidth: '100',visible: true},
status: {label: `连通状态`, minWidth: '100', slotName: 'tempStatus', visible: true},
};
this.config = {
colHiddenCheck: true, colTopHiddenIcon: true,
};
} else if (this.activeName === '网卡信息') {
//
this.columns = {
id: {label: `ID`, width: '50'},
clientId: {label: `clientID`, minWidth: '280'},
isp: {label: `运营商`, minWidth: '60', visible: true},
province: {label: ``, minWidth: '60', visible: true},
city: {label: ``, minWidth: '80',visible: true},
publicIp: {label: `公网地址`, minWidth: '100',visible: true},
ipv4Address: {label: `IPv4`, minWidth: '120',visible: true},
gateway: {label: `网关`, minWidth: '150',visible: true},
interfaceName: {label: `接口名称`, minWidth: '100',visible: true},
interfaceType: {label: `接口类型`, minWidth: '100',visible: true},
macAddress: {label: `MAC地址`, minWidth: '150',visible: true},
ipv6Address: {label: `IPv6`, minWidth: '120',visible: true},
};
this.config = {
colHiddenCheck: true, colTopHiddenIcon: true,
};
}
this.$nextTick(() => {
if (this.$refs.tabref) {
this.$refs.tabref.tableKey++;
}
});
},
callback(result, rowData, selectChange, selectList) {
if (result && result.fnCode) {
switch (result.fnCode) {
+62 -12
View File
@@ -18,12 +18,23 @@
<el-radio-group v-model="timeModel" size="medium" class="ml20" :disabled="timeShow" @input="radioTimeChange">
<el-radio-button v-for="item of radioTimeList" :label="item.value">{{item.name}}</el-radio-button>
</el-radio-group>
<!-- 定时刷新 -->
<div class="disInlineBlock ml10">
<el-select v-model="timeRefresh" placeholder="请选择" style="width: 110px;" @change="fnTimeInter">
<el-option
v-for="item in timeModelOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
<!-- 单双列切换 -->
<el-radio-group v-model="layoutModel" size="medium" class="ml20" style="float: right;" @input="radioLayouteChange">
<el-radio-button v-for="item of radioLayoutList" :label="item.value">{{item.name}}</el-radio-button>
</el-radio-group>
</div>
<div v-if="activeName === '网卡流量监控'">
<div class="mt10" v-if="activeName === '网卡流量监控'">
<span style="display: inline-block;font-size: 14px;font-weight: 600;">网卡名称</span>
<el-select v-model="interCardName" @change="handleSelect">
<el-option v-for="(item,key) of this.interCartList" :key="key" :value="key" :label="key">
@@ -33,7 +44,7 @@
</div>
<template v-if="echartDataList && Object.keys(echartDataList).length > 0">
<template v-for="(val, key, index) of echartDataList">
<div :ref="key" v-for="(item, chartIndex) of val.echartList" class="disInlineBlock mt20 mb20 plr-10" :style="`width: calc(100% / ${layoutModel}); height:300px;position: relative;`">
<div v-for="(item, chartIndex) of val.echartList" class="disInlineBlock mt10 mb10 plr-10" :style="`width: calc(100% / ${layoutModel}); height:300px;position: relative;`">
<!-- 图表标题 -->
<div style="width: 100%;position: absolute;top: 12px;left: 30px;">
<template v-if="val && val.serverIp">
@@ -51,7 +62,7 @@
</div>
</div>
<!-- 图表 -->
<EchartsLine v-if="val && val.titleTo" :key="`chart-${key || ''}-${index}-${chartIndex}`" :lineData="item && item.dataVal || {}"
<EchartsLine :ref="`${key}_${chartIndex}`" v-if="val && val.title" :key="`chart-${key || ''}-${index}-${chartIndex}`" :lineData="item && item.dataVal || {}"
:title="undefined" class="w100 h100" style="border: 1.5px solid #cfcfcf;"
:chartData="(valData, unit) => chartDataEvent(valData, item.fnEvent,val.title, unit)"></EchartsLine>
<div v-else class="w100 h100 flex-center disInlineBlock mt20 mb20 plr-10" :style="`width: calc(100% / ${layoutModel}); height:200px;background: #f5f7fa;`">
@@ -63,11 +74,11 @@
</div>
</template>
</template>
<div v-if="activeName === '网卡流量监控'">
<div v-for="(item, key) of systemContent" class="disInlineBlock w50" style="font-size: 14px;line-height: 25px;vertical-align: top;">
<span style="color: #C0C4CC;">{{item}}</span>{{modelVal[key]}}
</div>
</div>
<!-- <div v-if="activeName === '网卡流量监控'">-->
<!-- <div v-for="(item, key) of systemContent" class="disInlineBlock w50" style="font-size: 14px;line-height: 25px;vertical-align: top;">-->
<!-- <span style="color: #C0C4CC;">{{item}}</span>{{modelVal[key]}}-->
<!-- </div>-->
<!-- </div>-->
</div>
</template>
@@ -157,11 +168,38 @@
currTimeList: {},
indexNum: 0,
interCardName: '',
timedRefresh: '',
timeRefresh: '300000',
timeModelOptions: [
{value: '30000', label: '30s刷新'},
{value: '60000', label: '1分钟刷新'},
{value: '300000', label: '5分钟刷新'},
{value: '0', label: '不刷新'},
],
}
},
created() {
},
beforeDestroy() {
clearInterval(this.timedRefresh);
this.timedRefresh = null;
},
methods: {
//
fnTimeInter(val) {
clearInterval(this.timedRefresh);
this.timedRefresh = null;
if (val !== '0') {
this.timedRefresh = setInterval(() => {
this.$emit('timeChangeData', {currTimeList: this.currTimeList, interCardName: this.interCardName});
}, Number(val));
}
},
//
handleSelect(val) {
this.$emit('timeChangeData', {currTimeList: this.currTimeList, interCardName: this.interCardName, onlyInterCard: true});
this.fnTimeInter(this.timeRefresh);
},
//
checkChange(val) {
this.timeModel = null;
@@ -170,6 +208,7 @@
dateChange(val){
this.currTimeList = {startTime: val[0], endTime: val[1]};
this.$emit('timeChangeData', {currTimeList: this.currTimeList, interCardName: this.interCardName});
this.fnTimeInter(this.timeRefresh);
},
//
radioTimeChange(val) {
@@ -184,14 +223,23 @@
this.get7dayTime();
}
this.$emit('timeChangeData', {currTimeList: this.currTimeList, interCardName: this.interCardName});
this.fnTimeInter(this.timeRefresh);
},
//
radioLayouteChange(val) {
this.layoutModel = val;
this.$nextTick(() => {
const resizeEvent = new Event('resize');
// window resize
window.dispatchEvent(resizeEvent);
// resize
Object.keys(this.$refs).forEach(key => {
const chartRefs = this.$refs[key];
if (Array.isArray(chartRefs)) {
chartRefs.forEach(chartRef => {
if (chartRef.resizeChart) {
chartRef.resizeChart();
}
});
}
});
});
},
// 6
@@ -260,7 +308,6 @@
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
},
chartDataEvent(valData, funcName, tabName, unit) {
this.$emit("chartFnEvent", this.currTimeList, funcName, tabName, unit, this.activeName, this.interCardName);
// //
@@ -287,4 +334,7 @@
height: 100%;
font-size: 1.1rem;
}
::v-deep .el-radio-button--medium .el-radio-button__inner {
padding: 10px 15px!important;
}
</style>
@@ -93,11 +93,11 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:monitorStategy:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:monitorStategy:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:monitorStategy:details'},
// {content: '', fnCode: 'copy', type: 'text', icon: 'el-icon-document-copy', hasPermi: 'disRevenue:resource:monitorStategy:copy'},
{content: '下发策略', fnCode: 'strategy', type: 'text', showName: 'policyStatus', showVal: '0', icon: 'el-icon-sort-down', hasPermi: 'resource:monitorStategy:strategy'},
{content: '删除', fnCode: 'delete', type: 'text', icon: 'el-icon-delete', hasPermi: 'resource:monitorStategy:delete'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:monitorStategy:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:monitorStategy:details'},
// {content: '', fnCode: 'copy', type: 'primary', icon: 'el-icon-document-copy', hasPermi: 'disRevenue:resource:monitorStategy:copy'},
{content: '下发策略', fnCode: 'strategy', type: 'primary', showName: 'policyStatus', showVal: '0', icon: 'el-icon-sort-down', hasPermi: 'resource:monitorStategy:strategy'},
{content: '删除', fnCode: 'delete', type: 'danger', icon: 'el-icon-delete', hasPermi: 'resource:monitorStategy:delete'},
]
}
},
@@ -123,10 +123,10 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:serverScriptStrat:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', showName: 'policyStatus', showVal: '0', icon: 'el-icon-edit', hasPermi: 'resource:serverScriptStrat:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:serverScriptStrat:details'},
{content: '删除', fnCode: 'delete', type: 'text', showName: 'policyStatus', showVal: '0', icon: 'el-icon-delete', hasPermi: 'resource:serverScriptStrat:delete'},
{content: '执行结果查看', fnCode: 'resultView', type: 'text', showName: 'policyStatus', showVal: '1', icon: 'el-icon-help', hasPermi: 'resource:serverScriptStrat:resultView'},
{content: '修改', fnCode: 'edit', type: 'primary', showName: 'policyStatus', showVal: '0', icon: 'el-icon-edit', hasPermi: 'resource:serverScriptStrat:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:serverScriptStrat:details'},
{content: '删除', fnCode: 'delete', type: 'danger', showName: 'policyStatus', showVal: '0', icon: 'el-icon-delete', hasPermi: 'resource:serverScriptStrat:delete'},
{content: '执行结果查看', fnCode: 'resultView', type: 'primary', showName: 'policyStatus', showVal: '1', icon: 'el-icon-help', hasPermi: 'resource:serverScriptStrat:resultView'},
]
}
},
@@ -81,9 +81,9 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:switchMonitorStrat:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', showName: 'status', showVal: '0', icon: 'el-icon-edit', hasPermi: 'resource:switchMonitorStrat:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:switchMonitorStrat:details'},
{content: '删除', fnCode: 'delete', type: 'text', showName: 'status', showVal: '0', icon: 'el-icon-delete', hasPermi: 'resource:switchMonitorStrat:delete'},
{content: '修改', fnCode: 'edit', type: 'primary', showName: 'status', showVal: '0', icon: 'el-icon-edit', hasPermi: 'resource:switchMonitorStrat:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:switchMonitorStrat:details'},
{content: '删除', fnCode: 'delete', type: 'danger', showName: 'status', showVal: '0', icon: 'el-icon-delete', hasPermi: 'resource:switchMonitorStrat:delete'},
{}
]
}
+4 -4
View File
@@ -123,10 +123,10 @@
{content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'resource:switchRegister:export'},
],
line: [
{content: '图形监控', fnCode: 'echartView', type: 'text', icon: 'el-icon-data-analysis', hasPermi: 'rocketmq:switchInfo'},
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:switchRegister:edit'},
{content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:switchRegister:details'},
{content: '执行监控策略', fnCode: 'monitorStrategy', type: 'text', icon: 'el-icon-document-checked', hasPermi: 'resource:switchRegister:monitorStrategy'},
{content: '图形监控', fnCode: 'echartView', type: 'primary', icon: 'el-icon-data-analysis', hasPermi: 'rocketmq:switchInfo'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:switchRegister:edit'},
{content: '详情', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'resource:switchRegister:details'},
{content: '执行监控策略', fnCode: 'monitorStrategy', type: 'primary', icon: 'el-icon-document-checked', hasPermi: 'resource:switchRegister:monitorStrategy'},
{},{}
// {content: '', fnCode: 'enroll', showName: 'registrationStatus', showVal: '0', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'resource:register:enroll'},
// {content: '', fnCode: 'unenroll', showName: 'registrationStatus', showVal: '1', type: 'text', icon: 'el-icon-circle-close', hasPermi: 'resource:register:unenroll'},
+1 -1
View File
@@ -70,7 +70,7 @@
{content: '拓扑展示', fnCode: 'echarts', type: 'warning', icon: 'el-icon-picture-outline-round', hasPermi: 'resource:topology:echarts'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'resource:topology:edit'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'resource:topology:edit'},
]
}
}
+2 -2
View File
@@ -68,8 +68,8 @@
{content: '导出', fnCode: 'export', type: 'primary', icon: 'el-icon-download', hasPermi: 'sync:problemRecord:export'},
],
line: [
{content: '修改', fnCode: 'edit', type: 'text', icon: 'el-icon-edit', hasPermi: 'sync:problemRecord:edit'},
{content: '查看', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'sync:problemRecord:details'},
{content: '修改', fnCode: 'edit', type: 'primary', icon: 'el-icon-edit', hasPermi: 'sync:problemRecord:edit'},
{content: '查看', fnCode: 'details', type: 'primary', icon: 'el-icon-view', hasPermi: 'sync:problemRecord:details'},
]
}
}