张雄 3 years ago
parent 3625f1e1fd
commit a8e2d00104

@ -10,8 +10,9 @@
<template> <template>
<div class="mp-outter" v-loading="load"> <div class="mp-outter" v-loading="load">
<v-label-div title="重点媒体" :showLine="false" :eStyle="{'border-style': 'none'}"></v-label-div> <v-label-div title="重点媒体" :showLine="false" :eStyle="{'border-style': 'none'}"></v-label-div>
<div class="mp-inner">
<vue-scroll> <vue-scroll>
<div class="mp-inner">
<v-ranking-mpth <v-ranking-mpth
v-for="(item, index) in labelArr" v-for="(item, index) in labelArr"
:key="index" :key="index"
@ -19,8 +20,9 @@
:label="item.key" :label="item.key"
:val="item.value" :val="item.value"
></v-ranking-mpth> ></v-ranking-mpth>
</vue-scroll>
</div> </div>
</vue-scroll>
</div> </div>
</template> </template>
@ -67,7 +69,7 @@ export default {
<style lang="less" scoped> <style lang="less" scoped>
.mp-outter { .mp-outter {
width: 460px; width: 460px;
height: 460px; height: 400px;
// border: 2px solid #0f2a4d; // border: 2px solid #0f2a4d;
.mp-inner { .mp-inner {
padding: 0px 16px 0px 16px; padding: 0px 16px 0px 16px;

@ -94,7 +94,7 @@ export default {
width: 100%; width: 100%;
height: 1px; height: 1px;
background:#0a1d3b; background:#0a1d3b;
margin-top: 16px; margin-top: 12px;
margin-bottom: 16px; margin-bottom: 16px;
} }
.v-r-inner { .v-r-inner {

@ -28,20 +28,40 @@
<v-label-div :title="form.Classify == 1 ? '品牌列表':'车型列表'"> <v-label-div :title="form.Classify == 1 ? '品牌列表':'车型列表'">
<v-btn @click="reset"></v-btn> <v-btn @click="reset"></v-btn>
</v-label-div> </v-label-div>
<div class="brandChooseContent" v-if="form.Classify == 1"> <div v-if="form.Classify == 1">
<div class="brand-item" v-for="(item, index) in chosenBrandList" :key="index"> <div v-if="chosenBrandList.length <= 60" class="brandChooseContent">
<span style="margin-left: 40px">{{item}}</span><a-icon @click="delBrand(index)" class="close-icon" type="close" /> <div class="brand-item" v-for="(item, index) in chosenBrandList" :key="index">
<span style="margin-left: 40px">{{item}}</span><a-icon @click="delBrand(index)" class="close-icon" type="close" />
</div>
<div class="brand-item" style="text-align: center;">
<a-icon @click="handlerAdd" style="cursor: pointer;font-size: 36px;margin-top: 20px" type="plus" />
</div>
</div> </div>
<div class="brand-item" style="text-align: center;"> <div v-else class="brandChooseContent">
<a-icon @click="handlerAdd" style="cursor: pointer;font-size: 36px;margin-top: 20px" type="plus" /> <div class="brand-item-small" v-for="(item, index) in chosenBrandList" :key="index">
<span style="margin-left: 36px">{{item.length > 8 ? item.slice(0,8)+'...':item}}</span><a-icon @click="delBrand(index)" class="close-icon" type="close" />
</div>
<div class="brand-item-small" style="text-align: center;">
<a-icon @click="handlerAdd" style="cursor: pointer;font-size: 36px;margin-top: 20px" type="plus" />
</div>
</div> </div>
</div> </div>
<div class="brandChooseContent" v-if="form.Classify == 2"> <div v-if="form.Classify == 2">
<div class="brand-item" v-for="(item, index) in chosenSeriesList" :key="index"> <div v-if="chosenSeriesList.length <= 60" class="brandChooseContent">
<span style="margin-left: 40px">{{item}}</span><a-icon @click="delBrand(index)" class="close-icon" type="close" /> <div class="brand-item" v-for="(item, index) in chosenSeriesList" :key="index">
<span style="margin-left: 40px">{{item}}</span><a-icon @click="delBrand(index)" class="close-icon" type="close" />
</div>
<div class="brand-item" style="text-align: center;">
<a-icon @click="handlerAdd" style="cursor: pointer;font-size: 36px;margin-top: 20px" type="plus" />
</div>
</div> </div>
<div class="brand-item" style="text-align: center;"> <div v-else class="brandChooseContent">
<a-icon @click="handlerAdd" style="cursor: pointer;font-size: 36px;margin-top: 20px" type="plus" /> <div class="brand-item-small" v-for="(item, index) in chosenSeriesList" :key="index">
<span style="margin-left: 36px">{{item.length > 8 ? item.slice(0,8)+'...':item}}</span><a-icon @click="delBrand(index)" class="close-icon" type="close" />
</div>
<div class="brand-item-small" style="text-align: center;">
<a-icon @click="handlerAdd" style="cursor: pointer;font-size: 36px;margin-top: 20px" type="plus" />
</div>
</div> </div>
</div> </div>
</div> </div>
@ -244,6 +264,28 @@ export default {
color: #3373CC; color: #3373CC;
cursor: pointer; cursor: pointer;
} }
};
.brand-item-small {
width: 168px;
height: 80px;
background: #1B4163;
border-radius: 4px;
font-size: 14px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #FFFFFF;
line-height: 80px;
margin-right: 16px;
margin-top: 24px;
text-align: center;
.close-icon {
position: relative;
margin-top: 30px;
margin-right: 24px;
float: right;
color: #3373CC;
cursor: pointer;
}
} }
} }
} }

Loading…
Cancel
Save