refactor(导航): 将内部路由链接替换为外部链接
将HomePage.vue和ActivityCard.vue中的`<router-link>`替换为`<a>`标签和`window.open`方法,以便点击后在新标签页打开外部链接
Showing
2 changed files
with
10 additions
and
6 deletions
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2025-03-20 20:36:36 | 2 | * @Date: 2025-03-20 20:36:36 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-03-21 17:21:45 | 4 | + * @LastEditTime: 2025-03-24 14:32:02 |
| 5 | * @FilePath: /mlaj/src/components/ui/ActivityCard.vue | 5 | * @FilePath: /mlaj/src/components/ui/ActivityCard.vue |
| 6 | * @Description: 文件描述 | 6 | * @Description: 文件描述 |
| 7 | --> | 7 | --> |
| 8 | <template> | 8 | <template> |
| 9 | - <router-link :to="`/activities/${activity.id}`" class="block mb-4"> | 9 | + <div @click="navigateToActivity" class="block mb-4"> |
| 10 | <FrostedGlass class="flex overflow-hidden rounded-xl shadow-sm"> | 10 | <FrostedGlass class="flex overflow-hidden rounded-xl shadow-sm"> |
| 11 | <!-- Activity Image --> | 11 | <!-- Activity Image --> |
| 12 | <div class="w-1/3 h-28 relative"> | 12 | <div class="w-1/3 h-28 relative"> |
| ... | @@ -71,19 +71,23 @@ | ... | @@ -71,19 +71,23 @@ |
| 71 | </div> | 71 | </div> |
| 72 | </div> | 72 | </div> |
| 73 | </FrostedGlass> | 73 | </FrostedGlass> |
| 74 | - </router-link> | 74 | + </div> |
| 75 | </template> | 75 | </template> |
| 76 | 76 | ||
| 77 | <script setup> | 77 | <script setup> |
| 78 | import FrostedGlass from './FrostedGlass.vue' | 78 | import FrostedGlass from './FrostedGlass.vue' |
| 79 | 79 | ||
| 80 | -defineProps({ | 80 | +const props = defineProps({ |
| 81 | activity: { | 81 | activity: { |
| 82 | type: Object, | 82 | type: Object, |
| 83 | required: true | 83 | required: true |
| 84 | } | 84 | } |
| 85 | }) | 85 | }) |
| 86 | 86 | ||
| 87 | +const navigateToActivity = () => { | ||
| 88 | + window.open(`https://example.com/activities/${props.activity.id}`, '_blank') | ||
| 89 | +} | ||
| 90 | + | ||
| 87 | const getStatusClass = (status) => { | 91 | const getStatusClass = (status) => { |
| 88 | switch (status) { | 92 | switch (status) { |
| 89 | case '活动中': | 93 | case '活动中': | ... | ... |
| ... | @@ -303,12 +303,12 @@ | ... | @@ -303,12 +303,12 @@ |
| 303 | <section class="mb-7"> | 303 | <section class="mb-7"> |
| 304 | <div class="flex justify-between items-center mb-3"> | 304 | <div class="flex justify-between items-center mb-3"> |
| 305 | <h3 class="font-medium">最新活动</h3> | 305 | <h3 class="font-medium">最新活动</h3> |
| 306 | - <router-link to="/activities" class="text-xs text-gray-500 flex items-center"> | 306 | + <a href="https://www.mlaj.com/activities" target="_blank" class="text-xs text-gray-500 flex items-center"> |
| 307 | 更多 | 307 | 更多 |
| 308 | <svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3 ml-1" fill="none" viewBox="0 0 24 24" stroke="currentColor"> | 308 | <svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3 ml-1" fill="none" viewBox="0 0 24 24" stroke="currentColor"> |
| 309 | <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" /> | 309 | <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" /> |
| 310 | </svg> | 310 | </svg> |
| 311 | - </router-link> | 311 | + </a> |
| 312 | </div> | 312 | </div> |
| 313 | <div class="space-y-4"> | 313 | <div class="space-y-4"> |
| 314 | <div v-for="activity in activities.slice(0, 3)" :key="activity.id"> | 314 | <div v-for="activity in activities.slice(0, 3)" :key="activity.id"> | ... | ... |
-
Please register or login to post a comment