张雄 3 years ago
parent 6dd9fe7d28
commit 30984fa8be

@ -7,25 +7,30 @@
<a-form-model layout="inline">
<a-form-model-item label="选择日期">
<a-month-picker style="width: 146px" :allowClear="false" v-model="selTime[0]" :disabled-date="disabledDate" valueFormat="YYYY-MM" placeholder="请选择开始日期"></a-month-picker>
<a-month-picker style="width: 146px" :allowClear="false" v-model="selTime[1]" :disabled-date="disabledDate" valueFormat="YYYY-MM" placeholder="请选择结束日期"></a-month-picker>
<a-month-picker style="width: 146px;margin-left: 12px" :allowClear="false" v-model="selTime[1]" :disabled-date="disabledDate" valueFormat="YYYY-MM" placeholder="请选择结束日期"></a-month-picker>
</a-form-model-item>
<a-form-model-item label="品牌车型">
<a-select style="width: 160px" v-model="form.sBrand" placeholder="请选择品牌" @dropdownVisibleChange="brandDrawer" :dropdownMatchSelectWidth="false" allowClear>
<div slot="dropdownRender"></div>
</a-select>
<a-select style="width: 160px" v-model="form.sSeriesName" placeholder="请选择车型" allowClear>
<a-select style="width: 160px;margin-left: 12px" v-model="form.sSeriesName" placeholder="请选择车型" allowClear>
<a-select-option v-for="(item,index) in seriesList" :value="item.name" :key="index">
{{item.name}}
</a-select-option>
</a-select>
<a-select style="width: 160px" v-model="form.sBrandType" placeholder="请选择类型">
<a-select style="width: 160px;margin-left: 12px" v-model="form.sBrandType" placeholder="请选择类型">
<a-select-option v-for="(item,index) in brandTypeList" :value="item.key" :key="index">
{{item.value}}
</a-select-option>
</a-select>
</a-form-model-item>
<a-form-model-item label="选择城市">
<a-select style="width: 80px" v-model="form.sCity" @dropdownVisibleChange="cityDrawer" :dropdownMatchSelectWidth="false" allowClear>
<div slot="dropdownRender"></div>
</a-select>
</a-form-model-item>
<a-form-model-item>
<a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
<a-button @click="onSearch" style="margin-left: 12px" type="primary">查询</a-button>
</a-form-model-item>
</a-form-model>
</div>
@ -42,20 +47,36 @@
</v-table>
</div>
<a-modal title="销量明细" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
<v-tab-group :value="pValue" :style="{ background: 'transparent',padding: '0px 0px 12px 0px' }" :btns="btnPro" @change="handlerProMode"></v-tab-group>
<v-table v-if="pValue == 0" ref="rtable" :columns="columnsProCity" :data="dataProCity">
</v-table>
<v-table v-if="pValue == 1" ref="rtable" :columns="columnsProBrand" :data="dataProBrand">
</v-table>
<v-table v-if="pValue == 2" ref="rtable" :columns="columnsProSeries" :data="dataProSeries">
</v-table>
<div v-if="form.sBrand == undefined">
<v-tab-group :value="pValue" :style="{ background: 'transparent',padding: '0px 0px 12px 0px' }" :btns="btnPro" @change="handlerProMode"></v-tab-group>
<v-table v-if="pValue == 0" ref="rtable" :columns="columnsProCity" :data="dataProCity">
</v-table>
<v-table v-if="pValue == 1" ref="rtable" :columns="columnsProBrand" :data="dataProBrand">
</v-table>
<v-table v-if="pValue == 2" ref="rtable" :columns="columnsProSeries" :data="dataProSeries">
</v-table>
</div>
<div v-else>
<v-tab-group :value="pValue" :style="{ background: 'transparent',padding: '0px 0px 12px 0px' }" :btns="btnProBrand" @change="handlerProMode"></v-tab-group>
<v-table v-if="pValue == 0" ref="rtable" :columns="columnsProCity" :data="dataProCity">
</v-table>
<v-table v-if="pValue == 1 || pValue == 2" ref="rtable" :columns="columnsProSeries" :data="dataProSeries">
</v-table>
</div>
</a-modal>
<a-modal title="销量明细" width="1200px" :footer="null" @cancel="onClose2" :visible="visible2">
<v-tab-group :value="cValue" :style="{ background: 'transparent',padding: '0px 0px 12px 0px' }" :btns="btnCity" @change="handlerCityMode"></v-tab-group>
<v-table v-if="cValue == 0" ref="rtable" :columns="columnsCityBrand" :data="dataCityBrand">
</v-table>
<v-table v-if="cValue == 1" ref="rtable" :columns="columnsCitySeries" :data="dataCitySeries">
</v-table>
<div v-if="form.sBrand == undefined && form.sSeriesName == undefined">
<v-tab-group :value="cValue" :style="{ background: 'transparent',padding: '0px 0px 12px 0px' }" :btns="btnCity" @change="handlerCityMode"></v-tab-group>
<v-table v-if="cValue == 0" ref="rtable" :columns="columnsCityBrand" :data="dataCityBrand">
</v-table>
<v-table v-if="cValue == 1" ref="rtable" :columns="columnsCitySeries" :data="dataCitySeries">
</v-table>
</div>
<div v-else>
<v-tab-group :value="cValue" :style="{ background: 'transparent',padding: '0px 0px 12px 0px' }" :btns="btnCityBrand" @change="handlerCityMode"></v-tab-group>
<v-table ref="rtable" :columns="columnsCitySeries" :data="dataCitySeries">
</v-table>
</div>
</a-modal>
<a-drawer :visible="drVisible" title="请选择品牌" placement="left" @close="drClose">
<div class="drawer">
@ -73,7 +94,24 @@
</div>
</vue-scroll>
</div>
</a-drawer>
</a-drawer>
<a-drawer :visible="cityVisible" title="请选择城市" placement="right" @close="cityClose">
<div class="drawer">
<a-anchor style="width: 15%" @click="anchorClick">
<a-anchor-link v-for="(item, index) in letters" :key="index" :href="`#${item}`" :title="item"></a-anchor-link>
</a-anchor>
<vue-scroll ref="vs">
<div class="drawer-right">
<div v-for="(item, index) in cityList" :key="index">
<span :id="'#'+letters[index]" class="drawer-letter">{{letters[index]}}</span>
<div v-for="(it, id) in item" :key="id">
<a class="drawer-link" @click="drawerChooseCity(it.label,it.prov)">{{it.label}}</a>
</div>
</div>
</div>
</vue-scroll>
</div>
</a-drawer>
</div>
</template>
@ -93,6 +131,7 @@ export default {
iPageIndex: 1,
sBrand: undefined,
sSeriesName: undefined,
sCity: undefined,
},
seriesList:[],
brandTypeList:[],
@ -129,7 +168,8 @@ export default {
},
//1
visible: false,
pValue: 0, btnPro:['省份城市销量排行','省份品牌销量排行','省份车型销量排行'],
pValue: 0, btnPro: ['省份城市销量排行','省份品牌销量排行','省份车型销量排行'],
btnProBrand: ['省份城市销量排行','省份车型销量排行'],
columnsProCity: [
{title: "排名",dataIndex: "index",key: "index",width: 120},
{title: "城市",dataIndex: "key",key: "key",width: 120},
@ -151,6 +191,7 @@ export default {
//2
visible2: false,
cValue: 0, btnCity:['城市品牌销量排行','城市车型销量排行'],
btnCityBrand: ['城市车型销量排行'],
columnsCityBrand: [
{title: "排名",dataIndex: "index",key: "index",width: 120},
{title: "品牌",dataIndex: "key",key: "key",width: 120},
@ -167,6 +208,8 @@ export default {
drVisible: false,
brandList: [],
letters: [],
cityVisible: false,
cityList: [],
}
},
created() {

@ -2,6 +2,7 @@ import {getSalesType1,getSalesType0} from "@/api/SaleRankCity";
import {getSalesType6,getSalesType7} from "@/api/SaleRankCity";
import {getExcleTime} from "@/api/SaleRankCity";
import {getBrandType, getUserBrand, getUserSeriesName} from "@/api/comm"
import {getSalesCity} from "@/api/SaleRankCity"
import moment from "moment";
export default {
@ -27,6 +28,23 @@ export default {
this.brandList = brandList;
this.letters = letters;
})
getSalesCity({token: this.getToken}).then(res => {
let data = res.data;
let letters = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];
let cityList = [[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[]];
for(let i = 0; i< data.length; i++) {
let index = letters.indexOf(data[i].City_FirstWord)
if(index >= 0) {
let obj = {
label: data[i].City,
value: data[i].City,
prov: data[i].Prov,
};
cityList[index].push(obj)
}
}
this.cityList = cityList;
})
},
getData() {
this.tableLoad = true;
@ -62,7 +80,8 @@ export default {
},
//切换类型
handlerTime(activeIndex) {
this.activeIndex = activeIndex
this.activeIndex = activeIndex;
this.tValue = activeIndex;
if(this.activeIndex == 0) {
getSalesType1(this.form).then(res => {
let data = res.data;
@ -88,6 +107,9 @@ export default {
this.tableLoad = true;
this.form.sStartTime = this.selTime[0];
this.form.sEndTime = this.selTime[1];
if(this.form.sCity != undefined) {
this.handlerTime(1)
}
if(this.activeIndex == 0) {
getSalesType1(this.form).then(res => {
let data = res.data;
@ -113,6 +135,7 @@ export default {
sBrandType: this.form.sBrandType,
iPageIndex: 1,
sProv: record.key,
sCity: '',
sBrand: this.form.sBrand
}
let o = {
@ -200,6 +223,12 @@ export default {
drClose() {
this.drVisible = false
},
cityDrawer() {
this.cityVisible = true
},
cityClose() {
this.cityVisible = false
},
//锚点
anchorClick(e, link) {
// 阻止点击的默认事件修改路由
@ -218,4 +247,8 @@ export default {
})
this.drVisible = false;
},
drawerChooseCity(val,prov) {
this.form.sCity = val;
this.cityVisible = false;
}
}

@ -174,6 +174,7 @@ export default {
}
.choose-series {
width: 240px;
margin-left: 18px;
}
}
.sr-content {

Loading…
Cancel
Save