新增预点单功能

This commit is contained in:
gyq
2025-12-03 15:26:41 +08:00
parent 0d3fb4f634
commit 00c5987ccc
11 changed files with 4814 additions and 5207 deletions

View File

@@ -0,0 +1,108 @@
<template>
<view class="loading-page">
<view class="loader"></view>
<text class="text">加载中...</text>
</view>
</template>
<script setup></script>
<style scoped lang="scss">
.loading-page {
width: 100%;
height: 100vh;
background-color: rgba(255, 255, 255, 0.8);
backdrop-filter: blur(10px);
position: fixed;
top: 0;
left: 0;
z-index: 999;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding-top: 10vh;
--color: #111;
.text {
font-size: 24upx;
color: var(--color);
}
.loader {
width: 40px;
height: 20px;
--c: no-repeat radial-gradient(farthest-side, var(--color) 93%, var(--color));
background: var(--c) 0 0, var(--c) 50% 0;
background-size: 8px 8px;
position: relative;
clip-path: inset(-200% -100% 0 0);
animation: l6-0 1.5s linear infinite;
}
.loader:before {
content: '';
position: absolute;
width: 8px;
height: 12px;
background: var(--color);
left: -16px;
top: 0;
animation: l6-1 1.5s linear infinite, l6-2 0.5s cubic-bezier(0, 200, 0.8, 200) infinite;
}
.loader:after {
content: '';
position: absolute;
inset: 0 0 auto auto;
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--color);
animation: l6-3 1.5s linear infinite;
}
@keyframes l6-0 {
0%,
30% {
background-position: 0 0, 50% 0;
}
33% {
background-position: 0 100%, 50% 0;
}
41%,
63% {
background-position: 0 0, 50% 0;
}
66% {
background-position: 0 0, 50% 100%;
}
74%,
100% {
background-position: 0 0, 50% 0;
}
}
@keyframes l6-1 {
90% {
transform: translateY(0);
}
95% {
transform: translateY(15px);
}
100% {
transform: translateY(15px);
left: calc(100% - 8px);
}
}
@keyframes l6-2 {
100% {
top: -0.1px;
}
}
@keyframes l6-3 {
0%,
80%,
100% {
transform: translate(0);
}
90% {
transform: translate(26px);
}
}
}
</style>

View File

@@ -127,6 +127,8 @@
</view>
<indexs ref="indexsRef" v-if="showindex == 'shopIndex'" :shopExtend="orderVIP.shopExtendList"></indexs>
<!-- <CouponModal></CouponModal> -->
<!-- 页面加载动画 -->
<pageLoading v-if="showPageLoading" />
</view>
</template>
@@ -136,6 +138,7 @@ import { ref, computed, onMounted, reactive, onBeforeUnmount, watch, getCurrentI
import { onLoad, onReady, onShow, onReachBottom, onPageScroll } from '@dcloudio/uni-app';
// 获取全局属性
const { proxy } = getCurrentInstance();
import pageLoading from './components/pageLoading.vue';
import swipers from './components/swiper.vue'; //引入轮播
import advertisement from './components/advertisement.vue'; //广告
import diamond from './components/diamond.vue'; //金刚区
@@ -326,16 +329,13 @@ const indexsRef = ref(null);
onShow(async () => {
try {
await storeuser.getLocation()
await storeuser.getLocation();
proxy.$isResolve();
const shopId=uni.cache.get('shopId')
const shopId = uni.cache.get('shopId');
if (shopId) {
indexsRef.value.getVipConfig();
}
} catch (error) {
}
} catch (error) {}
await proxy.$onLaunched;
if (uni.cache.get('shopId')) {
showindex.value = 'shopIndex';
@@ -349,7 +349,14 @@ onShow(async () => {
// 获取初始定位高度
}
});
onMounted(async () => {});
const showPageLoading = ref(true);
onMounted(async () => {
setTimeout(() => {
showPageLoading.value = false;
}, 800);
});
onReachBottom(() => {
onLoadhome();

View File

@@ -27,7 +27,6 @@
<!-- <view class="contentboxitemright_item flex-between"
@click="memberindex('user/member/index')"
> -->
<view class="contentboxitemright_item flex-between" @click="toCharge">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xchong.png" mode="aspectFill"></image>
<view class="contentboxitemright_itembox flex-colum">
@@ -38,6 +37,24 @@
</view>
</view>
</view>
<u-popup :show="popupShow" :safe-area-inset-bottom="false" mode="center" @close="popupShow = false">
<view class="popup-content">
<view class="header-wrap">
<text class="t">请选择</text>
<view class="close" @click="popupShow = false">
<u-icon name="close" size="16" color="#666"></u-icon>
</view>
</view>
<view class="btn-content">
<view class="btn">
<u-button color="#E8AD7B" plain="" shape="circle" @click="beforehandOrderHandle">预点单</u-button>
</view>
<view class="btn">
<u-button color="#E8AD7B" shape="circle" @click="scanOrderHandle">扫码点单</u-button>
</view>
</view>
</view>
</u-popup>
</view>
</template>
@@ -55,10 +72,27 @@ const props = defineProps({
import { productStore } from '@/stores/user.js';
const scanCodehandle = async (i) => {
// 显示弹窗
const popupShow = ref(false);
const scanCodehandle = (i) => {
popupShow.value = true;
};
// 预点单
function beforehandOrderHandle() {
let shopUserInfo = uni.cache.get('shopUserInfo');
uni.cache.set('dinersNum', 1);
uni.cache.set('tableCode', shopUserInfo.id);
uni.navigateTo({
url: '/pages/product/index?type=beforehand'
});
}
// 扫码点餐
async function scanOrderHandle() {
const store = productStore();
await store.scanCodeactions();
};
}
const memberindex = (url) => {
uni.pro.navigateTo(url, {
@@ -221,4 +255,39 @@ page {
}
}
}
.popup-content {
width: 90vw;
background-color: #fff;
border-radius: 8px;
.header-wrap {
height: 64px;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #ececec;
padding: 0 28upx;
.t {
font-size: 32upx;
color: #333;
}
.close {
$size: 60upx;
width: $size;
height: $size;
display: flex;
align-items: center;
justify-content: center;
}
}
.btn-content {
height: 86px;
display: flex;
align-items: center;
justify-content: center;
gap: 60upx;
.btn {
width: 248upx;
}
}
}
</style>

View File

@@ -914,7 +914,7 @@
console.log('init', listinfo);
if (options.shopId) {
// 每次进来全局更新shopId
uni.cache.set('shopId', options.shopId, 30)
uni.cache.set('shopId', options.shopId)
uni.$on('returnData', handleReturnData);
}
// * 获取会员信息

File diff suppressed because it is too large Load Diff

View File

@@ -575,7 +575,7 @@
orderId.value = options.orderId
if (options.shopId) {
// 每次进来全局更新shopId
uni.cache.set('shopId', options.shopId, 30)
uni.cache.set('shopId', options.shopId)
uni.$on('returnData', handleReturnData);
}
// * 获取会员信息

File diff suppressed because it is too large Load Diff

View File

@@ -291,7 +291,7 @@
dataform.queueId = getApp().globalData.queueId
}
// #endif
uni.cache.set('shopId', dataform.shopId, 30)
uni.cache.set('shopId', dataform.shopId)
await nextTick()
getQueueUpTablList();
})

View File

@@ -343,7 +343,7 @@
// #endif
if (options.shopId) {
uni.cache.set('shopId', options.shopId, 30)
uni.cache.set('shopId', options.shopId)
infoForn.shopId = options.shopId ? options.shopId : uni.cache.get('shopId')
}
asyncshopUserInfo()

View File

@@ -2,170 +2,150 @@
<!-- 会员详情 -->
<view class="content">
<view class="card_info">
<image class="card_info_bg"
<image
class="card_info_bg"
:src="shopUserInfo.shopExtend ? shopUserInfo.shopExtend.value : 'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_bg.png'"
mode="aspectFill"></image>
mode="aspectFill"
></image>
<view class="card_info_bg_box"></view>
<view class="card_content">
<view class="card_head">
<view class="card_head_left">
<image class="card_head_left_head"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_head.png"
mode="aspectFill"></image>
<image class="card_head_left_head" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_head.png" mode="aspectFill"></image>
<text class="card_head_left_name">{{ shopUserInfo.shopInfo.shopName || '' }}会员卡</text>
<view class="card_head_left_icon_box" v-if="shopUserInfo.shopInfo.isVip != 0">
<image class="card_head_left_icon1"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_icon1.png"
mode="aspectFill"></image>
<image class="card_head_left_icon1" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_icon1.png" mode="aspectFill"></image>
<text class="card_head_left_iconText">VL1</text>
</view>
</view>
<view class="card_head_right" @click="clickEvent" v-if="shopUserInfo.shopInfo.isVip != 0">
<image class="card_head_left_qrCode"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_qrCode.png"
mode="aspectFill"></image>
<image class="card_head_left_qrCode" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_qrCode.png" mode="aspectFill"></image>
</view>
</view>
<view class="card_cen">
<view class="card_cen_left">{{ shopUserInfo.shopInfo.isVip == 0 ? '尚未开通会员暂无法享受会员权益' : '欢迎加入本店会员~'}}
</view>
<view class="card_cen_left">{{ shopUserInfo.shopInfo.isVip == 0 ? '尚未开通会员暂无法享受会员权益' : '欢迎加入本店会员~' }}</view>
<!-- <view class="card_cen_right" v-if="shopUserInfo.shopInfo.isVip != 0">查看特权</view> -->
</view>
<view class="card_bom" v-if="shopUserInfo.shopInfo.isVip != 0">
<view class="card_bom_item" @click="itemClick(1)">
<text>{{shopUserInfo.amount || '0.00'}}</text><text>储值</text>
<text>{{ shopUserInfo.amount || '0.00' }}</text>
<text>储值</text>
</view>
<view class="card_bom_item" @click="itemClick(2)">
<text>{{shopUserInfo.accountPoints || '0'}}</text><text>积分</text>
<text>{{ shopUserInfo.accountPoints || '0' }}</text>
<text>积分</text>
</view>
<view class="card_bom_item" @click="itemClick(3)">
<text>{{shopUserInfo.couponNum || '0'}}</text><text>优惠券</text>
<text>{{ shopUserInfo.couponNum || '0' }}</text>
<text>优惠券</text>
</view>
<view class="card_bom_item">
<text>0</text><text>权益卡</text>
<text>0</text>
<text>权益卡</text>
</view>
</view>
</view>
</view>
<view class="card_bottom" :class="shopUserInfo.shopInfo.isVip == 0 ? 'n' : ''">
<view class="card_bottom_Box" v-if="shopUserInfo.shopInfo.isVip != 0">
<view class="card_bottom_left flex-start">
<image class="card_bottom_head"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_head2.png"
mode="aspectFill"></image>
<image class="card_bottom_head" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_head2.png" mode="aspectFill"></image>
<view class="">
<view class="card_bottom_title">感谢你 2 天陪伴</view>
<view class="flex-start">
<view class="card_bottom_text">您今天的幸运词<text class="luckyWord">林波微步</text></view>
<view class="card_bottom_text">
您今天的幸运词
<text class="luckyWord">林波微步</text>
</view>
</view>
</view>
<image class="card_bottom_right_img"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_img3.png" mode="aspectFill">
</image>
</view>
<image class="card_bottom_right_img" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_img3.png" mode="aspectFill"></image>
</view>
<view class="card_bottom_Box" v-else>
<view class="card_bottom_equity">
<view class="card_bottom_equity_title">专享2项权益</view>
<view class="card_bottom_equity_list">
<view class="card_bottom_equity_list_item">
<image class="list_item_icon"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_icon01.png"
mode="aspectFill"></image>
<image class="list_item_icon" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_icon01.png" mode="aspectFill"></image>
<text class="list_item_text">会员专属活动</text>
</view>
<view class="card_bottom_equity_list_item">
<image class="list_item_icon"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_icon02.png"
mode="aspectFill"></image>
<image class="list_item_icon" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/menber/member_icon02.png" mode="aspectFill"></image>
<text class="list_item_text">福利商品</text>
</view>
</view>
</view>
</view>
</view>
<registermember :memberOpen="form.memberOpen" :shopUserInfo="shopUserInfo.shopInfo">
</registermember>
<registermember :memberOpen="form.memberOpen" :shopUserInfo="shopUserInfo.shopInfo"></registermember>
</view>
</template>
<script setup>
import {
reactive,
ref,
onMounted
} from 'vue'
import {
APIshopUserInfo
} from '@/common/api/member.js'
import registermember from './components/registermember.vue'
import { reactive, ref, onMounted } from 'vue';
import { APIshopUserInfo } from '@/common/api/member.js';
import registermember from './components/registermember.vue';
const shopUserInfo = reactive({
shopInfo: {},
shopExtend: {},
shopId: ""
})
shopId: ''
});
const form = reactive({
memberOpen: true,
shopName: "",
shopName: '',
amount: '',
lucky: {
list: ['鸿运当头', "财运亨通", "时来运转", "否极泰来", "花逢时发"],
list: ['鸿运当头', '财运亨通', '时来运转', '否极泰来', '花逢时发'],
index: 0,
text: ""
},
})
text: ''
}
});
const itemClick = (type) => {
if (type == 1) {
uni.pro.navigateTo('user/member/index', {
shopId: shopUserInfo.shopId,
type: type
})
});
} else if (type == 2) {
uni.pro.navigateTo('user/member/billDetails', {
shopId: shopUserInfo.shopId,
type: type,
shopInfo: JSON.stringify(shopUserInfo)
})
});
} else if (type == 3) {
uni.pro.navigateTo('user/coupon', {
shopId: shopUserInfo.shopId,
shopInfo: shopUserInfo.shopInfo
})
}
});
}
};
// * 注册会员卡
const clickEvent = () => {
uni.pro.navigateTo('user/member/paycode', {
shopId: shopUserInfo.shopId,
shopInfo: JSON.stringify(shopUserInfo.shopInfo)
})
}
});
};
// 会员总信息
const asyncshopUserInfo = async () => {
let res = await APIshopUserInfo({
shopId: shopUserInfo.shopId
})
});
Object.assign(shopUserInfo, res);
uni.cache.set('orderVIP', res)
uni.cache.set('ordershopUserInfo', res.shopInfo)
form.memberOpen = res.isVip == 1 ? false : true
shopUserInfo.shopExtend = res.shopExtendList[2]
}
uni.cache.set('orderVIP', res);
uni.cache.set('ordershopUserInfo', res.shopInfo);
form.memberOpen = res.isVip == 1 ? false : true;
shopUserInfo.shopExtend = res.shopExtendList[2];
};
onMounted(async () => {
// 获取当前页面栈
@@ -180,17 +160,16 @@
// 获取页面参数
const pageParams = currentPage.options;
if (pageParams.shopId) {
shopUserInfo.shopId = pageParams.shopId
uni.cache.set('shopId', pageParams.shopId, 30)
asyncshopUserInfo()
shopUserInfo.shopId = pageParams.shopId;
uni.cache.set('shopId', pageParams.shopId);
asyncshopUserInfo();
}
})
});
</script>
<style lang="scss">
page {
background: #F9F9F9;
background: #f9f9f9;
}
.content {
@@ -247,7 +226,7 @@
.card_head_left_name {
font-weight: 400;
font-size: 32rpx;
color: #FFFFFF;
color: #ffffff;
margin-right: 12rpx;
}
@@ -270,12 +249,11 @@
.card_head_left_iconText {
font-weight: bold;
font-size: 18rpx;
color: #FFFFFF;
color: #ffffff;
position: relative;
z-index: 1;
}
}
}
.card_head_right {
@@ -300,7 +278,7 @@
justify-content: space-between;
font-weight: 400;
font-size: 20rpx;
color: #FFFFFF;
color: #ffffff;
margin-top: 20rpx;
}
@@ -318,12 +296,12 @@
text:nth-child(1) {
font-size: 30rpx;
color: #FFFFFF;
color: #ffffff;
}
text:nth-child(2) {
font-size: 24rpx;
color: #FFFFFF;
color: #ffffff;
}
}
}
@@ -381,7 +359,6 @@
height: 132rpx;
}
.card_bottom_equity {
display: flex;
flex-direction: column;
@@ -430,7 +407,7 @@
position: relative;
padding: 32rpx;
border-radius: 12rpx;
background: linear-gradient(126deg, #FFFBF2 0%, #F2D093 100%);
background: linear-gradient(126deg, #fffbf2 0%, #f2d093 100%);
border-radius: 12rpx 12rpx 12rpx 12rpx;
&::after {
@@ -466,8 +443,6 @@
border-radius: 50%;
}
.towcontentitemonetext {
height: 76rpx;
margin-left: 16rpx;
@@ -483,9 +458,8 @@
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
color: #422a07;
}
}
}
@@ -502,7 +476,7 @@
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
color: #422a07;
}
.towcontentitevip {
@@ -512,14 +486,13 @@
width: 92rpx;
height: 40rpx;
font-size: 20rpx;
background: #F4C380;
background: #f4c380;
border-radius: 0rpx 12rpx 0rpx 12rpx;
text-align: center;
line-height: 40rpx;
color: #fff;
font-family: Source Han Sans CN-Medium;
font-weight: Medium;
}
.towcontentitemthere {
@@ -543,7 +516,7 @@
position: relative;
padding: 22rpx 32rpx;
width: 100%;
background: #FFFFFF;
background: #ffffff;
border-radius: 8rpx;
input {
@@ -579,7 +552,7 @@
margin: 24rpx 10rpx;
padding: 16rpx 0;
text-align: center;
background: #FFFFFF;
background: #ffffff;
border-radius: 8rpx;
border: 1rpx solid #333333;
font-size: 28rpx;
@@ -593,16 +566,15 @@
padding: 16rpx 0;
text-align: center;
border-radius: 8rpx;
background: #F1CB66;
background: #f1cb66;
border-radius: 8rpx 8rpx 8rpx 8rpx;
border: 2rpx solid #F1CB66;
border: 2rpx solid #f1cb66;
font-size: 28rpx;
font-family: Roboto-Medium, Roboto;
font-weight: 500;
color: #FFFFFF;
color: #ffffff;
}
}
}
.fivecontent {
@@ -615,9 +587,9 @@
font-size: 36rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
color: #ffffff;
border-radius: 8rpx;
background: #F1CB66;
background: #f1cb66;
}
// 会员详情
@@ -646,6 +618,5 @@
align-items: center;
}
}
}
</style>

