fix:修复工具详情页中跳转关于页面404问题

This commit is contained in:
陶然
2026-03-02 16:43:57 +08:00
parent 5bbe38f6fe
commit f492194fab
2 changed files with 1 additions and 94 deletions
+1 -1
View File
@@ -50,7 +50,7 @@ const gotoAnchor = (anchor: string) => {
}
}
const gotoAbout = () => {
router.push('about')
router.push('/about')
}
onMounted(async () => {
@@ -1,93 +0,0 @@
<script setup lang="ts">
import { onMounted, ref, computed } from 'vue';
import { RouterLink } from 'vue-router';
import { useToolsStore } from '@/store/modules/tools';
const props = defineProps({
title: {
type: String,
default: '推荐工具'
},
cateId: {
type: Number,
default: 0
},
currentUrl: {
type: String,
default: ''
}
});
const toolsStore = useToolsStore();
const recommendedTools = ref([]);
// 随机打乱数组
const shuffleArray = (array: any[]) => {
const shuffled = [...array];
for (let i = shuffled.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]];
}
return shuffled;
};
// 计算推荐工具
const getRecommendedTools = () => {
if (!props.cateId) return [];
// 获取当前分类下的所有工具
let allTools = [];
toolsStore.cates.forEach(cate => {
if (cate.id === props.cateId) {
allTools = cate.list;
}
});
// 过滤掉当前工具
const otherTools = allTools.filter(tool => {
const toolUrl = tool.url.replace(/\/$/, '');
const currentUrl = props.currentUrl.replace(/\/$/, '');
return toolUrl !== currentUrl;
});
// 随机打乱并取前4个
const shuffled = shuffleArray(otherTools);
return shuffled.slice(0, 4);
};
onMounted(() => {
// 加载工具分类
toolsStore.getToolCate().then(() => {
recommendedTools.value = getRecommendedTools();
});
});
</script>
<template>
<!-- 推荐工具 -->
<div class="mt-3 rounded-2xl bg-white p-4">
<el-divider content-position="left">{{ props.title }}</el-divider>
<div class="m-4">
<div v-if="recommendedTools.length > 0" class="grid grid-cols-2 md:grid-cols-4 gap-4">
<router-link
v-for="tool in recommendedTools"
:key="tool.url"
:to="tool.url"
class="flex flex-col items-center p-3 border rounded-lg hover:shadow-md transition-shadow"
>
<el-image :src="tool.logo" class="w-12 h-12 mb-2 rounded-full"></el-image>
<div class="text-center">
<div class="font-medium text-sm line-clamp-1">{{ tool.title }}</div>
</div>
</router-link>
</div>
<div v-else class="text-center text-gray-500 py-4">
暂无推荐工具
</div>
</div>
</div>
</template>
<style scoped>
</style>