feat: 添加页面切换动画，优化路由视图体验

src/App.vue

@@ -5,6 +5,10 @@ import 'vue-sonner/style.css'
 </script>
 
 <template>
-  <RouterView />
+  <RouterView v-slot="{ Component, route }">
+    <Transition name="page" mode="out-in">
+      <component :is="Component" :key="route.fullPath" />
+    </Transition>
+  </RouterView>
   <Toaster class="pointer-events-auto" />
 </template>

src/style.css

@@ -122,3 +122,19 @@
     @apply bg-background text-foreground;
   }
 }
+
+/* Page transition animations */
+.page-enter-active,
+.page-leave-active {
+  transition: opacity 200ms ease, transform 200ms ease;
+}
+.page-enter-from,
+.page-leave-to {
+  opacity: 0;
+  transform: translateY(8px);
+}
+.page-enter-to,
+.page-leave-from {
+  opacity: 1;
+  transform: translateY(0);
+}