monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by 王涛
Commit 41543c35d5a9d71bf419d65b7a95bd2cdb3bf47b 2 parents d09a22b0 83db2a3a

Merge branch 'mater-ztq' into 'master' 

Mater ztq



See merge request !1214
Inline Side-by-side
Showing 4 changed files with 134 additions and 42 deletions
... ... @@ -56,14 +56,18 @@
<div class="res-ratio">
<div>使用容量</div>
<div class="progress">
<div :style="{width:((cloudList[4].map[cloudList[4].kpiIds].kpiValue/cloudList[5].map[cloudList[5].kpiIds].kpiValue)*100).toFixed(2)+'%'}" class="progress-bar"><span>{{cloudList[5].map[cloudList[5].kpiIds].kpiValue==0?'':((cloudList[4].map[cloudList[4].kpiIds].kpiValue/cloudList[5].map[cloudList[5].kpiIds].kpiValue)*100).toFixed(2)+'%'}}</span></div>
<div v-show="cloudList[5].map[cloudList[5].kpiIds].kpiValue!=0" :style="{width:((cloudList[4].map[cloudList[4].kpiIds].kpiValue/cloudList[5].map[cloudList[5].kpiIds].kpiValue)*100).toFixed(2)+'%'}" class="progress-bar">
<span>{{cloudList[5].map[cloudList[5].kpiIds].kpiValue==0?'':((cloudList[4].map[cloudList[4].kpiIds].kpiValue/cloudList[5].map[cloudList[5].kpiIds].kpiValue)*100).toFixed(2)+'%'}}</span>
</div>
</div>
<div>已使用：{{cloudList[4].map[cloudList[4].kpiIds].kpiValue}}/总量：{{cloudList[5].map[cloudList[5].kpiIds].kpiValue}}</div>
</div>
<div class="res-ratio">
<div>售卖容量</div>
<div class="progress">
<div :style="{width:((cloudList[6].map[cloudList[6].kpiIds].kpiValue/cloudList[7].map[cloudList[7].kpiIds].kpiValue)*100).toFixed(2)+'%'}" class="progress-bar"><span>{{cloudList[7].map[cloudList[7].kpiIds].kpiValue==0?'':((cloudList[6].map[cloudList[6].kpiIds].kpiValue/cloudList[7].map[cloudList[7].kpiIds].kpiValue)*100).toFixed(2)+'%'}}</span></div>
<div v-show="cloudList[7].map[cloudList[7].kpiIds].kpiValue!=0" :style="{width:((cloudList[6].map[cloudList[6].kpiIds].kpiValue/cloudList[7].map[cloudList[7].kpiIds].kpiValue)*100).toFixed(2)+'%'}" class="progress-bar">
<span>{{cloudList[7].map[cloudList[7].kpiIds].kpiValue==0?'':((cloudList[6].map[cloudList[6].kpiIds].kpiValue/cloudList[7].map[cloudList[7].kpiIds].kpiValue)*100).toFixed(2)+'%'}}</span>
</div>
</div>
<div>已使用：{{cloudList[6].map[cloudList[6].kpiIds].kpiValue}}/总量：{{cloudList[7].map[cloudList[7].kpiIds].kpiValue}}</div>
</div>
... ...
... ... @@ -16,58 +16,101 @@ export default {
flag: 'capacity-disk-snapshotCount',
kpiIds:'KPI2AABE086',
name:'快照数量',
map:{
'KPI2AABE086':{
kpiValue:0,
kpiUnit:"个",
kpiName:"快照数量"
}
}
},{
// 快照已使用容量
flag: 'capacity-disk-snapshotSize',
kpiIds:'KPIF1297210',
name:'快照已使用容量',
map:{
'KPIF1297210':{
kpiValue:0,
kpiUnit:"TB",
kpiName:"快照已使用容量"
}
}
},{
// 云硬盘总数
flag: 'capacity-disk-count',
kpiIds:'KPI4F8DDF84',
name:"云硬盘总数",
map:{
'KPI4F8DDF84':{
kpiValue:0,
kpiUnit:"个",
kpiName:"云硬盘总数"
}
}
},{
// 高效云硬盘数
flag: 'capacity-disk-totalDiskCount',
kpiIds:'KPI16AC2C58',
name:'高效云硬盘数',
map:{
'KPI16AC2C58':{
kpiValue:0,
kpiUnit:"个",
kpiName:"高效云硬盘数"
}
}
},{
// 使用容量 已使用
flag: 'capacity-disk-used',
kpiIds:'KPI1988842F',
name:'使用容量 (已使用)',
map:{
'KPI1988842F':{
kpiValue:0,
kpiUnit:"",
kpiName:"使用容量"
}
}
},{
// 使用容量 总量
flag: 'capacity-disk-used',
kpiIds:'KPIBA50E567',
name: '使用容量 (总量)',
map:{
'KPIBA50E567':{
kpiValue:0,
kpiUnit:"",
kpiName:"使用容量"
}
}
},{
// 售卖容量 已用
flag: 'capacity-disk-sale',
kpiIds:'KPI1988842F',
name: '售卖容量 (已用)',
map:{
'KPI1988842F':{
kpiValue:0,
kpiUnit:"",
kpiName:"售卖容量"
}
}
},{
// 售卖容量 总量
flag: 'capacity-disk-sale',
kpiIds:'KPIBA50E567',
name: '售卖容量 (总量)',
map:{
'KPIBA50E567':{
kpiValue:0,
kpiUnit:"",
kpiName:"售卖容量"
}
}
}
]
let getList = ()=>{
// 快照数量
// proxy.$http.get(`/api-web/detail/getTencentCloudPlatInfo`,{
// resId:resId,
// flag:"capacity-disk-snapshotCount",
// kpiIds:"KPI2AABE086",
// },(res)=>{
// // console.log(res);
// if (Object.keys(res.map).length){
//
// }
// },(err)=>{
// console.log(err);
// })
cloudList.value.forEach((item,index)=>{
proxy.$http.get(`/api-web/detail/getTencentCloudPlatInfo`,{
resId:resId,
... ... @@ -76,8 +119,6 @@ export default {
},(res)=>{
if (Object.keys(res.map).length){
item.map = res.map;
}else {
item.map = {};
}
},(err)=>{
console.log(err);
... ...
... ... @@ -33,21 +33,27 @@
<div class="res-ratio">
<div>CPU</div>
<div class="progress">
<div :style="{width:((cloudList[3].map[cloudList[3].kpiIds].kpiValue/cloudList[4].map[cloudList[4].kpiIds].kpiValue)*100).toFixed(2)+'%'}" class="progress-bar"><span>{{cloudList[4].map[cloudList[4].kpiIds].kpiValue==0?'':((cloudList[3].map[cloudList[3].kpiIds].kpiValue/cloudList[4].map[cloudList[4].kpiIds].kpiValue)*100).toFixed(2)+'%'}}</span></div>
<div v-show="cloudList[4].map[cloudList[4].kpiIds].kpiValue!=0" :style="{width:((cloudList[3].map[cloudList[3].kpiIds].kpiValue/cloudList[4].map[cloudList[4].kpiIds].kpiValue)*100).toFixed(2)+'%'}" class="progress-bar">
<span>{{cloudList[4].map[cloudList[4].kpiIds].kpiValue==0?'':((cloudList[3].map[cloudList[3].kpiIds].kpiValue/cloudList[4].map[cloudList[4].kpiIds].kpiValue)*100).toFixed(2)+'%'}}</span>
</div>
</div>
<div>已使用：{{cloudList[3].map[cloudList[3].kpiIds].kpiValue}}/总量：{{cloudList[4].map[cloudList[4].kpiIds].kpiValue}}(核)</div>
</div>
<div class="res-ratio">
<div>内存</div>
<div class="progress">
<div :style="{width:((cloudList[5].map[cloudList[5].kpiIds].kpiValue/cloudList[6].map[cloudList[6].kpiIds].kpiValue)*100).toFixed(2)+'%'}" class="progress-bar"><span>{{cloudList[6].map[cloudList[6].kpiIds].kpiValue==0?'':((cloudList[5].map[cloudList[5].kpiIds].kpiValue/cloudList[6].map[cloudList[6].kpiIds].kpiValue)*100).toFixed(2)+'%'}}</span></div>
<div v-show="cloudList[6].map[cloudList[6].kpiIds].kpiValue!=0" :style="{width:((cloudList[5].map[cloudList[5].kpiIds].kpiValue/cloudList[6].map[cloudList[6].kpiIds].kpiValue)*100).toFixed(2)+'%'}" class="progress-bar">
<span>{{cloudList[6].map[cloudList[6].kpiIds].kpiValue==0?'':((cloudList[5].map[cloudList[5].kpiIds].kpiValue/cloudList[6].map[cloudList[6].kpiIds].kpiValue)*100).toFixed(2)+'%'}}</span>
</div>
</div>
<div>已使用：{{cloudList[5].map[cloudList[5].kpiIds].kpiValue}}/总量：{{cloudList[6].map[cloudList[6].kpiIds].kpiValue}}(T)</div>
</div>
<div class="res-ratio">
<div>磁盘</div>
<div class="progress">
<div :style="{width:((cloudList[7].map[cloudList[7].kpiIds].kpiValue/cloudList[8].map[cloudList[8].kpiIds].kpiValue)*100).toFixed(2)+'%'}" class="progress-bar"><span>{{cloudList[8].map[cloudList[8].kpiIds].kpiValue==0?'':((cloudList[7].map[cloudList[7].kpiIds].kpiValue/cloudList[8].map[cloudList[8].kpiIds].kpiValue)*100).toFixed(2)+'%'}}</span></div>
<div v-show="cloudList[8].map[cloudList[8].kpiIds].kpiValue!=0" :style="{width:((cloudList[7].map[cloudList[7].kpiIds].kpiValue/cloudList[8].map[cloudList[8].kpiIds].kpiValue)*100).toFixed(2)+'%'}" class="progress-bar">
<span>{{cloudList[8].map[cloudList[8].kpiIds].kpiValue==0?'':((cloudList[7].map[cloudList[7].kpiIds].kpiValue/cloudList[8].map[cloudList[8].kpiIds].kpiValue)*100).toFixed(2)+'%'}}</span>
</div>
</div>
<div>已使用：{{cloudList[7].map[cloudList[7].kpiIds].kpiValue}}/总量：{{cloudList[8].map[cloudList[8].kpiIds].kpiValue}}(T)</div>
</div>
... ...
... ... @@ -16,72 +16,113 @@ export default {
flag: 'capacity-mysql-total',
kpiIds:'KPI6D78305E',
name:'实例数量',
map:{}
map:{
'KPI6D78305E':{
kpiValue:0,
kpiUnit:"个",
kpiName:"实例数量"
}
}
},{
// Mysql/MariaDB实例
flag: 'capacity-mysql-mysql-count',
kpiIds:'KPI4149780A',
name:'Mysql/MariaDB实例',
map:{}
map:{
'KPI4149780A':{
kpiValue:0,
kpiUnit:"个",
kpiName:"Mysql/MariaDB实例"
}
}
},{
// 分布式Mysql实例
flag: 'capacity-mysql-distributed',
kpiIds:'KPIAAF0E124',
name:"分布式Mysql实例",
map:{}
map:{
'KPIAAF0E124':{
kpiValue:0,
kpiUnit:"个",
kpiName:"分布式Mysql实例"
}
}
},{
// CPU使用情况 已用
flag: 'capacity-mysql-cpu-used',
kpiIds:'KPIB5848895',
name:'CPU使用情况 已用',
map:{}
map:{
'KPIB5848895':{
kpiValue:0,
kpiUnit:"",
kpiName:"CPU"
}
}
},{
// CPU使用情况 总量
flag: 'capacity-mysql-cpu-total',
kpiIds:'KPI8DBA891C',
name:'CPU使用情况 总量',
map:{}
map:{
'KPI8DBA891C':{
kpiValue:0,
kpiUnit:"",
kpiName:"CPU"
}
}
},{
// 内存使用情况 已用
flag: 'capacity-mysql-mem-used',
kpiIds:'KPI4A216352',
name: '内存使用情况 已用',
map:{}
map:{
'KPI4A216352':{
kpiValue:0,
kpiUnit:"",
kpiName:"内存"
}
}
},{
// 内存使用情况 总量
flag: 'capacity-mysql-mem-total',
kpiIds:'KPI1DA60197',
name: '内存使用情况 总量',
map:{}
map:{
'KPI1DA60197':{
kpiValue:0,
kpiUnit:"",
kpiName:"内存"
}
}
},{
// 磁盘使用情况 已用
flag: 'capacity-mysql-disk-used',
kpiIds:'KPI1988842F',
name: '磁盘使用情况 已用',
map:{}
map:{
'KPI1988842F':{
kpiValue:0,
kpiUnit:"",
kpiName:"磁盘"
}
}
},{
//磁盘使用情况 总量
flag: 'capacity-mysql-disk-total',
kpiIds:'KPIBA50E567',
name: '磁盘使用情况 总量',
map:{}
map:{
'KPIBA50E567':{
kpiValue:0,
kpiUnit:"",
kpiName:"磁盘"
}
}
}
]
let getList = ()=>{
// 快照数量
// proxy.$http.get(`/api-web/detail/getTencentCloudPlatInfo`,{
// resId:resId,
// flag:"capacity-disk-snapshotCount",
// kpiIds:"KPI2AABE086",
// },(res)=>{
// // console.log(res);
// if (Object.keys(res.map).length){
//
// }
// },(err)=>{
// console.log(err);
// })
cloudList.value.forEach((item,index)=>{
proxy.$http.get(`/api-web/detail/getTencentCloudPlatInfo`,{
resId:resId,
... ...