feat(AD): 添加轮播图按钮点击逻辑

- 在轮播图按钮上添加点击事件处理函数
- 实现按钮点击时的跳转逻辑:
  - 如果当前广告有配置 URL,则跳转到该 URL
  - 如果没有配置 URL,则跳转到智能生成页面
This commit is contained in:
Huangzhe
2025-05-26 11:38:25 +08:00
parent f9b5d001e5
commit 23b1a46bec

View File

@@ -1,8 +1,9 @@
<script setup lang="ts">
import { fetchBanners } from '@/hooks/request/banner';
import { computed } from 'vue';
import { useRoute } from 'vue-router';
import { useRoute, useRouter } from 'vue-router';
const router = useRouter();
const { banners } = fetchBanners();
const route = useRoute();
const bannerInfo = computed(() => {
@@ -10,6 +11,15 @@ const bannerInfo = computed(() => {
return banners.value?.find((item: any) => item.code === route.params.code);
});
function handleButtonClick() {
if (!bannerInfo.value?.url) {
router.push({ name: 'intelligentGeneration' });
return;
}
window.location.href = bannerInfo.value?.url;
}
</script>
<template>
@@ -51,7 +61,9 @@ const bannerInfo = computed(() => {
>
<!-- 立即进入 -->
<el-button style="width: 95%; height: 50px; border-radius: 15px" color="#70b937">
<el-text style="color: white">{{ bannerInfo.button_name }}</el-text>
<el-text style="color: white" @click="handleButtonClick">{{
bannerInfo.button_name
}}</el-text>
</el-button>
</section>
</section>