You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
83 lines
1.5 KiB
83 lines
1.5 KiB
<template>
|
|
<div class="ycl">
|
|
<div class="ycl__title">各月份产量(吨)</div>
|
|
<dv-conical-column-chart v-if="show" :config="config" />
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {getKqData, getQyfcl} from "@/api/kban";
|
|
|
|
export default {
|
|
name:'MainGeYueChanLiang',
|
|
data(){
|
|
return {
|
|
show:false,
|
|
config:{
|
|
showValue:true,
|
|
data: [
|
|
{
|
|
name: '1月',
|
|
value: 71
|
|
},
|
|
],
|
|
},
|
|
delay:null,
|
|
}
|
|
},
|
|
mounted() {
|
|
// this.$socket.open()
|
|
// this.wsSubscribe()
|
|
},
|
|
created(){
|
|
this.getData();
|
|
this.delay=setInterval(this.getData,30000)
|
|
},
|
|
sockets:{},
|
|
methods:{
|
|
getData(){
|
|
getQyfcl().then(res=>{
|
|
this.show=false
|
|
const data=[]
|
|
for (const item of res.data) {
|
|
data.push({name:`${item.month}月`,value:item.t.toFixed(2)})
|
|
}
|
|
this.config.data=data
|
|
this.show=true
|
|
})
|
|
},
|
|
clear(){
|
|
clearInterval(this.delay)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.ycl{
|
|
width: 1070px;
|
|
height: 378px;
|
|
background: url('../../../assets/kban/gyclbg.png') no-repeat;
|
|
background-size: 100% 100%;
|
|
text-align: center;
|
|
|
|
.ycl__title{
|
|
width: 231px;
|
|
height: 41px;
|
|
background: url('../../../assets/kban/cltitle.png') no-repeat;
|
|
background-size: 100% 100%;
|
|
font-weight: bold;
|
|
font-size: 20px;
|
|
padding: 12px 26px;
|
|
margin-left: 425px;
|
|
}
|
|
|
|
.dv-conical-column-chart{
|
|
width: 90%;
|
|
height: 308px;
|
|
padding: 0 50px 0 50px;
|
|
}
|
|
}
|
|
</style>
|
|
|