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";

// 去加餐：从缓存取桌号、人数并带上，点餐页依赖 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 tableId = '';
  let diners = '';
  let totalAmount = '';
  let remark = '';
  try {
    const raw = uni.getStorageSync('lastPlaceOrderInfo');
    if (raw) {
      const data = JSON.parse(raw);
      tableId = data?.tableId ?? '';
      diners = data?.diners ?? '';
      totalAmount = data?.totalAmount != null ? String(data.totalAmount) : '';
      remark = (data?.remark ?? '').trim().slice(0, 30);
    }
  } catch (e) {
    console.error('读取下单信息失败', e);
  }
  const q = [];
  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((e) => {
});
</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>