购物车修改

This commit is contained in:
GaoHao
2024-09-27 15:28:37 +08:00
parent 587fa3a620
commit a3e1d951e6
10 changed files with 4528 additions and 845 deletions

View File

@@ -54,7 +54,6 @@
watch: {
forceUpdate(val,oldval) {
// 在 forceUpdate 改变时执行更新操作
console.log(val,oldval)
let time = uni.cache.get('popUpTime') ? new Date().getTime() - uni.cache.get('popUpTime') : 1000;
if ( time >= 1000 ) {
uni.cache.set('popUpTime', new Date().getTime())

View File

@@ -13,7 +13,6 @@ uni.pro.uploadFile = (obj) => {
uni.pro.navigateTo = (pageName, extras = {}) => {
let url = uni.url.getUrl(pageName, extras)
console.log(url)
return uni.navigateTo({
url
})

View File

@@ -0,0 +1,353 @@
<template>
<viwe>
<u-popup :show="showCart" :round="20" :safeAreaInsetBottom="false" :zIndex="98" :overlayStyle="{ zIndex: 98 }"
@close="close">
<view class="cart-list-wrap">
<view class="cart-header flex-between">
<view class="num">已点 {{cartLists_count}} </view>
<view class="clear" @click="cartclear">
<u-icon name="trash" color="#999"></u-icon>
<text class="t">清空</text>
</view>
</view>
<scroll-view scroll-y class="scroll-view">
<view class="list-wrap">
<view class="shop-item" v-for="(item,index) in cartLists.data" :key="item.id">
<view class="shop-item-content">
<view class="cover" v-if="item.productId!=-999">
<u-image :src="item.coverImg" width="120" height="120"></u-image>
</view>
<view class="info">
<view class="name"> {{ item.name }} </view>
<view class="select-sku-wrap"> {{ item.skuName }} </view>
<view class="price-wrap" style="padding-top: 0;">
<view class="price">
<text class="i"></text>
<text class="num">{{ item.salePrice }}</text>
</view>
<view class="operation-wrap">
<view class="btn" v-if="item.number&&item.productId!=-999" >
<u-icon name="minus-circle-fill" size="50"></u-icon>
<view class="btnClick" @click="cartListadd(item,index,'-')"></view>
</view>
<text class="num" v-if="item.number">{{ item.number }}</text>
<view class="btn" v-if="item.productId!=-999">
<u-icon name="plus-circle-fill" :color="item.isVip == 1 ? '#CECECE' : '#E9AB7A'" size="50"></u-icon>
<view class="btnClick" @click="cartListadd(item,index,'+')"></view>
</view>
</view>
</view>
</view>
</view>
<view class="shop-item-remark">
<view class="label">备注</view>
<u--input
placeholder="商品备注(选填)"
border="none"
v-model="item.note"
@blur="productBlur(item)"
></u--input>
</view>
</view>
</view>
</scroll-view>
</view>
</u-popup>
</viwe>
</template>
<script>
export default {
data() {
return {
}
},
props:{
cartLists:{
type: Object
},
cartLists_count: {
type: String
},
showCart:{
type: Boolean
},
shopId:{
type: String
},
tableCode:{
type: String
}
},
mounted() {
},
methods: {
close () {
this.$emit("close",false)
},
/**
* 购物车加减
* @param {Object} item
* @param {Object} index
* @param {Object} a
*/
async cartListadd(item, index, c) {
try {
if ( c == "+" && item.isVip == 1){
return;
}
let params = {
"skuId": item.skuId,
"num": c == '+' ? item.number + 1 : item.number - 1, //数量
"type": c == '+' ? 1 : 0,
"isVip": item.isVip,
"productId": item.productId, //商品id
"note": item.note,
"shopId": this.shopId,
"userId": uni.cache.get('userInfo').id,
"tableId": this.tableCode,
}
this.addCart(params);
} catch (e) {
//TODO handle the exception
}
},
/**
* 菜品备注修改
*/
productBlur ( item ) {
let params = {
"skuId": item.skuId,
"num": item.number, //数量
"type": item.type,
"isVip": item.isVip,
"productId": item.productId, //商品id
"note": item.note,
"shopId": this.shopId,
"userId": uni.cache.get('userInfo').id,
"tableId": this.tableCode,
}
this.addCart(params);
},
/**
* 添加到购物车
*/
async addCart(data) {
let res = await this.api.cartAdd(data)
if (res.code == 0) {
this.showShopsku = false;
this.pagemetashow = false;
// this.$set(this, 'amountcartNumber', 0)
}
},
/**
* 清空购物车
*/
async cartclear() {
let res = await this.api.cleanCart({
"shopId": this.shopId,
"tableId": this.tableCode,
})
},
}
}
</script>
<style lang="scss">
.cart-list-wrap {
.cart-header {
display: flex;
height: 72rpx;
background-color: #F2F2F2;
align-items: center;
justify-content: space-between;
padding: 20upx $paddingSize;
border-radius: 20upx 20upx 0 0;
.num {
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
.clear {
display: flex;
align-items: center;
.t {
font-size: 24upx;
color: #999;
margin-left: 4upx;
}
}
}
.scroll-view {
max-height: 50vh;
margin-bottom: 190rpx;
}
.list-wrap {
padding: $paddingSize 0 0 $paddingSize;
}
.shop-item {
display: flex;
flex-direction: column;
padding-bottom: $paddingSize;
.shop-item-content{
display: flex;
}
.shop-item-remark{
display: flex;
align-items: center;
padding-right: 180rpx;
margin-top: 10rpx;
.label{
font-size: 28rpx;
color: #666;
margin-right: 20rpx;
}
}
.langcover {
position: relative;
}
.langcover::after {
content: '加载中..';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background-color: #e8e8e8;
color: #6b6b6b;
border-radius: 10rpx;
text-align: center;
line-height: 180rpx;
z-index: 1;
}
.info {
flex: 1;
padding-left: 20upx;
padding-right: $paddingSize;
.name {
font-size: 28upx;
font-weight: bold;
color: #333;
margin-bottom: 5rpx;
}
.select-sku-wrap {
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
.price-wrap {
margin-top: 16rpx;
display: flex;
align-items: center;
justify-content: space-between;
.price {
display: flex;
align-items: flex-end;
.i,
.num {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.i {
position: relative;
bottom: 4upx;
}
.num {}
}
.sku-wrap {
padding: 6upx 16upx;
background-color: $color-priamry;
border-radius: 12upx;
display: flex;
align-items: center;
justify-content: center;
position: relative;
.t {
font-size: 24upx;
font-weight: bold;
}
.dot {
display: flex;
align-items: center;
justify-content: center;
font-size: 20upx;
position: absolute;
padding: 2upx 12upx;
border-radius: 8upx;
background-color: $numColor;
color: #fff;
position: absolute;
top: -14upx;
right: -8upx;
}
}
.operation-wrap {
display: flex;
align-items: center;
.num {
font-size: 32upx;
padding: 0 16upx;
}
.btn {
position: relative;
display: flex;
align-items: center;
justify-content: center;
position: relative;
.btnClick{
width: 100rpx;
height: 100rpx;
position: absolute;
// bottom: 0;
}
.btnClick.l{
right: 0;
}
.btnClick.r{
left: 0;
}
}
}
}
}
}
}
</style>

View File

@@ -0,0 +1,189 @@
<template>
<view class="cart-wrap" v-if="cartListsdatashow">
<view class="cart-content">
<view class="left">
<view class="iconBox">
<image class="icon"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/shopDetails/shopIcon.png"
mode="aspectFill" @click="isOpen">
</image>
<text class="u-badge"> {{cartLists_count<99?cartLists_count:'99+'}} </text>
</view>
<text class="i"></text>
<text class="num">{{cartLists.amount||'0.00'}}</text>
</view>
<view class="btn" @tap="orderdetail">
<text class="t">去结算</text>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
orderdetailFlag: true,
}
},
props:{
cartListsdatashow: {
type: Boolean
},
cartLists_count: {
type: String
},
storeInfo:{
type: Object
},
cartLists:{
type: Object
},
showCart:{
type: Boolean
},
shopId:{
type: String
},
dinersNum:{
type: String
},
tableCode:{
type: String
},
},
mounted() {
},
methods: {
/**
* 显示购物车
*/
isOpen () {
this.$emit("isOpen",!this.showCart)
},
/**
* 结算直接生成订单
*/
orderdetail() {
if (!this.orderdetailFlag) {
return;
}
this.orderdetailFlag = false;
if (this.cartLists.data.length == 0) {
uni.showToast({
title: '请先添加商品',
icon: 'none'
})
return false
}
uni.navigateTo({
url: `/pagesOrder/confirm_order/index?storeInfo=${encodeURIComponent(JSON.stringify(this.storeInfo))}&cartLists=${JSON.stringify(this.cartLists)}&tableCode=${this.tableCode||''}&dinersNum=${this.dinersNum||''}`
});
},
}
}
</script>
<style lang="scss">
.cart-wrap {
width: 100%;
padding: 0 20rpx;
box-sizing: border-box;
position: fixed;
bottom: 40rpx;
left: 0;
z-index: 99;
.cart-content {
display: flex;
align-items: center;
height: 128rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 20rpx 2rpx rgba(0, 0, 0, 0.15);
border-radius: 58rpx;
padding: 0 36rpx;
box-sizing: border-box;
.left {
flex: 1;
display: flex;
align-items: center;
position: relative;
.iconBox {
position: relative;
}
.icon {
width: 76rpx;
height: 88rpx;
margin-left: 22rpx;
}
.u-badge {
position: absolute;
top: -30rpx;
right: -30rpx;
background-color: #FF4B33;
color: #fff;
border-radius: 58rpx;
padding: 5rpx 14rpx;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
font-size: 20rpx;
}
.i,
.num {
color: #333;
}
.i {
font-size: 20upx;
position: relative;
top: 4upx;
margin-left: 64rpx;
}
.num {
font-size: 42upx;
font-weight: bold;
}
}
.btn {
height: 100%;
width: 40%;
display: flex;
align-items: center;
justify-content: flex-end;
.t {
width: 160rpx;
height: 64rpx;
line-height: 64rpx;
text-align: center;
background: #E7AE7B;
border-radius: 36rpx 36rpx 36rpx 36rpx;
border: 2rpx solid #E8AD7B;
font-weight: bold;
font-size: 28rpx;
color: #FFFFFF;
}
}
}
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -206,85 +206,14 @@
</view>
</view>
<!-- 购物车悬浮条 -->
<view class="cart-wrap" v-if="cartListsdatashow">
<view class="cart-content">
<view class="left">
<view class="iconBox">
<image class="icon"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/shopDetails/shopIcon.png"
mode="aspectFill" @click="showCart = !showCart">
</image>
<text class="u-badge"> {{cartLists_count<99?cartLists_count:'99+'}} </text>
</view>
<text class="i"></text>
<text class="num">{{cartLists.amount||'0.00'}}</text>
</view>
<view class="btn" @tap="orderdetail">
<text class="t">去结算</text>
</view>
</view>
</view>
<view class="placedOrderTip" @click="placedOrder" v-if="tableCode&&shopInfo.shopTableInfo&&shopInfo.shopTableInfo.orderId&&shopInfo.storeInfo.registerType == 'restaurant'"><u-avatar :src="src" shape="circle"></u-avatar><view style="margin-left: 8rpx;">已下单菜品</view></view>
<!-- 购物车 -->
<u-popup :show="showCart" :round="20" :safeAreaInsetBottom="false" :zIndex="98" :overlayStyle="{ zIndex: 98 }"
@close="showCart = false">
<view class="cart-list-wrap">
<view class="cart-header flex-between">
<view class="num">已点 {{cartLists_count}} </view>
<view class="clear" @click="cartclear">
<u-icon name="trash" color="#999"></u-icon>
<text class="t">清空</text>
</view>
</view>
<scroll-view scroll-y class="scroll-view">
<view class="list-wrap">
<view class="shop-item" v-for="(item,index) in cartLists.data" :key="item.id">
<view class="shop-item-content">
<view class="cover">
<u-image :src="item.coverImg" width="120" height="120"></u-image>
</view>
<view class="info">
<view class="name"> {{ item.name }} </view>
<view class="select-sku-wrap"> {{ item.skuName }} </view>
<view class="price-wrap" style="padding-top: 0;">
<view class="price">
<text class="i"></text>
<text class="num">{{ item.salePrice }}</text>
</view>
<view class="operation-wrap">
<view class="btn" v-if="item.number" >
<u-icon name="minus-circle-fill" size="50"></u-icon>
<view class="btnClick" @click="cartListadd(item,index,'-')"></view>
</view>
<text class="num" v-if="item.number">{{ item.number }}</text>
<view class="btn">
<u-icon name="plus-circle-fill" :color="item.isVip == 1 ? '#CECECE' : '#E9AB7A'" size="50"></u-icon>
<view class="btnClick" @click="cartListadd(item,index,'+')"></view>
</view>
</view>
</view>
</view>
</view>
<view class="shop-item-remark">
<view class="label">备注</view>
<u--input
placeholder="商品备注(选填)"
border="none"
v-model="item.note"
@blur="productBlur(item)"
></u--input>
</view>
</view>
</view>
</scroll-view>
</view>
</u-popup>
<shoppingCart ref="shoppingCart" :shopId="shopId" :tableCode="tableCode" :cartLists_count="cartLists_count" :cartLists="cartLists" :showCart="showCart" @addCart="addCart" @close="close"></shoppingCart>
<!-- 购物车结算 -->
<shoppingCartBilling ref="shoppingCartBilling" :cartListsdatashow="cartListsdatashow" :shopId="shopId" :tableCode="tableCode" :dinersNum="dinersNum" :storeInfo="shopInfo.storeInfo" :cartLists_count="cartLists_count" :cartLists="cartLists" :showCart="showCart" @isOpen="isOpen"></shoppingCartBilling>
<view class="placedOrderTip" @click="placedOrder" v-if="tableCode&&shopInfo.shopTableInfo&&shopInfo.shopTableInfo.orderId&&shopInfo.storeInfo.registerType == 'restaurant'"><u-avatar :src="src" shape="circle"></u-avatar><view style="margin-left: 8rpx;">已下单菜品</view></view>
<!-- 店铺详情 -->
<u-popup :show="showShopInfo" :round="20" mode="bottom" @close="showShopInfo = false" height="500">
@@ -399,10 +328,14 @@
import navseat from '@/components/navseat.vue'
import webSocketUtils from '@/common/js/websocket.js';
import popupad from '@/components/popupad.vue'
import shoppingCart from './components/shoppingCart.vue'
import shoppingCartBilling from './components/shoppingCartBilling.vue'
export default {
components: {
navseat,
popupad
popupad,
shoppingCart,
shoppingCartBilling
},
data() {
return {
@@ -437,7 +370,6 @@
showCart: false,
lastbottom: '', //元素最低端的距离
scrollxleft: true,
orderdetailFlag: true,
forceUpdate: false,
shopExtend: null,
shopId: null,
@@ -472,7 +404,6 @@
}
},
onLoad(e) {
console.log(e)
if (e.q) {
this.tableCode = this.getQueryString(decodeURIComponent(e.q), 'code')
uni.cache.set('tableCode', this.tableCode)
@@ -503,7 +434,6 @@
},
async onShow() {
let _this = this;
this.orderdetailFlag = true;
uni.pageScrollTo({
scrollTop: 0,
@@ -727,7 +657,7 @@
}
}
},
/**
* 添加购物车
*/
@@ -759,55 +689,24 @@
"userId": uni.cache.get('userInfo').id,
"tableId": this.tableCode,
}
this.addCart(params)
},
/**
* 购物车加减
* @param {Object} item
* @param {Object} index
* @param {Object} a
*/
async cartListadd(item, index, c) {
try {
if ( c == "+" && item.isVip == 1){
return;
}
let params = {
"skuId": item.skuId,
"num": c == '+' ? item.number + 1 : item.number - 1, //数量
"type": c == '+' ? 1 : 0,
"isVip": item.isVip,
"productId": item.productId, //商品id
"note": item.note,
"shopId": this.shopId,
"userId": uni.cache.get('userInfo').id,
"tableId": this.tableCode,
}
this.addCart(params);
} catch (e) {
//TODO handle the exception
}
this.addCart(params);
},
/**
* 菜品备注修改
* 关闭购物车
*/
productBlur ( item ) {
let params = {
"skuId": item.skuId,
"num": item.number, //数量
"type": item.type,
"isVip": item.isVip,
"productId": item.productId, //商品id
"note": item.note,
"shopId": this.shopId,
"userId": uni.cache.get('userInfo').id,
"tableId": this.tableCode,
}
this.addCart(params);
close (e) {
this.showCart = e;
},
/**
* 显示购物车
*/
isOpen (e) {
this.showCart = e;
},
/**
* 添加到购物车
*/
@@ -816,21 +715,9 @@
if (res.code == 0) {
this.showShopsku = false;
this.pagemetashow = false;
// this.$set(this, 'amountcartNumber', 0)
}
},
/**
* 清空购物车
*/
async cartclear() {
let res = await this.api.cleanCart({
"shopId": this.shopId,
"tableId": this.tableCode,
})
},
/**
* 商品数量\购物车数量处理
*/
@@ -1053,6 +940,7 @@
})
this.salePrice = res.data.salePrice // 价格
let data = null;
console.log(a)
if (a == 1) { //1添加购物车 2是websocket返回这个商品的价格(应为不同的多规格商品返回不同的价格)
let params = {
"skuId": res.data.id,
@@ -1065,6 +953,7 @@
"userId": uni.cache.get('userInfo').id,
"tableId": this.tableCode,
}
//添加到购物车
this.addCart(params);
} else {
this.skuId = res.data.id;
@@ -1085,26 +974,6 @@
} catch (e) {}
},
/**
* 结算直接生成订单
*/
orderdetail() {
if (!this.orderdetailFlag) {
return;
}
this.orderdetailFlag = false;
if (this.cartLists.data.length == 0) {
uni.showToast({
title: '请先添加商品',
icon: 'none'
})
return false
}
uni.navigateTo({
url: `/pagesOrder/confirm_order/index?storeInfo=${encodeURIComponent(JSON.stringify(this.shopInfo.storeInfo))}&cartLists=${JSON.stringify(this.cartLists)}&tableCode=${this.tableCode||''}&dinersNum=${this.dinersNum||''}`
});
},
/**
* 商家信息显示
@@ -1118,7 +987,6 @@
* @param {Object} msg
*/
getMessage(msg) { //wss 回显数据
console.log(msg)
if (msg == 1) { // 网络在连接
this.fixedtrue = true
return false
@@ -1770,280 +1638,9 @@
}
}
.cart-wrap {
width: 100%;
padding: 0 20rpx;
box-sizing: border-box;
position: fixed;
bottom: 40rpx;
left: 0;
z-index: 99;
.cart-content {
display: flex;
align-items: center;
height: 128rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 20rpx 2rpx rgba(0, 0, 0, 0.15);
border-radius: 58rpx;
padding: 0 36rpx;
box-sizing: border-box;
.left {
flex: 1;
display: flex;
align-items: center;
position: relative;
.iconBox {
position: relative;
}
.icon {
width: 76rpx;
height: 88rpx;
margin-left: 22rpx;
}
.u-badge {
position: absolute;
top: -30rpx;
right: -30rpx;
background-color: #FF4B33;
color: #fff;
border-radius: 58rpx;
padding: 5rpx 14rpx;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
font-size: 20rpx;
}
.i,
.num {
color: #333;
}
.i {
font-size: 20upx;
position: relative;
top: 4upx;
margin-left: 64rpx;
}
.num {
font-size: 42upx;
font-weight: bold;
}
}
.btn {
height: 100%;
width: 40%;
display: flex;
align-items: center;
justify-content: flex-end;
.t {
width: 160rpx;
height: 64rpx;
line-height: 64rpx;
text-align: center;
background: #E7AE7B;
border-radius: 36rpx 36rpx 36rpx 36rpx;
border: 2rpx solid #E8AD7B;
font-weight: bold;
font-size: 28rpx;
color: #FFFFFF;
}
}
}
}
.cart-list-wrap {
.cart-header {
display: flex;
height: 72rpx;
background-color: #F2F2F2;
align-items: center;
justify-content: space-between;
padding: 20upx $paddingSize;
border-radius: 20upx 20upx 0 0;
.num {
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
.clear {
display: flex;
align-items: center;
.t {
font-size: 24upx;
color: #999;
margin-left: 4upx;
}
}
}
.scroll-view {
max-height: 50vh;
margin-bottom: 190rpx;
}
.list-wrap {
padding: $paddingSize 0 0 $paddingSize;
}
.shop-item {
display: flex;
flex-direction: column;
padding-bottom: $paddingSize;
.shop-item-content{
display: flex;
}
.shop-item-remark{
display: flex;
align-items: center;
padding-right: 180rpx;
margin-top: 10rpx;
.label{
font-size: 28rpx;
color: #666;
margin-right: 20rpx;
}
}
.langcover {
position: relative;
}
.langcover::after {
content: '加载中..';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background-color: #e8e8e8;
color: #6b6b6b;
border-radius: 10rpx;
text-align: center;
line-height: 180rpx;
z-index: 1;
}
.info {
flex: 1;
padding-left: 20upx;
padding-right: $paddingSize;
.name {
font-size: 28upx;
font-weight: bold;
color: #333;
margin-bottom: 5rpx;
}
.select-sku-wrap {
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
.price-wrap {
margin-top: 16rpx;
display: flex;
align-items: center;
justify-content: space-between;
.price {
display: flex;
align-items: flex-end;
.i,
.num {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.i {
position: relative;
bottom: 4upx;
}
.num {}
}
.sku-wrap {
padding: 6upx 16upx;
background-color: $color-priamry;
border-radius: 12upx;
display: flex;
align-items: center;
justify-content: center;
position: relative;
.t {
font-size: 24upx;
font-weight: bold;
}
.dot {
display: flex;
align-items: center;
justify-content: center;
font-size: 20upx;
position: absolute;
padding: 2upx 12upx;
border-radius: 8upx;
background-color: $numColor;
color: #fff;
position: absolute;
top: -14upx;
right: -8upx;
}
}
.operation-wrap {
display: flex;
align-items: center;
.num {
font-size: 32upx;
padding: 0 16upx;
}
.btn {
position: relative;
display: flex;
align-items: center;
justify-content: center;
position: relative;
.btnClick{
width: 100rpx;
height: 100rpx;
position: absolute;
// bottom: 0;
}
.btnClick.l{
right: 0;
}
.btnClick.r{
left: 0;
}
}
}
}
}
}
}
.placedOrderTip{
width: 200rpx;
height: 60rpx;

File diff suppressed because it is too large Load Diff

View File

@@ -90,83 +90,11 @@
</view>
</view>
<!-- 购物车悬浮条 -->
<view class="cart-wrap" v-if="cartListsdatashow">
<view class="cart-content">
<view class="left">
<view class="iconBox">
<image class="icon"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/shopDetails/shopIcon.png"
mode="aspectFill" @click="showCart = !showCart">
</image>
<text class="u-badge"> {{cartLists_count<99?cartLists_count:'99+'}} </text>
</view>
<text class="i"></text>
<text class="num">{{cartLists.amount||'0.00'}}</text>
</view>
<view class="btn" @tap="orderdetail">
<text class="t">去结算</text>
</view>
</view>
</view>
<!-- 购物车 -->
<u-popup :show="showCart" :round="20" :safeAreaInsetBottom="false" :zIndex="98" :overlayStyle="{ zIndex: 98 }"
@close="showCart = false">
<view class="cart-list-wrap">
<view class="cart-header flex-between">
<view class="num">已点 {{cartLists_count}} </view>
<view class="clear" @click="cartclear">
<u-icon name="trash" color="#999"></u-icon>
<text class="t">清空</text>
</view>
</view>
<scroll-view scroll-y class="scroll-view">
<view class="list-wrap">
<view class="shop-item" v-for="(item,index) in cartLists.data" :key="item.id">
<view class="shop-item-content">
<view class="cover">
<u-image :src="item.coverImg" width="120" height="120"></u-image>
</view>
<view class="info">
<view class="name"> {{ item.name }} </view>
<view class="select-sku-wrap"> {{ item.skuName }} </view>
<view class="price-wrap" style="padding-top: 0;">
<view class="price">
<text class="i"></text>
<text class="num">{{ item.salePrice }}</text>
</view>
<view class="operation-wrap">
<view class="btn" v-if="item.number" >
<u-icon name="minus-circle-fill" color="#E9AB7A" size="50"></u-icon>
<view class="btnClick" @click="cartListadd(item,'-')"></view>
</view>
<text class="num" v-if="item.number">{{ item.number }}</text>
<view class="btn">
<u-icon name="plus-circle-fill" :color="item.isVip == 1 ? '#CECECE' : '#E9AB7A'" size="50"></u-icon>
<view class="btnClick" @click="cartListadd(item,'+')"></view>
</view>
</view>
</view>
</view>
</view>
<view class="shop-item-remark">
<view class="label">备注</view>
<u--input
placeholder="商品备注(选填)"
border="none"
v-model="item.remark"
></u--input>
</view>
</view>
</view>
</scroll-view>
</view>
</u-popup>
<shoppingCart ref="shoppingCart" :shopId="shopId" :tableCode="tableCode" :cartLists_count="cartLists_count" :cartLists="cartLists" :showCart="showCart" @addCart="addCart" @close="close"></shoppingCart>
<!-- 购物车结算 -->
<shoppingCartBilling ref="shoppingCartBilling" :cartListsdatashow="cartListsdatashow" :shopId="shopId" :tableCode="tableCode" :storeInfo="shopInfo.storeInfo" :cartLists_count="cartLists_count" :cartLists="cartLists" :showCart="showCart" @isOpen="isOpen"></shoppingCartBilling>
<!-- 规格 -->
@@ -241,9 +169,13 @@
<script>
import navseat from '@/components/navseat.vue'
import webSocketUtils from '@/common/js/websocket.js';
import shoppingCart from './components/shoppingCart.vue'
import shoppingCartBilling from './components/shoppingCartBilling.vue'
export default {
components: {
navseat
navseat,
shoppingCart,
shoppingCartBilling
},
data() {
return {
@@ -486,37 +418,23 @@
"userId": uni.cache.get('userInfo').id,
"tableId": uni.cache.get('tableCode'),
}
this.addCart(params)
this.addCart(params);
},
/**
* 购物车加减
* @param {Object} item
* @param {Object} index
* @param {Object} a
* 关闭购物车
*/
async cartListadd(item, c) {
try {
if ( c == "+" && item.isVip == 1){
return;
}
let params = {
"skuId": item.skuId,
"num": c == '+' ? item.number + 1 : item.number - 1, //数量
"type": c == '+' ? 1 : 0,
"isVip": item.isVip,
"productId": item.productId, //商品id
"shopId": this.shopId,
"userId": uni.cache.get('userInfo').id,
"tableId": uni.cache.get('tableCode'),
}
this.addCart(params);
} catch (e) {
//TODO handle the exception
}
close (e) {
this.showCart = e;
},
/**
* 显示购物车
*/
isOpen (e) {
this.showCart = e;
},
/**
* 添加到购物车
*/
@@ -525,21 +443,9 @@
if (res.code == 0) {
this.showShopsku = false;
this.pagemetashow = false;
// this.$set(this, 'amountcartNumber', 0)
}
},
/**
* 清空购物车
*/
async cartclear() {
let res = await this.api.cleanCart({
"shopId": this.shopId,
"tableId": uni.cache.get('tableCode'),
})
},
/**
* 商品数量\购物车数量处理
*/
@@ -1284,281 +1190,7 @@
}
}
.cart-wrap {
width: 100%;
padding: 0 20rpx;
box-sizing: border-box;
position: fixed;
bottom: 40rpx;
left: 0;
z-index: 99;
.cart-content {
display: flex;
align-items: center;
height: 128rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 20rpx 2rpx rgba(0, 0, 0, 0.15);
border-radius: 58rpx;
padding: 0 36rpx;
box-sizing: border-box;
.left {
flex: 1;
display: flex;
align-items: center;
position: relative;
.iconBox {
position: relative;
}
.icon {
width: 76rpx;
height: 88rpx;
margin-left: 22rpx;
}
.u-badge {
position: absolute;
top: -30rpx;
right: -30rpx;
background-color: #FF4B33;
color: #fff;
border-radius: 58rpx;
padding: 5rpx 14rpx;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
font-size: 20rpx;
}
.i,
.num {
color: #333;
}
.i {
font-size: 20upx;
position: relative;
top: 4upx;
margin-left: 64rpx;
}
.num {
font-size: 42upx;
font-weight: bold;
}
}
.btn {
height: 100%;
width: 40%;
display: flex;
align-items: center;
justify-content: flex-end;
.t {
width: 160rpx;
height: 64rpx;
line-height: 64rpx;
text-align: center;
background: #E7AE7B;
border-radius: 36rpx 36rpx 36rpx 36rpx;
border: 2rpx solid #E8AD7B;
font-weight: bold;
font-size: 28rpx;
color: #FFFFFF;
}
}
}
}
.cart-list-wrap {
.cart-header {
display: flex;
height: 72rpx;
background-color: #F2F2F2;
align-items: center;
justify-content: space-between;
padding: 20upx $paddingSize;
border-radius: 20upx 20upx 0 0;
.num {
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
.clear {
display: flex;
align-items: center;
.t {
font-size: 24upx;
color: #999;
margin-left: 4upx;
}
}
}
.scroll-view {
max-height: 50vh;
margin-bottom: 190rpx;
}
.list-wrap {
padding: $paddingSize 0 0 $paddingSize;
}
.shop-item {
display: flex;
flex-direction: column;
padding-bottom: $paddingSize;
.shop-item-content{
display: flex;
}
.shop-item-remark{
display: flex;
align-items: center;
padding-right: 180rpx;
margin-top: 10rpx;
.label{
font-size: 28rpx;
color: #666;
margin-right: 20rpx;
}
}
.langcover {
position: relative;
}
.langcover::after {
content: '加载中..';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background-color: #e8e8e8;
color: #6b6b6b;
border-radius: 10rpx;
text-align: center;
line-height: 180rpx;
z-index: 1;
}
.info {
flex: 1;
padding-left: 20upx;
padding-right: $paddingSize;
.name {
font-size: 28upx;
font-weight: bold;
color: #333;
margin-bottom: 5rpx;
}
.select-sku-wrap {
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
.price-wrap {
margin-top: 16rpx;
display: flex;
align-items: center;
justify-content: space-between;
.price {
display: flex;
align-items: flex-end;
.i,
.num {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.i {
position: relative;
bottom: 4upx;
}
.num {}
}
.sku-wrap {
padding: 10rpx 20rpx;
background-color: $color-priamry;
border-radius: 12upx;
display: flex;
align-items: center;
justify-content: center;
position: relative;
.t {
font-size: 24upx;
font-weight: bold;
}
.dot {
display: flex;
align-items: center;
justify-content: center;
font-size: 20upx;
position: absolute;
padding: 2upx 12upx;
border-radius: 8upx;
background-color: $numColor;
color: #fff;
position: absolute;
top: -14upx;
right: -8upx;
}
}
.operation-wrap {
display: flex;
align-items: center;
.num {
font-size: 32upx;
padding: 0 16upx;
}
.btn {
position: relative;
display: flex;
align-items: center;
justify-content: center;
position: relative;
.btnClick{
width: 100rpx;
height: 100rpx;
position: absolute;
// bottom: 0;
}
.btnClick.l{
right: 0;
}
.btnClick.r{
left: 0;
}
}
}
}
}
}
}
}

View File

@@ -232,7 +232,6 @@
},
},
onUnload() {
console.log(this)
if (this.socketTicket) {
this.socketTicket.Close()
uni.$off('message')
@@ -248,7 +247,6 @@
onLoad(e) {
console.log(e)
this.storeInfo = JSON.parse(decodeURIComponent(e.storeInfo));
console.log(this.storeInfo)
this.shopId =this.storeInfo.shopId;
this.listinfo.name = this.storeInfo.shopName;
this.listinfo.details = JSON.parse(e.cartLists).data;
@@ -269,7 +267,6 @@
}
},
onShow() {
console.log(this.listinfoid)
if (this.listinfoid) {
uni.$on('message', this.getMessage)
this.orderorderInfo()
@@ -286,7 +283,6 @@
scan () {
uni.scanCode({
success: (res) => {
console.log(res)
this.tableCode = this.getQueryString(decodeURIComponent(res.result), 'code')
if (this.tableCode) {
this.getProductqueryShop();
@@ -298,6 +294,10 @@
})
},
/**
* 获取店铺信息。桌台信息
* @param {Object} tableCode
*/
async getProductqueryShop (tableCode) {
let params = {
lng: uni.cache.get('getLocationstorage').lng ? uni.cache.get('getLocationstorage').lng :
@@ -309,7 +309,6 @@
if (this.shopId) {params.shopId = this.shopId}
let res = await this.api.productqueryShop(params)
this.shopTableInfo = res.data.shopTableInfo;
console.log(res)
},
/**
@@ -337,7 +336,6 @@
* @param {Object} msg
*/
getMessage(msg) {
console.log(msg)
if (msg == 1) { // 网络在连接
return false
}
@@ -371,7 +369,6 @@
this.orderorderInfo(1)
break;
case 'addCart':
console.log("商品列表===",msg)
this.isSocket = true;
if (this.listinfoid) {
this.orderorderInfo()
@@ -425,7 +422,6 @@
* @param {Object} n
*/
groupChange(e) {
console.log(e)
this.radiovalue = e.type;
this.paymentBtnText = e.name;
},
@@ -464,7 +460,6 @@
"userId": uni.cache.get('userInfo').id,
})
if (res.code == 0) {
console.log("会员信息===",res)
this.amountVIP = res.data;
}
},
@@ -474,12 +469,10 @@
* @param {Object} i
*/
async orderorderInfo(i) {
console.log(this.listinfo)
let res = await this.api.orderorderInfo({
orderId: this.listinfoid
})
if (res.code == 0) {
console.log(res)
this.listinfo = res.data
if (i == 1) { //请求完了详情在去调支付
this.showpopupclickdd()
@@ -502,7 +495,6 @@
* 生成订单
*/
orderdetail() {
console.log(this.listinfo.details)
if (!this.isSocket) {
uni.showToast({
title: "当前网络异常,请稍后再试",
@@ -517,10 +509,7 @@
})
return;
}
let noteList = [];
this.listinfo.details.map((item)=>{
console.log(item)
})
let data = {
"skuId": '',
"num": '', //数量
@@ -544,7 +533,6 @@
* 去支付
*/
showpopupclickdd() {
console.log(this.radiovalue)
if ( this.radiovalue == 2 || this.radiovalue == 3 && this.listinfo.payAmount <= 0 ) {
uni.showToast({
title: "支付金额必须大于0",
@@ -566,7 +554,6 @@
this.goRecharge();
} else {
console.log(this.amountVIP)
if (uni.cache.get('userInfo').isPwd == 0) {
uni.navigateTo({
url: '/pages/member/setPassword?shopUserInfo=' + JSON.stringify(this.amountVIP)
@@ -680,7 +667,6 @@
*/
async accountPayevent(pwd) {
this.ispws = false;
console.log(pwd)
let res = await this.api.accountPay({
orderId: this.listinfoid,
memberId: this.amountVIP.id,

View File

@@ -42,7 +42,6 @@
};
},
onLoad(options) {
console.log(options)
this.tableCode = options.tableCode;
this.shopId = options.shopId;
},
@@ -55,7 +54,6 @@
* 切换桌型
*/
tabCut(index) {
console.log(index)
this.numIndex = index;
if ( index != -1) {
this.dinersNum = index+1;