自动路由-bug版

components.d.ts

@@ -24,11 +24,15 @@ declare module 'vue' {
     DMenu: typeof import('vue-devui/menu/index.es.js')['Menu']
     DMenuItem: typeof import('vue-devui/menu/index.es.js')['MenuItem']
     DModal: typeof import('vue-devui/modal/index.es.js')['Modal']
+    DPopover: typeof import('vue-devui/popover/index.es.js')['Popover']
+    DSearch: typeof import('vue-devui/search/index.es.js')['Search']
     DSelect: typeof import('vue-devui/select/index.es.js')['Select']
     DTab: typeof import('vue-devui/tabs/index.es.js')['Tab']
     DTabs: typeof import('vue-devui/tabs/index.es.js')['Tabs']
+    DUpload: typeof import('vue-devui/upload/index.es.js')['Upload']
     HomeSide: typeof import('./src/components/homeSide.vue')['default']
-    Menu: typeof import('./src/components/menu.vue')['default']
+    Menu: typeof import('./src/components/menuH.vue')['default']
+    MenuH: typeof import('./src/components/menuH.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
   }

package.json

@@ -17,6 +17,7 @@
     "@devui-design/icons": "^1.4.0",
     "@heroicons/vue": "^2.2.0",
     "@unocss/reset": "^66.3.3",
+    "@vicons/ionicons4": "^0.13.0",
     "aplayer": "^1.10.1",
     "axios": "^1.11.0",
     "devui-theme": "^0.0.7",
@@ -29,8 +30,9 @@
     "unocss": "^66.3.3",
     "unplugin-auto-import": "^19.3.0",
     "unplugin-vue-components": "^28.8.0",
+    "unplugin-vue-router": "^0.15.0",
     "vite-svg-loader": "^5.1.0",
-    "vue": "^3.5.18",
+    "vue": "^3.6.0-alpha.2",
     "vue-devui": "^1.6.33",
     "vue-router": "^4.5.1",
     "vue3-cookies": "^1.0.6",

src/App.vue

@@ -1,7 +1,8 @@
 <template>
   <div>
     <PerfectScrollbar>
-      <router-view></router-view>
+      <!-- <router-view></router-view> -->
+       <lay-index></lay-index>
     </PerfectScrollbar>
   </div>
 
@@ -18,6 +19,7 @@
 </template>
 
 <script setup lang="ts">
+import layIndex from './Index.vue'
 // 空白项目入口
 const modal = reactive<any>({
   visible: false,

src/Index.vue

@@ -21,8 +21,10 @@
 
 <script setup lang="ts">
 // 空白项目入口
-import menuH from '@/components/menu.vue';
+// definePage({
-const route = useRoute();
+//   path:"/",
+// })
+const route = useRoute()
 
 
 </script>

src/api/file/index.ts

@@ -8,3 +8,19 @@ export function getFileList(params: Record<string, string>) {
     params,
   });
 }
+//getMyList
+export function getMyList(params: Record<string, string>) {
+  return request({
+    url: "/files/myfile",
+    method: "get",
+    params,
+  });
+}
+//putShare
+export function putShare(data: Record<string, string>) {
+  return request({
+    url: `/files/${data.pid}`,
+    method: "put",
+    data,
+  });
+}

src/components/homeSide.vue

@@ -1,17 +1,19 @@
 <template>
   <div class="pr-8">
-    <d-card shadow="never" class="mt-10 bg-white">
+    <!-- <d-card shadow="never" class="mt-10 bg-white"> -->
-      <template #title>
+    <div class="dt-card mt-10 bg-white">
-        <div class="flex items-center">
+      <!-- <template #title> -->
-          <icon-time class="w-5 mr-2"></icon-time>
+      <div class="flex items-center">
-          时间日期
+        <icon-time class="w-5 mr-2"></icon-time>
-        </div>
+        时间日期
-      </template>
+      </div>
-      <template #content>
+      <!-- </template> -->
-        <div class="w-full text-center text-[#ec66ab] font-500 text-4xl font-[yj]">{{ t }}</div>
+      <!-- <template #content> -->
-        <div class="mt-3 text-right">{{ d }}</div>
+      <div class="w-full text-center text-[#ec66ab] font-500 text-4xl font-[yj]">{{ t }}</div>
-      </template>
+      <div class="mt-3 text-right">{{ d }}</div>
-    </d-card>
+      <!-- </template> -->
+    </div>
+    <!-- </d-card> -->
 
     <d-card shadow="never" class="mt-10 bg-white">
       <template #title>
@@ -117,4 +119,9 @@ onUnmounted(() => {
   src: url('@/assets/font/LCDML.woff2');
 }
 
+.dt-card {
+  background-image: url('@/assets/images/中秋节中国风边框34.png');
+  background-size: 100% 100%;
+  padding: 20px 40px;
+}
 </style>

src/components/menuH.vue

@@ -164,10 +164,11 @@ function toLogin() {
 
 
 onMounted(() => {
-  console.log(route.name);
+ 
   userinfo.value = $cookies.get('userinfo');
   console.log('>>>>>>>>>>', userinfo.value);
   key.value = route.name as string;
+  console.log('>>> --> route.name:', route.name)
   getLocation(); // 组件挂载时获取位置
 
   const h: number = nav.value.clientHeight

src/icon/download.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="size-6">
+  <path fill-rule="evenodd" d="M9.75 6.75h-3a3 3 0 0 0-3 3v7.5a3 3 0 0 0 3 3h7.5a3 3 0 0 0 3-3v-7.5a3 3 0 0 0-3-3h-3V1.5a.75.75 0 0 0-1.5 0v5.25Zm0 0h1.5v5.69l1.72-1.72a.75.75 0 1 1 1.06 1.06l-3 3a.75.75 0 0 1-1.06 0l-3-3a.75.75 0 1 1 1.06-1.06l1.72 1.72V6.75Z" clip-rule="evenodd" />
+  <path d="M7.151 21.75a2.999 2.999 0 0 0 2.599 1.5h7.5a3 3 0 0 0 3-3v-7.5c0-1.11-.603-2.08-1.5-2.599v7.099a4.5 4.5 0 0 1-4.5 4.5H7.151Z" />
+</svg>

src/icon/lock.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="size-6">
+  <path fill-rule="evenodd" d="M12 1.5a5.25 5.25 0 0 0-5.25 5.25v3a3 3 0 0 0-3 3v6.75a3 3 0 0 0 3 3h10.5a3 3 0 0 0 3-3v-6.75a3 3 0 0 0-3-3v-3c0-2.9-2.35-5.25-5.25-5.25Zm3.75 8.25v-3a3.75 3.75 0 1 0-7.5 0v3h7.5Z" clip-rule="evenodd" />
+</svg>

src/icon/unlock.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="size-6">
+  <path d="M18 1.5c2.9 0 5.25 2.35 5.25 5.25v3.75a.75.75 0 0 1-1.5 0V6.75a3.75 3.75 0 1 0-7.5 0v3a3 3 0 0 1 3 3v6.75a3 3 0 0 1-3 3H3.75a3 3 0 0 1-3-3v-6.75a3 3 0 0 1 3-3h9v-3c0-2.9 2.35-5.25 5.25-5.25Z" />
+</svg>

src/main.ts

@@ -3,7 +3,7 @@ import { useConfig } from "@/config";
 import icon from "@/icon/index.ts";
 import { createPinia } from "pinia";
 import "virtual:uno.css";
-import { createApp } from "vue";
+import { createApp, vaporInteropPlugin } from "vue";
 import App from "./App.vue";
 import router from "./router";
 // 自定义主题配置 - 设置主色和二级色
@@ -16,6 +16,7 @@ const themeService = ThemeServiceInit({ infinityTheme }, "infinityTheme");
 themeService?.applyTheme(sweetTheme);
 const app = createApp(App);
 
+app.use(vaporInteropPlugin)
 app.use(createPinia());
 app.use(router);
 

src/router/index.ts

@@ -1,100 +1,21 @@
 import { createRouter, createWebHistory } from "vue-router";
-
+import { routes } from 'vue-router/auto-routes';
-import layout from "@/Layout.vue";
+// import layout from "@/Layout.vue";
-import Home from '@/views/Home.vue';
+// import Home from '@/views/Home.vue';
 
 // 导入视图组件 - 修改为@开头的懒加载路径
 
-const Gallery = () => import("@/views/Gallery.vue");
+// const Gallery = () => import("@/views/Gallery.vue");
-const Article = () => import("@/views/Article.vue");
+// const Article = () => import("@/views/Article.vue");
-const Widget = () => import("@/views/Widget.vue");
+// const Widget = () => import("@/views/Widget.vue");
-const AppShare = () => import("@/views/AppShare.vue");
+// const AppShare = () => import("@/views/AppShare.vue");
-const Plink = () => import("@/views/Plink.vue");
+// const Plink = () => import("@/views/Plink.vue");
-const Login = () => import("@/views/login/Login.vue");
+// const Login = () => import("@/views/Login.vue");
-const NotFound = () => import("@/views/NotFound.vue");
+// const NotFound = () => import("@/views/NotFound.vue");
 
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
-  routes: [
+  routes:routes as any
-    {
-      path: "/",
-      
-      meta: {},
-      children: [
-        {
-          path: "/",
-          component: layout,
-          redirect: {name:'home'},
-          children: [
-            {
-              path: "/home",
-              name: "home",
-              component: Home,
-              meta: {
-                title:'首页'
-              },
-            },
-            {
-              path: "/gallery",
-              name: "gallery",
-              component: Gallery,
-              meta: {
-                title:'画廊'
-              },
-            },
-            {
-              path: "/article",
-              name: "article",
-              component: Article,
-              meta: {
-                title:'文章'
-              },
-            },
-            {
-              path: "/widget",
-              name: "widget",
-              component: Widget,
-              meta: {
-                title:'工具'
-              },
-            },
-            {
-              path: "/appshare",
-              name: "appShare",
-              component: AppShare,
-              meta: {
-                title:'软件分享'
-              },
-            },
-            {
-              path: "/plink",
-              name: "plink",
-              component: Plink,
-              meta: {
-                title:'友链'
-              },
-            },
-          ],
-        },
-        {
-          path: "/login",
-          name: "login",
-          component: Login,
-          meta: {
-            title:'登录'
-          },
-        },
-        {
-          path: "/404",
-          name: "404",
-          component: NotFound,
-          meta: {
-            title:'错误页'
-          },
-        },
-      ],
-    },
-  ],
 });
 
 export default router;

src/views/Gallery.vue

@@ -1,8 +1,10 @@
 <template>
   <PerfectScrollbar ref="scrollbar" @ps-scroll-y="handleScroll">
-    <div class="gallery-page py-5 px-[10%]">
+    <div ref="myCon" class="gallery-page py-5 px-[10%]">
-      <d-tabs v-model="tid" type="slider">
+      <d-tabs v-model="tid" type="options" :before-change="beforeChange" @active-tab-change.native="activeTabChange">
         <d-tab id="share" title="画廊">
+          <d-search class="mt-0 mb-8 w-2/3 mx-auto rounded-full" v-model="kw" is-keyup-search :delay="1000"
+            @search="onSearch"></d-search>
           <div class="gallery-container w-full box-border">
             <!-- 瀑布流容器 -->
             <div ref="waterfallContainer" v-image-preview
@@ -10,25 +12,105 @@
               <!-- 动态生成的列 -->
               <div v-for="(column, index) in columns" :key="index" class="waterfall-column flex flex-col w-[240px]">
                 <div v-for="item in column" :key="item.id"
-                  class="gallery-item my-[10px] rounded-lg overflow-hidden transition-transform duration-300 box-border hover:-translate-y-1.5">
+                  class="gallery-item group relative my-[10px] rounded-lg overflow-hidden transition-transform duration-300 box-border hover:-translate-y-1.5">
+                  <div
+                    class="absolute px-2 truncate hidden group-hover:block top-0 text-center w-full bg-[#00000070] text-white">
+                    {{ item.filename }}</div>
                   <img :src="item.filepath" alt="" class="gallery-image block w-full h-auto object-cover rounded-md">
+                  <div class="px-2 absolute  bottom-0 flex justify-between w-full bg-[#00000060]">
+                    <div class="text-white ">由 <span class="text-[#f1d9db] font-600">{{ item.nickname }}</span> 上传</div>
+                    <d-popover content="下载" trigger="hover" class="!bg-primary" style="color: #fff">
+                      <icon-download @click="downloadFile(item.filepath)"
+                        class="w-5 h-5 text-white hover-text-primary"></icon-download>
+                    </d-popover>
+                  </div>
                 </div>
               </div>
             </div>
             <!-- 加载中指示器 -->
             <div v-if="loading" class="loading-indicator text-center p-5 text-gray-600">加载中...</div>
+            <div v-else class="loading-indicator text-center p-5 text-gray-600">已全部加载完成</div>
+          </div>
+        </d-tab>
+        <d-tab id="my" title="我的">
+          <div>
+            <d-upload class="py-8 upload-demo border-2 border-dashed border-gray-300 rounded-md p-4"
+              :on-success="handleSuccess" :upload-options="uploadOptions" droppable="true">
+              <div class="w-full h-full flex flex-col items-center justify-center">
+                <div><d-icon name="upload" size="32px"></d-icon></div>
+                <div class="my-2">
+                  将文件拖到此处，或
+                  <span class="devui-link text-[#ec66ab]">点击上传</span>
+                </div>
+                <div class="text-sm text-gray-500">注意图片大小不要大于5MB哟~</div>
+              </div>
+            </d-upload>
+          </div>
+          <div class="gallery-container w-full box-border">
+            <!-- 瀑布流容器 -->
+            <div ref="waterfallContainer" v-image-preview
+              class="waterfall-container flex justify-between flex-nowrap w-full overflow-hidden">
+              <!-- 动态生成的列 -->
+              <div v-for="(column, index) in columns" :key="index" class="waterfall-column flex flex-col w-[240px]">
+                <div v-for="item in column" :key="item.id"
+                  class="gallery-item group relative my-[10px] rounded-lg overflow-hidden transition-transform duration-300 box-border hover:-translate-y-1.5">
+                  <div
+                    class="px-2 truncate absolute hidden group-hover:block top-0 text-center w-full bg-[#00000070] text-white">
+                    {{ item.filename }}
+                  </div>
+                  <img :src="item.filepath" alt="" class="gallery-image block w-full h-auto object-cover rounded-md">
+                  <div class="pr-2 absolute  bottom-0 flex justify-between items-center w-full bg-[#00000060]">
+                    <div class="text-white ">
+                      <span class="px-2 py-1 bg-primary rounded-full" v-if="item.share">已共享</span>
+                      <span class="px-2 py-1 bg-[#ffa500] rounded-full" v-else>未共享</span>
+                    </div>
+                    <div class="icon flex items-center">
+                      <d-popover content="下载" trigger="hover" class="!bg-primary" style="color: #fff">
+                        <icon-download @click="downloadFile(item.filepath)"
+                          class="w-5 h-5 mr-2 text-white hover-text-primary"></icon-download>
+                      </d-popover>
+                      <d-popover v-if="item.share" content="取消共享" trigger="hover" class="!bg-primary"
+                        style="color: #fff">
+                        <icon-lock @click="handdleShare(item.pid, item.share)"
+                          class="w-5 h-5 text-white hover-text-primary"></icon-lock>
+                      </d-popover>
+                      <d-popover v-else content="共享" trigger="hover" class="!bg-primary" style="color: #fff">
+                        <icon-unlock @click="handdleShare(item.pid, item.share)"
+                          class="w-5 h-5 text-white hover-text-primary"></icon-unlock>
+                      </d-popover>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- 加载中指示器 -->
+            <div v-if="loading" class="loading-indicator text-center p-5 text-gray-600">加载中...</div>
+            <div v-else class="loading-indicator text-center p-5 text-gray-600">已全部加载完成</div>
           </div>
         </d-tab>
-        <d-tab id="my" title="我的">我的</d-tab>
       </d-tabs>
     </div>
+    <Teleport to="body">
+      <div>
+        <img class="fixed top-10 -left-2" :src="tao" alt="">
+        <img class="fixed bottom-10 left-0 w-44" :src="sword" alt="">
+        <img class="fixed bottom-0 right-5 w-25" :src="psword" alt="">
+        <img class="fixed top-[56px] right-0" :src="denglong" alt="">
+      </div>
+    </Teleport>
+
+
   </PerfectScrollbar>
 
 </template>
 
 <script setup lang="ts">
+import psword from "@/assets/images/剑-粉.png";
+import sword from "@/assets/images/剑.png";
+import tao from "@/assets/images/树枝桃.png";
+import denglong from "@/assets/images/灯笼.png";
+import { throttle } from 'es-toolkit';
 import { nextTick, onMounted, onUnmounted, ref } from 'vue';
-
 // 画廊页逻辑
 const tid = ref('share');
 const fileList = ref<any[]>([]);
@@ -43,6 +125,18 @@ const imageHeights = ref<Record<string, number>>({}); // 存储每张图片的
 const imagesLoaded = ref(0);
 const itemWidth = ref(240); // 图片宽度固定为220px
 const scrollbar = ref<any>(null);
+const kw = ref<string>('');
+const myCon = ref<HTMLDivElement | null>(null);
+
+const uploadOptions = ref({
+  uri: 'https://www.hxyouzi.com/api/files/upload',
+  method: 'POST',
+  maximumSize: 5 * 1024 * 1024,
+  headers: {
+    'Authorization': 'Bearer ' + $cookies.get('token'),
+  },
+});
+
 
 
 // 计算列数 based on 屏幕宽度
@@ -65,16 +159,19 @@ function resetWaterfall() {
 }
 
 // 添加图片到瀑布流
-function addToWaterfall(item: any) {
+async function addToWaterfall(item: any) {
   if (columns.value.length === 0) return;
+  const { height, width } = await getImageSizeByCheck(item.filepath)
+
   // 找到高度最小的列
   let minHeight = Math.min(...columnHeights.value);
   let minIndex = columnHeights.value.indexOf(minHeight);
   // 添加到该列
   columns.value[minIndex].push(item);
   // 估算列高 - 实际高度会在图片加载后更新
-  const estimatedHeight = itemWidth.value; // 假设1:1比例
+
-  columnHeights.value[minIndex] += estimatedHeight + 24; // 加上padding和margin
+  const estimatedHeight = itemWidth.value * height / width // 假设1:1比例
+  columnHeights.value[minIndex] += estimatedHeight + 20; // 加上padding和margin
 }
 
 // 图片加载完成后更新瀑布流
@@ -91,6 +188,24 @@ function onImageLoad(id: string) {
   });
 }
 
+function getImageSizeByCheck(url: string): any {
+
+  return new Promise(function (resolve, reject) {
+    let image = new Image();
+    image.src = url;
+    let height = 0
+    let width = 0
+    let timer = setInterval(() => {
+      if (image.width > 0 && image.height > 0) {
+        height = image.height
+        width = image.width
+        resolve({ height, width })
+        clearInterval(timer)
+      }
+    }, 40)
+  });
+}
+
 // 更新所有列的高度
 function updateColumnHeights() {
   if (!waterfallContainer.value) return;
@@ -104,10 +219,39 @@ async function getFileList() {
   loading.value = true;
   try {
     const res = await $http.file.getFileList({
+      keyword: kw.value,
       page_num: pn.value,
       page_size: ps.value,
     });
-    console.log('>>> --> getFileList --> res:', res);
+    // console.log('>>> --> getFileList --> res:', res);
+
+    if (pn.value === 1) {
+      fileList.value = res.data;
+      resetWaterfall();
+    } else {
+      // 追加新数据
+      res.data.forEach((item: any) => {
+        fileList.value.push(item);
+        addToWaterfall(item);
+      });
+    }
+  } catch (error) {
+    console.error('获取文件列表失败:', error);
+  } finally {
+    loading.value = false;
+  }
+}
+
+// 获取我的文件列表
+async function getMyList() {
+  if (loading.value) return;
+  loading.value = true;
+  try {
+    const res = await $http.file.getMyList({
+      page_num: pn.value,
+      page_size: ps.value,
+    });
+    // console.log('>>> --> getFileList --> res:', res);
 
     if (pn.value === 1) {
       fileList.value = res.data;
@@ -127,11 +271,11 @@ async function getFileList() {
 }
 
 // 监听滚动事件
-function handleScroll(e: any) {
+const handleScroll: any = throttle((e: any) => {
-  // console.log('>>> --> handleScroll --> loading:', e)
+  console.log('>>> --> handleScroll --> loading:', e)
   if (loading.value) return;
   const scrollTop = e.target.scrollTop
-  // console.log('>>> --> handleScroll --> scrollTop:', scrollTop)
+  console.log('>>> --> handleScroll --> scrollTop:', scrollTop)
   const scrollHeight = e.target.scrollHeight
   // console.log('>>> --> handleScroll --> scrollHeight:', scrollHeight)
   const clientHeight = e.target.offsetHeight;
@@ -143,8 +287,97 @@ function handleScroll(e: any) {
     pn.value++;
     getFileList();
   }
+}, 1000)
+function onSearch() {
+  pn.value = 1;
+  getFileList();
 }
 
+function beforeChange(tabId: string) {
+  myCon.value?.scrollIntoView(true)
+  if (tabId === 'my') {
+    // 我的画廊，不加载更多
+    if (!$cookies.get('token')) {
+      $msg.error('请先登录');
+      return false
+    }
+    return true
+  }
+  return true
+
+}
+function activeTabChange(tabId: string) {
+  pn.value = 1;
+  kw.value = '';
+  fileList.value = [];
+  resetWaterfall();
+  if (tabId === 'my') {
+    // console.log('>>> --> activeTabChange --> tabId:', tabId)
+    getMyList()
+  } else if (tabId === 'share') {
+    getFileList();
+  }
+
+}
+function handleSuccess(res: any) {
+  console.log('>>> --> handleSuccess --> res:', res)
+  const code = JSON.parse(res[0].response).code
+  if (code === 200) {
+    $msg.success('上传成功');
+    getMyList();
+  }
+
+}
+
+function downloadFile(url: string) {
+  console.log('>>> --> downloadFile --> url:', url)
+  // 创建临时a标签
+  const link = document.createElement('a');
+  // 设置下载链接
+  link.href = url;
+  // 提取文件名
+  const fileName = url.split('/').pop() || 'downloaded-file';
+  // 设置下载属性和文件名
+  link.download = fileName;
+  // 设置为隐藏元素
+  link.style.display = 'none';
+  // 添加到文档
+  document.body.appendChild(link);
+  // 触发点击事件
+  link.click();
+  // 移除临时元素
+  document.body.removeChild(link);
+}
+
+async function handdleShare(id: string, share: boolean | number) {
+  console.log('>>> --> handdleShare --> id:', id)
+  console.log('>>> --> handdleShare --> share:', share)
+  try {
+    const res = await $http.file.putShare({
+      pid: id,
+      share: Number(!share),
+
+    })
+    console.log('>>> --> handdleShare --> res:', res)
+    if (res.code === 200) {
+      $msg.success('共享成功');
+      pn.value = 1;
+      fileList.value = [];
+      resetWaterfall();
+      getMyList();
+      console.log('>>> --> handdleShare --> myCon.value:', myCon.value?.scrollTop)
+      if (myCon.value) {
+        myCon.value.scrollIntoView(true)
+      }
+    }
+
+  } catch (error) {
+    console.error('共享文件失败:', error);
+  }
+
+}
+
+
 onMounted(() => {
   getFileList();
   // 计算初始列数
@@ -156,6 +389,11 @@ onMounted(() => {
 });
 
 onUnmounted(() => {
+  pn.value = 1;
+  kw.value = '';
+  fileList.value = [];
+  resetWaterfall();
+
   // 移除监听
   window.removeEventListener('resize', calculateColumnCount);
   window.removeEventListener('scroll', handleScroll);
@@ -187,4 +425,13 @@ onUnmounted(() => {
 
   width: 100%;
 }
+
+:deep(.devui-upload) {
+  width: 100%;
+
+  &>div {
+    width: 100%;
+
+  }
+}
 </style>

src/views/Home.vue

@@ -2,7 +2,7 @@
   <div class="home-page" :style="contentStyle">
     <d-layout>
       <d-content class="main-content">
-        <div class="pt-8 px-12">
+        <div class="pt-8 px-12 relative">
           <d-input class="devui-input-demo__mt" size="lg" v-model="searchWord" @keyup.enter="search" placeholder="请输入">
             <template #prepend>
               <d-select class="w-48" size="lg" v-model="broswer" :options="options"></d-select>
@@ -15,7 +15,7 @@
         <!-- 图片网格展示区域 -->
         <PerfectScrollbar class="" :style="navStyle">
           <div class="navcard grid-cols-5 gap-6 p-12">
-            <d-card class="bg-[white] h-25" v-for="(item, index) in navlist" :key="index"
+            <d-card class="bg-[#ffffff80] h-25" v-for="(item, index) in navlist" :key="index"
               @click="goExtra(item.menu_link)">
               <template #content>
                 <div class="mt-1 w-full flex flex-col items-center cursor-pointer hover:!text-primary">
@@ -27,7 +27,7 @@
                 </div>
               </template>
             </d-card>
-            <d-card class="bg-[white] h-25">
+            <d-card class="bg-[#ffffff80] h-25">
               <div @click="addNav" class="w-full h-full flex flex-col items-center justify-center cursor-pointer">
                 <div :style="{ background: getRandomDarkColor() }"
                   class="w-12 h-12 rounded-full text-2xl text-white flex items-center justify-center">
@@ -78,10 +78,12 @@
 </template>
 
 <script setup lang="ts">
-import aplayer from '@/components/aplayer.vue'
-import homeSide from '@/components/homeSide.vue'
 import { getDictValue } from '@/util/index.ts'
 
+definePage({
+  name:'home'
+})
+
 // 新增导航弹窗
 const visible: any = ref(false)
 const navData: any = reactive({
@@ -235,8 +237,15 @@ onMounted(() => {
 
 <style scoped lang="less">
 /* 首页样式 */
+.main-content {
+  background-image: url('@/assets/images/小鹿.png');
+  background-repeat: no-repeat;
+  background-position: 111% center;
+  background-size: auto 100%;
+}
 .navcard {
   display: grid;
+
 }
 
 :deep(.devui-input-slot__prepend) {

tsconfig.app.json

@@ -6,12 +6,13 @@
     "src/**/*.vue",
     "auto-imports.d.ts",
     "components.d.ts",
-    "extra.d.ts"
+    "extra.d.ts",
+    "typed-router.d.ts"
   ],
   "exclude": ["src/**/__tests__/*"],
   "compilerOptions": {
     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
-
+    "types":["unplugin-vue-router/client"],
     "paths": {
       "@/*": ["./src/*"]
     }

typed-router.d.ts

@@ -0,0 +1,86 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-vue-router. ‼️ DO NOT MODIFY THIS FILE ‼️
+// It's recommended to commit this file.
+// Make sure to add this file to your tsconfig.json file as an "includes" or "files" entry.
+
+declare module 'vue-router/auto-routes' {
+  import type {
+    RouteRecordInfo,
+    ParamValue,
+    ParamValueOneOrMore,
+    ParamValueZeroOrMore,
+    ParamValueZeroOrOne,
+  } from 'vue-router'
+
+  /**
+   * Route name map generated by unplugin-vue-router
+   */
+  export interface RouteNamedMap {
+    '/AppShare': RouteRecordInfo<'/AppShare', '/AppShare', Record<never, never>, Record<never, never>>,
+    '/Article': RouteRecordInfo<'/Article', '/Article', Record<never, never>, Record<never, never>>,
+    '/Gallery': RouteRecordInfo<'/Gallery', '/Gallery', Record<never, never>, Record<never, never>>,
+    'home': RouteRecordInfo<'home', '/Home', Record<never, never>, Record<never, never>>,
+    '/Login': RouteRecordInfo<'/Login', '/Login', Record<never, never>, Record<never, never>>,
+    '/NotFound': RouteRecordInfo<'/NotFound', '/NotFound', Record<never, never>, Record<never, never>>,
+    '/Plink': RouteRecordInfo<'/Plink', '/Plink', Record<never, never>, Record<never, never>>,
+    '/Widget': RouteRecordInfo<'/Widget', '/Widget', Record<never, never>, Record<never, never>>,
+  }
+
+  /**
+   * Route file to route info map by unplugin-vue-router.
+   * Used by the volar plugin to automatically type useRoute()
+   *
+   * Each key is a file path relative to the project root with 2 properties:
+   * - routes: union of route names of the possible routes when in this page (passed to useRoute<...>())
+   * - views: names of nested views (can be passed to <RouterView name="...">)
+   *
+   * @internal
+   */
+  export interface _RouteFileInfoMap {
+    'src/views/AppShare.vue': {
+      routes: '/AppShare'
+      views: never
+    }
+    'src/views/Article.vue': {
+      routes: '/Article'
+      views: never
+    }
+    'src/views/Gallery.vue': {
+      routes: '/Gallery'
+      views: never
+    }
+    'src/views/Home.vue': {
+      routes: 'home'
+      views: never
+    }
+    'src/views/Login.vue': {
+      routes: '/Login'
+      views: never
+    }
+    'src/views/NotFound.vue': {
+      routes: '/NotFound'
+      views: never
+    }
+    'src/views/Plink.vue': {
+      routes: '/Plink'
+      views: never
+    }
+    'src/views/Widget.vue': {
+      routes: '/Widget'
+      views: never
+    }
+  }
+
+  /**
+   * Get a union of possible route names in a certain route component file.
+   * Used by the volar plugin to automatically type useRoute()
+   *
+   * @internal
+   */
+  export type _RouteNamesForFilePath<FilePath extends string> =
+    _RouteFileInfoMap extends Record<FilePath, infer Info>
+      ? Info['routes']
+      : keyof RouteNamedMap
+}

vite.config.ts

@@ -5,11 +5,14 @@ import UnoCSS from "unocss/vite";
 import AutoImport from "unplugin-auto-import/vite";
 import { DevUiResolver } from "unplugin-vue-components/resolvers";
 import Components from "unplugin-vue-components/vite";
+import { VueRouterAutoImports } from 'unplugin-vue-router';
+import VueRouter from 'unplugin-vue-router/vite';
 import { defineConfig } from "vite";
 import vueDevTools from "vite-plugin-vue-devtools";
 import svgLoader from "vite-svg-loader";
 // https://vite.dev/config/
 export default defineConfig({
+  
   plugins: [
     vue(),
     vueDevTools(),
@@ -17,10 +20,14 @@ export default defineConfig({
     svgLoader(),
     AutoImport({
       include: [/\.[tj]sx?$/, /\.vue$/, /\.vue\?vue/, /\.md$/],
-      imports: ["vue", "pinia", "vue-router"],
+      imports: ["vue", "pinia",VueRouterAutoImports],
+    }),
+    VueRouter({
+      routesFolder:'src/views'
     }),
     Components({
       resolvers: [DevUiResolver()],
+      dirs:['src/components']
     }),
   ],
   esbuild: {

yarn.lock

@@ -198,13 +198,20 @@
     "@babel/template" "^7.27.2"
     "@babel/types" "^7.28.2"
 
-"@babel/parser@^7.26.9", "@babel/parser@^7.27.2", "@babel/parser@^7.28.0":
+"@babel/parser@^7.26.9", "@babel/parser@^7.27.2":
   version "7.28.0"
   resolved "https://registry.npmmirror.com/@babel/parser/-/parser-7.28.0.tgz#979829fbab51a29e13901e5a80713dbcb840825e"
   integrity sha512-jVZGvOxOuNSsuQuLRTh13nU0AogFlw32w/MT+LV6D3sP5WdbW61E77RnkbaO2dUvmPAYrBDJXGn5gGS6tH4j8g==
   dependencies:
     "@babel/types" "^7.28.0"
 
+"@babel/parser@^7.27.5", "@babel/parser@^7.28.0", "@babel/parser@^7.28.3":
+  version "7.28.3"
+  resolved "https://registry.npmmirror.com/@babel/parser/-/parser-7.28.3.tgz#d2d25b814621bca5fe9d172bc93792547e7a2a71"
+  integrity sha512-7+Ey1mAgYqFAx2h0RuoxcQT5+MlG3GTV0TQrgr7/ZliKsm/MNDxVVutlWaziMq7wJNAz8MTqz55XLpWvva6StA==
+  dependencies:
+    "@babel/types" "^7.28.2"
+
 "@babel/plugin-proposal-decorators@^7.23.0":
   version "7.28.0"
   resolved "https://registry.npmmirror.com/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.28.0.tgz#419c8acc31088e05a774344c021800f7ddc39bf0"
@@ -498,11 +505,16 @@
   resolved "https://registry.npmmirror.com/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz#7a0ee601f60f99a20c7c7c5ff0c80388c1189bd6"
   integrity sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==
 
-"@jridgewell/sourcemap-codec@^1.4.14", "@jridgewell/sourcemap-codec@^1.5.0":
+"@jridgewell/sourcemap-codec@^1.4.14":
   version "1.5.4"
   resolved "https://registry.npmmirror.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.4.tgz#7358043433b2e5da569aa02cbc4c121da3af27d7"
   integrity sha512-VT2+G1VQs/9oz078bLrYbecdZKs912zQlkelYpuf+SXF+QvZDYJlbx/LSx+meSAwdDFnF8FVXW92AVjjkVmgFw==
 
+"@jridgewell/sourcemap-codec@^1.5.0":
+  version "1.5.5"
+  resolved "https://registry.npmmirror.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz#6912b00d2c631c0d15ce1a7ab57cd657f2a8f8ba"
+  integrity sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==
+
 "@jridgewell/trace-mapping@^0.3.24", "@jridgewell/trace-mapping@^0.3.28":
   version "0.3.29"
   resolved "https://registry.npmmirror.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.29.tgz#a58d31eaadaf92c6695680b2e1d464a9b8fbf7fc"
@@ -909,6 +921,11 @@
     tinyglobby "^0.2.14"
     unplugin-utils "^0.2.4"
 
+"@vicons/ionicons4@^0.13.0":
+  version "0.13.0"
+  resolved "https://registry.npmmirror.com/@vicons/ionicons4/-/ionicons4-0.13.0.tgz#fc3ce6d951b1c7b96dbe3b842d939562672524a4"
+  integrity sha512-5WHIl/4R5a4i9GONa+hIQWxg/WczrbsCdqxawHZvdd3drsEr+Q3yzlfS+NNRO4WS3uDW2uWLCwoW+yp5TgcKeQ==
+
 "@vitejs/plugin-vue@^6.0.1":
   version "6.0.1"
   resolved "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-6.0.1.tgz#4c7f559621af104a22255c6ace5626e6d8349689"
@@ -923,11 +940,23 @@
   dependencies:
     "@volar/source-map" "2.4.20"
 
+"@volar/language-core@2.4.23":
+  version "2.4.23"
+  resolved "https://registry.npmmirror.com/@volar/language-core/-/language-core-2.4.23.tgz#deb6dbc5fdbafa9bb7ba691fc59cb196cdb856d3"
+  integrity sha512-hEEd5ET/oSmBC6pi1j6NaNYRWoAiDhINbT8rmwtINugR39loROSlufGdYMF9TaKGfz+ViGs1Idi3mAhnuPcoGQ==
+  dependencies:
+    "@volar/source-map" "2.4.23"
+
 "@volar/source-map@2.4.20":
   version "2.4.20"
   resolved "https://registry.npmmirror.com/@volar/source-map/-/source-map-2.4.20.tgz#55ff844410d8d670ef2c3722e2717223edbf8717"
   integrity sha512-mVjmFQH8mC+nUaVwmbxoYUy8cww+abaO8dWzqPUjilsavjxH0jCJ3Mp8HFuHsdewZs2c+SP+EO7hCd8Z92whJg==
 
+"@volar/source-map@2.4.23":
+  version "2.4.23"
+  resolved "https://registry.npmmirror.com/@volar/source-map/-/source-map-2.4.23.tgz#d476e11a3a669d89858a5eb38b02342be39b0e44"
+  integrity sha512-Z1Uc8IB57Lm6k7q6KIDu/p+JWtf3xsXJqAX/5r18hYOTpJyBn0KXUR8oTJ4WFYOcDzWC9n3IflGgHowx6U6z9Q==
+
 "@volar/typescript@2.4.20":
   version "2.4.20"
   resolved "https://registry.npmmirror.com/@volar/typescript/-/typescript-2.4.20.tgz#c388d6fe5ee31ddeb5338d01dbbfc71054065a7c"
@@ -937,6 +966,17 @@
     path-browserify "^1.0.1"
     vscode-uri "^3.0.8"
 
+"@vue-macros/common@3.0.0-beta.16":
+  version "3.0.0-beta.16"
+  resolved "https://registry.npmmirror.com/@vue-macros/common/-/common-3.0.0-beta.16.tgz#504141897a7acd2cdab6d7ba85a61b2bae178faa"
+  integrity sha512-8O2gWxWFiaoNkk7PGi0+p7NPGe/f8xJ3/INUufvje/RZOs7sJvlI1jnR4lydtRFa/mU0ylMXUXXjSK0fHDEYTA==
+  dependencies:
+    "@vue/compiler-sfc" "^3.5.17"
+    ast-kit "^2.1.1"
+    local-pkg "^1.1.1"
+    magic-string-ast "^1.0.0"
+    unplugin-utils "^0.2.4"
+
 "@vue/babel-helper-vue-transform-on@1.4.0":
   version "1.4.0"
   resolved "https://registry.npmmirror.com/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.4.0.tgz#616020488692a9c42a613280d62ed1b727045d95"
@@ -979,6 +1019,17 @@
     estree-walker "^2.0.2"
     source-map-js "^1.2.1"
 
+"@vue/compiler-core@3.6.0-alpha.2":
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/@vue/compiler-core/-/compiler-core-3.6.0-alpha.2.tgz#3467ec5dea3bd225ac3184a699a46de73e885528"
+  integrity sha512-2aPvrCWKKhKKU4TaX6N6+cY4LcLIlIc+tcxJHw029mZr7KGb/w+98UxU9o3mYe/CLo5c5v8ps4IlE/Tm4H/eZA==
+  dependencies:
+    "@babel/parser" "^7.27.5"
+    "@vue/shared" "3.6.0-alpha.2"
+    entities "^4.5.0"
+    estree-walker "^2.0.2"
+    source-map-js "^1.2.1"
+
 "@vue/compiler-dom@3.5.18", "@vue/compiler-dom@^3.3.4", "@vue/compiler-dom@^3.5.0":
   version "3.5.18"
   resolved "https://registry.npmmirror.com/@vue/compiler-dom/-/compiler-dom-3.5.18.tgz#e13504492c3061ec5bbe6a2e789f15261d4f03a7"
@@ -987,7 +1038,15 @@
     "@vue/compiler-core" "3.5.18"
     "@vue/shared" "3.5.18"
 
-"@vue/compiler-sfc@3.5.18", "@vue/compiler-sfc@^3.5.13":
+"@vue/compiler-dom@3.6.0-alpha.2":
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/@vue/compiler-dom/-/compiler-dom-3.6.0-alpha.2.tgz#06ff116c7d352eb3cc0f3becc511d1030a92f710"
+  integrity sha512-WHFo0z5QXXkBQk65NPrze1RO4RG6vAHcMudRG604zs2VsMkJPXBL5CAFcae3R6aoU3wwbIYHkklbMOelegS90w==
+  dependencies:
+    "@vue/compiler-core" "3.6.0-alpha.2"
+    "@vue/shared" "3.6.0-alpha.2"
+
+"@vue/compiler-sfc@3.5.18", "@vue/compiler-sfc@^3.5.13", "@vue/compiler-sfc@^3.5.17":
   version "3.5.18"
   resolved "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.5.18.tgz#ba1e849561337d809937994cdaf900539542eeca"
   integrity sha512-5aBjvGqsWs+MoxswZPoTB9nSDb3dhd1x30xrrltKujlCxo48j8HGDNj3QPhF4VIS0VQDUrA1xUfp2hEa+FNyXA==
@@ -1002,6 +1061,22 @@
     postcss "^8.5.6"
     source-map-js "^1.2.1"
 
+"@vue/compiler-sfc@3.6.0-alpha.2":
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.6.0-alpha.2.tgz#d760fdacee1f5f102fde68d8aa278cd2172344eb"
+  integrity sha512-QFwY1M5lYTo6Qt0rSQKXEp9aZngaKtT4WRlITAuioNeFoK5Y5stElr6sw2dopsaPzjbAJftDbQ7MgtMjOZ9XQg==
+  dependencies:
+    "@babel/parser" "^7.27.5"
+    "@vue/compiler-core" "3.6.0-alpha.2"
+    "@vue/compiler-dom" "3.6.0-alpha.2"
+    "@vue/compiler-ssr" "3.6.0-alpha.2"
+    "@vue/compiler-vapor" "3.6.0-alpha.2"
+    "@vue/shared" "3.6.0-alpha.2"
+    estree-walker "^2.0.2"
+    magic-string "^0.30.17"
+    postcss "^8.5.6"
+    source-map-js "^1.2.1"
+
 "@vue/compiler-ssr@3.5.18":
   version "3.5.18"
   resolved "https://registry.npmmirror.com/@vue/compiler-ssr/-/compiler-ssr-3.5.18.tgz#aecde0b0bff268a9c9014ba66799307c4a784328"
@@ -1010,6 +1085,25 @@
     "@vue/compiler-dom" "3.5.18"
     "@vue/shared" "3.5.18"
 
+"@vue/compiler-ssr@3.6.0-alpha.2":
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/@vue/compiler-ssr/-/compiler-ssr-3.6.0-alpha.2.tgz#8322409ed47e0131e854c35474052f5aee7fd7df"
+  integrity sha512-BtP+A4xL7QSCf/P1eOvJw9XG1wojK3nqjJXSABcwXeIv0SJgBpi4CZ/obVUPAiUWMmdJDV3bdSwqQtkiXqOmug==
+  dependencies:
+    "@vue/compiler-dom" "3.6.0-alpha.2"
+    "@vue/shared" "3.6.0-alpha.2"
+
+"@vue/compiler-vapor@3.6.0-alpha.2":
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/@vue/compiler-vapor/-/compiler-vapor-3.6.0-alpha.2.tgz#b31b7f6c76f78b09ac95f89b9f4572f9e0dcd0ee"
+  integrity sha512-/qmhrcOrVmBsZiQEpDMH5coH/hx7v1uflKCXDcvWhl7XaPfNWBeVwIndU/s/8mtOz+5nuCZrGtbqozXc4tfQzw==
+  dependencies:
+    "@babel/parser" "^7.27.5"
+    "@vue/compiler-dom" "3.6.0-alpha.2"
+    "@vue/shared" "3.6.0-alpha.2"
+    estree-walker "^2.0.2"
+    source-map-js "^1.2.1"
+
 "@vue/compiler-vue2@^2.7.16":
   version "2.7.16"
   resolved "https://registry.npmmirror.com/@vue/compiler-vue2/-/compiler-vue2-2.7.16.tgz#2ba837cbd3f1b33c2bc865fbe1a3b53fb611e249"
@@ -1096,6 +1190,20 @@
     path-browserify "^1.0.1"
     picomatch "^4.0.2"
 
+"@vue/language-core@^3.0.1":
+  version "3.0.6"
+  resolved "https://registry.npmmirror.com/@vue/language-core/-/language-core-3.0.6.tgz#5e9d2f58f3a91465c5d86e460f0239f9c6e8300d"
+  integrity sha512-e2RRzYWm+qGm8apUHW1wA5RQxzNhkqbbKdbKhiDUcmMrNAZGyM8aTiL3UrTqkaFI5s7wJRGGrp4u3jgusuBp2A==
+  dependencies:
+    "@volar/language-core" "2.4.23"
+    "@vue/compiler-dom" "^3.5.0"
+    "@vue/compiler-vue2" "^2.7.16"
+    "@vue/shared" "^3.5.0"
+    alien-signals "^2.0.5"
+    muggle-string "^0.4.1"
+    path-browserify "^1.0.1"
+    picomatch "^4.0.2"
+
 "@vue/reactivity@3.5.18":
   version "3.5.18"
   resolved "https://registry.npmmirror.com/@vue/reactivity/-/reactivity-3.5.18.tgz#fe32166e3938832c54b4134e60e9b58ca7d9bdb4"
@@ -1103,6 +1211,13 @@
   dependencies:
     "@vue/shared" "3.5.18"
 
+"@vue/reactivity@3.6.0-alpha.2":
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/@vue/reactivity/-/reactivity-3.6.0-alpha.2.tgz#ac51f691bed25c37a874ffecfc53e1bf2e123ee1"
+  integrity sha512-dqCEZHz7dy5u0fZV1ILObnH2YCA+I6UHuOt7PLGb1NBEAAUbO251nOK9OfecZEEPsvMJRl3P9rNqdJmAvIcHTg==
+  dependencies:
+    "@vue/shared" "3.6.0-alpha.2"
+
 "@vue/runtime-core@3.5.18":
   version "3.5.18"
   resolved "https://registry.npmmirror.com/@vue/runtime-core/-/runtime-core-3.5.18.tgz#9e9ae8b9491548b53d0cea2bf25746d27c52e191"
@@ -1111,6 +1226,14 @@
     "@vue/reactivity" "3.5.18"
     "@vue/shared" "3.5.18"
 
+"@vue/runtime-core@3.6.0-alpha.2":
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/@vue/runtime-core/-/runtime-core-3.6.0-alpha.2.tgz#c6d14eda7c0ac10b6931678986ec75c8e6fb92b0"
+  integrity sha512-OPEIqs/q2rTZWTJm8VVSsI9B2OgsKdtprKEqzw3L74tBGDwNRleCGxGxu2T3LUpPlOtQFkSCZTIh1M52/6PG0w==
+  dependencies:
+    "@vue/reactivity" "3.6.0-alpha.2"
+    "@vue/shared" "3.6.0-alpha.2"
+
 "@vue/runtime-dom@3.5.18":
   version "3.5.18"
   resolved "https://registry.npmmirror.com/@vue/runtime-dom/-/runtime-dom-3.5.18.tgz#1150952d1048b5822e4f1dd8aed24665cbb22107"
@@ -1121,6 +1244,24 @@
     "@vue/shared" "3.5.18"
     csstype "^3.1.3"
 
+"@vue/runtime-dom@3.6.0-alpha.2":
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/@vue/runtime-dom/-/runtime-dom-3.6.0-alpha.2.tgz#1157fbedca5bc149a0d2a5a60c61fac6378a91ca"
+  integrity sha512-oYrpDYpbRqv/pgqM1SJEN7w9oahCjj6Txatz7McMJ++CX0WyFqAChi3Zvxr06Vrte+OCWA86t6Ot8K+mKV0QAA==
+  dependencies:
+    "@vue/reactivity" "3.6.0-alpha.2"
+    "@vue/runtime-core" "3.6.0-alpha.2"
+    "@vue/shared" "3.6.0-alpha.2"
+    csstype "^3.1.3"
+
+"@vue/runtime-vapor@3.6.0-alpha.2":
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/@vue/runtime-vapor/-/runtime-vapor-3.6.0-alpha.2.tgz#1144c9da77ff4b5e21ec2f30ef4e30247f491cc8"
+  integrity sha512-UdGN6tcXIMTD/OFR7qI8V+ID4lji7K5A90i68OjiCr8nevtGxjfYPB3Lz5Lg7S6sckPCnFTECHExzWOmE7aV0A==
+  dependencies:
+    "@vue/reactivity" "3.6.0-alpha.2"
+    "@vue/shared" "3.6.0-alpha.2"
+
 "@vue/server-renderer@3.5.18":
   version "3.5.18"
   resolved "https://registry.npmmirror.com/@vue/server-renderer/-/server-renderer-3.5.18.tgz#e9fa267b95b3a1d8cddca762377e5de2ae9122bd"
@@ -1129,11 +1270,24 @@
     "@vue/compiler-ssr" "3.5.18"
     "@vue/shared" "3.5.18"
 
+"@vue/server-renderer@3.6.0-alpha.2":
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/@vue/server-renderer/-/server-renderer-3.6.0-alpha.2.tgz#c939967a2f589a02d28caf68c35eb5382778edb4"
+  integrity sha512-Zw+fX/FlRqfwzrv5EmCyLBN5bOZWsRo3SnxQKqPl1yA5xGDe+FIe9cjII/X7hlFdC9Vb4lmQBvOQSnTeTj8ygA==
+  dependencies:
+    "@vue/compiler-ssr" "3.6.0-alpha.2"
+    "@vue/shared" "3.6.0-alpha.2"
+
 "@vue/shared@3.5.18", "@vue/shared@^3.2.33", "@vue/shared@^3.5.0", "@vue/shared@^3.5.13":
   version "3.5.18"
   resolved "https://registry.npmmirror.com/@vue/shared/-/shared-3.5.18.tgz#529f24a88d3ed678d50fd5c07455841fbe8ac95e"
   integrity sha512-cZy8Dq+uuIXbxCZpuLd2GJdeSO/lIzIspC2WtkqIpje5QyFbvLaI5wZtdUjLHjGZrlVX6GilejatWwVYYRc8tA==
 
+"@vue/shared@3.6.0-alpha.2":
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/@vue/shared/-/shared-3.6.0-alpha.2.tgz#b5140656105c51c6f30b1024c8707a27d8b05a47"
+  integrity sha512-/tviorcvTBm63BIg/oEpU+tuU3NUrLkWWPrljCH//2vHwc/RJZ7wxq6vPLWfTcuSc82uxDWZXDTKxUjN8/JmGQ==
+
 "@vue/tsconfig@^0.7.0":
   version "0.7.0"
   resolved "https://registry.npmmirror.com/@vue/tsconfig/-/tsconfig-0.7.0.tgz#67044c847b7a137b8cbfd6b23104c36dbaf80d1d"
@@ -1208,6 +1362,22 @@ argparse@^2.0.1:
   resolved "https://registry.npmmirror.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38"
   integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
 
+ast-kit@^2.1.1, ast-kit@^2.1.2:
+  version "2.1.2"
+  resolved "https://registry.npmmirror.com/ast-kit/-/ast-kit-2.1.2.tgz#167da747afd8bdf3762c702bdc436376100332be"
+  integrity sha512-cl76xfBQM6pztbrFWRnxbrDm9EOqDr1BF6+qQnnDZG2Co2LjyUktkN9GTJfBAfdae+DbT2nJf2nCGAdDDN7W2g==
+  dependencies:
+    "@babel/parser" "^7.28.0"
+    pathe "^2.0.3"
+
+ast-walker-scope@^0.8.1:
+  version "0.8.2"
+  resolved "https://registry.npmmirror.com/ast-walker-scope/-/ast-walker-scope-0.8.2.tgz#f075e3199bd429b4fa0bbad56ec3577deadacad5"
+  integrity sha512-3pYeLyDZ6nJew9QeBhS4Nly02269Dkdk32+zdbbKmL6n4ZuaGorwwA+xx12xgOciA8BF1w9x+dlH7oUkFTW91w==
+  dependencies:
+    "@babel/parser" "^7.28.3"
+    ast-kit "^2.1.2"
+
 async-validator@^4.0.7:
   version "4.2.5"
   resolved "https://registry.npmmirror.com/async-validator/-/async-validator-4.2.5.tgz#c96ea3332a521699d0afaaceed510a54656c6339"
@@ -1317,6 +1487,13 @@ chokidar@^3.6.0:
   optionalDependencies:
     fsevents "~2.3.2"
 
+chokidar@^4.0.3:
+  version "4.0.3"
+  resolved "https://registry.npmmirror.com/chokidar/-/chokidar-4.0.3.tgz#7be37a4c03c9aee1ecfe862a4a23b2c70c205d30"
+  integrity sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==
+  dependencies:
+    readdirp "^4.0.1"
+
 clipboard-copy@^4.0.1:
   version "4.0.1"
   resolved "https://registry.npmmirror.com/clipboard-copy/-/clipboard-copy-4.0.1.tgz#326ef9726d4ffe72d9a82a7bbe19379de692017d"
@@ -2667,6 +2844,13 @@ lru-cache@^5.1.1:
   dependencies:
     yallist "^3.0.2"
 
+magic-string-ast@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.npmmirror.com/magic-string-ast/-/magic-string-ast-1.0.2.tgz#77668ee71d1ff2222cd8039dff9dde00d082d4c1"
+  integrity sha512-8ngQgLhcT0t3YBdn9CGkZqCYlvwW9pm7aWJwd7AxseVWf1RU8ZHCQvG1mt3N5vvUme+pXTcHB8G/7fE666U8Vw==
+  dependencies:
+    magic-string "^0.30.17"
+
 magic-string@^0.30.17, magic-string@^0.30.4:
   version "0.30.17"
   resolved "https://registry.npmmirror.com/magic-string/-/magic-string-0.30.17.tgz#450a449673d2460e5bbcfba9a61916a1714c7453"
@@ -3083,6 +3267,11 @@ read-package-json-fast@^4.0.0:
     json-parse-even-better-errors "^4.0.0"
     npm-normalize-package-bin "^4.0.0"
 
+readdirp@^4.0.1:
+  version "4.1.2"
+  resolved "https://registry.npmmirror.com/readdirp/-/readdirp-4.1.2.tgz#eb85801435fbf2a7ee58f19e0921b068fc69948d"
+  integrity sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==
+
 readdirp@~3.6.0:
   version "3.6.0"
   resolved "https://registry.npmmirror.com/readdirp/-/readdirp-3.6.0.tgz#74a370bd857116e245b29cc97340cd431a02a6c7"
@@ -3463,6 +3652,28 @@ unplugin-vue-components@^28.8.0:
     unplugin "^2.3.5"
     unplugin-utils "^0.2.4"
 
+unplugin-vue-router@^0.15.0:
+  version "0.15.0"
+  resolved "https://registry.npmmirror.com/unplugin-vue-router/-/unplugin-vue-router-0.15.0.tgz#fac7991a53213746277214dc3a5990d48b796f82"
+  integrity sha512-PyGehCjd9Ny9h+Uer4McbBjjib3lHihcyUEILa7pHKl6+rh8N7sFyw4ZkV+N30Oq2zmIUG7iKs3qpL0r+gXAaQ==
+  dependencies:
+    "@vue-macros/common" "3.0.0-beta.16"
+    "@vue/language-core" "^3.0.1"
+    ast-walker-scope "^0.8.1"
+    chokidar "^4.0.3"
+    json5 "^2.2.3"
+    local-pkg "^1.1.1"
+    magic-string "^0.30.17"
+    mlly "^1.7.4"
+    muggle-string "^0.4.1"
+    pathe "^2.0.3"
+    picomatch "^4.0.3"
+    scule "^1.3.0"
+    tinyglobby "^0.2.14"
+    unplugin "^2.3.5"
+    unplugin-utils "^0.2.4"
+    yaml "^2.8.0"
+
 unplugin@^2.2.2, unplugin@^2.3.4, unplugin@^2.3.5:
   version "2.3.5"
   resolved "https://registry.npmmirror.com/unplugin/-/unplugin-2.3.5.tgz#c689d806e2a15c95aeb794f285356c6bcdea4a2e"
@@ -3643,7 +3854,7 @@ vue3-perfect-scrollbar@^2.0.0:
   dependencies:
     perfect-scrollbar "^1.5.5"
 
-vue@^3.0.0, vue@^3.5.18:
+vue@^3.0.0:
   version "3.5.18"
   resolved "https://registry.npmmirror.com/vue/-/vue-3.5.18.tgz#3d622425ad1391a2b0138323211ec784f4415686"
   integrity sha512-7W4Y4ZbMiQ3SEo+m9lnoNpV9xG7QVMLa+/0RFwwiAVkeYoyGXqWE85jabU4pllJNUzqfLShJ5YLptewhCWUgNA==
@@ -3654,6 +3865,18 @@ vue@^3.0.0, vue@^3.5.18:
     "@vue/server-renderer" "3.5.18"
     "@vue/shared" "3.5.18"
 
+vue@^3.6.0-alpha.2:
+  version "3.6.0-alpha.2"
+  resolved "https://registry.npmmirror.com/vue/-/vue-3.6.0-alpha.2.tgz#cdd90b3f8adb9dfceacc90b71b8c75f50581a8a7"
+  integrity sha512-xn3jwLo6eMqxEKEAW8TWX+KSm7K2jTrNZ5Q3+H5Bu9P3mkoz8w0lUQHrO5WcnSVZfmR7vvw4/5XSYQe2XeDzdw==
+  dependencies:
+    "@vue/compiler-dom" "3.6.0-alpha.2"
+    "@vue/compiler-sfc" "3.6.0-alpha.2"
+    "@vue/runtime-dom" "3.6.0-alpha.2"
+    "@vue/runtime-vapor" "3.6.0-alpha.2"
+    "@vue/server-renderer" "3.6.0-alpha.2"
+    "@vue/shared" "3.6.0-alpha.2"
+
 webpack-virtual-modules@^0.6.2:
   version "0.6.2"
   resolved "https://registry.npmmirror.com/webpack-virtual-modules/-/webpack-virtual-modules-0.6.2.tgz#057faa9065c8acf48f24cb57ac0e77739ab9a7e8"
@@ -3693,6 +3916,11 @@ yallist@^3.0.2:
   resolved "https://registry.npmmirror.com/yallist/-/yallist-3.1.1.tgz#dbb7daf9bfd8bac9ab45ebf602b8cbad0d5d08fd"
   integrity sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==
 
+yaml@^2.8.0:
+  version "2.8.1"
+  resolved "https://registry.npmmirror.com/yaml/-/yaml-2.8.1.tgz#1870aa02b631f7e8328b93f8bc574fac5d6c4d79"
+  integrity sha512-lcYcMxX2PO9XMGvAJkJ3OsNMw+/7FKes7/hgerGUYWIoWu5j/+YQqcZr5JnPZWzOsEBgMbSbiSTn/dv/69Mkpw==
+
 yoctocolors@^2.1.1:
   version "2.1.1"
   resolved "https://registry.npmmirror.com/yoctocolors/-/yoctocolors-2.1.1.tgz#e0167474e9fbb9e8b3ecca738deaa61dd12e56fc"