update
This commit is contained in:
parent
1290832735
commit
45d4816c3a
@ -37,6 +37,7 @@
|
|||||||
<a-space size="small" class="action-column">
|
<a-space size="small" class="action-column">
|
||||||
<a @click="handleEdit(record)">编辑</a>
|
<a @click="handleEdit(record)">编辑</a>
|
||||||
<a @click="handleGetQrCode(record)">获取二维码</a>
|
<a @click="handleGetQrCode(record)">获取二维码</a>
|
||||||
|
<a @click="handleGetLink(record)">获取链接</a>
|
||||||
</a-space>
|
</a-space>
|
||||||
</template>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
@ -255,6 +256,41 @@
|
|||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</a-modal>
|
</a-modal>
|
||||||
|
|
||||||
|
<!-- 活动链接模态框 -->
|
||||||
|
<a-modal
|
||||||
|
v-model:visible="linkModalVisible"
|
||||||
|
title="活动链接"
|
||||||
|
@cancel="handleLinkModalCancel"
|
||||||
|
:footer="null"
|
||||||
|
width="500px"
|
||||||
|
centered
|
||||||
|
>
|
||||||
|
<div class="link-container">
|
||||||
|
<div v-if="linkLoading" class="link-loading">
|
||||||
|
<a-spin />
|
||||||
|
<p>获取链接中...</p>
|
||||||
|
</div>
|
||||||
|
<template v-else>
|
||||||
|
<div class="link-content">
|
||||||
|
<a-input
|
||||||
|
v-model:value="activityLink"
|
||||||
|
class="link-input"
|
||||||
|
readonly
|
||||||
|
>
|
||||||
|
<template #addonAfter>
|
||||||
|
<a-button type="link" @click="copyLink" size="small">
|
||||||
|
复制
|
||||||
|
</a-button>
|
||||||
|
</template>
|
||||||
|
</a-input>
|
||||||
|
</div>
|
||||||
|
<div class="link-tip">
|
||||||
|
<p>复制链接分享给用户参与活动</p>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</a-modal>
|
||||||
</div>
|
</div>
|
||||||
</page-container>
|
</page-container>
|
||||||
</template>
|
</template>
|
||||||
@ -274,7 +310,8 @@ import {
|
|||||||
Checkbox,
|
Checkbox,
|
||||||
Card,
|
Card,
|
||||||
Divider,
|
Divider,
|
||||||
Spin
|
Spin,
|
||||||
|
Button
|
||||||
} from 'ant-design-vue'
|
} from 'ant-design-vue'
|
||||||
import PageContainer from '@/components/PageContainer.vue'
|
import PageContainer from '@/components/PageContainer.vue'
|
||||||
import dayjs from 'dayjs'
|
import dayjs from 'dayjs'
|
||||||
@ -297,7 +334,8 @@ export default defineComponent({
|
|||||||
ACard: Card,
|
ACard: Card,
|
||||||
ADivider: Divider,
|
ADivider: Divider,
|
||||||
QrcodeVue,
|
QrcodeVue,
|
||||||
ASpin: Spin
|
ASpin: Spin,
|
||||||
|
AButton: Button
|
||||||
},
|
},
|
||||||
|
|
||||||
setup() {
|
setup() {
|
||||||
@ -714,6 +752,11 @@ export default defineComponent({
|
|||||||
const qrCodeModalVisible = ref(false)
|
const qrCodeModalVisible = ref(false)
|
||||||
const qrCodeUrl = ref('')
|
const qrCodeUrl = ref('')
|
||||||
const qrCodeLoading = ref(false)
|
const qrCodeLoading = ref(false)
|
||||||
|
|
||||||
|
// 活动链接相关
|
||||||
|
const linkModalVisible = ref(false)
|
||||||
|
const activityLink = ref('')
|
||||||
|
const linkLoading = ref(false)
|
||||||
|
|
||||||
// 获取活动二维码
|
// 获取活动二维码
|
||||||
const handleGetQrCode = async (record) => {
|
const handleGetQrCode = async (record) => {
|
||||||
@ -722,7 +765,7 @@ export default defineComponent({
|
|||||||
qrCodeLoading.value = true
|
qrCodeLoading.value = true
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const res = await request.get(`/api/coupon-activities/${record.id}/get_url_link`)
|
const res = await request.get(`/api/coupon-activities/${record.id}/get_qr_code`)
|
||||||
if (res.code === 200) {
|
if (res.code === 200) {
|
||||||
qrCodeUrl.value = res.data
|
qrCodeUrl.value = res.data
|
||||||
} else {
|
} else {
|
||||||
@ -738,6 +781,58 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 获取活动链接
|
||||||
|
const handleGetLink = async (record) => {
|
||||||
|
// 先显示模态框
|
||||||
|
linkModalVisible.value = true
|
||||||
|
linkLoading.value = true
|
||||||
|
|
||||||
|
try {
|
||||||
|
const res = await request.get(`/api/coupon-activities/${record.id}/get_url_link`)
|
||||||
|
if (res.code === 200) {
|
||||||
|
activityLink.value = res.data
|
||||||
|
} else {
|
||||||
|
message.error('获取活动链接失败')
|
||||||
|
linkModalVisible.value = false
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('获取活动链接失败:', error)
|
||||||
|
message.error('获取活动链接失败')
|
||||||
|
linkModalVisible.value = false
|
||||||
|
} finally {
|
||||||
|
linkLoading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 复制链接到剪贴板
|
||||||
|
const copyLink = () => {
|
||||||
|
if (!activityLink.value) {
|
||||||
|
message.error('链接为空,无法复制')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// 创建临时输入框
|
||||||
|
const input = document.createElement('input')
|
||||||
|
input.value = activityLink.value
|
||||||
|
document.body.appendChild(input)
|
||||||
|
input.select()
|
||||||
|
|
||||||
|
try {
|
||||||
|
document.execCommand('copy')
|
||||||
|
message.success('复制成功')
|
||||||
|
} catch (error) {
|
||||||
|
console.error('复制失败:', error)
|
||||||
|
message.error('复制失败')
|
||||||
|
} finally {
|
||||||
|
document.body.removeChild(input)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 取消链接模态框
|
||||||
|
const handleLinkModalCancel = () => {
|
||||||
|
linkModalVisible.value = false
|
||||||
|
}
|
||||||
|
|
||||||
// 取消二维码模态框
|
// 取消二维码模态框
|
||||||
const handleQrCodeModalCancel = () => {
|
const handleQrCodeModalCancel = () => {
|
||||||
qrCodeModalVisible.value = false
|
qrCodeModalVisible.value = false
|
||||||
@ -776,7 +871,14 @@ export default defineComponent({
|
|||||||
handleGetQrCode,
|
handleGetQrCode,
|
||||||
handleQrCodeModalCancel,
|
handleQrCodeModalCancel,
|
||||||
getCouponConfigValue,
|
getCouponConfigValue,
|
||||||
handleCouponConfigChange
|
handleCouponConfigChange,
|
||||||
|
// 新增链接相关
|
||||||
|
linkModalVisible,
|
||||||
|
activityLink,
|
||||||
|
linkLoading,
|
||||||
|
handleGetLink,
|
||||||
|
copyLink,
|
||||||
|
handleLinkModalCancel
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@ -949,4 +1051,36 @@ export default defineComponent({
|
|||||||
margin-top: 16px;
|
margin-top: 16px;
|
||||||
color: rgba(0, 0, 0, 0.65);
|
color: rgba(0, 0, 0, 0.65);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 链接相关样式 */
|
||||||
|
.link-container {
|
||||||
|
padding: 10px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.link-loading {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.link-loading p {
|
||||||
|
margin-top: 16px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
}
|
||||||
|
|
||||||
|
.link-content {
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.link-input {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.link-tip {
|
||||||
|
text-align: center;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
Loading…
Reference in New Issue
Block a user