Skip to content

I
IT-monitor
Commit e844981e authored by Asjoker's avatar Asjoker
Browse files
Options

feat: 综合监控-自动发现 & 日志监控 修复

parent b42290b2
Show whitespace changes
Inline Side-by-side
Showing with 412 additions and 13 deletions
src/views/IntegratedMonitor/autoSearch.vue
View file @ e844981e
......@@ -98,8 +98,8 @@
</el-dialog>
<el-dialog :visible.sync="PasswordOpen" :title="passwordTitle" width="600px">
<el-form label-width="100px">
<div style="padding-right: 80px">
<el-form label-width="110px">
<div v-if="dialogFlag !== 'snmp'" style="padding-right: 80px">
<el-form-item label="用户名">
<el-input
value="root"
......@@ -112,7 +112,7 @@
/>
</el-form-item>
</div>
<div v-for="item in addPassword" :key="item.id">
<div v-if="dialogFlag !== 'snmp'" v-for="item in addPassword" :key="item.id">
<div style="width: calc(100% - 80px);display: inline-block">
<el-form-item label="用户名">
<el-input />
......@@ -125,7 +125,20 @@
</div>
<el-button type="text" @click="deleteAccount(item.id)">删除</el-button>
</div>
<el-button type="text" @click="addAccount">添加一组用户名和密码</el-button>
<el-button v-if="dialogFlag !== 'snmp'" type="text" @click="addAccount">添加一组用户名和密码</el-button>
<el-form-item v-if="dialogFlag === 'oracle'" label="SID">
<el-input value="ORCLDB" />
</el-form-item>
<el-form-item v-if="dialogFlag === 'snmp'" label="可读共同体名称">
<el-input type="password" value="ORCLDB" />
</el-form-item>
<el-form-item v-if="dialogFlag === 'snmp'" label="版本">
<el-select value="V2">
<el-option value="V1"></el-option>
<el-option value="V2"></el-option>
<el-option value="V3"></el-option>
</el-select>
</el-form-item>
</el-form>
</el-dialog>
......@@ -151,6 +164,7 @@ export default {
open: false,
PasswordOpen: false,
passwordTitle: '',
dialogFlag: 'mysql',
addPassword: [],
// 表单参数
form: {},
......@@ -229,17 +243,17 @@ export default {
logContent: '1'
},
{
software: 'agent',
software: 'oracle',
createTime: '1521',
logContent: '1'
},
{
software: 'agent',
software: 'snmp',
createTime: '161',
logContent: '1'
},
{
software: 'agent',
software: 'ssh',
createTime: '22',
logContent: '1'
}
......@@ -290,6 +304,7 @@ export default {
changeSenior(row) {
this.PasswordOpen = true
this.passwordTitle = row.software + '--高级'
this.dialogFlag = row.software
},
addAccount() {
this.addPassword.push({
......
src/views/IntegratedMonitor/logMonitor/snmpTrapJournal.vue
View file @ e844981e
......@@ -45,7 +45,7 @@
<el-form-item>
<el-button type="primary" size="small" @click="handleQuery">查询</el-button>
</el-form-item>
<el-button id="fullScreen" style="float: right;margin: 0 10px">全屏</el-button>
<el-button id="fullScreen" style="float: right;margin: 0 10px">{{ isScreen ? '退出全屏' : '全屏' }}</el-button>
</el-form>
<div class="placeholder" />
<div style="padding: 10px">
......@@ -133,7 +133,7 @@ export default {
// 表单参数
form: {},
// 表单参数
isScreen: screenfull.isEnabled,
isScreen: false,
// 查询参数
queryParams: {
page: 1,
......@@ -223,8 +223,10 @@ export default {
handleExpand() {
const element = document.getElementById('sylog-container')// 指定全屏区域元素
document.getElementById('fullScreen').addEventListener('click', () => {
if (screenfull.isEnabled) {
if (screenfull.isEnabled && this.isScreen === false) {
screenfull.request(element)
} else {
screenfull.exit()
}
})// 实现模块全屏
},
......
src/views/IntegratedMonitor/logMonitor/sylogJournal.vue
View file @ e844981e
......@@ -45,7 +45,7 @@
<el-form-item>
<el-button type="primary" size="small" @click="handleQuery">查询</el-button>
</el-form-item>
<el-button id="fullScreen" style="float: right;margin: 0 10px">全屏</el-button>
<el-button id="fullScreen" style="float: right;margin: 0 10px">{{ isScreen ? '退出全屏' : '全屏' }}</el-button>
</el-form>
<div class="placeholder" />
<div style="padding: 10px">
......@@ -133,7 +133,7 @@ export default {
// 表单参数
form: {},
// 表单参数
isScreen: screenfull.isEnabled,
isScreen: false,
// 查询参数
queryParams: {
page: 1,
......@@ -223,8 +223,10 @@ export default {
handleExpand() {
const element = document.getElementById('sylog-container')// 指定全屏区域元素
document.getElementById('fullScreen').addEventListener('click', () => {
if (screenfull.isEnabled) {
if (screenfull.isEnabled && this.isScreen === false) {
screenfull.request(element)
} else {
screenfull.exit()
}
})// 实现模块全屏
},
......
src/views/IntegratedMonitor/reportStatistics/realTimeReport.vue 0 → 100644
View file @ e844981e
<template>
<div id="sylog-container" class="app-container-realTime">
<el-tabs v-model="currentTab" type="card">
<el-tab-pane label="实时报告" name="1">
<div style="padding: 10px 10px 10px 0">
<el-table
v-loading="loading"
border
:data="data"
:header-cell-style="{textAlign: 'center'}"
@selection-change="handleSelectionChange"
>
<el-table-column type="expand">
<template slot-scope="props">
<span>{{ props.row.path }}</span>
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" label="监测对象" align="center" prop="monitorObject">
<template slot-scope="scope">
{{ scope.row.monitorObject || '-' }}
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" label="监测点名称" align="center" prop="monitorName">
<template slot-scope="scope">
{{ scope.row.monitorName || '-' }}
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" label="状态" align="center" width="100" prop="logContent">
<template>
<span class="st-square" style="background-color: #3db58d;" />
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" label="CPU使用效率(%)" width="250" align="center" prop="cpu">
<template slot-scope="scope">
{{ scope.row.cpuRate || '-' }}
</template>
</el-table-column>
</el-table>
</div>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.rows"
@pagination="getList"
/>
</el-tab-pane>
<el-tab-pane label="指标统计" name="2">
<div style="padding: 10px 10px 10px 0">
<el-table
v-loading="loading"
border
:data="initialData"
:header-cell-style="{textAlign: 'center'}"
>
<el-table-column :show-overflow-tooltip="true" label="指标名称" align="center" prop="ipAddress">
<template slot-scope="scope">
{{ scope.row.name || '-' }}
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" label="最大值" align="center" prop="createTime">
<template slot-scope="scope">
{{ scope.row.max || '-' }}
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" label="最小值" align="center" prop="logContent">
<template slot-scope="scope">
{{ scope.row.min || '-' }}
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" label="平均值" align="center" prop="logContent">
<template slot-scope="scope">
{{ scope.row.average || '-' }}
</template>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
</el-tabs>
<el-dialog :visible.sync="open" title="添加报告" width="700px">
<el-form label-width="100px">
<el-form-item label="报告标题">
<el-input />
</el-form-item>
<el-form-item label="每页显示报告数">
<el-input />
</el-form-item>
<el-form-item label="选择设备列表">
<el-date-picker
v-model="queryParams.endTime"
type="datetime"
size="small"
value-format="yyyy-MM-DD HH:MM:SS"
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="open = false">取消</el-button>
<el-button type="primary" @click="open = false">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import screenfull from 'screenfull'
export default {
name: 'Sylog',
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 总条数
total: 0,
// 表格数据
list: [],
// 是否显示弹出层
open: false,
// 表单参数
form: {},
// 表单参数
isScreen: screenfull.isEnabled,
// 查询参数
queryParams: {
page: 1,
rows: 10,
status: 1,
startTime: '',
endTime: '',
ipAddress: '',
logContent: ''
},
currentTab: '1',
data: [
{
path: '路径：设备列表\\\\本机容器\\网络设备\\常用网络设备\\光环新网',
monitorObject: '',
monitorName: 'NetWork CPU',
cpuRate: '1.000'
},
{
path: '路径：设备列表\\\\本机容器\\网络设备\\常用网络设备\\光环新网',
monitorObject: '总部24F-机柜1-31U-23F出口核心路由器',
monitorName: '',
cpuRate: '5.000'
},
{
path: '路径：设备列表\\本机容器\\网络设备\\常用网络设备\\光环新网',
monitorObject: '西安交换出口',
monitorName: 'NetWork CPU',
cpuRate: '1.000'
},
{
path: '路径：设备列表\\本机容器\\网络设备\\常用网络设备\\光环新网',
monitorObject: '核心交换_192.168.6.155',
monitorName: 'NetWork CPU',
cpuRate: '4.000'
},
{
path: '路径：设备列表\\本机容器\\网络设备\\常用网络设备\\光环新网',
monitorObject: '1网段虚拟设备',
monitorName: 'NetWork CPU',
cpuRate: '2.000'
},
{
path: '路径：设备列表\\本机容器\\网络设备\\常用网络设备\\光环新网',
monitorObject: '核心交换机主',
monitorName: 'NetWork CPU',
cpuRate: '6.000'
},
{
path: '路径：设备列表\\本机容器\\网络设备\\常用网络设备\\光环新网',
monitorObject: '24F-机柜2-',
monitorName: 'NetWork CPU',
cpuRate: '1.000'
},
{
path: '路径：设备列表\\本机容器\\网络设备\\常用网络设备\\光环新网',
monitorObject: '24F-机柜7-40U-电信出口路由器',
monitorName: 'NetWork CPU',
cpuRate: '8.000'
},
{
path: '路径：设备列表\\本机容器\\网络设备\\常用网络设备\\光环新网',
monitorObject: '总部24F-机柜2-37U-去外网联通的交',
monitorName: 'NetWork CPU',
cpuRate: '6.000'
},
{
path: '路径：设备列表\\本机容器\\网络设备\\常用网络设备\\光环新网',
monitorObject: '3网段-10.1.1',
monitorName: 'NetWork CPU',
cpuRate: '2.000'
}
],
initialData: [
{
name: 'cpu使用率',
max: '29.000',
min: '0.000',
average: '14.021'
},
{
name: '内存使用率',
max: '77.000',
min: '0.000',
average: '34.021'
},
{
name: '显存使用率',
max: '55.000',
min: '0.000',
average: '24.021'
},
{
name: '网络使用率',
max: '33.000',
min: '0.000',
average: '55.021'
},
{
name: '磁盘使用率',
max: '55.000',
min: '0.000',
average: '5.021'
},
{
name: '风扇转速',
max: '777.000',
min: '0.000',
average: '666.021'
},
{
name: 'cpu温度',
max: '456.000',
min: '0.000',
average: '55.021'
},
{
name: 'cpu频率',
max: '29.000',
min: '0.000',
average: '14.021'
},
{
name: '磁盘读写速度',
max: '1000.000',
min: '0.000',
average: '800.021'
},
{
name: '访问数',
max: '29.000',
min: '0.000',
average: '14.021'
}
],
treeData: [{
label: '本机容器',
children: [{
label: '虚拟化平台',
children: [{
label: '信服工业云平台'
}, {
label: '192.168.1.30'
}, {
label: '虚拟机虚拟化硬件'
}]
}]
}, {
label: '一级 2',
children: [{
label: '二级 2-1',
children: [{
label: '三级 2-1-1'
}]
}, {
label: '二级 2-2',
children: [{
label: '三级 2-2-1'
}]
}]
}, {
label: '一级 3',
children: [{
label: '二级 3-1',
children: [{
label: '三级 3-1-1'
}]
}, {
label: '二级 3-2',
children: [{
label: '三级 3-2-1'
}]
}]
}]
}
},
/** 路由离开前存储筛选条件*/
beforeRouteLeave(to, from, next) {
this.$store.dispatch('searchSave/searchParamsSet', {
path: this.$route.path,
param: {
...this.queryParams
}
})
next()
},
created() {
this.getList()
},
mounted() {
this.handleExpand()
window.onresize = () => {
this.isScreen = screenfull.isFullscreen
}
},
methods: {
handleExpand() {
const element = document.getElementById('sylog-container')// 指定全屏区域元素
document.getElementById('fullScreen').addEventListener('click', () => {
if (screenfull.isEnabled) {
screenfull.request(element)
}
})// 实现模块全屏
},
/** 查询登录日志 */
getList() {
this.loading = true
setTimeout(() => {
this.loading = false
}, 500)
},
/** 查询按钮操作 */
changeTime() {
this.open = !this.open
},
/** 查询按钮操作 */
handleQuery() {
this.queryParams.page = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.dateRange = ''
this.resetForm('queryForm')
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.operId)
}
}
}
</script>
<style lang="scss" scoped>
.app-container-realTime {
padding: 0 20px;
font-size: 18px;
.placeholder{
height:14px;
background-color: #F4F4F4;
margin-bottom:10px
}
.st-square{
cursor: pointer;
margin-right: 6px;
width: 9px;
height: 9px;
display: inline-block;
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment