diff --git a/src/pages/pay/pay.vue b/src/pages/pay/pay.vue index c1f3e79..e0c6315 100644 --- a/src/pages/pay/pay.vue +++ b/src/pages/pay/pay.vue @@ -40,6 +40,17 @@ + + + + 合计: + {{totalPrice}} + 去支付({{ totalCount }}) + @@ -66,13 +77,44 @@ export default { this.address = res } }) - } + }, + // 去付款 + payHandle(){ + if (!this.address.userName) { + uni.showToast({ title: "请选择收货地址", icon: "none" }); + } else { + console.log("走支付逻辑"); + } + }, }, computed: { // 拼接收货地址 addressDetail (){ const {detailInfo, countyName, cityName, provinceName} = this.address return provinceName + cityName + countyName + detailInfo + }, + // 总价格 + totalPrice(){ + let totalPrice = 0 + this.cartList.forEach(item => { + if(item.goods_select){ + totalPrice += item.goods_price * item.goods_count + } + }) + return totalPrice + }, + // 总数量 + totalCount(){ + let totalCount = 0 + // 京东规则 + // this.cartList.forEach(item => { + // if(item.goods_select){ + // totalCount += item.goods_count + // } + // }) + // 淘宝规则 + totalCount = this.cartList.filter(item=>item.goods_select).length + return totalCount } }, } @@ -125,24 +167,57 @@ export default { } .goods { - background-color: #fff; - border-radius: 5rpx; - margin: 20rpx; - padding: 20rpx; - .goods_title { - line-height: 60rpx; - font-size: 30rpx; - font-weight: bold; + background-color: #fff; + border-radius: 5rpx; + margin: 20rpx; + padding: 20rpx; + .goods_title { + line-height: 60rpx; + font-size: 30rpx; + font-weight: bold; + } + + .goods_list { + .goods_item { + position: relative; + .goods_count { + position: absolute; + right: 20rpx; + bottom: 20rpx; + } + } + } } - .goods_list { - .goods_item { - position: relative; - .goods_count { - position: absolute; - right: 20rpx; - bottom: 20rpx; - } +.bottom { + height: 83rpx; + position: fixed; + bottom: 0; + left: 0; + right: 0; + background-color: #fff; + border-top: 1rpx solid #ddd; + display: flex; + align-items: center; + padding: 0 20rpx; + + .price { + font-size: 28rpx; + flex: 1; + } + + .bottom_btn { + font-size: 22rpx; + width: 150rpx; + height: 52rpx; + border-radius: 26rpx; + color: #fff; + background-color: #ea4350; + display: flex; + justify-content: center; + align-items: center; + &.disabled { + background-color: #ccc; } } }