feat: 核销二维码组件

src/pages-order/order/detail.vue

@@ -2,39 +2,26 @@
   <view class="order-detail-page flex flex-col h-screen">
     <TopNavBar titleAlign="center" :background="$theme-color-100" title="订单详情" />
 
-    <view
-      class="order-detail-wrapper border-box flex-full overflow-hidden scroll-y"
-    >
+    <view class="order-detail-wrapper border-box flex-full overflow-hidden scroll-y">
       <OrderStatusInfo :orderData="orderData" />
 
-      <OrderQrcode
-        v-if="orderData.orderStatus === '2'"
-        size="132"
-        unit="px"
-        :val="orderData.orderId"
-      />
-
-      <VoucherList/>
+      <VoucherList v-if="orderData.orderStatus === '2'" :orderData="orderData" @selected="handleSelectedVoucher" />
 
       <AmtSection :orderData="orderData" @click="refundVisible = true" />
 
       <GoodsInfo :orderData="orderData" />
 
-      <UserInfo
-        v-if="orderData.commodityTypeCode === '0'"
-        :orderData="orderData"
-      />
+      <UserInfo v-if="orderData.commodityTypeCode === '0'" :orderData="orderData" />
 
       <OrderInfo :orderData="orderData" />
     </view>
 
-    <FooterSection
-      :orderData="orderData"
-      @refund="handleRefundConfirm"
-      @refresh="handlePaySuccess"
-    />
+    <FooterSection :orderData="orderData" @refund="handleRefundConfirm" @refresh="handlePaySuccess" />   
   </view>
 
+  <!-- 核销凭证 二维码 -->
+  <OrderQrcode v-model="visbleQrcode" :orderData="orderData" :selectedVoucherIndex="selectedVoucherIndex" @close="handleClose" />
+
   <!-- 退款状态显示 -->
   <RefundPopup v-model="refundVisible" :orderData="orderData" />
 </template>
@@ -57,8 +44,27 @@ import RefundPopup from "@/components/RefundPopup/index.vue";
 const refundVisible = ref(false);
 const orderData = ref({});
 
+const visbleQrcode = ref(false);
+const selectedVoucher = ref(null);
+const selectedVoucherIndex = ref(0);
+
 onLoad(({ orderId }) => getOrderDetail(orderId));
 
+// 处理选中核销凭证事件
+const handleSelectedVoucher = (voucher, index) => {
+  console.log("选中的核销凭证：", voucher);
+  selectedVoucher.value = voucher;
+  selectedVoucherIndex.value = index;
+  visbleQrcode.value = true;
+}
+
+// 关闭核销凭证二维码弹窗
+const handleClose = () => {
+  visbleQrcode.value = false;
+  selectedVoucher.value = null;
+  selectedVoucherIndex.value = 0;
+};
+
 // 获取订单详情
 const getOrderDetail = async (orderId) => {
   const res = await userOrderDetail({ orderId });