|
|
@@ -2,12 +2,10 @@
|
|
|
import type { ICouponShareResult } from '../hooks/useCouponShare'
|
|
|
|
|
|
// 监听showModal变化,当弹窗显示时自动获取分享短链
|
|
|
-import { watch } from 'vue'
|
|
|
-import { useCouponShare } from '../hooks/useCouponShare'
|
|
|
+import { ref, watch } from 'vue'
|
|
|
|
|
|
// 定义props
|
|
|
const props = defineProps<{
|
|
|
- couponId?: string // 优惠券ID,从父组件传入
|
|
|
showModal?: boolean // 控制弹窗显示/隐藏的prop
|
|
|
shareLink?: string // 分享短链,从父组件传入
|
|
|
shareHooks?: ICouponShareResult
|
|
|
@@ -21,14 +19,66 @@ const emit = defineEmits<{
|
|
|
(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() {
|
|
|
+ console.log('shareLinkDisplay:', shareLinkDisplay.value)
|
|
|
emit('update:showModal', false)
|
|
|
emit('close')
|
|
|
cleanShareLink()
|
|
|
@@ -40,13 +90,12 @@ function handleClose() {
|
|
|
<up-modal title="分享优惠券" style="z-index: 1000;" :show="props.showModal" :show-confirm-button="false">
|
|
|
<view class="share-modal-content">
|
|
|
<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 v-if="copySuccess" class="copy-success">
|
|
|
复制成功!
|