| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136 |
- <template>
- <!-- 下单结果页面 -->
- <view class="content">
- <image :src="getFileUrl('img/icon/success.png')" mode="widthFix" class="result-img"></image>
- <view class="result-title">下单成功</view>
- <view class="result-desc">您的菜马上就来,坐等开吃</view>
- <view class="result-btns">
- <view class="result-btn1" hover-class="hover-active" @click="handleGoAddFood">去加餐</view>
- <view class="result-btn2" hover-class="hover-active" @click="handleGoSettle">去结算</view>
- </view>
- </view>
- </template>
- <script setup>
- import { onLoad } from "@dcloudio/uni-app";
- import { ref } from "vue";
- import { go } from "@/utils/utils.js";
- import { getFileUrl } from "@/utils/file.js";
- const resultOrderId = ref(''); // 本页 URL 上的订单ID(下单成功跳转时带的 id)
- // 去加餐:从缓存取桌号、人数并带上,点餐页依赖 tableid、diners 拉取列表和购物车
- const handleGoAddFood = () => {
- const tableid = uni.getStorageSync('currentTableId') ?? '';
- const diners = uni.getStorageSync('currentDiners') ?? '';
- const q = [];
- if (tableid !== '' && tableid != null) q.push(`tableid=${encodeURIComponent(String(tableid))}`);
- if (diners !== '' && diners != null) q.push(`diners=${encodeURIComponent(String(diners))}`);
- go(q.length ? `/pages/orderFood/index?${q.join('&')}` : '/pages/orderFood/index');
- };
- // 去结算:带上桌号、人数、金额、备注,确认订单页才显示金额并走「确认支付」
- const handleGoSettle = () => {
- let orderId = '';
- let orderNo = '';
- let tableId = '';
- let diners = '';
- let totalAmount = '';
- let remark = '';
- try {
- const raw = uni.getStorageSync('lastPlaceOrderInfo');
- if (raw) {
- const data = JSON.parse(raw);
- orderId = data?.orderId ?? resultOrderId.value ?? '';
- orderNo = data?.orderNo ?? '';
- tableId = data?.tableId ?? '';
- diners = data?.diners ?? '';
- totalAmount = data?.totalAmount != null ? String(data.totalAmount) : '';
- remark = (data?.remark ?? '').trim().slice(0, 30);
- }
- if (!orderId) orderId = resultOrderId.value;
- } catch (e) {
- console.error('读取下单信息失败', e);
- }
- const q = [];
- if (orderId !== '') q.push(`orderId=${encodeURIComponent(String(orderId))}`);
- if (orderNo !== '') q.push(`orderNo=${encodeURIComponent(String(orderNo))}`);
- if (tableId !== '') q.push(`tableId=${encodeURIComponent(tableId)}`);
- if (diners !== '') q.push(`diners=${encodeURIComponent(diners)}`);
- if (totalAmount !== '') q.push(`totalAmount=${encodeURIComponent(totalAmount)}`);
- if (remark !== '') q.push(`remark=${encodeURIComponent(remark)}`);
- go(q.length ? `/pages/placeOrder/index?${q.join('&')}` : '/pages/placeOrder/index');
- };
- onLoad((options) => {
- resultOrderId.value = options?.id ?? '';
- });
- </script>
- <style lang="scss" scoped>
- .content {
- background-color: #fff;
- width: 100%;
- height: 100vh;
- overflow: hidden;
- text-align: center;
- }
- .result-img {
- width: 84rpx;
- height: 84rpx;
- margin-top: 64rpx;
- }
- .result-title {
- font-weight: bold;
- font-size: 34rpx;
- color: #151515;
- margin-top: 30rpx;
- }
- .result-desc {
- font-size: 30rpx;
- color: #666666;
- margin-top: 10rpx;
- margin-top: 40rpx;
- }
- .result-btns {
- display: flex;
- justify-content: space-around;
- align-items: center;
- margin-top: 40rpx;
- width: 100%;
- margin-top: 52rpx;
- padding: 0 60rpx;
- .result-btn1 {
- width: 252rpx;
- height: 80rpx;
- box-shadow: 0rpx -11rpx 46rpx 0rpx rgba(86, 125, 244, 0.05);
- border-radius: 19rpx 19rpx 19rpx 19rpx;
- border: 2rpx solid #F47D1F;
- font-weight: bold;
- font-size: 27rpx;
- color: #F47D1F;
- display: flex;
- align-items: center;
- justify-content: center;
- }
- .result-btn2 {
- width: 252rpx;
- height: 80rpx;
- background: linear-gradient(90deg, #FCB73F 0%, #FC743D 100%);
- box-shadow: 0rpx -11rpx 46rpx 0rpx rgba(86, 125, 244, 0.05);
- border-radius: 19rpx 19rpx 19rpx 19rpx;
- font-weight: bold;
- font-size: 27rpx;
- color: #FFFFFF;
- display: flex;
- align-items: center;
- justify-content: center;
- }
- }
- </style>
|