绿满眶商城微信小程序-uniapp
peng
9 天以前 25ee0fc249a081bb7bc4b485708c3e1afd3b07d1
pages/order/claim-coupon/claim-coupon.vue
@@ -2,8 +2,8 @@
   <view class="container">
      <!-- 顶部标题 -->
      <view class="header">
         <text class="title">优惠券领取</text>
         <text class="subtitle">领取您的专属优惠券</text>
         <text class="title">商品兑换券领取</text>
         <text class="subtitle">领取您的专属商品兑换券</text>
      </view>
      
      <!-- 单个优惠券展示 -->
@@ -12,12 +12,12 @@
            <!-- 商品图片 -->
            <view class="goods-image-container">
               <u-image 
                  :src="couponInfo.goodsImage || '/static/default_goods.png'"
                  :src="couponInfo.goodsUrl"
                  width="100%" 
                  height="300rpx" 
                  mode="aspectFit"
                  border-radius="16"
                  @click="previewImage(couponInfo.goodsImage)"
                  @click="previewImage(couponInfo.goodsUrl)"
               ></u-image>
            </view>
            
@@ -89,26 +89,57 @@
            couponInfo: null, // 单个优惠券信息
            loading: false,
            showShoppingModal: false ,// 控制去购物弹窗显示
            couponId:''
            couponId:'',
            cardId:''
         }
      },
      onShow() {
         this.loadCouponInfo(this.cardId);
      },
      onLoad(options) {
         // 通过参数传递优惠券ID
         // 例如: /pages/order/claim-coupon/claim-coupon?id=123
         options.id = '1966390012058017794'
         
         this.couponId = ''
         if (options.id) {
            this.cardId = options.id
            this.loadCouponInfo(options.id);
         } else {
         }else if(options.q) {
               // 双重解码:微信对URL进行了两次编码
               const decodedUrl = decodeURIComponent(decodeURIComponent(options.q));
               console.log('原始URL:', decodedUrl);
               // 解析URL中的查询参数
               const params = this.parseUrlParams(decodedUrl);
               this.cardId =  params.id;
               this.loadCouponInfo(this.cardId);
            }
          else {
            // 如果没有传递ID,显示空状态
            uni.showToast({
               title: '缺少优惠券ID参数',
               title: '缺少兑换券ID参数',
               icon: 'none'
            });
         }
      },
      methods: {
         // 解析URL参数
         parseUrlParams(url) {
            const params = {};
            // 处理可能存在的hash(如果有的话)
            const cleanUrl = url.split('#')[0];
            const queryStr = cleanUrl.split('?')[1] || '';
            queryStr.split('&').forEach(pair => {
               const [key, value] = pair.split('=');
               if (key) {
                  // 如果值存在,则解码,否则设为空字符串
                  params[key] = value ? decodeURIComponent(value) : '';
               }
            });
            return params;
         },
         // 加载指定ID的优惠券信息
         async loadCouponInfo(id) {
            if (this.loading) return;
@@ -121,12 +152,12 @@
               if (res.data.code===200) {
                  this.couponInfo = res.data.data;
               } else {
                  throw new Error(res.message || '获取优惠券失败');
                  throw new Error(res.message || '获取兑换券失败');
               }
            } catch (err) {
               console.error('获取优惠券信息失败:', err);
               console.error('获取兑换券信息失败:', err);
               uni.showToast({
                  title: err.message || '获取优惠券失败',
                  title: err.message || '获取兑换券失败',
                  icon: 'none'
               });
            } finally {
@@ -138,7 +169,7 @@
         async claimCoupon() {
            if (!this.couponInfo || this.couponInfo.claimStatus === 'CLAIM') {
               uni.showToast({
                  title: '该优惠券已领取',
                  title: '该兑换券已领取',
                  icon: 'none'
               });
               return;
@@ -148,7 +179,7 @@
               uni.showLoading({
                  title: '领取中...'
               });
               console.log(this.couponInfo)
               // 调用领取优惠券接口
               const res = await claimVirtualCoupon(this.couponInfo.id);
               
@@ -170,7 +201,7 @@
               }
            } catch (err) {
               uni.hideLoading();
               console.error('领取优惠券失败:', err);
               console.error('领取兑换券失败:', err);
               uni.showToast({
                  title: err.message || '领取失败',
                  icon: 'none'