<!--标签-->
<el-tabs class="stat1_3" v-model="activeName">
<el-tab-pane label="柱状图" name="first">
<!--柱状图-->
<v-chart class="stat1_chart" :forceFit="true" :height="height" :data="data" :scale="scale">
<v-tooltip/>
<v-axis/>
<v-bar position="collectTime*paramterValue" />
</v-chart>
</el-tab-pane>
<el-tab-pane label="折线图" name="second" lazy="true"><!--lazy="true"-->
<!--折线图-->
<v-chart class="stat1_chart" :forceFit="true" :height="height" :data="data" :scale="scale">
<v-tooltip/>
<v-axis/>
<v-line position="collectTime*paramterValue" />
</v-chart>
</el-tab-pane>
</el-tabs>
<script>
const data = [
{collectTime: '1月', paramterValue: 20},
{collectTime: '2月', paramterValue: 50},
];
const scale = [{
dataKey: 'paramterValue',
min: 0,
}, {
dataKey: 'collectTime',
min: '0',
max: '1',
}];
export default {
name: "station4",
data() {
return {
activeName: 'first',
data,
scale,
height: 400,
}
},
SELECT(){
let data1 = new Date(this.time1);
let y1 = data1.getFullYear();
let m1 = data1.getMonth()+1;
m1 = m1 < 10 ? ('0'+m1):m1;
let d1 = data1.getDate();
d1 = d1 < 10 ? ('0'+d1):d1;
const Time1 = y1 + '-' + m1 + '-' + d1;
let data2 = new Date(this.time2);
let y2 = data2.getFullYear();
let m2 = data2.getMonth()+1;
m2 = m2 < 10 ? ('0'+m2):m2;
let d2 = data2.getDate();
d2 = d2 < 10 ? ('0'+d2):d2;
const Time2 = y2 + '-' + m2 + '-' + d2;
if(this.time1>this.time2){
this.$message.error('时间输入错误:开始时间不得大于结束时间');
}
else if(this.time1===this.time2){
this.$message.error('时间输入错误:开始时间不得于结束时间相同');
}
else {
this.axios({
url:this.ip+'/Api/..',
method:'get',
params:{
time1:Time1,
time2:Time2,
stationName:this.select1,
cs:this.select2,
cxtj:this.select3,
}
}).then((res)=>{
console.log(res.data.result)
this.data=res.data.result
}).catch((err)=>{
console.log(err)
})
}