zhuce
/
lilishop-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化了部分展示功能

master
Yer 2023-07-06 16:21:25 +08:00
parent 2213f0d0ce
commit 8529641145
6 changed files with 107 additions and 91 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
buyer/src/components/header/Header.vue
View File

@ -223,7 +223,6 @@ export default {
font-weight: normal; font-weight: normal;
text-decoration: none; text-decoration: none;
border-left: 1px solid #ccc !important;
cursor: pointer; cursor: pointer;
color: #fff; color: #fff;
} }

152
buyer/src/components/indexDecorate/modelList/Carousel.vue
View File

@ -19,7 +19,7 @@
</Carousel> </Carousel>
</div> </div>
<div class="nav-right"> <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 /> <img class="user-face" :src="userInfo.face || defaultAvatar" alt />
<div class="welcome"> <div class="welcome">
Hi, {{ Hi, {{
@ -27,7 +27,9 @@
}} }}
</div> </div>
<div v-if="userInfo.id"> <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="icon-item" :key="index" @click="entryControl(item)" v-for="(item,index) in recentList">
<div class="value"> <div class="value">
{{ item.value}} {{ item.value}}
@ -36,7 +38,7 @@
{{ item.label}} {{ item.label}}
</div> </div>
</div> </div>
</div> </div> -->
</div> </div>
<div v-else class="flex flex-a-c "> <div v-else class="flex flex-a-c ">
<div class="btns" @click="$router.push('login')" shape="circle" <div class="btns" @click="$router.push('login')" shape="circle"
@ -49,18 +51,18 @@
<div class="gray-line"></div> <div class="gray-line"></div>
<div class="icon-list flex flex-j-sb" > <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`)"> <img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
<div> <div>
{{ item.label}} {{ item.label }}
</div> </div>
</div> </div>
</div> </div>
<div class="icon-list flex flex-j-sb" > <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`)"> <img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
<div> <div>
{{ item.label}} {{ item.label }}
</div> </div>
</div> </div>
</div> </div>
@ -85,73 +87,73 @@ export default {
config: require("@/config"), config: require("@/config"),
defaultAvatar: require("@/assets/images/default.png"), defaultAvatar: require("@/assets/images/default.png"),
userInfo: {}, // 用户信息 userInfo: {}, // 用户信息
entranceList:[ entranceList: [
{ {
icon:"collage", icon: "collage",
label:"宝贝收藏", label: "宝贝收藏",
path:"/home/Favorites" path: "/home/Favorites"
}, },
{ {
icon:"shop", icon: "shop",
label:"收藏店铺", label: "收藏店铺",
path:"/home/Favorites?type=STORE" path: "/home/Favorites?type=STORE"
}, },
{ {
icon:"carts", icon: "carts",
label:"购物车", label: "购物车",
path:"/cart" path: "/cart"
}, },
{ {
icon:"story", icon: "story",
label:"我的足迹", label: "我的足迹",
path:"/home/MyTracks" path: "/home/MyTracks"
}, },
], ],
appendList:[ appendList: [
{ {
icon:"support", icon: "support",
label:"帮助中心", label: "帮助中心",
path:"/article" path: "/article"
}, },
{ {
icon:"feedback", icon: "feedback",
label:"我的评论", label: "我的评论",
path:"/home/CommentList" path: "/home/CommentList"
}, },
{ {
icon:"notice", icon: "notice",
label:"收货地址", label: "收货地址",
path:"/home/MyAddress" path: "/home/MyAddress"
}, },
{ {
icon:"notification", icon: "notification",
label:"我的消息", label: "我的消息",
path:"/home/MsgList" path: "/home/MsgList"
}, },
], ],
recentList:[ recentList: [
{ {
value:"0", value: "0",
label:"购物车" label: "购物车"
}, },
{ {
value:"0", value: "0",
label:"待收货" label: "待收货"
}, },
{ {
value:"0", value: "0",
label:"待发货" label: "待发货"
}, },
{ {
value:"0", value: "0",
label:"代付款" label: "代付款"
}, },
], ],
}; };
}, },
methods: { methods: {
// 快捷跳转中心 // 快捷跳转中心
entryControl(val){ entryControl(val) {
this.$router.push(val.path) this.$router.push(val.path)
}, },
}, },
@ -164,7 +166,7 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.label{ .label {
font-size: 12px; font-size: 12px;
font-weight: normal; font-weight: normal;
line-height: 14px; line-height: 14px;
@ -173,24 +175,28 @@ export default {
color: #666666; color: #666666;
} }
.swiper-img{
.swiper-img {
overflow: hidden; overflow: hidden;
width: 637px; width: 637px;
height: 329.9px; height: 329.9px;
} }
.icon-list{ .icon-list {
width: 216px width: 216px
} }
.icon-list:nth-last-of-type(1){
.icon-list:nth-last-of-type(1) {
margin-top: 20px; margin-top: 20px;
} }
.hot-box{
.hot-box {
margin-top: 35px; margin-top: 35px;
width: 216px; width: 216px;
} }
.hot-tag{
.hot-tag {
margin-right: 6px; margin-right: 6px;
width: 36px; width: 36px;
height: 18px; height: 18px;
@ -202,22 +208,26 @@ export default {
text-align: center; text-align: center;
line-height: 18px; line-height: 18px;
} }
.gray-line{
.gray-line {
width: 216px; width: 216px;
height: 1px; height: 1px;
border: 1px solid #E5E5E5; border: 1px solid #E5E5E5;
margin-bottom: 13px; margin-bottom: 13px;
} }
.icon{
.icon {
width: 20px !important; width: 20px !important;
height: 20px !important; height: 20px !important;
margin-bottom: 7px; margin-bottom: 7px;
} }
.icon-item{
.icon-item {
cursor: pointer; cursor: pointer;
text-align: center; text-align: center;
>div{
>div {
font-size: 11px; font-size: 11px;
font-weight: normal; font-weight: normal;
line-height: 13px; line-height: 13px;
@ -226,7 +236,8 @@ export default {
color: #666666; color: #666666;
} }
>.value{
>.value {
font-size: 14px; font-size: 14px;
line-height: 17px; line-height: 17px;
@ -236,7 +247,8 @@ export default {
margin-bottom: 3px; margin-bottom: 3px;
color: $theme_color; color: $theme_color;
} }
>.label{
>.label {
font-weight: 400; font-weight: 400;
font-size: 12px; font-size: 12px;
@ -247,12 +259,14 @@ export default {
margin-bottom: 13px; margin-bottom: 13px;
} }
} }
.model-carousel { .model-carousel {
width: 1200px; width: 1200px;
height: 340px; height: 340px;
overflow: hidden; overflow: hidden;
} }
.hover-pointer{
.hover-pointer {
//display: block; //display: block;
//width: 100%; //width: 100%;
//height: 100%; //height: 100%;
@ -263,7 +277,8 @@ export default {
} }
.welcome{
.welcome {
font-size: 14px; font-size: 14px;
font-weight: normal; font-weight: normal;
line-height: 17px; line-height: 17px;
@ -272,11 +287,13 @@ export default {
color: #333333; color: #333333;
} }
.hr{
.hr {
width: 216px; width: 216px;
height: 1px; height: 1px;
border: 1px solid #E5E5E5; border: 1px solid #E5E5E5;
} }
.btns { .btns {
margin-top: 21px; margin-top: 21px;
margin-bottom: 13px; margin-bottom: 13px;
@ -294,14 +311,17 @@ export default {
color: #FFFFFF; color: #FFFFFF;
background: $theme_color; background: $theme_color;
} }
.sign-up{
.sign-up {
background: #F39519; background: #F39519;
margin-left: 10px; margin-left: 10px;
} }
.avatar{
.avatar {
margin-bottom: 13px; margin-bottom: 13px;
} }
.user-face{
.user-face {
margin-bottom: 12px; margin-bottom: 12px;
width: 70px; width: 70px;
@ -342,6 +362,7 @@ export default {
float: left; float: left;
position: relative; position: relative;
} }
.nav-right { .nav-right {
float: left; float: left;
margin-top: 10px; margin-top: 10px;
@ -350,7 +371,9 @@ export default {
border-radius: 10px; border-radius: 10px;
background: #FFFFFF; background: #FFFFFF;
.person-msg { .person-msg {
cursor: pointer;
height: 333px; height: 333px;
display: flex; display: flex;
align-items: center; align-items: center;
@ -360,27 +383,33 @@ export default {
} }
.shop-msg { .shop-msg {
div { div {
width: 100%; width: 100%;
margin: 10px 27px; margin: 10px 27px;
span { span {
cursor: pointer; cursor: pointer;
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
margin-left: 5px; margin-left: 5px;
} }
span:nth-child(1) { span:nth-child(1) {
@include content_color($theme_color); @include content_color($theme_color);
margin-left: 0; margin-left: 0;
} }
span:nth-child(2) { span:nth-child(2) {
font-weight: normal; font-weight: normal;
} }
span:nth-child(3):hover { span:nth-child(3):hover {
color: $theme_color; color: $theme_color;
} }
} }
ul { ul {
li { li {
cursor: pointer; cursor: pointer;
@ -388,6 +417,7 @@ export default {
color: #999395; color: #999395;
width: 150px; width: 150px;
font-size: 12px; font-size: 12px;
&:hover { &:hover {
color: $theme_color; color: $theme_color;
} }

8
buyer/src/pages/Cart.vue
View File

@ -10,7 +10,7 @@
>) >)
</div> </div>
</div> </div>
<Search :showTag="false" :showLogo="false"></Search>
</div> </div>
<Divider /> <Divider />
<!-- 购物车主体 --> <!-- 购物车主体 -->
@ -245,7 +245,7 @@
</div> </div>
<Spin size="large" fix v-if="loading"></Spin> <Spin size="large" fix v-if="loading"></Spin>
</div> </div>
<BaseFooter></BaseFooter> <BaseFooter class="footer"></BaseFooter>
</div> </div>
</template> </template>
@ -449,6 +449,9 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.footer{
margin-top: 10px;
}
/** logo 搜索 start **/ /** logo 搜索 start **/
.logo { .logo {
height: 40px; height: 40px;
@ -781,4 +784,5 @@ export default {
.ivu-input-number-input { .ivu-input-number-input {
text-align: center; text-align: center;
} }
</style> </style>

6
buyer/src/pages/GoodsList.vue
View File

@ -3,7 +3,7 @@
<BaseHeader></BaseHeader> <BaseHeader></BaseHeader>
<Search @search="handleSearch"></Search> <Search @search="handleSearch"></Search>
<drawer></drawer> <drawer></drawer>
<cateNav useClass="background-white"></cateNav> <cateNav class="cate-nav" useClass="background-white"></cateNav>
<div class="container"> <div class="container">
<!-- 商品筛选栏 --> <!-- 商品筛选栏 -->
<GoodsClassNav @getParams="getParams"></GoodsClassNav> <GoodsClassNav @getParams="getParams"></GoodsClassNav>
@ -261,7 +261,9 @@ export default {
<style scoped lang="scss"> <style scoped lang="scss">
@import "../assets/styles/goodsList.scss"; @import "../assets/styles/goodsList.scss";
.cate-nav{
margin-top: 10px;
}
.goods-show-info > .goods-show-seller > .goods-show-buyer { .goods-show-info > .goods-show-seller > .goods-show-buyer {
width: 35px; width: 35px;
height: 17px; height: 17px;

2
buyer/src/pages/ShoppingCart.vue
View File

@ -2,7 +2,7 @@
<div> <div>
<BaseHeader></BaseHeader> <BaseHeader></BaseHeader>
<Search></Search> <Search></Search>
<cateNav></cateNav>
<!-- 添加成功提示 --> <!-- 添加成功提示 -->
<div class="add-info-box-container"> <div class="add-info-box-container">
<div class="add-info-box"> <div class="add-info-box">

19
manager/src/views/page-decoration/modelConfig.js
View File

@ -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', type: 'discountAdvert',
name: '折扣广告', name: '折扣广告',