Skip to content

S
smart
Commit 9ac18d32 authored by wangqinghua's avatar wangqinghua
Browse files
Options

update

parent 4ac7c507
Show whitespace changes
Inline Side-by-side
Showing with 135 additions and 46 deletions
src/main/webapp/app/app.main.module.ts
View file @ 9ac18d32
......@@ -68,6 +68,7 @@ import {CheckComponent} from './netTopology/model/check/check.component';
import {TopologyImgComponent} from './netTopology/topology-img/topology-img.component';
import {DeviceComponent} from './netTopology/model/device/device.component';
import {IconComponent} from './netTopology/model/icon/icon.component';
import {ToUtilPipe} from './shared/common/toUtil.pipe';
@NgModule({
imports: [
......@@ -136,7 +137,8 @@ import {IconComponent} from './netTopology/model/icon/icon.component';
CheckComponent,
TopologyImgComponent,
DeviceComponent,
IconComponent
IconComponent,
ToUtilPipe
],
providers:[
OverAllService,
......
src/main/webapp/app/netTopology/flow-trend/flow-trend.component.html
View file @ 9ac18d32
......@@ -57,28 +57,29 @@
></nz-date-picker>
</div>
</div>
<div echarts [options]="chartOption" style="height: 400px;width: 100%"></div>
<nz-spin [nzSpinning]="isLoading">
<div echarts [options]="chartOption" style="height: 400px;width: 100%"></div>
</nz-spin>
<nz-tabset [nzTabPosition]="'top'" [nzType]="'card'">
<nz-tab nzTitle="接收流量排行">
<nz-table #nzTable [nzData]="inList" [nzLoading]="inLoading" [nzFrontPagination]="false" [nzTotal]="inTotalNum" [nzPageIndex]="inPageNum" [nzPageSize]="inPageCount" (nzPageIndexChange)="inChnagePage($event)">
<thead>
<tr>
<th nzWidth="20%">监测点名称</th>
<th>最大值(kb/s)</th>
<th>最小值(kb/s)</th>
<th>平均值(kb/s)</th>
<th>最大值</th>
<th>最小值</th>
<th>平均值</th>
</tr>
</thead>
<tbody>
<ng-container *ngFor="let item of inList">
<tr (click)="getEcharts(item.itemid)">
<td>{{item.itemName}}</td>
<td>{{item.max}}</td>
<td>{{item.min}}</td>
<td>{{item.avg}}</td>
<td>{{item.max | toUtil}}</td>
<td>{{item.min | toUtil}}</td>
<td>{{item.avg | toUtil}}</td>
</tr>
</ng-container>
</tbody>
</nz-table>
</nz-tab>
......@@ -96,9 +97,9 @@
<ng-container *ngFor="let data of outList">
<tr (click)="getEcharts(data.itemid)">
<td>{{data.itemName}}</td>
<td>{{data.max}}</td>
<td>{{data.min}}</td>
<td>{{data.avg}}</td>
<td>{{data.max | toUtil}}</td>
<td>{{data.min | toUtil}}</td>
<td>{{data.avg | toUtil}}</td>
</tr>
</ng-container>
</tbody>
......
src/main/webapp/app/netTopology/flow-trend/flow-trend.component.ts
View file @ 9ac18d32
......@@ -15,6 +15,7 @@ declare var vis: any;
export class FlowTrendComponent implements OnInit {
groupList;
hostList;
isLoading;
obj = {
groupid:null,
hostid: null,
......@@ -90,6 +91,7 @@ export class FlowTrendComponent implements OnInit {
//获取图标数据
getEcharts(itemid) {
this.isLoading = true;
const data= {
itemid: itemid,
endTime: this.obj.endTime,
......@@ -97,24 +99,27 @@ export class FlowTrendComponent implements OnInit {
hostid:this.obj.hostid,
groupid:this.obj.groupid,
type:'in',
limit:'1000'
};
this.topologySer.findTrendData(data).subscribe(
(res) => {
if(res.errCode == 10000){
if(res.data){
if(res.data.length > 0){
this.inEchartData = res.data;
}else{
this.message.info("图表暂无数据");
this.isLoading = false;
}
data.type = "out";
this.topologySer.findTrendData(data).subscribe(
(res)=>{
if(res.data){
if(res.data.length > 0){
this.outEchartData = res.data;
this.setEacharts();
}else{
this.message.info("图表暂无数据");
this.isLoading = false;
}
this.setEacharts();
}
)
}else{
......@@ -139,27 +144,37 @@ export class FlowTrendComponent implements OnInit {
this.chartOption = {
backgroundColor: '#eee',
tooltip: {},
tooltip: {
// trigger: 'axis',
formatter: (params)=> {
console.log(params);
let res = params.seriesName;
res += '<br/>时间：' + params.name;
let Mbps = 1000*1000;
let kbps = 1000;
let size = Math.abs(params.data);
if(size/Mbps > 1){
res += '<br/>流量：' + (size/Mbps).toFixed(2) + 'Mbps';
}else if(size/kbps >1){
res += '<br/>流量：' +(size/kbps).toFixed(2) + 'kbps';
}else{
res += '<br/>流量：' + (size)+ 'bbps';
}
return res;
}
},
xAxis: {
data: this.inEchartData.map(e=>{
return e.clock;
}),
name: '时间',
silent: false,
axisLine: {onZero: true},
splitLine: {show: false},
splitArea: {show: false},
axisLabel:{
margin: 10,
interval: 100000,
showMinLabel: true,
showMaxLabel: true,
textStyle: {
color: '#999',
fontSize: 12,
}
}
},
dataZoom: [{
startValue: this.obj.startTime
}, {
type: 'inside'
}],
yAxis: {
inverse: true,
splitArea: {show: false},
......@@ -189,7 +204,7 @@ export class FlowTrendComponent implements OnInit {
{
name: '出口流量',
type: 'bar',
stack: 'two',
stack: 'one',
itemStyle: itemStyle,
data: this.outEchartData.map(e=>{
return -e.avg;
......@@ -197,6 +212,7 @@ export class FlowTrendComponent implements OnInit {
}
]
};
this.isLoading = false;
}
//获取流量
......
src/main/webapp/app/shared/common/toUtil.pipe.ts 0 → 100644
View file @ 9ac18d32
import {Pipe, PipeTransform} from '@angular/core';
@Pipe({
name: 'toUtil'
})
export class ToUtilPipe implements PipeTransform {
transform(value: any): any {
console.log(value);
if(value){
let res;
let Mbps = 1000 * 1000;
let kbps = 1000;
let size = Math.abs(value);
if (size / Mbps > 1) {
const m = size / Mbps;
res = m.toFixed(2) + 'Mbps';
} else if (size / kbps > 1) {
const k = size / kbps;
res = k.toFixed(2) + 'kbps';
} else {
res = (size) + 'bbps';
}
return res;
}else{
return true;
}
}
}
src/main/webapp/app/work/work-handle/work-handle.component.html
View file @ 9ac18d32
......@@ -20,19 +20,21 @@
</div>
<div nz-row [nzGutter]="4" class="search-form">
<div nz-col nzSpan="3">
<nz-select style="width: 100%;" nzShowSearch nzAllowClear nzPlaceHolder="事件分类">
<nz-select style="width: 100%;" [(ngModel)]="obj.type" nzPlaceHolder="事件分类">
<nz-option nzLabel="告警" nzValue="告警"></nz-option>
<nz-option nzLabel="严重" nzValue="严重"></nz-option>
</nz-select>
</div>
<div nz-col nzSpan="3">
<nz-select style="width: 100%;" nzShowSearch nzAllowClear nzPlaceHolder="事件状态">
<nz-option nzLabel="" nzValue=""></nz-option>
<nz-select style="width: 100%;" [(ngModel)]="obj.status" nzPlaceHolder="事件状态">
<nz-option nzLabel="待处理" nzValue="0"></nz-option>
<nz-option nzLabel="已结束" nzValue="1"></nz-option>
</nz-select>
</div>
<div nz-col nzSpan="3">
<nz-select style="width: 100%;" nzShowSearch nzAllowClear nzPlaceHolder="事件来源">
<nz-option nzLabel="" nzValue=""></nz-option>
<nz-select style="width: 100%;" [(ngModel)]="obj.source" nzPlaceHolder="事件来源">
<nz-option nzLabel="系统警告" nzValue="0"></nz-option>
<nz-option nzLabel="手动新增" nzValue="1"></nz-option>
</nz-select>
</div>
<div nz-col nzSpan="8">
......@@ -52,7 +54,7 @@
</div>
</div>
<nz-table #nzTable [nzData]="eventList">
<nz-table #nzTable [nzData]="eventList" [nzFrontPagination]="false" [nzTotal]="totalNum" [nzPageIndex]="pageNum" [nzPageSize]="pageCount" (nzPageIndexChange)="change($event)">
<thead>
<tr>
<th>事件编号</th>
......
src/main/webapp/app/work/work-handle/work-handle.component.ts
View file @ 9ac18d32
import { Component, OnInit } from '@angular/core';
import {pageSize} from '../../app.constants';
import {WorkService} from '../work.service';
@Component({
selector: 'smart-work-handle',
......@@ -11,9 +13,52 @@ export class WorkHandleComponent implements OnInit {
eventList;
timeBegin;
timeEnd;
constructor() { }
pageCount = pageSize;
pageNum = 1;
totalNum;
obj = {
pageCount:null,
pageNum:null,
searchStr:'',
type:null,
status:null,
source:null,
startTime:'',
endTime:'',
};
constructor(private workSer:WorkService) { }
ngOnInit() {
this.getList();
}
getList(){
const obj = {
pageCount:this.pageCount,
pageNum:this.pageNum,
searchStr:this.obj.searchStr,
type:this.obj.type,
status:this.obj.status,
source:this.obj.source,
startTime:this.obj.startTime,
endTime:this.obj.endTime,
};
this.workSer.find(obj).subscribe(
(res)=>{
if(res.errCode == 10000){
this.eventList = res.data.data;
this.totalNum = res.data.totalNum;
}else{
}
}
)
}
change(e){
this.pageNum = e;
this.getList();
}
}
src/main/webapp/content/javascript/jtopo/js/util.js
View file @ 9ac18d32
......@@ -18,8 +18,6 @@ var SysUtil = {
}
// url根路径
var rootPath = SysUtil.getRootPath();
console.log("rootPath");
console.log(rootPath);
// var topoImgPath = 'javascript/jtopo/img/';
var topoImgPath = 'http://10.10.38.99:8282/file/icon/';
......
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