商品分类购物车导航优化
gongfuxiang
parent
235c4bf235
commit
baeeca4c6c
|
|
@ -267,36 +267,19 @@
|
||||||
* 底部导航
|
* 底部导航
|
||||||
*/
|
*/
|
||||||
.botton-nav {
|
.botton-nav {
|
||||||
width: calc(100% - 40rpx);
|
width: calc(100% - 60rpx);
|
||||||
left: auto;
|
left: auto;
|
||||||
bottom: 20rpx;
|
bottom: 20rpx;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
margin-left: 20rpx;
|
margin-left: 20rpx;
|
||||||
background: linear-gradient(132deg, #EBEBEB 0%, #F7F7F7 100%);
|
box-shadow: 0rpx 4rpx 8rpx 0px rgba(0, 0, 0, 0.16);
|
||||||
box-shadow: 0rpx 4rpx 8rpx 0px rgba(0, 0, 0, 0.16);
|
line-height: 84rpx;
|
||||||
|
height: 84rpx;
|
||||||
}
|
}
|
||||||
.botton-nav .cart .badge-icon {
|
.botton-nav .cart .badge-icon {
|
||||||
top: -20rpx;
|
top: -20rpx;
|
||||||
right: -2rpx;
|
right: -2rpx;
|
||||||
}
|
}
|
||||||
.botton-nav button {
|
|
||||||
width: 160rpx;
|
|
||||||
line-height: 84rpx;
|
|
||||||
height: 84rpx;
|
|
||||||
padding: 0 38rpx;
|
|
||||||
border: 0;
|
|
||||||
/* #ifdef MP-QQ */
|
|
||||||
padding-top: 0;
|
|
||||||
padding-bottom: 0;
|
|
||||||
/* #endif */
|
|
||||||
}
|
|
||||||
.botton-nav .cart-total-price {
|
|
||||||
padding-left: 20rpx;
|
|
||||||
width: calc(100% - 260rpx);
|
|
||||||
}
|
|
||||||
.cart {
|
|
||||||
padding-left: 40rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 购物车
|
* 购物车
|
||||||
|
|
@ -309,7 +292,7 @@
|
||||||
}
|
}
|
||||||
.cart-content {
|
.cart-content {
|
||||||
left: auto;
|
left: auto;
|
||||||
bottom: 130rpx;
|
bottom: 150rpx;
|
||||||
width: calc(100% - 40rpx);
|
width: calc(100% - 40rpx);
|
||||||
z-index: 6;
|
z-index: 6;
|
||||||
max-width: calc(800px - 40rpx);
|
max-width: calc(800px - 40rpx);
|
||||||
|
|
|
||||||
|
|
@ -329,20 +329,20 @@
|
||||||
</view>
|
</view>
|
||||||
</block>
|
</block>
|
||||||
<!-- 购物车底部导航 -->
|
<!-- 购物车底部导航 -->
|
||||||
<view class="botton-nav round pa oh flex-row jc-sb align-c" :style="botton_nav_style+(cart_status ? 'z-index:5;' : '')">
|
<view class="botton-nav bg-white round pa oh padding-sm flex-row jc-sb align-c" :style="botton_nav_style+(cart_status ? 'z-index:5;' : '')">
|
||||||
<view class="flex-row align-c flex-1 flex-width">
|
<view class="flex-row align-c flex-1 flex-width">
|
||||||
<view class="cart pr cp top-sm" @tap="cart_event">
|
<view class="cart pr cp top-sm padding-left-lg" @tap="cart_event">
|
||||||
<iconfont name="icon-applet-shop-acquiesce" size="36rpx" color="#666"></iconfont>
|
<iconfont name="icon-applet-shop-acquiesce" size="36rpx" color="#666"></iconfont>
|
||||||
<view v-if="(cart || null) != null && (cart.buy_number || 0) != 0" class="badge-icon pa">
|
<view v-if="(cart || null) != null && (cart.buy_number || 0) != 0" class="badge-icon pa">
|
||||||
<component-badge :propNumber="cart.buy_number"></component-badge>
|
<component-badge :propNumber="cart.buy_number"></component-badge>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="cart-total-price single-text fw-b cr-red flex-1">
|
<view class="cart-total-price single-text padding-left-lg fw-b cr-red flex-1">
|
||||||
<text class="text-size-xss">{{ currency_symbol }}</text>
|
<text class="text-size-xss">{{ currency_symbol }}</text>
|
||||||
<text class="text-size-lg">{{ (cart || null) == null ? 0 : cart.total_price || 0 }}</text>
|
<text class="text-size-lg">{{ (cart || null) == null ? 0 : cart.total_price || 0 }}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<button type="default" size="mini" hover-class="none" @tap="buy_submit_event" class="text-size-md radius-0 bg-main cr-white">{{ $t('goods-category.goods-category.44f1ww') }}</button>
|
<button type="default" size="mini" hover-class="none" class="bg-main cr-white text-size-md round margin-right-xs" @tap="buy_submit_event">{{ $t('goods-category.goods-category.44f1ww') }}</button>
|
||||||
</view>
|
</view>
|
||||||
</block>
|
</block>
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -682,18 +682,18 @@
|
||||||
// 左侧
|
// 左侧
|
||||||
var left_style = '';
|
var left_style = '';
|
||||||
if(this.category_goods_is_show_cart_nav == 1) {
|
if(this.category_goods_is_show_cart_nav == 1) {
|
||||||
left_style = 'height: calc(100% - 100rpx - '+(this.footer_height_value+20)+'rpx);';
|
left_style = 'height: calc(100% - 120rpx - '+(this.footer_height_value+20)+'rpx);';
|
||||||
}
|
}
|
||||||
// 右侧
|
// 右侧
|
||||||
var right_style = '';
|
var right_style = '';
|
||||||
if(this.category_goods_is_show_cart_nav == 1 && this.common_site_type != 1) {
|
if(this.category_goods_is_show_cart_nav == 1 && this.common_site_type != 1) {
|
||||||
right_style = 'padding-bottom: calc(105rpx + '+(this.footer_height_value+20)+'rpx);';
|
right_style = 'padding-bottom: calc(120rpx + '+(this.footer_height_value+20)+'rpx);';
|
||||||
}
|
}
|
||||||
this.setData({
|
this.setData({
|
||||||
left_content_actual_style: left_style,
|
left_content_actual_style: left_style,
|
||||||
right_content_actual_style: right_style,
|
right_content_actual_style: right_style,
|
||||||
botton_nav_style: 'bottom: calc(20rpx + '+this.footer_height_value+'rpx);',
|
botton_nav_style: 'bottom: calc(20rpx + '+this.footer_height_value+'rpx);',
|
||||||
cart_content_style: 'bottom: calc(130rpx + '+this.footer_height_value+'rpx);',
|
cart_content_style: 'bottom: calc(150rpx + '+this.footer_height_value+'rpx);',
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue