WechatApp/pages/result/index.vue

<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）

// 去加餐：销毁当前页再跳转点餐页（不用 go，用 redirectTo）
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))}`);
  const url = q.length ? `/pages/orderFood/index?${q.join('&')}` : '/pages/orderFood/index';
  uni.redirectTo({ url });
};

// 去结算：带上桌号、人数、金额、备注，确认订单页才显示金额并走「确认支付」
const handleGoSettle = () => {
  let orderId = '';
  let orderNo = '';
  let tableId = '';
  let tableNumber = '';
  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 ?? '';
      tableNumber = data?.tableNumber ?? '';
      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 (tableNumber !== '') q.push(`tableNumber=${encodeURIComponent(tableNumber)}`);
  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/checkout/index?${q.join('&')}` : '/pages/checkout/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>