下单页面调整,确认订单页面调整

This commit is contained in:
2025-04-28 11:29:32 +08:00
parent 94cc918357
commit 7c182023a5
39 changed files with 5725 additions and 275 deletions

View File

@@ -0,0 +1,474 @@
<template>
<view class="card_item">
<!-- <view class="head">
<view class="head_left">
<text class="placeNum">当前购物车</text>
</view>
</view> -->
<!-- 订单详情 -->
<view class="shop-info">
<view class="item" v-for="item in nowCarts" :key="item.id">
<view class="cover">
<up-image width="76" height="76" radius="16" :src="item.productImg"
v-if="item.productId!=-999"></up-image>
<up-image width="76" height="76" radius="16"
:src="'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/table.png'"
mode="heightFix" v-else></up-image>
</view>
<view class="info">
<text class="productName">{{item.productName}}</text>
<text class="productSkuName" v-if="item.skuName">{{item.skuName}}</text>
</view>
<view class="price">
<view class="priceAmount">
<text v-if="changeFreeenable">{{item.price}}</text>
<text v-else>
{{useVipPrice?(item.memberPrice|| item.price):item.price}}
</text>
</view>
<view class="num">x{{item.num}}</view>
</view>
</view>
</view>
<!--<view class="status" v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">未付款</view>
<view class="totalAmount">
<view class="label">小计</view>
<view class="price"> {{item.totalAmount}} </view>
</view> -->
<!-- <view class="semicircle_icon" v-if="index > 0">
<view class="semicircle_left_icon"></view>
<view class="semicircle_right_icon"></view>
</view> -->
</view>
</template>
<script setup>
import {
ref,
reactive,
defineProps,
computed,
defineEmits,
watch,
watchEffect,
defineExpose,
onMounted
} from 'vue'
const props = defineProps({
changeFreeenable: {
type: Boolean,
default: false
},
useVipPrice: {
type: Boolean,
default: false
},
nowCarts: {
type: Array,
default: () => {
return []
}
}
})
onMounted(() => {
console.log('props.nowCarts');
console.log(props.nowCarts);
})
</script>
<style lang="scss" scoped>
.card_item {
display: flex;
flex-direction: column;
position: relative;
padding: 0 34rpx;
.head {
display: flex;
justify-content: space-between;
// padding: 32rpx 0;
.head_left {
display: flex;
align-items: center;
.placeNum {
font-weight: bold;
font-size: 32rpx;
color: #333333;
margin-right: 32rpx;
flex-shrink: 0;
}
.placeTime {
font-weight: 400;
font-size: 32rpx;
color: #666666;
flex-shrink: 0;
}
}
}
.shop-info {
padding-top: 28rpx;
.item:nth-child(1) {
margin-top: 0;
}
.item {
margin-bottom: 32rpx;
display: flex;
&:last-child{
margin-bottom: 0;
}
.cover {}
.info {
flex: 1;
display: flex;
flex-direction: column;
padding-left: 16upx;
.productName {
font-weight: bold;
font-size: 28rpx;
color: #333333;
margin-top: 20rpx;
}
.productSkuName {
font-weight: 400;
font-size: 24rpx;
color: #999999;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
text-overflow: ellipsis;
}
.n {
font-size: 24upx;
color: #999;
}
}
.price {
display: flex;
flex-direction: column;
align-items: flex-end;
padding-left: 68rpx;
.priceAmount {
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin-top: 26rpx;
}
.num {
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin-top: 22rpx;
}
}
}
}
.status {
align-self: flex-end;
width: 92rpx;
height: 40rpx;
line-height: 40rpx;
text-align: center;
background: #999999;
border-radius: 10rpx 10rpx 10rpx 10rpx;
font-weight: 400;
font-size: 22rpx;
color: #FFFFFF;
margin-top: 32rpx;
}
.totalAmount {
width: 100%;
display: flex;
justify-content: flex-end;
align-items: flex-end;
padding: 32rpx 0;
border-bottom: 2rpx dashed #e5e5e5;
.label {
font-weight: bold;
font-size: 28rpx;
color: #333333;
}
.price {
font-weight: bold;
font-size: 36rpx;
color: #333333;
}
}
.semicircle_icon {
width: 100%;
position: absolute;
top: -22.5rpx;
left: 0;
display: flex;
justify-content: space-between;
.semicircle_left_icon {
width: 45rpx;
height: 45rpx;
margin-left: -22.5rpx;
background-color: #f9f9f9;
border-radius: 50%;
// box-shadow: inset -20rpx 0rpx 22rpx -20rpx rgba(87, 86, 86, 0.35);
}
.semicircle_right_icon {
width: 45rpx;
height: 45rpx;
margin-right: -22.5rpx;
background-color: #f9f9f9;
border-radius: 50%;
// box-shadow: inset 13rpx 0rpx 16rpx -9rpx rgba(87, 86, 86, 0.35);
}
}
}
.cell-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 32rpx 34rpx 0 34rpx;
.label {
font-weight: bold;
font-size: 32rpx;
color: #333333;
padding-bottom: 32rpx;
}
.val {
display: flex;
align-items: flex-end;
padding-bottom: 32rpx;
border-bottom: 2rpx dashed #e5e5e5;
view:nth-child(1) {
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin-right: 42rpx;
}
view:nth-child(2) {
display: flex;
align-items: flex-end;
font-weight: bold;
font-size: 36rpx;
color: #333333;
}
}
.val.column {
display: flex;
flex-direction: column;
.productCoupon {
display: flex;
align-items: flex-end;
margin: 0 0 10rpx 0;
.name {
font-weight: 400;
font-size: 26rpx;
color: #999;
margin: 0;
}
.num {
font-weight: 400;
font-size: 26rpx;
color: #999;
margin: 0 30rpx;
line-height: 20rpx;
}
.amount {
font-weight: bold;
font-size: 26rpx;
color: #333;
}
}
}
}
.favorable {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 30rpx;
box-sizing: border-box;
padding-bottom: 26rpx;
padding-top: 26rpx;
border-bottom: 2rpx solid #E5E5E5;
.favorable_left {
display: flex;
align-items: center;
.icon {
width: 40rpx;
height: 40rpx;
margin-right: 16rpx;
}
.name {
font-size: 28rpx;
font-weight: 400rpx;
color: #333;
}
}
.favorable_right {
display: flex;
align-items: center;
.favorable_right_text {
font-size: 24rpx;
color: #999;
font-weight: 400rpx;
}
}
.favorable_right {
.column {
display: flex;
flex-direction: column;
align-items: flex-end;
.favorable_right_text {
margin-bottom: 10rpx;
text:nth-child(1) {
font-size: 26rpx;
color: #999;
}
text:nth-child(2) {
font-size: 26rpx;
color: #999;
margin: 0 30rpx;
}
text:nth-child(3) {
font-size: 26rpx;
color: #333;
}
}
}
}
.favorable_right.column {
align-items: flex-start;
}
}
.favorable.column {
align-items: flex-start;
}
.cell-item.column {
align-items: flex-start;
}
.total-wrap {
width: 100%;
display: flex;
justify-content: flex-end;
align-items: flex-end;
padding: 0 34rpx;
font-weight: bold;
font-size: 28rpx;
color: #333333;
margin-top: 64rpx;
.price {
font-weight: bold;
font-size: 36rpx;
}
}
.order_footer {
display: flex;
flex-direction: column;
padding: 34rpx;
position: relative;
}
.fixedview {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
.flex-between {
width: 100%;
padding: 36rpx 54rpx 102rpx 54rpx;
background: #FFFFFF;
.fixedview_one {
display: flex;
align-items: flex-end;
.fixedview_oneone {
font-weight: 400;
font-size: 28rpx;
color: #666666;
}
.fixedview_onetow {
font-weight: bold;
font-size: 32rpx;
color: #333333;
text {
font-size: 24rpx;
}
}
}
.fixedview_tow {
width: 140rpx;
height: 56rpx;
line-height: 56rpx;
text-align: center;
background: #E3AD7F;
border-radius: 12rpx 12rpx 12rpx 12rpx;
font-weight: 400;
font-size: 28rpx;
color: #FFFFFF;
}
}
}
</style>

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,8 @@
<template>
</template>
<script>
</script>
<style>
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -164,12 +164,26 @@
if (!item.show) {
return false;
}
// 查找选中的数组里面 统计指定 id 的重复次数
const count = Selectedlist.value.filter(item => item.id === item.id).length;
if (item.Selected) {
Selectedlist.value = Selectedlist.value.filter(i => i.id !== item.id)
fromInfo.list[index].Selected = false
return
}
// 查找选中的数组里面 统计指定 id 的重复次数
const foundObject = mergedArray.value.find(i => i.productId === item.proId)
if (foundObject.num <= count) {
const canSelMaxNum = Orderinfo.shoppingCart.filter((v) => v.productId == item.proId).reduce((prve,
cur) => {
return prve + cur.num * 1
}, 0)
if (canSelMaxNum <= 0) {
uni.showToast({
title: '不可多余商品!',
icon: 'none'
})
return
}
// 查找选中的数组里面 统计指定 id 的重复次数
const count = Selectedlist.value.filter(v => v.couponId == item.couponId).length;
if (count >= canSelMaxNum) {
uni.showToast({
title: '不可多余商品!',
icon: 'none'
@@ -190,18 +204,14 @@
// return false;
// }
if (item.Selected) {
Selectedlist.value = Selectedlist.value.filter(i => i.id !== item.id)
} else {
// 筛查出最低价格
await productmethod()
const matchedItem = lowestPrices.value.find(cartItem => cartItem.productId == item.proId);
Selectedlist.value.push({
...item,
price: matchedItem.price,
memberPrice: matchedItem.memberPrice
})
}
// 筛查出最低价格
await productmethod()
const matchedItem = lowestPrices.value.find(cartItem => cartItem.productId == item.proId);
Selectedlist.value.push({
...item,
price: matchedItem.price,
memberPrice: matchedItem.memberPrice
})
fromInfo.list[index].Selected = !item.Selected
}
@@ -272,13 +282,14 @@
shopUserId: Orderinfo.shopUserId,
})
if (Orderinfo.typeOrder == 2 && res.length>0) {
if (Orderinfo.typeOrder == 2 && res.length > 0) {
res.forEach((item) => {
item.Selected = false
})
res = res.map(item => {
const matchedItem = Orderinfo.shoppingCart.find(cartItem => cartItem.productId == item
.proId);
const matchedItem = Orderinfo.shoppingCart.find(cartItem => {
return cartItem.productId == item.proId
});
const hasMatch = Boolean(matchedItem);
return {
...item,
@@ -336,7 +347,10 @@
Orderinfo.shopUserId = options.shopUserId
Orderinfo.payAmount = options.payAmount
console.log('coupon mounted');
console.log(Orderinfo.payAmount)
console.log(options);
console.log(JSON.parse(decodeURIComponent(options.shoppingCart)));
Orderinfo.shoppingCart = JSON.parse(decodeURIComponent(options.shoppingCart))
}
getCouponList()

View File

@@ -0,0 +1,22 @@
<template>
<view>
历史订单
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style>
</style>

View File

@@ -1,6 +1,7 @@
<template>
<view>
<up-popup :show="confirmordershow" :round="20" :safeAreaInsetBottom="false" :zIndex="105"
close-on-click-overlay
:overlayStyle="{ zIndex: 98 }" @close="close">
<!-- 头部内容 -->
<view class="container">

View File

@@ -19,7 +19,7 @@
</view>
<view class="flex-between" @click="cartclear">
<up-icon name="trash" color="#999" size="20"></up-icon>
<text class="t">清空购物车</text>
<text class="clear-btn">清空购物车</text>
</view>
</view>
@@ -65,7 +65,7 @@
<view class="operation-wrap">
<view class="btn">
<up-icon name="minus-circle-fill" size="25"></up-icon>
<up-icon color="#E8AD7B" name="minus-circle" size="25"></up-icon>
<view class="btnClick" @click="cartListadd(item,'-')"></view>
</view>
<text class="num">{{ ifcartNumber(item) }}</text>
@@ -73,7 +73,7 @@
<!-- <up-icon name="plus-circle-fill"
:color="{shopInfo.isVip ==1 && shopInfo.isMemberPrice==1? '#CECECE' : '#E9AB7A'"
size="25"></up-icon> -->
<up-icon name="plus-circle-fill" color="#E9AB7A"
<up-icon name="plus-circle-fill" color="#E8AD7B"
size="25"></up-icon>
<view class="btnClick" @click="cartListadd(item,'+')"></view>
</view>
@@ -83,56 +83,7 @@
</view>
</view>
</view>
<!-- 历史订单 -->
<view class="card" v-if="orderinfo.detailMap">
<!-- 订单头部 -->
<view class="cardcalorders flex-between">
<!-- ··· 历史订单 ··· -->
<text>待支付订单</text>
<view class="flex-start">
<up-icon name="trash" color="#999" size="20"></up-icon>
<text style="color:' #999;'" @click="clickcancelOrder('all')">清空历史订单</text>
</view>
</view>
<view class="card_item" v-for="(value, key) in orderinfo.detailMap" :key="key">
<view class="head">
<view class="head_left">
<text class="placeNum">{{key}}次下单</text>
<view class="placeTime flex-start">
<up-icon name="trash" color="#999"></up-icon>
<text class="t" @click="clickcancelOrder('Single',key)">清空</text>
</view>
</view>
</view>
<!-- 订单详情 -->
<view class="shop-info">
<view class="item" v-for="item in value" :key="item.id">
<view class="cover">
<up-image width="80" radius="10" height="80" :src="item.productImg"
v-if="item.productId!=-999"></up-image>
<up-image width="80" radius="10" height="80"
:src="'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/table.png'"
mode="heightFix" v-else></up-image>
</view>
<view class="info">
<text class="productName">{{item.productName}}</text>
<text class="productSkuName" v-if="item.skuName">{{item.skuName}}</text>
</view>
<view class="price">
<view class="priceAmount">
{{shopInfo.isVip ==1 && shopInfo.isMemberPrice==1?(item.memberPrice||item.price):item.price}}
</view>
<view class="num">x{{item.num}}</view>
</view>
</view>
</view>
<view class="semicircle_icon" v-if="index > 0">
<view class="semicircle_left_icon"></view>
<view class="semicircle_right_icon"></view>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
@@ -289,6 +240,11 @@
</script>
<style lang="scss">
.clear-btn{
color: #333;
font-size: 24rpx;
font-weight: 500;
}
.cart-list-wrap {
.cart-header {
display: flex;

View File

@@ -8,8 +8,13 @@
mode="aspectFill">
</image>
<view class="panelone flex-start">
<view>
{{ shopInfo.shopName }}
<view class="u-flex u-flex-y-center">
<text>
{{ shopInfo.shopName }}
</text>
<view class="u-flex u-flex-y-center u-m-t-4">
<up-icon name="arrow-right" color="#999999" size="14"></up-icon>
</view>
</view>
<!-- <up-icon name="arrow-right" color="#999999" size="14"></up-icon> -->
</view>
@@ -31,7 +36,8 @@
<view class="panelfour" v-if="shopProductList.hots && shopProductList.hots.length > 0">
本店招牌菜
</view>
<view class="panelfive">
<view class="panelfive ">
<scroll-view :scroll-x="true" :scroll-with-animation="false">
<view class="panelfive_list">
<view class="panelfiveitem" @click="clickspecifications(item,index,index,'热销')"
@@ -142,7 +148,7 @@
</view>
<!-- 滚动区域 -->
<view class="scroll-panel" id="scroll-panel" :class="{ 'grayscale':!isBusinessTime }">
<view class="scroll-panel " id="scroll-panel" :class="{ 'grayscale':!isBusinessTime }">
<view class="list-box">
<view class="left" :style="{top: `${store.height}px`}">
<scroll-view :scroll-into-view="leftIntoView" :scroll-with-animation="false" :scroll-y="true"
@@ -257,6 +263,8 @@
</view>
</view>
</view>
</view>
<confirmorder ref="confirmorderref" :cartLists_count="cartLists_count" :cartList="matchedProducts"
@@ -288,7 +296,7 @@
<text class="num">{{totalPrices}}</text>
</view>
<view class="btn" @tap="$u.debounce(orderdetail, 500)">
<text class="t">结算</text>
<text class="t">结算</text>
</view>
</view>
</view>
@@ -406,7 +414,10 @@
</view>
</view>
</up-popup>
<view class="history_order" @click="toHistory" v-if="shopInfo&&shopInfo.registerType == 'after'&&orderinfo.id">
<image class="img" src="@/static/history.png" mode=""></image>
<text>已下单菜品</text>
</view>
<Loading :isLoading="isLoading" />
</view>
</template>
@@ -1123,7 +1134,6 @@
shop_id: uni.cache.get('shopId')
}
}
const {
isConnected,
sendMessage,
@@ -1140,8 +1150,6 @@
// 提交订单显示
const confirmordershow = ref(false)
// 购物车数组
const cartList = ref([])
// 更新商品数量的方法
const updateProductQuantities = () => {
@@ -1195,6 +1203,7 @@
if (isDataLoaded.value && receivedMessages.value) {
const Message = receivedMessages.value
if (Message) {
console.log(Message.data);
// 心跳返回 过滤
if (Message.type == "ping_interval" || Message.msg_id == "ping_interval") {
isLoading.value = false;
@@ -1208,14 +1217,14 @@
// 初始化
if (Message.operate_type == "init") {
cartList.value = Message.data
cartStore.carts = Message.data
uni.hideLoading();
isLoading.value = false;
}
// 清空购物车
if (Message.operate_type == 'cleanup') {
cartList.value = []
cartStore.carts = []
setTimeout(() => {
Historicalorders()
}, 400)
@@ -1225,18 +1234,18 @@
// 删除除购物车
if (Message.operate_type == 'del' && Message.status == 1) {
// 优化:使用可选链操作符避免报错
cartList.value = cartList.value.filter(item => item.id !== Message.data?.id);
// cartList.value = cartList.value.filter(item => item.id != Message.data.id);
cartStore.carts = cartStore.carts.filter(item => item.id !== Message.data?.id);
// cartStore.carts = cartStore.carts.filter(item => item.id != Message.data.id);
}
// 添加或者减少购物后返回
if (Message.operate_type == 'add' || Message.operate_type == 'edit') {
[Message.data].forEach((objA) => {
const index = cartList.value.findIndex((objB) => objB.id == objA.id);
const index = cartStore.carts.findIndex((objB) => objB.id == objA.id);
if (index !== -1) {
cartList.value[index] = objA;
cartStore.carts[index] = objA;
} else {
cartList.value.push(objA);
cartStore.carts.push(objA);
}
});
}
@@ -1295,7 +1304,7 @@
// 更新购物车数据shopProductList.hots
const matchedProducts = computed(() => {
if (cartList.value.length > 0) {
if (cartStore.carts.length > 0) {
let Specialstop = null
try {
@@ -1308,7 +1317,7 @@
Specialstop = shopProductList.productInfo
//TODO handle the exception
}
return cartList.value.flatMap((cartItem) => {
return cartStore.carts.flatMap((cartItem) => {
for (const group of Specialstop) {
for (const product of group.productList) {
if (product.id == cartItem.product_id) {
@@ -1365,6 +1374,12 @@
// 结账
const orderdetail = async () => {
uni.navigateTo({
url: '/pages/order/confirm-order?tableCode=' + uni.cache.get('tableCode') + '&shopId=' + uni
.cache.get(
'shopId')
})
return
try {
await Historicalorders()
} catch (error) {}
@@ -1374,16 +1389,18 @@
// 历史订单
const Historicalorders = async (W) => {
let res = await APIhistoryOrder({
tableCode: uni.cache.get('tableCode'),
})
orderinfo.value = {
id: res.id,
detailMap: res.detailMap,
placeNum: res.placeNum
}
if (W) {
showCart.value = !showCart.value
} else {
let res = await APIhistoryOrder({
tableCode: uni.cache.get('tableCode'),
})
orderinfo.value = {
id: res.id,
detailMap: res.detailMap,
placeNum: res.placeNum
}
}
}
@@ -1449,7 +1466,7 @@
}
}, 0);
}
cart = parseFloat(cartone) + parseFloat(cart)
cart = parseFloat(cart)
// 向上取整并保留两位小数
return parseFloat(cart.toFixed(2));
});
@@ -1467,7 +1484,7 @@
return sum + num;
}, 0);
const totalCount = orderInfoCount + matchedProductsCount;
const totalCount = matchedProductsCount;
return parseFloat(totalCount.toFixed(2));
});
@@ -1499,7 +1516,7 @@
// 计算处理后的购物车列表 // 用于筛选后的购物车数组
const cartListFilter = computed(() => {
// 使用 reduce 方法对 cartList 进行处理
const grouped = cartList.value.reduce((acc, item) => {
const grouped = cartStore.carts.reduce((acc, item) => {
const productId = item.product_id;
const num = parseFloat(item.number);
@@ -1554,6 +1571,7 @@
// 列表请求
const productqueryProduct = async () => {
cartStore.goodsIsloading = false;
try {
shopProductList.hots = await productminiApphotsquery()
shopProductList.productInfo = await APIgroupquery()
@@ -1574,12 +1592,15 @@
product.cartNumber = 0;
product.isSaleTimeshow = await isProductAvailable(product.days, product
.startTime, product.endTime)
cartStore.setGoodsMap(product.id, product)
});
});
shopProductList.hots.forEach(async (i) => {
i.cartNumber = 0
i.isSaleTimeshow = await isProductAvailable(i.days, i.startTime, i.endTime)
cartStore.setGoodsMap(i.id, i)
})
cartStore.goodsIsloading = true;
scrollTopSize.value = 0
topArr.value = []
// userStore.actionsAPIuser()
@@ -1623,13 +1644,34 @@
const currentPage = pages[pages.length - 1];
// 获取页面参数
const options = currentPage.options;
let res = await APIhistoryOrder({
tableCode: uni.cache.get('tableCode'),
})
await productqueryProduct()
if (res && res.id && shopInfo.registerType == "after") {
toHistory()
return
}
setTimeout(() => {
// 启动网络监听
initNetworkListener()
getElementTop()
}, 500)
})
//跳转历史订单
function toHistory() {
uni.navigateTo({
url: '/pages/order/confirm-order?tableCode=' + uni.cache.get('tableCode') + '&shopId=' + uni
.cache.get(
'shopId')
})
// uni.navigateTo({
// url: '/pages/order/confirm-order?orderId=' + orderinfo.id + '&shopId=' + uni.cache.get('shopId')+'&tableCode='+uni.cache.get('tableCode')
// })
}
</script>
<style lang="scss" scoped>
@@ -1893,6 +1935,8 @@
}
.scroll-panel {
position: relative;
.list-box {
display: flex;
flex-direction: row;
@@ -2538,14 +2582,36 @@
height: 64rpx;
line-height: 64rpx;
text-align: center;
background: #E7AE7B;
background: #FEFAF7;
border-radius: 36rpx 36rpx 36rpx 36rpx;
border: 2rpx solid #E8AD7B;
border: 2rpx solid $my-main-color;
font-weight: bold;
font-size: 28rpx;
color: #FFFFFF;
color: $my-main-color;
}
}
}
}
.history_order {
background-color: #fff;
padding: 12rpx 16rpx;
font-size: 24rpx;
color: #333;
display: flex;
align-items: center;
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
position: fixed;
top: 50%;
right: 0;
transform: translateY(-50%);
border-radius: 100px 0 0 100px;
z-index: 20;
.img {
width: 36rpx;
margin-right: 8rpx;
height: 36rpx;
}
}
</style>

65
pages/test/test.vue Normal file
View File

@@ -0,0 +1,65 @@
<template>
<view class="u-p-30">
<view>
<up-button type="warning" @click="popupShow">初始化</up-button>
</view>
<view class="u-m-t-30">
<up-button type="primary" @click="toCreate">去下单</up-button>
</view>
<up-popup :show="show" mode="bottom" close-on-click-overlay @close="resetForm">
<view class="u-p-30">
<up-form label-width="80" ref="refForm">
<up-form-item label="台桌码">
<up-input v-model="form.tableCode" placeholder="请输入台桌码"></up-input>
</up-form-item>
</up-form>
<view class="u-flex gap-20 u-m-t-30">
<up-button @click="show=false">取消</up-button>
<up-button type="primary" @click="scanCodehandle">确定</up-button>
</view>
</view>
</up-popup>
</view>
</template>
<script setup>
import {onLoad} from '@dcloudio/uni-app'
import { reactive,ref} from 'vue'
import {
productStore
} from '@/stores/user.js';
const store = productStore();
const scanCodehandle = async (i) => {
await store.scanCodeactions(form)
}
const show=ref(false);
const options=ref({})
function popupShow(){
show.value=true;
}
const refForm=ref(null);
const form=reactive({
tableCode:"40963902920"
})
function resetForm(){
form.tableCode=""
}
onLoad((opt)=>{
console.log(opt);
options.value=opt
})
function toCreate(){
uni.navigateTo({
url:'/pages/index/index'
})
}
</script>
<style lang="scss" scoped>
.gap-20{
gap: 20rpx;
}
</style>