Bladeren bron

优化:页面安全区距离已经短链分享弹窗显示

haiyang 12 uur geleden
bovenliggende
commit
b3736ffd3c

+ 10 - 20
src/components/ShortLinkModal.vue

@@ -18,7 +18,7 @@ const emit = defineEmits<{
     (e: 'update:showModal', value: boolean): void
 }>()
 
-const { shareLink, copySuccess, shareLoading, shareCoupon, copyShareLink } = useCouponShare()
+const { shareLink, copySuccess, shareLoading, shareCoupon, copyShareLink, cleanShareLink } = useCouponShare()
 watch(() => props.showModal, (newVal) => {
     console.log('showModal', newVal)
     if (newVal && props.couponId) {
@@ -30,32 +30,22 @@ watch(() => props.showModal, (newVal) => {
 function handleClose() {
     emit('update:showModal', false)
     emit('close')
+    cleanShareLink()
 }
 </script>
 
 <template>
     <!-- 分享弹窗 - 使用uview-plus的Modal组件 -->
-    <!-- <up-modal :show="props.showModal" title="分享优惠券" :show-cancel-button="false" confirm-text="关闭" :border-radius="16"
-        width="600rpx" @confirm="handleClose">
-        <view class="share-modal-content">
-            <view class="share-link-container">
-                <text class="share-link">{{ shareLink }}</text>
-                <button class="copy-btn" @click="copyShareLink">
-                    复制
-                </button>
-            </view>
-            <view v-if="copySuccess" class="copy-success">
-                复制成功!
-            </view>
-        </view>
-    </up-modal> -->
     <up-modal title="分享优惠券" style="z-index: 1000;" :show="props.showModal" :show-confirm-button="false">
         <view class="share-modal-content">
             <view class="share-link-container">
-                <text class="share-link">{{ shareLink }}</text>
-                <button class="copy-btn" @click="copyShareLink">
-                    复制
-                </button>
+                <up-loading-icon v-if="shareLoading" mode="semicircle" text="正在获取分享链接中" text-size="18" />
+                <template v-else>
+                    <text class="share-link">{{ shareLink }}</text>
+                    <button class="copy-btn" @click="copyShareLink">
+                        复制
+                    </button>
+                </template>
             </view>
             <view v-if="copySuccess" class="copy-success">
                 复制成功!
@@ -63,7 +53,7 @@ function handleClose() {
         </view>
         <template #popupBottom>
             <view class="rounded" style="margin-top: 20px;" @click="handleClose">
-                <up-icon name="close-circle" size="50rpx" color="#fff" />
+                <up-icon name="close-circle" size="72rpx" color="#fff" />
             </view>
         </template>
     </up-modal>

+ 6 - 1
src/hooks/useCouponShare.ts

@@ -98,11 +98,16 @@ export function useCouponShare() {
         })
     }
 
+    const cleanShareLink = () => {
+        shareLink.value = ''
+    }
+
     return {
         shareLink,
         copySuccess,
         shareLoading,
         shareCoupon,
-        copyShareLink
+        copyShareLink,
+        cleanShareLink
     }
 }

+ 1 - 1
src/pages-A/couponRedemptionList/index.vue

@@ -90,7 +90,7 @@ function datePickerConfirm() {
     <view class="page-container">
         <view class="safe-top" :style="{ height: `${topSafeAreaHeight}px` }" />
         <up-navbar title="优惠券" :auto-back="true" />
-        <up-status-bar />
+        <!-- <up-status-bar /> -->
         <view class="redemption-type" :style="{ paddingTop: `${topSafeAreaHeight}px` }">
             <view class="redemption-type-item" :class="{ active: currentState === '1' }" @click="redemptionChange('1')">
                 待核销

+ 1 - 1
src/pages-A/discountcouponList/index.vue

@@ -82,7 +82,7 @@ onShareAppMessage(async (options) => {
     <view class="page-container">
         <view class="safe-top" :style="{ height: `${topSafeAreaHeight}px` }" />
         <up-navbar title="折扣券" :auto-back="true" />
-        <up-status-bar />
+        <!-- <up-status-bar /> -->
         <scroll-view :style="{ paddingTop: `${topSafeAreaHeight}px` }" class="discount-coupon-list" scroll-y
             refresher-enabled :refresher-triggered="loading" @refresherrefresh="onRefresh" @scrolltolower="onLoadMore">
             <view class="list-content">

+ 1 - 1
src/pages-A/spendAndSaveCouponList/index.vue

@@ -81,7 +81,7 @@ onLoad((options) => {
     <view class="page-container">
         <view class="safe-top" :style="{ height: `${topSafeAreaHeight}px` }" />
         <up-navbar title="满减券" :auto-back="true" />
-        <up-status-bar />
+        <!-- <up-status-bar /> -->
         <scroll-view :style="{ paddingTop: `${topSafeAreaHeight}px` }" class="discount-coupon-list" scroll-y
             refresher-enabled :refresher-triggered="loading" @refresherrefresh="onRefresh" @scrolltolower="onLoadMore">
             <view class="list-content">