优化了部分展示功能
Yer
parent
2213f0d0ce
commit
8529641145
|
|
@ -223,7 +223,6 @@ export default {
|
|||
font-weight: normal;
|
||||
text-decoration: none;
|
||||
|
||||
border-left: 1px solid #ccc !important;
|
||||
cursor: pointer;
|
||||
color: #fff;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
</Carousel>
|
||||
</div>
|
||||
<div class="nav-right">
|
||||
<div class="person-msg">
|
||||
<div class="person-msg" @click="entryControl({ path: 'home' })">
|
||||
<img class="user-face" :src="userInfo.face || defaultAvatar" alt />
|
||||
<div class="welcome">
|
||||
Hi, {{
|
||||
|
|
@ -27,7 +27,9 @@
|
|||
}}
|
||||
</div>
|
||||
<div v-if="userInfo.id">
|
||||
<div class="icon-list flex flex-j-sb" >
|
||||
<div class="icon-list"></div>
|
||||
<!-- #TODO 后续增加 -->
|
||||
<!-- <div class="icon-list flex flex-j-sb" >
|
||||
<div class="icon-item" :key="index" @click="entryControl(item)" v-for="(item,index) in recentList">
|
||||
<div class="value">
|
||||
{{ item.value}}
|
||||
|
|
@ -36,7 +38,7 @@
|
|||
{{ item.label}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div v-else class="flex flex-a-c ">
|
||||
<div class="btns" @click="$router.push('login')" shape="circle"
|
||||
|
|
@ -49,18 +51,18 @@
|
|||
|
||||
<div class="gray-line"></div>
|
||||
<div class="icon-list flex flex-j-sb" >
|
||||
<div class="icon-item" @click="entryControl(item)" :key="index" v-for="(item,index) in entranceList">
|
||||
<div class="icon-item" @click="entryControl(item)" :key="index" v-for="(item, index) in entranceList">
|
||||
<img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
|
||||
<div>
|
||||
{{ item.label}}
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="icon-list flex flex-j-sb" >
|
||||
<div class="icon-item" :key="index" @click="entryControl(item)" v-for="(item,index) in appendList">
|
||||
<div class="icon-item" :key="index" @click="entryControl(item)" v-for="(item, index) in appendList">
|
||||
<img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
|
||||
<div>
|
||||
{{ item.label}}
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -85,73 +87,73 @@ export default {
|
|||
config: require("@/config"),
|
||||
defaultAvatar: require("@/assets/images/default.png"),
|
||||
userInfo: {}, // 用户信息
|
||||
entranceList:[
|
||||
entranceList: [
|
||||
{
|
||||
icon:"collage",
|
||||
label:"宝贝收藏",
|
||||
path:"/home/Favorites"
|
||||
icon: "collage",
|
||||
label: "宝贝收藏",
|
||||
path: "/home/Favorites"
|
||||
},
|
||||
{
|
||||
icon:"shop",
|
||||
label:"收藏店铺",
|
||||
path:"/home/Favorites?type=STORE"
|
||||
icon: "shop",
|
||||
label: "收藏店铺",
|
||||
path: "/home/Favorites?type=STORE"
|
||||
},
|
||||
{
|
||||
icon:"carts",
|
||||
label:"购物车",
|
||||
path:"/cart"
|
||||
icon: "carts",
|
||||
label: "购物车",
|
||||
path: "/cart"
|
||||
},
|
||||
{
|
||||
icon:"story",
|
||||
label:"我的足迹",
|
||||
path:"/home/MyTracks"
|
||||
icon: "story",
|
||||
label: "我的足迹",
|
||||
path: "/home/MyTracks"
|
||||
},
|
||||
],
|
||||
appendList:[
|
||||
appendList: [
|
||||
{
|
||||
icon:"support",
|
||||
label:"帮助中心",
|
||||
path:"/article"
|
||||
icon: "support",
|
||||
label: "帮助中心",
|
||||
path: "/article"
|
||||
},
|
||||
{
|
||||
icon:"feedback",
|
||||
label:"我的评论",
|
||||
path:"/home/CommentList"
|
||||
icon: "feedback",
|
||||
label: "我的评论",
|
||||
path: "/home/CommentList"
|
||||
},
|
||||
{
|
||||
icon:"notice",
|
||||
label:"收货地址",
|
||||
path:"/home/MyAddress"
|
||||
icon: "notice",
|
||||
label: "收货地址",
|
||||
path: "/home/MyAddress"
|
||||
},
|
||||
{
|
||||
icon:"notification",
|
||||
label:"我的消息",
|
||||
path:"/home/MsgList"
|
||||
icon: "notification",
|
||||
label: "我的消息",
|
||||
path: "/home/MsgList"
|
||||
},
|
||||
],
|
||||
recentList:[
|
||||
recentList: [
|
||||
{
|
||||
value:"0",
|
||||
label:"购物车"
|
||||
value: "0",
|
||||
label: "购物车"
|
||||
},
|
||||
{
|
||||
value:"0",
|
||||
label:"待收货"
|
||||
value: "0",
|
||||
label: "待收货"
|
||||
},
|
||||
{
|
||||
value:"0",
|
||||
label:"待发货"
|
||||
value: "0",
|
||||
label: "待发货"
|
||||
},
|
||||
{
|
||||
value:"0",
|
||||
label:"代付款"
|
||||
value: "0",
|
||||
label: "代付款"
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 快捷跳转中心
|
||||
entryControl(val){
|
||||
entryControl(val) {
|
||||
this.$router.push(val.path)
|
||||
},
|
||||
},
|
||||
|
|
@ -164,7 +166,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.label{
|
||||
.label {
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
line-height: 14px;
|
||||
|
|
@ -173,24 +175,28 @@ export default {
|
|||
|
||||
color: #666666;
|
||||
}
|
||||
.swiper-img{
|
||||
|
||||
.swiper-img {
|
||||
overflow: hidden;
|
||||
width: 637px;
|
||||
height: 329.9px;
|
||||
}
|
||||
|
||||
.icon-list{
|
||||
.icon-list {
|
||||
width: 216px
|
||||
}
|
||||
.icon-list:nth-last-of-type(1){
|
||||
|
||||
.icon-list:nth-last-of-type(1) {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.hot-box{
|
||||
|
||||
.hot-box {
|
||||
margin-top: 35px;
|
||||
width: 216px;
|
||||
|
||||
}
|
||||
.hot-tag{
|
||||
|
||||
.hot-tag {
|
||||
margin-right: 6px;
|
||||
width: 36px;
|
||||
height: 18px;
|
||||
|
|
@ -202,22 +208,26 @@ export default {
|
|||
text-align: center;
|
||||
line-height: 18px;
|
||||
}
|
||||
.gray-line{
|
||||
|
||||
.gray-line {
|
||||
width: 216px;
|
||||
height: 1px;
|
||||
border: 1px solid #E5E5E5;
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
.icon{
|
||||
|
||||
.icon {
|
||||
width: 20px !important;
|
||||
height: 20px !important;
|
||||
margin-bottom: 7px;
|
||||
}
|
||||
.icon-item{
|
||||
|
||||
.icon-item {
|
||||
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
>div{
|
||||
|
||||
>div {
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
line-height: 13px;
|
||||
|
|
@ -226,7 +236,8 @@ export default {
|
|||
|
||||
color: #666666;
|
||||
}
|
||||
>.value{
|
||||
|
||||
>.value {
|
||||
font-size: 14px;
|
||||
|
||||
line-height: 17px;
|
||||
|
|
@ -236,7 +247,8 @@ export default {
|
|||
margin-bottom: 3px;
|
||||
color: $theme_color;
|
||||
}
|
||||
>.label{
|
||||
|
||||
>.label {
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
|
||||
|
|
@ -247,12 +259,14 @@ export default {
|
|||
margin-bottom: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.model-carousel {
|
||||
width: 1200px;
|
||||
height: 340px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.hover-pointer{
|
||||
|
||||
.hover-pointer {
|
||||
//display: block;
|
||||
//width: 100%;
|
||||
//height: 100%;
|
||||
|
|
@ -263,7 +277,8 @@ export default {
|
|||
|
||||
|
||||
}
|
||||
.welcome{
|
||||
|
||||
.welcome {
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
line-height: 17px;
|
||||
|
|
@ -272,11 +287,13 @@ export default {
|
|||
|
||||
color: #333333;
|
||||
}
|
||||
.hr{
|
||||
|
||||
.hr {
|
||||
width: 216px;
|
||||
height: 1px;
|
||||
border: 1px solid #E5E5E5;
|
||||
}
|
||||
|
||||
.btns {
|
||||
margin-top: 21px;
|
||||
margin-bottom: 13px;
|
||||
|
|
@ -294,14 +311,17 @@ export default {
|
|||
color: #FFFFFF;
|
||||
background: $theme_color;
|
||||
}
|
||||
.sign-up{
|
||||
|
||||
.sign-up {
|
||||
background: #F39519;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.avatar{
|
||||
|
||||
.avatar {
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
.user-face{
|
||||
|
||||
.user-face {
|
||||
|
||||
margin-bottom: 12px;
|
||||
width: 70px;
|
||||
|
|
@ -342,6 +362,7 @@ export default {
|
|||
float: left;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.nav-right {
|
||||
float: left;
|
||||
margin-top: 10px;
|
||||
|
|
@ -350,7 +371,9 @@ export default {
|
|||
|
||||
border-radius: 10px;
|
||||
background: #FFFFFF;
|
||||
|
||||
.person-msg {
|
||||
cursor: pointer;
|
||||
height: 333px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -360,27 +383,33 @@ export default {
|
|||
|
||||
|
||||
}
|
||||
|
||||
.shop-msg {
|
||||
div {
|
||||
width: 100%;
|
||||
margin: 10px 27px;
|
||||
|
||||
span {
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
span:nth-child(1) {
|
||||
@include content_color($theme_color);
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
span:nth-child(2) {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
span:nth-child(3):hover {
|
||||
color: $theme_color;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
li {
|
||||
cursor: pointer;
|
||||
|
|
@ -388,6 +417,7 @@ export default {
|
|||
color: #999395;
|
||||
width: 150px;
|
||||
font-size: 12px;
|
||||
|
||||
&:hover {
|
||||
color: $theme_color;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
>)
|
||||
</div>
|
||||
</div>
|
||||
<Search :showTag="false" :showLogo="false"></Search>
|
||||
|
||||
</div>
|
||||
<Divider />
|
||||
<!-- 购物车主体 -->
|
||||
|
|
@ -245,7 +245,7 @@
|
|||
</div>
|
||||
<Spin size="large" fix v-if="loading"></Spin>
|
||||
</div>
|
||||
<BaseFooter></BaseFooter>
|
||||
<BaseFooter class="footer"></BaseFooter>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -449,6 +449,9 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.footer{
|
||||
margin-top: 10px;
|
||||
}
|
||||
/** logo 搜索 start **/
|
||||
.logo {
|
||||
height: 40px;
|
||||
|
|
@ -781,4 +784,5 @@ export default {
|
|||
.ivu-input-number-input {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<BaseHeader></BaseHeader>
|
||||
<Search @search="handleSearch"></Search>
|
||||
<drawer></drawer>
|
||||
<cateNav useClass="background-white"></cateNav>
|
||||
<cateNav class="cate-nav" useClass="background-white"></cateNav>
|
||||
<div class="container">
|
||||
<!-- 商品筛选栏 -->
|
||||
<GoodsClassNav @getParams="getParams"></GoodsClassNav>
|
||||
|
|
@ -261,7 +261,9 @@ export default {
|
|||
|
||||
<style scoped lang="scss">
|
||||
@import "../assets/styles/goodsList.scss";
|
||||
|
||||
.cate-nav{
|
||||
margin-top: 10px;
|
||||
}
|
||||
.goods-show-info > .goods-show-seller > .goods-show-buyer {
|
||||
width: 35px;
|
||||
height: 17px;
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div>
|
||||
<BaseHeader></BaseHeader>
|
||||
<Search></Search>
|
||||
<cateNav></cateNav>
|
||||
|
||||
<!-- 添加成功提示 -->
|
||||
<div class="add-info-box-container">
|
||||
<div class="add-info-box">
|
||||
|
|
|
|||
|
|
@ -300,25 +300,6 @@ export const modelData = [{
|
|||
]
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'seckill-only-album',
|
||||
name: '促销活动-图片版',
|
||||
icon: 'md-image',
|
||||
showName: '',
|
||||
options: {
|
||||
list: [{
|
||||
time: 6,
|
||||
goodsList: [{
|
||||
img: require('@/assets/nav/1.jpg'),
|
||||
|
||||
url: ''
|
||||
},
|
||||
|
||||
]
|
||||
},
|
||||
]
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'discountAdvert',
|
||||
name: '折扣广告',
|
||||
|
|
|
|||
Loading…
Reference in New Issue