修复苹果端领取bug

pages/experience-coupon/claim.vue

@@ -5,17 +5,24 @@
         <view v-if="tip" class="tip">{{ tip }}</view>
         <view v-else class="tip">加载中...</view>
       </view>
+    </full-page>
 
-      <view v-if="posterVisible" class="poster-mask">
-        <view class="poster-dialog">
-          <image class="poster-image" :src="issue?.posterUrl || ''" mode="widthFix" />
-          <view class="poster-content">{{ buildClaimContent() }}</view>
-          <view class="poster-btn" :class="{ disabled: claiming }" @click="acceptCoupon">
-            {{ claiming ? "领取中..." : "接受" }}
-          </view>
+    <!-- Keep the fixed overlay outside full-page's scroll-view for iOS compatibility. -->
+    <view v-if="posterVisible" class="poster-mask">
+      <view class="poster-dialog">
+        <image
+          v-if="issue?.posterUrl"
+          class="poster-image"
+          :src="issue.posterUrl"
+          mode="aspectFit"
+        />
+        <view v-else class="poster-image poster-image--placeholder">体验券</view>
+        <view class="poster-content">{{ buildClaimContent() }}</view>
+        <view class="poster-btn" :class="{ disabled: claiming }" @click="acceptCoupon">
+          {{ claiming ? "领取中..." : "接受" }}
         </view>
       </view>
-    </full-page>
+    </view>
   </view>
 </template>
 
@@ -372,7 +379,10 @@ onShow(() => {
 
 .poster-mask {
   position: fixed;
-  inset: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
   z-index: 1000;
   display: flex;
   align-items: center;
@@ -385,6 +395,7 @@ onShow(() => {
 .poster-dialog {
   width: 100%;
   max-width: 620rpx;
+  max-height: calc(100vh - 80rpx);
   overflow: hidden;
   border-radius: 20rpx;
   background: #fff;
@@ -393,15 +404,26 @@ onShow(() => {
 .poster-image {
   display: block;
   width: 100%;
+  height: 58vh;
   max-height: 700rpx;
   background: #f5f7fa;
 }
 
+.poster-image--placeholder {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #9aa5b1;
+  font-size: 32rpx;
+}
+
 .poster-content {
   padding: 28rpx 30rpx 8rpx;
   color: #333;
   font-size: 28rpx;
   line-height: 1.6;
+  max-height: 160rpx;
+  overflow: hidden;
 }
 
 .poster-btn {
@@ -419,4 +441,4 @@ onShow(() => {
 .poster-btn.disabled {
   opacity: 0.6;
 }
-</style>
+</style>