View File

@@ -1,13 +1,24 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { APIuserlogin, APIuser } from "@/common/api/api.js";
import {
defineStore
} from "pinia";
import {
ref
} from "vue";
import {
APIuserlogin,
APIuser
} from "@/common/api/api.js";
import {
APIproductqueryShop,
APIusershopInfodetail,
APIshopUserInfo,
} from "@/common/api/member.js";
import { getDistance } from "@/utils/address.js";
import { APIgeocodelocation } from "@/common/api/api.js";
import {
getDistance
} from "@/utils/address.js";
import {
APIgeocodelocation
} from "@/common/api/api.js";
export const Storelogin = defineStore("login", {
state: () => ({
@@ -40,11 +51,13 @@ export const Storelogin = defineStore("login", {
});
if (res) {
this.token = res.token;
this.miniAppOpenId = res.userInfo.miniAppOpenId;
this.miniAppOpenId = res.userInfo
.miniAppOpenId;
this.userInfo = res.userInfo;
uni.cache.set("token", res.token);
uni.cache.set("userInfo", res.userInfo);
uni.cache.set("followIndex", res.followIndex || "");
uni.cache.set("followIndex", res
.followIndex || "");
}
resolve(true);
},
@@ -223,7 +236,8 @@ export const productStore = defineStore("product", {
this.jumpToOrderPage();
return;
}
const canGetLocation = await this.openLocationAuth();
const canGetLocation = await this
.openLocationAuth();
if (canGetLocation) {
const canOrder = await this.computedDistance();
}
@@ -247,11 +261,14 @@ export const productStore = defineStore("product", {
// 2. 已授权:直接获取位置
resolve(true);
} else if (
settingRes.authSetting["scope.userLocation"] === undefined
settingRes.authSetting["scope.userLocation"] ===
undefined
) {
// 3. 未请求过授权:发起授权请求
uni
.authorize({ scope: "scope.userLocation" })
.authorize({
scope: "scope.userLocation"
})
.then((authRes) => {
if (authRes.errMsg === "authorize:ok") {
// 授权成功后获取位置
@@ -271,12 +288,21 @@ export const productStore = defineStore("product", {
if (modalRes.confirm) {
// 跳转微信小程序授权设置页
uni.openSetting({
success: async (openRes) => {
success: async (
openRes
) => {
// 用户在设置页开启授权后,再次获取位置
if (openRes.authSetting["scope.userLocation"]) {
resolve(true);
if (openRes
.authSetting[
"scope.userLocation"
]) {
resolve(
true
);
} else {
reject(false);
reject(
false
);
}
},
});
@@ -292,7 +318,10 @@ export const productStore = defineStore("product", {
});
} catch (err) {
console.error("位置授权失败:", err);
uni.showToast({ title: "授权失败,请稍后重试", icon: "none" });
uni.showToast({
title: "授权失败,请稍后重试",
icon: "none"
});
}
},
//计算距离判断是否可以点餐
@@ -321,8 +350,7 @@ export const productStore = defineStore("product", {
uni.showModal({
title: "提示",
confirmText: "重新定位",
content:
"抱歉,您当前距离店铺过远,为保障您的用餐体验,请您到店后或在门店附近再下单。若您已在店铺附近,可尝试重新定位",
content: "抱歉,您当前距离店铺过远,为保障您的用餐体验,请您到店后或在门店附近再下单。若您已在店铺附近,可尝试重新定位",
success: async (res) => {
if (res.confirm) {
console.log("用户点击了确认");
@@ -371,7 +399,8 @@ export const productStore = defineStore("product", {
uni.cache.set("shopTable", res.shopTable);
// 台桌信息
uni.cache.set("shopInfo", res.shopInfo);
uni.cache.set("shopId", res.shopTable.shopId, 30);
// uni.cache.set("shopId", res.shopTable.shopId, 30);
uni.cache.set("shopId", res.shopTable.shopId);
resolve(res);
} else {