mirror of
http://git.coreshop.cn/jianweie/coreshoppro.git
synced 2025-12-06 19:53:27 +08:00
【优化】优化模板库内点餐模块样式效果。
This commit is contained in:
@@ -73,7 +73,7 @@
|
||||
}
|
||||
|
||||
|
||||
.cart-box { position: absolute; bottom: 30rpx; left: 30rpx; right: 30rpx; height: 96rpx; border-radius: 48rpx; box-shadow: 0 0 20rpx rgba(0, 0, 0, 0.2); background-color: #FFFFFF; display: flex; align-items: center; justify-content: space-between; z-index: 10;
|
||||
.cart-box { position: fixed; bottom: 30rpx; left: 30rpx; right: 30rpx; height: 96rpx; border-radius: 48rpx; box-shadow: 0 0 20rpx rgba(0, 0, 0, 0.2); background-color: #FFFFFF; display: flex; align-items: center; justify-content: space-between; z-index: 10;
|
||||
.cart-img { width: 96rpx; height: 96rpx; position: relative; margin-top: -48rpx; }
|
||||
.pay-btn { height: 100%; padding: 0 30rpx; color: #FFFFFF; border-radius: 0 50rpx 50rpx 0; display: flex; align-items: center; font-size: 28rpx; }
|
||||
.mark { padding-left: 46rpx; margin-right: 30rpx; position: relative;
|
||||
|
||||
@@ -41,7 +41,7 @@
|
||||
</view>
|
||||
</view>
|
||||
<view class="content">
|
||||
<scroll-view class="menus" :scroll-into-view="menuScrollIntoView" scroll-with-animation scroll-y>
|
||||
<scroll-view class="menus" scroll-with-animation scroll-y :scroll-top="headerH" :style="'height:' + scorllH+'px;'">
|
||||
<view class="wrapper">
|
||||
<view class="menu" :id="`menu-${item.id}`" :class="{'current': item.id === currentCateId}" v-for="(item, index) in menus"
|
||||
:key="index" @tap="handleMenuTap(item.id)">
|
||||
@@ -50,14 +50,11 @@
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<!-- goods list begin -->
|
||||
<scroll-view class="goods" scroll-with-animation scroll-y :scroll-top="cateScrollTop" @scroll="handleGoodsScroll">
|
||||
<scroll-view class="goods" scroll-with-animation scroll-y :scroll-top="headerH" :style="'height:' + scorllH+'px;'">
|
||||
<view class="wrapper">
|
||||
<view class="list">
|
||||
<!-- category begin -->
|
||||
<view class="category" v-for="(good, key) in goodsList" :key="key" :id="`cate-${item.id}`">
|
||||
<view class="items">
|
||||
<!-- 商品 begin -->
|
||||
<view class="good">
|
||||
<image :src="good.images" class="image" @tap="goGoodsDetail(item.id)"></image>
|
||||
<view class="right">
|
||||
@@ -74,10 +71,8 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 商品 end -->
|
||||
</view>
|
||||
</view>
|
||||
<!-- category end -->
|
||||
<u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" margin-top="20" margin-bottom="20" />
|
||||
</view>
|
||||
</view>
|
||||
@@ -85,16 +80,7 @@
|
||||
</scroll-view>
|
||||
<!-- goods list end -->
|
||||
</view>
|
||||
<!-- 购物车栏 begin -->
|
||||
<view class="cart-box">
|
||||
<view class="mark">
|
||||
<image src="https://files.cdn.coreshop.cn/static/template/diancan/images/cart.png" class="cart-img"></image>
|
||||
<view class="tag">{{cartNums}}</view>
|
||||
</view>
|
||||
<view class="price">¥{{cartMoney}}</view>
|
||||
<button type="primary" class="pay-btn" @tap="redirectCart" :disabled="cartNums<=0">去结算</button>
|
||||
</view>
|
||||
<!-- 购物车栏 end -->
|
||||
|
||||
</view>
|
||||
|
||||
<vk-data-goods-sku-popup ref="skuPopup"
|
||||
@@ -107,6 +93,17 @@
|
||||
@close="onCloseSkuPopup"
|
||||
@add-cart="addCart"
|
||||
@buy-now="buyNow"></vk-data-goods-sku-popup>
|
||||
|
||||
<!-- 购物车栏 begin -->
|
||||
<view class="cart-box">
|
||||
<view class="mark">
|
||||
<image src="https://files.cdn.coreshop.cn/static/template/diancan/images/cart.png" class="cart-img"></image>
|
||||
<view class="tag">{{cartNums}}</view>
|
||||
</view>
|
||||
<view class="price">¥{{cartMoney}}</view>
|
||||
<button type="primary" class="pay-btn" @tap="redirectCart" :disabled="cartNums<=0">去结算</button>
|
||||
</view>
|
||||
<!-- 购物车栏 end -->
|
||||
<!-- 登录提示 -->
|
||||
<coreshop-login-modal></coreshop-login-modal>
|
||||
</view>
|
||||
@@ -123,7 +120,6 @@
|
||||
menuScrollIntoView: '',
|
||||
good: {},
|
||||
currentCateId: 0,//默认分类
|
||||
scrollTop: 0,
|
||||
loadStatus: 'loadmore',
|
||||
loadIconType: 'flower',
|
||||
loadText: {
|
||||
@@ -141,6 +137,9 @@
|
||||
skuMode: 1,
|
||||
// 后端返回的商品信息
|
||||
goodsSkuInfo: {},
|
||||
|
||||
headerH: 0,
|
||||
scorllH: 0, //滚动区域全屏
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -166,6 +165,20 @@
|
||||
},
|
||||
},
|
||||
onShow() {
|
||||
uni.getSystemInfo({
|
||||
success: (e) => {
|
||||
// #ifndef MP
|
||||
this.StatusBar = e.statusBarHeight;
|
||||
if (e.platform == 'android') {
|
||||
this.headerH = e.statusBarHeight + 50;
|
||||
} else {
|
||||
this.headerH = e.statusBarHeight + 45;
|
||||
};
|
||||
// #endif
|
||||
this.scorllH = e.windowHeight - e.statusBarHeight - 180;
|
||||
}
|
||||
})
|
||||
|
||||
this.categories();
|
||||
// 获取购物车数量
|
||||
this.getCartNums();
|
||||
@@ -315,7 +328,6 @@
|
||||
this.page = 1;
|
||||
this.goodsList = [];
|
||||
this.getGoods();
|
||||
//this.$nextTick(() => this.cateScrollTop = this.goods.find(item => item.id == id).top)
|
||||
},
|
||||
categories() {
|
||||
this.$u.api.categories().then(res => {
|
||||
|
||||
Reference in New Issue
Block a user