Prechádzať zdrojové kódy

优化:优化优惠券列表无法复制问题

haiyang 9 hodín pred
rodič
commit
413a97747c

+ 62 - 13
src/components/ShortLinkModal.vue

@@ -2,12 +2,10 @@
 import type { ICouponShareResult } from '../hooks/useCouponShare'
 import type { ICouponShareResult } from '../hooks/useCouponShare'
 
 
 // 监听showModal变化,当弹窗显示时自动获取分享短链
 // 监听showModal变化,当弹窗显示时自动获取分享短链
-import { watch } from 'vue'
-import { useCouponShare } from '../hooks/useCouponShare'
+import { ref, watch } from 'vue'
 
 
 // 定义props
 // 定义props
 const props = defineProps<{
 const props = defineProps<{
-    couponId?: string // 优惠券ID,从父组件传入
     showModal?: boolean // 控制弹窗显示/隐藏的prop
     showModal?: boolean // 控制弹窗显示/隐藏的prop
     shareLink?: string // 分享短链,从父组件传入
     shareLink?: string // 分享短链,从父组件传入
     shareHooks?: ICouponShareResult
     shareHooks?: ICouponShareResult
@@ -21,14 +19,66 @@ const emit = defineEmits<{
     (e: 'update:showModal', value: boolean): void
     (e: 'update:showModal', value: boolean): void
 }>()
 }>()
 
 
-const { copySuccess, shareLoading, copyShareLink, cleanShareLink } = props.shareHooks || {}
+// 计算属性,优先使用props中的shareHooks,如果没有则使用默认值
+const copySuccess = computed(() => props.shareHooks?.copySuccess || false)
+const shareLoading = computed(() => props.shareHooks?.shareLoading || false)
+const shareLinkDisplay = ref(props.shareLink)
 
 
-watch(() => props.showModal, (newVal) => {
-    console.log('showModal变化', newVal)
+watch(() => props.shareLink, () => {
+    console.log('shareLink变化了:', props.shareLink)
+    shareLinkDisplay.value = props.shareLink
 })
 })
 
 
+watch(() => shareLinkDisplay.value, (newValue) => {
+    console.log('shareLinkDisplay变化了:', newValue)
+})
+
+// 获取函数引用,优先使用props中的shareHooks
+function copyShareLink() {
+    if (props.shareHooks?.copyShareLink) {
+        props.shareHooks.copyShareLink()
+    }
+    else {
+        // 如果没有传递shareHooks,则使用默认的复制逻辑
+        if (!shareLinkDisplay.value) {
+            uni.showToast({
+                title: '没有可复制的内容',
+                icon: 'none',
+                duration: 2000,
+            })
+            return
+        }
+
+        uni.setClipboardData({
+            data: shareLinkDisplay.value,
+            success: () => {
+                uni.showToast({
+                    title: '复制成功',
+                    icon: 'success',
+                    duration: 2000,
+                })
+            },
+            fail: (error) => {
+                console.error('复制失败:', error)
+                uni.showToast({
+                    title: '复制失败',
+                    icon: 'none',
+                    duration: 2000,
+                })
+            }
+        })
+    }
+}
+
+function cleanShareLink() {
+    if (props.shareHooks?.cleanShareLink) {
+        props.shareHooks.cleanShareLink()
+    }
+}
+
 // 弹窗关闭时触发事件
 // 弹窗关闭时触发事件
 function handleClose() {
 function handleClose() {
+    console.log('shareLinkDisplay:', shareLinkDisplay.value)
     emit('update:showModal', false)
     emit('update:showModal', false)
     emit('close')
     emit('close')
     cleanShareLink()
     cleanShareLink()
@@ -40,13 +90,12 @@ function handleClose() {
     <up-modal title="分享优惠券" style="z-index: 1000;" :show="props.showModal" :show-confirm-button="false">
     <up-modal title="分享优惠券" style="z-index: 1000;" :show="props.showModal" :show-confirm-button="false">
         <view class="share-modal-content">
         <view class="share-modal-content">
             <view class="share-link-container">
             <view class="share-link-container">
-                <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 class="share-link">
+                    {{ shareLinkDisplay }}
+                </view>
+                <button class="copy-btn" @click="copyShareLink">
+                    复制
+                </button>
             </view>
             </view>
             <view v-if="copySuccess" class="copy-success">
             <view v-if="copySuccess" class="copy-success">
                 复制成功!
                 复制成功!

+ 1 - 2
src/components/spendAndSaveCoupon.vue

@@ -69,8 +69,7 @@ function handleCloseShareModal() {
         <button class="coupon-btn" @click="handleShareCoupon">
         <button class="coupon-btn" @click="handleShareCoupon">
             去发券
             去发券
         </button>
         </button>
-        <ShortLinkModal v-model:show-modal="showShareModal" :coupon-id="couponTemplateId" :share-link="couponShareLink"
-            :share-hooks="shareHooks" @close="handleCloseShareModal" />
+        <ShortLinkModal v-model:show-modal="showShareModal" :share-link="couponShareLink" :share-hooks="shareHooks" />
     </view>
     </view>
 </template>
 </template>
 
 

+ 3 - 2
src/pages-A/discountcouponList/index.vue

@@ -82,10 +82,11 @@ onShareAppMessage(async (options) => {
 })
 })
 // #endif
 // #endif
 
 
-function handleShareClick(shareLink, shareHooks) {
+function handleShareClick(shareLink, hooks) {
+    console.log(hooks)
+    shareHooks.value = hooks
     couponShareLink.value = shareLink
     couponShareLink.value = shareLink
     showShareModal.value = true
     showShareModal.value = true
-    shareHooks.value = shareHooks
 }
 }
 </script>
 </script>
 
 

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

@@ -81,10 +81,10 @@ onLoad((options) => {
     }
     }
 })
 })
 
 
-function handleShareClick(shareLink, shareHooks) {
+function handleShareClick(shareLink, hooks) {
     couponShareLink.value = shareLink
     couponShareLink.value = shareLink
     showShareModal.value = true
     showShareModal.value = true
-    shareHooks.value = shareHooks
+    shareHooks.value = hooks
 }
 }
 </script>
 </script>