2 lines
11 KiB
JavaScript
2 lines
11 KiB
JavaScript
import{g as W,b0 as q,b4 as K,b$ as V,b2 as j,bq as Q,c3 as J,b5 as X,bs as ee,b7 as te,bt as oe,bu as L,r as ae,w as re,a2 as P,W as Z,b1 as ne,k as E,D as ie,R as se,b9 as le,ba as me,_ as R,b as g,m as de,n as a,t as r,p as m,az as ue,E as C,F as M,J as U,ak as fe,l as x,aA as pe}from"./vendor/index.CRpmXtWV.js";import{a2 as ce,a3 as G,j as he,d as ye,R as F,a4 as B,a5 as T,a6 as $,_ as we}from"../index.D-NvtsOM.js";const A=W({__name:"index",props:{theme:{type:String,default:"light"},width:{type:String,default:"100%"},height:{type:String,default:"200px"},dataZoom:{type:Boolean,default:!1},option:{type:Object,required:!0}},setup(v){q([K,V,j,Q,J,X,ee,te,oe]);const t=v,s=[{color:new L(0,0,0,1,[{offset:0,color:"rgba(22, 119, 255, .5)"},{offset:1,color:"rgba(22, 119, 255, 0)"}])},{color:new L(0,0,0,1,[{offset:0,color:"rgba(82, 196, 26, .5)"},{offset:1,color:"rgba(82, 196, 26, 0)"}])},{color:new L(0,0,0,1,[{offset:0,color:"rgba(250, 173, 20, .5)"},{offset:1,color:"rgba(250, 173, 20, 0)"}])},{color:new L(0,0,0,1,[{offset:0,color:"rgba(255, 77, 79, 0.5)"},{offset:1,color:"rgba(255, 77, 79, 0)"}])}];let y;const p=ae(void 0);function N(w){if(!w||!t.option.yDatas)return;y||(y=le(me(w,t.theme)));const _=[],O=t.option.yDatas.length;t.option.yDatas.forEach((c,n)=>{_.push({name:c?.name,type:"line",areaStyle:s[n%O],data:c?.data,showSymbol:!1,yAxisIndex:c.yAxisIndex?1:null})});const S=[];t.option.yAxis&&t.option.yAxis.length>0&&t.option.yAxis.forEach(c=>{S.push({splitLine:{show:!0,lineStyle:{type:"dashed",opacity:t.theme==="dark"?.1:1}},...c})});const D={title:[{left:"center",text:t.option.title,show:t.option.title}],zlevel:1,z:1,tooltip:t.option.tooltip||{trigger:"axis",formatter:function(c){let n=c[0].name+"<br/>";switch(t.option.formatStr){case"KB/s":for(const e of c)n+=`${e.marker} ${e.seriesName}：${G(e.data)}<br/>`;break;case"MB":for(const e of c)n+=`${e.marker} ${e.seriesName}：${ce(e.data)}<br/>`;break;default:for(const e of c)n+=`${e.marker} ${e.seriesName}：${e.data}${t.option.formatStr}<br/>`;break}return n}},grid:t.option.grid||{left:"8%",right:"8%",bottom:"20%"},legend:t.option.legend||{right:10,itemWidth:8,textStyle:{color:"#646A73"},icon:"circle"},xAxis:{data:t.option.xDatas,boundaryGap:!1},yAxis:t.option.yAxis?S:{name:"( "+t.option.formatStr+" )",splitLine:{lineStyle:{type:"dashed",opacity:t.theme==="dark"?.1:1}}},series:_,dataZoom:[{startValue:t.option?.xDatas[0],show:t.dataZoom}]};D&&y.setOption(D,!0);var z=new ResizeObserver(c=>{y&&y.resize()});z.observe(w)}return re(()=>t.option,w=>{w&&P(()=>{N(p.value)})}),Z(()=>{P(()=>{N(p.value)})}),ne(()=>{y?.dispose()}),(w,_)=>(E(),ie("div",{ref_key:"chartDom",ref:p,style:se({height:v.height,width:v.width})},null,4))}});function I(v){return he({url:"/monitor/load",method:"get",params:v,timeout:6e4})}const be={class:"chart"},ge={class:"chart"},xe={class:"chart"},ve={class:"chart"},_e={class:"chart"},De=W({__name:"index",setup(v){const{t}=ye();let s=R({placeholder:[t("views.monitor.monitor.startTime"),t("views.monitor.monitor.endTime")],ranges:{[t("views.monitor.monitor.yesterday")]:[g().subtract(1,"day").startOf("day"),g().subtract(1,"day").endOf("day")],[t("views.monitor.monitor.today")]:[g().startOf("day"),g()],[t("views.monitor.monitor.week")]:[g().startOf("week"),g().endOf("week")],[t("views.monitor.monitor.month")]:[g().startOf("month"),g().endOf("month")]},all:["",""],load:["",""],cpu:["",""],memory:["",""],io:["",""],network:["",""]});function y(){let n=null,e=null;const i=s.all;if(i[0])n=i[0],e=i[1];else{const o=new Date;o.setHours(0,0,0,0),n=`${o.getTime()}`,e=`${new Date().getTime()}`}I({type:"all",startTime:n,endTime:e,neType:"#",neId:"#"}).then(o=>{o.code===F&&o.data&&(N(o.data.base),w(o.data.base),_(o.data.base),O(o.data.io),S(o.data.network))});const l=[n,e];s.all=l,s.load=l,s.cpu=l,s.memory=l,s.io=l,s.network=l}const p=R({loadChart:{},CPUChart:{},memoryChart:{},ioChart:{},networkChart:{}});function N(n){let e=[],i=[],l=[],o=[],h=[];for(const d of n)e.push(B(d.createTime)),i.push(Number(d.cpuLoad1).toFixed(2)),l.push(Number(d.cpuLoad5).toFixed(2)),o.push(Number(d.cpuLoad15).toFixed(2)),h.push(Number(d.loadUsage).toFixed(2));const Y={xDatas:e,yDatas:[{name:`1${t("common.units.minute")}`,data:i},{name:`5${t("common.units.minute")}`,data:l},{name:`15${t("common.units.minute")}`,data:o},{name:t("views.monitor.monitor.resourceUsage"),data:h,yAxisIndex:1}],yAxis:[{type:"value",name:`${t("views.monitor.monitor.loadDetail")} ( % )`},{type:"value",name:`${t("views.monitor.monitor.resourceUsage")} ( % )`,position:"right",alignTicks:!1}],grid:{left:"5%",right:"5%",bottom:"20%"},formatStr:"%"};p.loadChart=Y}function w(n){let e=[],i=[];for(const o of n)e.push(B(o.createTime)),i.push(Number(o.cpu).toFixed(2));const l={xDatas:e,yDatas:[{name:"CPU",data:i}],grid:{left:"5%",right:"5%",bottom:"20%"},formatStr:"%"};p.CPUChart=l}function _(n){let e=[],i=[];for(const o of n)e.push(B(o.createTime)),i.push(Number(o.memory));const l={xDatas:e,yDatas:[{name:t("views.monitor.monitor.memory"),data:i}],grid:{left:"5%",right:"5%",bottom:"20%"},formatStr:"%"};p.memoryChart=l}function O(n){let e=[],i=[],l=[],o=[],h=[];for(const d of n)e.push(B(d.createTime)),i.push(Number(d.read/1024).toFixed(2)),l.push(Number(d.write/1024).toFixed(2)),o.push(Number(d.count)),h.push(Number(d.time));const Y={xDatas:e,yDatas:[{name:t("views.monitor.monitor.read"),data:i},{name:t("views.monitor.monitor.write"),data:l},{name:t("views.monitor.monitor.readWriteCount"),data:o,yAxisIndex:1},{name:t("views.monitor.monitor.readWriteTime"),data:h,yAxisIndex:1}],tooltip:{trigger:"axis",formatter:function(d){let b=d[0].name+"<br/>";for(const u of d)(u.seriesName===t("views.monitor.monitor.read")||u.seriesName===t("views.monitor.monitor.write"))&&(b+=`${u.marker} ${u.seriesName}：${G(u.data)}<br/>`),u.seriesName===t("views.monitor.monitor.readWriteCount")&&(b+=`${u.marker} ${u.seriesName}：${u.data} ${t("views.monitor.monitor.count")}/s<br/>`),u.seriesName===t("views.monitor.monitor.readWriteTime")&&(b+=`${u.marker} ${u.seriesName}：${u.data} ms<br/>`);return b}},grid:{left:"5%",right:"5%",bottom:"20%"},yAxis:[{type:"value",name:"( KB/s )",axisLabel:{fontSize:10}},{type:"value",position:"right",alignTicks:!0,axisLabel:{fontSize:10}}]};p.ioChart=Y}function S(n){let e=[],i=[],l=[];for(const h of n)e.push(B(h.createTime)),i.push(Number(h.up).toFixed(2)),l.push(Number(h.down).toFixed(2));const o={xDatas:e,yDatas:[{name:t("views.monitor.monitor.up"),data:i},{name:t("views.monitor.monitor.down"),data:l}],grid:{left:"5%",right:"5%",bottom:"20%"},formatStr:"KB/s"};p.networkChart=o}function D(n,e){if(!e[0])return;const i=T(e[0],$),l=T(e[1],$);I({type:n,startTime:i.getTime(),endTime:l.getTime(),neType:"#",neId:"#"}).then(o=>{o.code===F&&o.data&&(n==="load"&&N(o.data.base),n==="cpu"&&w(o.data.base),n==="memory"&&_(o.data.base))})}function z(n,e){if(!n)return;const i=T(e[0],$),l=T(e[1],$);I({type:"io",startTime:i.getTime(),endTime:l.getTime(),neType:"#",neId:"#"}).then(o=>{o.code===F&&o.data&&O(o.data.io)})}function c(n,e){if(!n)return;const i=T(e[0],$),l=T(e[1],$);I({type:"network",startTime:i.getTime(),endTime:l.getTime(),neType:"#",neId:"#"}).then(o=>{o.code===F&&o.data&&S(o.data.network)})}return Z(()=>{y()}),(n,e)=>{const i=x.RangePicker,l=x.FormItem,o=x.Col,h=pe,Y=x.Button,d=x.Space,b=x.Row,u=x.Form,k=x.Card;return E(),de(m(fe),null,{default:a(()=>[r(k,{bordered:!1,"body-style":{marginBottom:"24px",paddingBottom:0}},{default:a(()=>[r(u,{name:"queryParams",layout:"horizontal"},{default:a(()=>[r(b,{gutter:16},{default:a(()=>[r(o,{lg:10,md:10,xs:24},{default:a(()=>[r(l,{label:m(t)("views.monitor.monitor.filter"),name:"neTypeSelect"},{default:a(()=>[r(i,{value:m(s).all,"onUpdate:value":e[0]||(e[0]=f=>m(s).all=f),"allow-clear":!1,bordered:"","show-time":{format:"HH:mm:ss"},format:"YYYY-MM-DD HH:mm:ss","value-format":"x",placeholder:m(s).placeholder,ranges:m(s).ranges,style:{width:"100%"}},null,8,["value","placeholder","ranges"])]),_:1},8,["label"])]),_:1}),r(o,{lg:6,md:12,xs:24},{default:a(()=>[r(l,null,{default:a(()=>[r(d,{size:8},{default:a(()=>[r(Y,{type:"primary",onClick:e[1]||(e[1]=ue(f=>y(),["prevent"]))},{icon:a(()=>[r(h)]),default:a(()=>[C(" "+M(m(t)("common.search")),1)]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),r(b,{gutter:16},{default:a(()=>[r(o,{lg:24,md:24,xs:24},{default:a(()=>[r(k,{bordered:!1,"body-style":{marginBottom:"24px"}},{title:a(()=>[C(M(m(t)("views.monitor.monitor.avgLoad")),1)]),extra:a(()=>[r(i,{value:m(s).load,"onUpdate:value":e[2]||(e[2]=f=>m(s).load=f),"allow-clear":!1,bordered:"","show-time":{format:"HH:mm:ss"},format:"YYYY-MM-DD HH:mm:ss","value-format":"x",placeholder:m(s).placeholder,style:{width:"100%"},onChange:e[3]||(e[3]=(f,H)=>D("load",H))},null,8,["value","placeholder"])]),default:a(()=>[U("div",be,[r(A,{option:p.loadChart,dataZoom:!0,height:"400px"},null,8,["option"])])]),_:1})]),_:1})]),_:1}),r(b,{gutter:16},{default:a(()=>[r(o,{lg:12,md:12,xs:24},{default:a(()=>[r(k,{bordered:!1,"body-style":{marginBottom:"24px"}},{title:a(()=>[C("CPU")]),extra:a(()=>[r(i,{value:m(s).cpu,"onUpdate:value":e[4]||(e[4]=f=>m(s).cpu=f),"allow-clear":!1,bordered:"","show-time":{format:"HH:mm:ss"},format:"YYYY-MM-DD HH:mm:ss","value-format":"x",placeholder:m(s).placeholder,style:{width:"100%"},onChange:e[5]||(e[5]=(f,H)=>D("cpu",H))},null,8,["value","placeholder"])]),default:a(()=>[U("div",ge,[r(A,{option:p.CPUChart,dataZoom:!0,height:"400px"},null,8,["option"])])]),_:1})]),_:1}),r(o,{lg:12,md:12,xs:24},{default:a(()=>[r(k,{bordered:!1,"body-style":{marginBottom:"24px"}},{title:a(()=>[C(M(m(t)("views.monitor.monitor.memory")),1)]),extra:a(()=>[r(i,{value:m(s).memory,"onUpdate:value":e[6]||(e[6]=f=>m(s).memory=f),"allow-clear":!1,bordered:"","show-time":{format:"HH:mm:ss"},format:"YYYY-MM-DD HH:mm:ss","value-format":"x",placeholder:m(s).placeholder,style:{width:"100%"},onChange:e[7]||(e[7]=(f,H)=>D("memory",H))},null,8,["value","placeholder"])]),default:a(()=>[U("div",xe,[r(A,{option:p.memoryChart,dataZoom:!0,height:"400px"},null,8,["option"])])]),_:1})]),_:1})]),_:1}),r(b,{gutter:16},{default:a(()=>[r(o,{lg:12,md:12,xs:24},{default:a(()=>[r(k,{bordered:!1,"body-style":{marginBottom:"24px"}},{title:a(()=>[C(M(m(t)("views.monitor.monitor.io")),1)]),extra:a(()=>[r(i,{value:m(s).io,"onUpdate:value":e[8]||(e[8]=f=>m(s).io=f),"allow-clear":!1,bordered:"","show-time":{format:"HH:mm:ss"},format:"YYYY-MM-DD HH:mm:ss","value-format":"x",placeholder:m(s).placeholder,style:{width:"100%"},onChange:z},null,8,["value","placeholder"])]),default:a(()=>[U("div",ve,[r(A,{option:p.ioChart,dataZoom:!0,height:"400px"},null,8,["option"])])]),_:1})]),_:1}),r(o,{lg:12,md:12,xs:24},{default:a(()=>[r(k,{bordered:!1,"body-style":{marginBottom:"24px"}},{title:a(()=>[C(M(m(t)("views.monitor.monitor.network")),1)]),extra:a(()=>[r(i,{value:m(s).network,"onUpdate:value":e[9]||(e[9]=f=>m(s).network=f),"allow-clear":!1,bordered:"","show-time":{format:"HH:mm:ss"},format:"YYYY-MM-DD HH:mm:ss","value-format":"x",placeholder:m(s).placeholder,style:{width:"100%"},onChange:c},null,8,["value","placeholder"])]),default:a(()=>[U("div",_e,[r(A,{option:p.networkChart,dataZoom:!0,height:"400px"},null,8,["option"])])]),_:1})]),_:1})]),_:1})]),_:1})}}}),Te=we(De,[["__scopeId","data-v-1389df2f"]]);export{Te as default};
|