feat: optimize router logic

This commit is contained in:
2026-01-29 20:57:04 +08:00
parent 15885463d3
commit 110aec7d5f
7 changed files with 35 additions and 184 deletions

View File

@@ -1,19 +0,0 @@
<script lang="ts" setup>
// About page component
</script>
<template>
<div class="hero min-h-screen bg-base-200">
<div class="hero-content text-center">
<div class="max-w-md">
<h1 class="text-5xl font-bold">关于我们</h1>
<p class="py-6">这是一个自动路由注册的示例页面</p>
<p>路径将自动转换为 /about</p>
</div>
</div>
</div>
</template>
<style scoped>
/* Component styles */
</style>

View File

@@ -1,77 +0,0 @@
<script lang="ts" setup>
import { range } from "radash";
import { usePagination } from "@/utils/pagination";
const merchandise = ref([
{
id: 1,
name: "商品1",
},
]);
const { currentPage, changePage, pageNumbers, totalPages, getPaginatedData } =
usePagination(() => merchandise.value);
const handlePageChange = (page: number) => {
changePage(page);
};
onMounted(async () => {
await new Promise(() => {
setTimeout(() => {
merchandise.value = Array.from(range(1, 50)).map((item) => ({
id: item,
name: `商品${item}`,
}));
}, 1000);
});
});
</script>
<template>
<div class="hero min-h-screen bg-base-200">
<div class="hero-content text-center">
<div class="max-w-md">
<h1 class="text-5xl font-bold">帮助</h1>
</div>
<div>
<ul>
<li v-for="item in getPaginatedData" :key="item.id">
{{ item.name }}
</li>
</ul>
</div>
<button
class="join-item btn btn-sm"
:disabled="currentPage === 1"
@click="handlePageChange(currentPage - 1)"
>
«
</button>
<button
v-for="page in pageNumbers"
:key="page"
class="join-item btn btn-sm"
:class="{
'btn-active': page === currentPage,
'btn-disabled': page === '...',
}"
@click="page !== '...' && handlePageChange(Number(page))"
>
{{ page }}
</button>
<button
class="join-item btn btn-sm"
:disabled="currentPage === totalPages"
@click="handlePageChange(currentPage + 1)"
>
»
</button>
</div>
</div>
</template>
<style scoped>
/* Component styles */
</style>

View File

@@ -6,8 +6,8 @@
<div class="hero min-h-screen bg-base-200">
<div class="hero-content text-center">
<div class="max-w-md">
<h1 class="text-5xl font-bold">首页</h1>
<p class="py-6">欢迎使用自动路由系统</p>
<h1 class="text-5xl font-bold">Hucky</h1>
<p class="py-6">自动路由系统已加载</p>
</div>
</div>
</div>

View File

@@ -1,15 +0,0 @@
<script lang="ts" setup></script>
<template>
<div class="hero min-h-screen bg-base-200">
<div class="hero-content text-center">
<div class="max-w-md">
<h1 class="text-5xl font-bold">我的</h1>
<p class="py-6">这是一个自动路由注册的示例页面</p>
<p>路径将自动转换为 /panel/me</p>
</div>
</div>
</div>
</template>
<style scoped></style>