订单

src/api/order.js

@@ -3,7 +3,7 @@ import { request } from '../utils/request';
 // 订单列表接口
 export function getOrderList(data) {
   return request({
-    url: '/sgyrdd/sgyOrder/groupBuy/page',
+    url: '/sgyrdd/sgyOrder/page',
     method: 'GET',
     data,
   });

src/pages/order/components/Payment/index.vue

@@ -29,7 +29,7 @@
         </view>
       </radio-group>
       <view class="footer">
-        <wd-button type="error" @tap="toPay">危险按钮</wd-button>
+        <wd-button type="error" @tap="toPay">立即支付</wd-button>
       </view>
     </view>
   </wd-popup>
@@ -46,11 +46,13 @@ function radioChange(evt) {
 }
 
 const toPay = () => {
-  emits('payment', selectType.value);
+  emits('payment', { selectType: selectType.value, orderNumber: orderNumber.value });
   show.value = false;
 };
 
-const open = () => {
+const orderNumber = ref('');
+const open = (e) => {
+  orderNumber.value = e;
   show.value = true;
 };
 const close = () => {

src/pages/order/order.vue

@@ -43,10 +43,10 @@
                   </view>
                   <view
                     class="btn-info"
-                    v-if="item.status == 3"
-                    @tap="handleDetail(item.orderNumber)"
+                    v-if="item.status == 3 || item.status == 2"
+                    @tap="handleQrcode(item)"
                   >
-                    查看预约
+                    核销码
                   </view>
                   <view
                     class="btn-info"
@@ -63,14 +63,18 @@
                   <view
                     class="btn-error"
                     v-if="item.status == 2 || item.status == 3 || item.status == 4"
-                    @click="handleRefund(item.orderNumber)"
+                    @click="handleRefund(item)"
                   >
                     申请退款
                   </view>
                   <view class="btn-error" v-if="item.status == 5" @tap="anotherOrder(item)">
                     再来一单
                   </view>
-                  <view class="btn-error" v-if="item.status == 1" @tap="payNow(item.orderNumber)">
+                  <view
+                    class="btn-error"
+                    v-if="item.status == 1"
+                    @tap="openPayment(item.orderNumber, index)"
+                  >
                     立即支付
                   </view>
                 </view>
@@ -83,14 +87,20 @@
         </block>
       </wd-tabs>
     </view>
-    <Payment ref="PaymentRef"></Payment>
+    <Payment ref="PaymentRef" @payment="payNow"></Payment>
   </view>
 </template>
 
 <script setup>
 import Header from './components/Header/index.vue';
 import Payment from './components/Payment/index.vue';
-import { getOrderList, deleteOrderApi, cancelOrderApi, repaymentApi } from '@/api/order';
+import {
+  getOrderList,
+  deleteOrderApi,
+  cancelOrderApi,
+  repaymentApi,
+  getOrderDetail,
+} from '@/api/order';
 const fileDomain = import.meta.env.VITE_APP_IMG_URL;
 
 const tabs = ref([
@@ -130,6 +140,38 @@ const statusList = ref({
   7: '已退款',
 });
 
+onShow(() => {
+  console.log(pendingPaymentOrder.value);
+  if (pendingPaymentOrder.value) {
+    // 查询订单状态决定是否支付
+    getOrderDetail({ orderNumber: pendingPaymentOrder.value }).then((res) => {
+      console.log(res.data.status);
+      switch (res.data.status) {
+        case '1':
+          xma.showToast({
+            title: '支付失败',
+            icon: 'error',
+            duration: 2000,
+          });
+          pendingPaymentOrder.value = null;
+          break;
+        case '2':
+          xma.redirectTo({
+            url: `/pages/shop/paymentSuccessful?outTradeNos=${pendingPaymentOrder.value}`,
+          });
+          break;
+        case '3':
+          xma.redirectTo({
+            url: `/pages/shop/paymentSuccessful?outTradeNos=${pendingPaymentOrder.value}`,
+          });
+          break;
+        default:
+          break;
+      }
+    });
+  }
+});
+
 // 触底函数
 onReachBottom(() => {
   if (dataList.value.length >= total.value) {
@@ -190,22 +232,6 @@ const initDataList = () => {
   getList();
 };
 
-const handleDetail = (id) => {
-  uni.navigateTo({
-    url: `/pages/order/detail?orderNumber=${id}`,
-  });
-};
-
-/**
- * 拨打商家电话
- * @param {*} phoneNumber
- */
-function callShopPhone(phoneNumber) {
-  xma.makePhoneCall({
-    phoneNumber, // 仅为示例
-  });
-}
-
 /**
  * 删除订单
  * @param {*} orderNumber
@@ -249,12 +275,33 @@ const handleCancel = (orderNumber) => {
 };
 
 /**
- * 立即支付
+ * 唤起支付组件
  * @param {*} orderNumber
  */
+const changeIndex = ref(0);
 const PaymentRef = ref(null);
-const payNow = (orderNumber) => {
-  PaymentRef.value.open();
+const openPayment = (orderNumber, idx) => {
+  changeIndex.value = idx;
+  PaymentRef.value.open(orderNumber);
+};
+
+/**
+ * 立即支付
+ * @param {*} orderNumber
+ */
+const pendingPaymentOrder = ref(null); // 待支付订单
+const payNow = async (data) => {
+  console.log(data);
+  const param = {
+    orderNumber: data.orderNumber,
+    tradeType: data.selectType,
+  };
+  const res = await repaymentApi(param);
+  const { paymentUrl, outTradeNo } = res.data.result;
+  // 修改列表待付款订单号
+  dataList.value[changeIndex.value].orderNumber = outTradeNo;
+  pendingPaymentOrder.value = outTradeNo;
+  window.location.href = paymentUrl;
 };
 
 /**
@@ -279,21 +326,60 @@ const onFinish = async (orderNumber) => {
   initDataList();
 };
 
+const handleDetail = (id) => {
+  // 清空查询待付款状态
+  pendingPaymentOrder.value = null;
+  uni.navigateTo({
+    url: `/pages/order/detail?orderNumber=${id}`,
+  });
+};
+
+/**
+ * 拨打商家电话
+ * @param {*} phoneNumber
+ */
+function callShopPhone(phoneNumber) {
+  // 清空查询待付款状态
+  pendingPaymentOrder.value = null;
+  xma.makePhoneCall({
+    phoneNumber, // 仅为示例
+  });
+}
+
 /**
  * 再来一单
  */
 const anotherOrder = (item) => {
+  // 清空查询待付款状态
+  pendingPaymentOrder.value = null;
   xma.navigateTo({
     url: `/pages/shop/confirmOrder?prodId=${item.orderItems[0].prodId}&skuId=${item.orderItems[0].skuId}`,
   });
 };
 
+/**
+ * 查看核销码
+ */
+const handleQrcode = (item) => {
+  // 清空查询待付款状态
+  pendingPaymentOrder.value = null;
+  xma.navigateTo({
+    url: `/pages/order/ticketCode?orderNumber=${item.orderNumber}`,
+  });
+};
+
+/**
+ * 售后详情
+ */
 const handleRemark = (item) => {
   xma.navigateTo({
     url: `/pages/order/remark?orderNumber=${item.orderNumber}&shopName=${item.shopName}`,
   });
 };
 
+/**
+ * 申请退款
+ */
 const handleRefund = (item) => {
   xma.navigateTo({
     url: `/pages/order/refund?orderNumber=${item.orderNumber}`,

src/pages/order/refund.vue

@@ -7,12 +7,20 @@
           <text class="title">单号:1111111111</text>
         </view>
         <view class="content-item">
-          <view class="item-left">
+          <view class="item-top">
             <image class="item-img" mode="aspectFill" src="/static/ticket/logo.png"></image>
             <view class="item-info">
               <text>血糯米</text>
+              <text>￥0.01</text>
             </view>
           </view>
+          <view class="item-buttom">
+            <text>共</text>
+            <text>1</text>
+            <text>件商品 实付款</text>
+            <text>￥</text>
+            <text class="price">0.01</text>
+          </view>
         </view>
       </view>
     </view>
@@ -33,10 +41,31 @@ page {
   margin: 0 auto;
 
   .content {
-    padding-top: 44px;
+    padding: 108rpx 10rpx 0;
     display: flex;
     flex-direction: column;
     gap: 20rpx;
+
+    .content-box {
+      background-color: #fff;
+      border-radius: 16rpx;
+      padding: 0 20rpx;
+      display: flex;
+      flex-direction: column;
+
+      .content-item {
+        border-bottom: 1rpx solid #f3f3f3;
+        padding: 20rpx 0;
+
+        .title {
+          font-size: 28rpx;
+          color: #333;
+        }
+
+        .item-top {
+        }
+      }
+    }
   }
 }
 </style>

src/pages/order/remark.vue

@@ -25,7 +25,13 @@
             <h5>上传图片/视频</h5>
           </wd-col>
         </wd-row>
-        <wd-upload accept="media" multiple :file-list="fileList" :action="action" @change="handleChange"></wd-upload>
+        <wd-upload
+          accept="media"
+          multiple
+          :file-list="fileList"
+          :action="action"
+          @change="handleChange"
+        ></wd-upload>
 
         <wd-row>
           <wd-col :span="24" custom-class="text">

src/pages/order/ticketCode.vue

@@ -4,21 +4,21 @@
     <view class="content">
       <!-- 使用状态 -->
       <view class="status">
-        <view class="status-text">老凯里酸汤鱼双人餐</view>
-        <view class="detail">有效期：2023-07-04 23:59</view>
+        <view class="status-text">{{ orderDetail.shopName }}</view>
+        <view class="detail">有效期：{{ orderDetail.receiverTime }}</view>
       </view>
 
       <!-- 券码信息 -->
       <view class="info">
         <view class="box">
-          <text class="title">酸汤鱼双人套餐</text>
-          <text class="code">0115 8156 9126</text>
+          <text class="title">{{ orderDetail.orderItems[0].prodName }}</text>
+          <text class="code">{{ orderDetail.orderNumber }}</text>
         </view>
         <view class="rectangle-with-semicircles"></view>
         <view class="qrcode line">
           <!-- 二维码 -->
           <view class="qr-box">
-            <image src="@/static/order/QR-code.png" class="qr"></image>
+            <image :src="qrcode" class="qr"></image>
             <text class="qr-text">请向商家出示此核销码</text>
           </view>
         </view>
@@ -29,6 +29,45 @@
 
 <script setup>
 import Header from './components/Header/index.vue';
+import { getOrderDetail } from '@/api/order';
+import QRCode from 'qrcode';
+
+onLoad((options) => {
+  console.log(options);
+  getOrderDetailFn(options.orderNumber);
+});
+
+/**
+ * 获取订单详情
+ */
+const orderDetail = ref();
+function getOrderDetailFn(orderNumber) {
+  getOrderDetail({ orderNumber }).then((res) => {
+    orderDetail.value = res.data;
+    const outTradeNo = res.data.orderNumber;
+    const indexOfDash = outTradeNo.indexOf('-');
+    if (indexOfDash !== -1) {
+      res.data.orderNumber = outTradeNo.substring(indexOfDash + 1);
+    } else {
+      console.log(`订单编号 ${outTradeNo} 中没有找到 "-" 符号。`);
+    }
+    if (orderDetail.value.status === '2' || orderDetail.value.status === '3') {
+      codeDetail(orderDetail.value.orderNumber);
+    }
+  });
+}
+
+const qrcode = ref('');
+const codeDetail = (item) => {
+  const data = {
+    type: 'write-off',
+    no: item,
+  };
+  QRCode.toDataURL(JSON.stringify(data)).then((img) => {
+    console.log(img);
+    qrcode.value = img;
+  });
+};
 </script>
 
 <style scoped lang="scss">
@@ -39,6 +78,7 @@ page {
 .container {
   width: 375 * 2rpx;
   margin: 0 auto;
+
   .content {
     padding-top: 44px;
     display: flex;