Fix(订单):[#5293]待付款的活动商品，点击立即付款并付款后，页面未出现已获得抽奖码的弹窗

assets/css/style.less

@@ -8231,3 +8231,191 @@ rich-text {
     font-size: 28rpx;
   }
 }
+
+.draw-ticket-mask {
+  position: fixed;
+  inset: 0;
+  z-index: 1000;
+  background: rgba(0, 0, 0, 0.45);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 24rpx;
+  box-sizing: border-box;
+}
+.draw-ticket-popup {
+  width: 100%;
+  max-width: 640rpx;
+  background: #fff;
+  border-radius: 40rpx;
+  padding: 50rpx 40rpx 60rpx;
+  position: relative;
+  box-sizing: border-box;
+
+  .draw-ticket-close {
+    position: absolute;
+    top: 30rpx;
+    right: 30rpx;
+    width: 40rpx;
+    height: 40rpx;
+    border: 4rpx solid #333;
+    border-radius: 50%;
+    color: #333;
+    text-align: center;
+    font-weight: bold;
+    z-index: 10;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .draw-ticket-icon {
+    display: flex;
+    justify-content: center;
+    margin-top: 20rpx;
+  }
+
+  .ticket-icon-box {
+    width: 100rpx;
+    height: 70rpx;
+    border-radius: 10rpx;
+    position: relative;
+    box-sizing: border-box;
+  }
+
+  .ticket-icon-check {
+    width: 100%;
+    height: 100%;
+  }
+
+  .draw-ticket-title {
+    font-size: 56rpx;
+    color: #222;
+    font-weight: 800;
+    text-align: center;
+    margin-top: 24rpx;
+    letter-spacing: 2rpx;
+  }
+
+  .ticket-card-container {
+    margin-top: 50rpx;
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+
+  .ticket-badge {
+    background-color: #fff9eb;
+    border: 6rpx solid #111;
+    border-radius: 40rpx;
+    padding: 12rpx 40rpx;
+    font-size: 46rpx;
+    font-weight: 800;
+    color: #222;
+    position: relative;
+    z-index: 2;
+    margin-bottom: -36rpx;
+    letter-spacing: 2rpx;
+  }
+
+  .ticket-badge-arrow {
+    position: absolute;
+    bottom: -22rpx;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 0;
+    height: 0;
+    border-left: 22rpx solid transparent;
+    border-right: 22rpx solid transparent;
+    border-top: 22rpx solid #111;
+
+    &::after {
+      content: '';
+      position: absolute;
+      top: -26rpx;
+      left: -16rpx;
+      border-left: 16rpx solid transparent;
+      border-right: 16rpx solid transparent;
+      border-top: 16rpx solid #fff9eb;
+    }
+  }
+
+  .ticket-card {
+    width: 100%;
+    background: #c23326;
+    border-radius: 36rpx;
+    padding: 70rpx 36rpx 40rpx;
+    box-sizing: border-box;
+    text-align: center;
+    position: relative;
+  }
+
+  .ticket-card-subtitle {
+    display: flex;
+    justify-content: center;
+  }
+
+  .ticket-card-subtitle-text {
+    color: #fff;
+    font-size: 34rpx;
+    font-weight: 700;
+    border: 2rpx solid #fff;
+    border-radius: 40rpx;
+    padding: 8rpx 50rpx;
+    letter-spacing: 4rpx;
+  }
+
+  .ticket-card-code-box {
+    background: #fff;
+    border-radius: 20rpx;
+    margin-top: 36rpx;
+    padding: 36rpx 0;
+  }
+
+  .ticket-card-code {
+    color: #c23326;
+    font-size: 72rpx;
+    font-weight: 800;
+    letter-spacing: 8rpx;
+  }
+
+  .ticket-card-time {
+    color: #fff;
+    font-size: 30rpx;
+    margin-top: 36rpx;
+    text-align: left;
+  }
+
+  .draw-ticket-actions {
+    margin-top: 60rpx;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    gap: 20rpx;
+
+    .action-btn {
+      flex: 1;
+      height: 86rpx;
+      border-radius: 44rpx;
+      font-size: 32rpx;
+      font-weight: 600;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      box-sizing: border-box;
+      white-space: nowrap;
+
+      &.home-btn {
+        color: #c23326;
+        border: 2rpx solid #c23326;
+        background: #fff;
+      }
+
+      &.primary {
+        color: #fff;
+        background: #c23326;
+      }
+    }
+  }
+}

mixins/orderPaySuccessToCheckDrawStatus.js

@@ -0,0 +1,72 @@
+import { getDrawTicketByOrder } from '@/api/lottery'
+export const orderPaySuccessToCheckDrawStatus = {
+	data(){
+		return {
+      drawTicketPopup: {
+        show: false,
+        ticketCode: '',
+        drawTime: ''
+      }
+		}
+	},
+	methods: {
+    setDrawTicketPopupFromQuery(ticketData = '') {
+      const drawTicketData = ticketData || this.$yroute.query.drawTicketData
+      if (!drawTicketData) {
+        return
+      }
+      let result = {}
+      try {
+        result = typeof drawTicketData === 'string' ? JSON.parse(decodeURIComponent(drawTicketData)) : drawTicketData
+        console.log(result)
+      } catch (e) {
+        result = {}
+      }
+      const hasTicket = Number(result.hasTicket || 0) === 1
+      const howPopup = Number(result.showPopup || 0) === 1
+      if (!hasTicket || !howPopup) {
+        return
+      }
+      this.drawTicketPopup = {
+        show: true,
+        ticketCode: result.ticketCode || result.code || '',
+        drawTime: result.drawTime || ''
+      }
+    },
+    closeDrawTicketPopup() {
+      this.drawTicketPopup.show = false
+    },
+    goHomeFromPopup() {
+      this.drawTicketPopup.show = false
+      uni.switchTab({
+        url: '/pages/home/index'
+      })
+    },
+    goTicketsFromPopup() {
+      this.drawTicketPopup.show = false
+      uni.navigateTo({
+        url: '/pkg-video/views/county-my-tickets'
+      })
+    },
+    buildOrderDetailQuery(orderId, drawTicketResult = {}) {
+      return {
+        id: orderId,
+        drawTicketData: encodeURIComponent(JSON.stringify(drawTicketResult || {}))
+      }
+    },
+    async afterPaySuccess(orderId, fallback) {
+      if (!orderId) {
+        fallback && fallback()
+        return
+      }
+      try {
+        const res = await getDrawTicketByOrder(orderId)
+        const result = (res && res.data) || {}
+        fallback && fallback(result)
+        return
+      } catch (e) {
+      }
+      fallback && fallback({})
+    }
+	}
+}

pages/order/MyOrder/index.vue

@@ -602,6 +602,40 @@
       @update:show="showDatePicker = false"
       @input="handleDateSelected"
     ></DateRangePicker>
+    <view
+      v-if="drawTicketPopup.show"
+      class="draw-ticket-mask"
+      @touchmove.stop.prevent
+    >
+      <view class="draw-ticket-popup">
+        <view class="draw-ticket-close" @click="closeDrawTicketPopup">×</view>
+        <view class="draw-ticket-icon">
+          <view class="ticket-icon-box">
+            <image class="ticket-icon-check" :src="webUrl + '/home/gongxi.png'" mode="widthFix"></image>
+          </view>
+        </view>
+        <view class="draw-ticket-title">支付成功</view>
+        <view class="ticket-card-container">
+          <view class="ticket-badge">
+            <text>恭喜获得抽奖码！</text>
+            <view class="ticket-badge-arrow"></view>
+          </view>
+          <view class="ticket-card">
+            <view class="ticket-card-subtitle">
+              <text class="ticket-card-subtitle-text">您的专属抽奖码</text>
+            </view>
+            <view class="ticket-card-code-box">
+              <text class="ticket-card-code">{{ drawTicketPopup.ticketCode }}</text>
+            </view>
+            <view class="ticket-card-time">开奖时间：{{ (drawTicketPopup.drawTime) }}</view>
+          </view>
+        </view>
+        <view class="draw-ticket-actions">
+          <view class="action-btn home-btn" @click="goHomeFromPopup">返回首页</view>
+          <view class="action-btn primary" @click="goTicketsFromPopup">查看我的抽奖码</view>
+        </view>
+      </view>
+    </view>
   </view>
 </template>
 <script>
@@ -626,10 +660,11 @@ import Payment from "@/components/Payment"
 import { mapGetters } from "vuex"
 import { pageListenMixins } from '@/mixins/pageListenMixins'
 import settings from '@/config/baseSetting.js'
+import { orderPaySuccessToCheckDrawStatus } from '@/mixins/orderPaySuccessToCheckDrawStatus.js'
 
 export default {
   name: "MyOrder",
-  mixins: [pageListenMixins],
+  mixins: [pageListenMixins, orderPaySuccessToCheckDrawStatus],
   data() {
     return {
       giftItem: {},
@@ -1017,9 +1052,14 @@ export default {
       })
     },
     async toYuePay(payPwd) {
-      const that = this;
+      const that = this
-      //网络请求
+      const orderId = this.orderInfo.orderId
-      await yuePayOrderHandle(this.orderInfo.orderId, "yue", that.from, payPwd);
+      // 网络请求
+      await yuePayOrderHandle(orderId, "yue", that.from, payPwd).then(() => {
+        this.afterPaySuccess(orderId, (drawTicketResult) => {
+          this.setDrawTicketPopupFromQuery(drawTicketResult)
+        })
+      });
       that.changeType();
       this.payPassword = "";
     },
@@ -1379,13 +1419,17 @@ export default {
       }
     },
     toPay(type) {
-      const that = this
       // 余额支付需要输入支付密码
       if (type == "yue") {
         this.isShowPayPwdPop = true
         return
       } else {
-        payOrderHandle(this.orderInfo.orderId, type, that.from)
+        const orderId = this.orderInfo.orderId
+        payOrderHandle(orderId, type, this.from).then(() => {
+          this.afterPaySuccess(orderId, (drawTicketResult) => {
+            this.setDrawTicketPopupFromQuery(drawTicketResult)
+          })
+        })
       }
     },
     toDelay(id) {

pages/order/OrderSubmission/index.vue

@@ -331,6 +331,7 @@ import CouponsPopup from "@/components/CouponsPopup.vue"
 import { getDrawTicketByOrder } from '@/api/lottery'
 import { pageListenMixins } from '@/mixins/pageListenMixins'
 import settings from '@/config/baseSetting.js'
+import { orderPaySuccessToCheckDrawStatus } from '@/mixins/orderPaySuccessToCheckDrawStatus.js'
 
 const NAME = "OrderSubmission"
 const _isWeixin = isWeixin()
@@ -344,7 +345,7 @@ export default {
     passkeyborad,
     CouponsPopup
   },
-  mixins: [pageListenMixins],
+  mixins: [pageListenMixins, orderPaySuccessToCheckDrawStatus],
   props: {},
   data: function () {
     return {
@@ -847,28 +848,7 @@ export default {
       this.computedPrice(1)
       // this.couponId = uni.getStorageSync('couponId') || 0
       // this.couponTitle = item.couponTitle
-    },
+    }
-    buildOrderDetailQuery(orderId, drawTicketResult = {}) {
-      return {
-        id: orderId,
-        drawTicketData: encodeURIComponent(JSON.stringify(drawTicketResult || {}))
-      }
-    },
-    async afterPaySuccess(orderId, fallback) {
-      if (!orderId) {
-        fallback && fallback()
-        return
-      }
-      try {
-        const res = await getDrawTicketByOrder(orderId)
-        const result = (res && res.data) || {}
-        fallback && fallback(result)
-        return
-      } catch (e) {
-      }
-      fallback && fallback({})
-    },
-    
   }
 };
 </script>