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.

112 lines
3.3 KiB

<template>
<div class="alvl-outter" v-loading="load">
<v-label-div :title="time">
<a-button @click="onTable" style="margin-right: 16px">查看图表</a-button>
<a-button @click="goBack"></a-button>
</v-label-div>
<div class="rank-container">
<div class="rank-item" v-for="(item, index) in lvList" :key="item.key">
<v-label-div :title="item.key + '销量排行TOP10'" :showLine="false" :eStyle="{'border-style': 'none'}"></v-label-div>
<div class="d1">
<vRankingKmd v-for="(it,index) in item.value" :key="index" :lineShow="index === 0 ? false : true" :num="index + 1" :label="it.seriesname" :val="it.salescount"></vRankingKmd>
</div>
<div class="d1-link">
<div style="padding: 14px 14px 14px 80px">
<a @click="goInfo(index)">更多{{item.key}}详细排行榜>>></a></div>
</div>
</div>
</div>
</div>
</template>
<script>
import vRankingKmd from "./v-ranking-kmd"
import {getCheZhuCarSpecidRankingAll} from "@/api/SaleRank"
import {getCheZhuCountTime} from "@/api/SaleRank"
export default {
name: "AllLevel",
components: {
vRankingKmd
},
data() {
return {
load: false,
time: '汽车级别销售排行榜',
form: {
token: '',
sTimeType: 4,
sStartTime: '',
sEndTime: '',
},
lvList: []
}
},
created() {
this.form.token = this.getToken;
this.getData();
},
methods: {
getData() {
this.load = true;
getCheZhuCountTime({token: this.getToken}).then(res => {
let data = res.data;
this.form.sStartTime = data.Data[0].Time;
this.form.sEndTime = data.Data[data.Data.length-1].Time;
let obj = {
token: this.getToken,
sTimeType: 4,
sStartTime: this.form.sStartTime + '-01',
sEndTime: this.form.sEndTime + '-01',
}
getCheZhuCarSpecidRankingAll(obj).then(res => {
let data = res.data;
this.lvList = data;
});
this.load = false
})
},
//查看图表
onTable() {
},
//返回
goBack() {
this.$router.go(-1);
},
//前往详细
goInfo(index) {
let url = '/saleRank/level'+(index+1);
this.$router.push(url)
}
}
}
</script>
<style lang="less">
.alvl-outter {
width: 1552px;
// height: 460px;
border: 2px solid #0f2a4d;
.rank-container {
padding-left: 17px;
padding-top: 17px;
display: flex;
flex-wrap:wrap;
justify-content: flex-start;
.rank-item {
width: 340px;
margin-right: 32px;
.d1-link {
position: relative;
width: 344px;
height: 48px;
margin-top: 26px;
margin-left: 16px;
color: #fff;
background: #0a1d3b;
border-radius: 2px;
}
}
}
}
</style>