panxiaohe
/
ceres-uniapp-v2.0
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

搜索结果商品列表界面布局调整

master
dy-hu 1 year ago
parent
0c6ee4a4b8
commit
cb33cd73a5
2 changed files with 51 additions and 44 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      App.vue
  2. 91
      pages_category_page1/goodsModule/goodsList.vue

4
App.vue
View File

@ -786,10 +786,6 @@ uni-checkbox:not([disabled]) .uni-checkbox-input:hover {
color: #595B6B;
}
.font-color-F54639 {
color: #F54639;
}
.font-color-BCBDC6 {
color: #BCBDC6;
}

91
pages_category_page1/goodsModule/goodsList.vue
View File

@ -6,18 +6,18 @@
<view class="searchImg-box flex-items-plus">
<image
class="searchImg"
src="https://ceres.zkthink.com/static/img/searchImg.png"
src="https://wechat.hnthee.com/ceres-local-file/image/shop_collect_search.png"
></image>
<input
class="search-box"
v-model="keyWord"
maxlength="20"
placeholder-class="searchboxPlace"
:placeholder="$t('common.searchproduct_hint')"
class="search-box"
v-model="keyWord"
maxlength="20"
placeholder-class="searchboxPlace"
:placeholder="$t('common.searchproduct_hint')"
/>
</view>
<label
class="mar-left-40 fs28"
class="mar-right-10 fs28 font-color-252744"
@click="searchList(1)"
>{{$t('page.search')}}</label>
</view>
@ -108,7 +108,7 @@
class="number"
v-if="item.number != null"
>
<view class="numText">已售{{ item.number }}件</view>
<view
class="numText"
@ -152,14 +152,14 @@
v-if="item.activityType == 9"
src="https://ceres.zkthink.com/static/images/memberCenterIcon.png"
></image>
<view class="font-color-C83732 flex-row-plus">
<view class="font-color-F54639 fs32 flex-row-plus">
<b>￥</b>
<label class="fs28">{{ item.price }}</label>
<label>{{ item.price }}</label>
</view>
<view class="mar-left-30 discountsPriceLine font-color-999">¥{{ item.originalPrice }}</view>
<view class="mar-left-10 mar-top-5 discountsPriceLine font-color-90919C">¥{{ item.originalPrice }}</view>
</view>
<view class="flex-display flex-sp-between flex-row mar-top-20 flex-items shopName">
<label class="fs22 font-color-FFEBC4">{{ item.shopName }}</label>
<label class="fs22 font-color-FFF">{{ item.shopName }}</label>
</view>
</view>
</view>
@ -341,7 +341,7 @@ input {
.container {
height: 100%;
background: #f8f8f8;
background: #FAFAFA;
position: relative;
.search {
@ -373,9 +373,10 @@ input {
.searchBg {
width: 100%;
display: flex;
background-color: #F7F7F7;
background-color: #F2F2F6;
border-radius: 35rpx;
align-items: center;
height: 78rpx;
height: 68rpx;
justify-content: space-between;
padding: 0 20rpx;
@ -386,19 +387,21 @@ input {
}
.searchImg {
width: 50upx;
height: 50upx;
width: 32rpx;
height: 32rpx;
position: absolute;
left: 0upx;
}
.search-box {
width: 400upx;
width: 500rpx;
height: 66upx;
font-size: 28rpx;
color: #252744;
}
.searchboxPlace {
font-size: 26upx;
font-size: 28rpx;
color: #A9A9A9;
padding-right: 30upx;
}
@ -416,15 +419,16 @@ input {
}
.goodsDetails-box {
background: #FFFFFF;
margin-top: 20rpx;
box-sizing: border-box;
.spikeList {
border-bottom: 1upx solid #EDEDED;
padding-top: 30rpx;
padding-bottom: 30upx;
position: relative;
background: #FFFFFF;
border-radius: 30rpx;
box-shadow: 0rpx 15rpx 30rpx 0rpx #F2F2F2;
.listItem {
display: flex;
@ -446,8 +450,9 @@ input {
margin-right: 30upx;
img {
width: 100%;
height: 100%;
width: 220rpx;
height: 220rpx;
border-radius: 20rpx;
}
}
@ -455,8 +460,8 @@ input {
flex: 1;
p {
font-size: 26upx;
color: #333333;
font-size: 28rpx;
color: #252744;
line-height: 40upx;
margin-bottom: 30upx;
text-overflow: -o-ellipsis-lastline;
@ -475,11 +480,10 @@ input {
align-items: center;
.numText {
padding: 0 10rpx;
height: 40rpx;
line-height: 40rpx;
border: 2rpx solid #E4E5E6;
color: #C5AA7B;
padding: 3rpx 12rpx;
border: 1rpx solid #90919C;
border-radius: 10rpx;
color: #90919C;
font-size: 20rpx;
margin-right: 10rpx;
}
@ -489,10 +493,11 @@ input {
.shopName {
height: 50rpx;
background: #333333;
background: #252744;
opacity: 1;
border-radius: 0 20rpx 20rpx 0;
padding: 10rpx 15rpx;
border-radius: 25rpx;
padding: 10rpx 20rpx;
margin-right: 10rpx;
}
}
}
@ -538,10 +543,11 @@ input {
}
.nav-title {
color: #90919C;
}
.nav-item.active {
color: #C5AA7B;
color: #252744;
}
.nav-item .line {
@ -553,7 +559,7 @@ input {
}
.nav-item.active .line {
background: #C5AA7B;
background: #252744;
}
.nav-item.padd-l {
@ -562,7 +568,8 @@ input {
}
.active {
color: #C5AA7B;
color: #252744;
font-weight: bold;
}
.nav-item.padd-r {
@ -594,8 +601,9 @@ input {
height: 0;
border-width: 10rpx;
border-style: solid;
border-color: #CCCCCC transparent transparent transparent;
border-color: #90919C transparent transparent transparent;
margin-top: 2rpx;
margin-left: 3rpx;
}
.arrowUp {
@ -604,15 +612,18 @@ input {
height: 0;
border-width: 10rpx;
border-style: solid;
border-color: transparent transparent #CCCCCC transparent;
border-color: transparent transparent #90919C transparent;
margin-left: 3rpx;
}
.activeDown {
border-color: #C5AA7B transparent transparent transparent;
border-color: #252744 transparent transparent transparent;
margin-left: 3rpx;
}
.activeUp {
border-color: transparent transparent #C5AA7B transparent;
border-color: transparent transparent #252744 transparent;
margin-left: 3rpx;
}
}

Write Preview
Loading…
Cancel
Save