| | |
| | | </g> |
| | | </svg> |
| | | </div> |
| | | <h1>服务器</h1> |
| | | <h1>主机</h1> |
| | | </div> |
| | | <div class="svgMain-bottom"> |
| | | <div class="svgMain-bottom-block"> |
| | |
| | | <countTo |
| | | ref="fuwuCountTo1" |
| | | :start-val="0" |
| | | :end-val="3689" |
| | | :end-val="zhuji.count" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | |
| | | <countTo |
| | | ref="fuwuCountTo2" |
| | | :start-val="0" |
| | | :end-val="3650" |
| | | :end-val="zhuji.normalCount" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | |
| | | </div> |
| | | <div class="svgMain-bottom"> |
| | | <div class="svgMain-bottom-block"> |
| | | <h1>监控主机</h1> |
| | | <h1>监控设备</h1> |
| | | <h2> |
| | | <countTo |
| | | ref="shutongCountTo1" |
| | | :start-val="0" |
| | | :end-val="3650" |
| | | :end-val="tongxun.count" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | | </h2> |
| | | </div> |
| | | <div class="svgMain-bottom-block"> |
| | | <h1>正常主机</h1> |
| | | <h1>正常设备</h1> |
| | | <h2> |
| | | <countTo |
| | | ref="shutongCountTo2" |
| | | :start-val="0" |
| | | :end-val="3650" |
| | | :end-val="tongxun.normalCount" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | |
| | | </div> |
| | | <div class="svgMain-bottom"> |
| | | <div class="svgMain-bottom-block"> |
| | | <h1>监控主机</h1> |
| | | <h1>计划总数</h1> |
| | | <h2> |
| | | <countTo |
| | | ref="yunweiCountTo1" |
| | | :start-val="0" |
| | | :end-val="3650" |
| | | :end-val="yunwei.count" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | | </h2> |
| | | </div> |
| | | <div class="svgMain-bottom-block"> |
| | | <h1>正常主机</h1> |
| | | <h1>已完成计划</h1> |
| | | <h2> |
| | | <countTo |
| | | ref="yunweiCountTo2" |
| | | :start-val="0" |
| | | :end-val="3650" |
| | | :end-val="yunwei.normalCount" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | |
| | | </div> |
| | | <div class="svgMain-bottom"> |
| | | <div class="svgMain-bottom-block"> |
| | | <h1>ups/电池组</h1> |
| | | <h1>ups</h1> |
| | | <h2> |
| | | <countTo |
| | | ref="donghuanCountTo1" |
| | | :start-val="0" |
| | | :end-val="3650" |
| | | :end-val="up.ups" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | |
| | | <countTo |
| | | ref="donghuanCountTo2" |
| | | :start-val="0" |
| | | :end-val="365" |
| | | :end-val="up.ups2" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | | </h2> |
| | | </div> |
| | | <div class="svgMain-bottom-block"> |
| | | <h1>温湿度设备/水禁</h1> |
| | | <h1>电池组</h1> |
| | | <h2> |
| | | <countTo |
| | | ref="donghuanCountTo2" |
| | | ref="donghuanCountTo3" |
| | | :start-val="0" |
| | | :end-val="3650" |
| | | :end-val="up.dianchi" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | | <span>/</span> |
| | | <countTo |
| | | ref="donghuanCountTo2" |
| | | ref="donghuanCountTo4" |
| | | :start-val="0" |
| | | :end-val="365" |
| | | :end-val="up.dianchi2" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | |
| | | </g> |
| | | </svg> |
| | | </div> |
| | | <h1>门禁</h1> |
| | | <h1>空调</h1> |
| | | </div> |
| | | <div class="svgMain-bottom"> |
| | | <div class="svgMain-bottom-block"> |
| | | <h1>正常门禁/监控门禁</h1> |
| | | <h1>ups空调</h1> |
| | | <h2> |
| | | <countTo |
| | | ref="menjinCountTo1" |
| | | :start-val="0" |
| | | :end-val="3650" |
| | | :end-val="kongtiao.upsKongtiao" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | | <span>/</span> |
| | | <countTo |
| | | ref="menjinCountTo1" |
| | | ref="menjinCountTo2" |
| | | :start-val="0" |
| | | :end-val="360" |
| | | :end-val="kongtiao.upsKongtiao2" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | | </h2> |
| | | </div> |
| | | <div class="svgMain-bottom-block"> |
| | | <h1>空调</h1> |
| | | <h1>中心空调</h1> |
| | | <h2> |
| | | <countTo |
| | | ref="menjinCountTo2" |
| | | ref="menjinCountTo3" |
| | | :start-val="0" |
| | | :end-val="3650" |
| | | :end-val="kongtiao.zhongxinKongtiao" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | | <span>/</span> |
| | | <countTo |
| | | ref="menjinCountTo4" |
| | | :start-val="0" |
| | | :end-val="kongtiao.zhongxinKongtiao2" |
| | | :duration="2500" |
| | | class="count-number" |
| | | :autoplay="false"></countTo> |
| | |
| | | fuwuqiconfig2: { |
| | | number: [0], |
| | | }, |
| | | zhuji: { |
| | | count: 0, |
| | | normalCount: 0 |
| | | }, |
| | | tongxun: { |
| | | count: 0, |
| | | normalCount: 0 |
| | | }, |
| | | yunwei: { |
| | | count: 0, |
| | | normalCount: 0 |
| | | }, |
| | | up: { |
| | | dianchi:0, |
| | | dianchi2:0, |
| | | ups:0, |
| | | ups2:0, |
| | | }, |
| | | kongtiao: { |
| | | upsKongtiao:0, |
| | | upsKongtiao2:0, |
| | | zhongxinKongtiao:0, |
| | | zhongxinKongtiao2:0 |
| | | }, |
| | | timer:null |
| | | } |
| | | }, |
| | | destroyed() { |
| | | clearInterval(this.timer) |
| | | }, |
| | | mounted() { |
| | | this.loading() |
| | | this.getHost() |
| | | this.getSnmp() |
| | | this.getTask() |
| | | this.getUps() |
| | | this.getKongtiao() |
| | | this.timer = setInterval(() => { |
| | | this.getHost() |
| | | this.getSnmp() |
| | | this.getTask() |
| | | this.getUps() |
| | | this.getKongtiao() |
| | | },300000) |
| | | |
| | | }, |
| | | methods: { |
| | | getHost(){ |
| | | getHost(){ //主机 |
| | | getHost().then(res =>{ |
| | | res.data; |
| | | console.log(res,'res====') |
| | | if(res.code == 0) { |
| | | res.data.count && (this.zhuji.count = res.data.count) |
| | | res.data.normalCount && (this.zhuji.normalCount = res.data.normalCount) |
| | | } |
| | | }) |
| | | }, |
| | | getSnmp() { //数通设备 |
| | | getSnmp().then(res => { |
| | | if(res.code == 0) { |
| | | this.tongxun.count = res.data.count |
| | | this.tongxun.normalCount = res.data.normalCount |
| | | } |
| | | }) |
| | | }, |
| | | getTask() { //运维计划 |
| | | getTask().then(res => { |
| | | if(res.code == 0) { |
| | | this.yunwei.count = res.data.count |
| | | this.yunwei.normalCount = res.data.normalCount |
| | | } |
| | | }) |
| | | }, |
| | | getUps() { |
| | | getUps().then(res => { |
| | | if(res.code == 0) { |
| | | this.up.dianchi = res.data.dianchi |
| | | this.up.dianchi2 = res.data.dianchi2 |
| | | console.log(this.up.dianchi,'this.up.dianchi1====') |
| | | console.log(this.up.dianchi2,'this.up.dianchi2====') |
| | | this.up.ups = res.data.ups |
| | | this.up.ups2 = res.data.ups2 |
| | | } |
| | | }) |
| | | }, |
| | | getKongtiao() { |
| | | getKongtiao().then(res => { |
| | | if(res.code == 0) { |
| | | this.kongtiao.upsKongtiao = res.data.upsKongtiao |
| | | this.kongtiao.upsKongtiao2 = res.data.upsKongtiao2 |
| | | this.kongtiao.zhongxinKongtiao = res.data.zhongxinKongtiao |
| | | this.kongtiao.zhongxinKongtiao2 = res.data.zhongxinKongtiao2 |
| | | } |
| | | }) |
| | | }, |
| | | start() { |
| | |
| | | this.$refs.donghuanCountTo1.start(); |
| | | this.$refs.donghuanCountTo2.start(); |
| | | this.$refs.donghuanCountTo2.start(); |
| | | this.$refs.donghuanCountTo3.start(); |
| | | this.$refs.donghuanCountTo4.start(); |
| | | this.$refs.menjinCountTo1.start(); |
| | | this.$refs.menjinCountTo2.start(); |
| | | this.$refs.menjinCountTo3.start(); |
| | | this.$refs.menjinCountTo4.start(); |
| | | },1000) |
| | | }) |
| | | |