108 lines
2.3 KiB
TypeScript
108 lines
2.3 KiB
TypeScript
import {Component, Emit, Vue} from 'vue-property-decorator';
|
|
import template from "./manageRight.component.html"
|
|
import {lineChartData,lineChartData1} from "./chartData";
|
|
import TitleComponent from "@/components/title.component.vue"
|
|
import * as echarts from 'echarts';
|
|
|
|
import("@/assets/style/pageCommon.component.scss")
|
|
|
|
|
|
Component.registerHooks([
|
|
'beforeRouteLeave',
|
|
]);
|
|
@Component({
|
|
template,
|
|
components: {
|
|
TitleComponent,
|
|
},
|
|
})
|
|
export default class ManageRightComponent extends Vue {
|
|
//标题图片
|
|
imgSrc = require("@/assets/icons/png/env/env-title-icon.png");
|
|
//定时器
|
|
timer: any = null;
|
|
//折线图数据
|
|
option: any = {}
|
|
//折线图实例
|
|
lineChart: any = {}
|
|
//折线图2数据
|
|
lineData1: any = {}
|
|
//折线图实例
|
|
lineChart1: any = {}
|
|
//球数据
|
|
public parkData = [{
|
|
count:345,
|
|
total:500
|
|
|
|
},{
|
|
count:400,
|
|
total:500
|
|
|
|
}]
|
|
|
|
|
|
|
|
//获取图表实例
|
|
getEcharts(e, type) {
|
|
console.log(e,'e')
|
|
console.log(type,'type')
|
|
|
|
this[type] = e
|
|
if (type === 'lineChart'){
|
|
this.initLineData()
|
|
}else{
|
|
this.lineData1 = lineChartData1()
|
|
}
|
|
|
|
}
|
|
|
|
//图表自适应
|
|
resize() {
|
|
setTimeout(() => {
|
|
this.lineChart.resize();
|
|
this.lineChart1.resize();
|
|
}, 300)
|
|
}
|
|
|
|
timerForLineData: any = null;
|
|
|
|
//自动切换line图表数据
|
|
autoChangeLineData() {
|
|
this.timerForLineData = setInterval(() => {
|
|
this.lineChart?.clear()
|
|
this.lineChart?.setOption(this.option)
|
|
this.lineChart1?.clear()
|
|
this.lineChart1?.setOption(this.lineData1)
|
|
}, 5000)
|
|
}
|
|
|
|
//获取范围内随机数
|
|
getRandomInt(min: number, max: number) {
|
|
min = Math.ceil(min);
|
|
max = Math.floor(max);
|
|
return Math.floor(Math.random() * (max - min)) + min; //不含最大值，含最小值
|
|
}
|
|
|
|
mounted() {
|
|
this.autoChangeLineData()
|
|
window.addEventListener("resize", this.resize);
|
|
}
|
|
|
|
//初始化line图表
|
|
initLineData() {
|
|
this.option = lineChartData()
|
|
}
|
|
|
|
beforeDestroy() {
|
|
clearInterval(this.timer)
|
|
clearInterval(this.timerForLineData)
|
|
}
|
|
|
|
destroyed() {
|
|
window.removeEventListener("resize", this.resize)
|
|
}
|
|
|
|
|
|
}
|
|
|