feat: 初步接入 translate.js 的多语言切换能力

目前只是在PC端的登录页面的右上角显示多语言切换入口
2026-01-05 10:57:15 +08:00 · 2025-10-30 03:09:35 +00:00
41 changed files with 368 additions and 1283 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,32 +1,3 @@
-## [v4.1.0](https://github.com/continew-org/continew-admin-ui/compare/v4.0.0...v4.1.0) (2025-11-17)
-
-### ✨ 新特性
-
- 新增分片文件上传 (Gitee#69@kiki1373639299) ([a3ce4b5](https://github.com/continew-org/continew-admin-ui/commit/a3ce4b508a0d146d62163185a4d71a9c1425eaf7))
- 新增微信开放平台登录及绑定按钮 ([0f73944](https://github.com/continew-org/continew-admin-ui/commit/0f739442ac57fc230210c195904e12d1402be3b7))
- 支持双列布局等更多布局选项并优化布局切换功能（同步gi-demo） (GitCode#11@kiki1373639299) ([704aacc](https://github.com/continew-org/continew-admin-ui/commit/704aacc38f655fc55b11ca4d64380334392cc073)) ([e5c9d2f](https://github.com/continew-org/continew-admin-ui/commit/e5c9d2f12f1a76e7b5186c59f0accbc774c63509)) ([e72e2ed](https://github.com/continew-org/continew-admin-ui/commit/e72e2ed1f8fbca2283d71f293afd34c02e5232d2)) ([1a0429d](https://github.com/continew-org/continew-admin-ui/commit/1a0429dfb696b1fa0d24a015fce5b4e745b5cf38))
- 新增支持文件回收站 ([7e2c2ba](https://github.com/continew-org/continew-admin-ui/commit/7e2c2ba647a963c4d60aaeb68bcebf9566a84cfb))
-
-### 💎 功能优化
-
- 优化操作日志json预览效果 ([eea9a93](https://github.com/continew-org/continew-admin-ui/commit/eea9a93ae681af42a1338d44d6f5192ba9097639))
- 优化 useDownload 函数，如果指定了文件名则直接使用 ([986c03e](https://github.com/continew-org/continew-admin-ui/commit/986c03e69fb8f21c7de84532d433e7c7ba5f6735))
- 简化命名，例如：UserAddDrawer => AddDrawer ([c57a0a2](https://github.com/continew-org/continew-admin-ui/commit/c57a0a21951b32e6a7ff889fb4da89344aa0eb0b))
- 统一表格操作按钮最大数量为 3，超过 2 个则显示更多 ([eddd7c5](https://github.com/continew-org/continew-admin-ui/commit/eddd7c5fc6943e918ab3cfd19e0da4e528b43ff3))
- v-model.trim => v-model（外国用户输入单词无法直接在首尾输入空格） ([4aeb795](https://github.com/continew-org/continew-admin-ui/commit/4aeb795db03c276463d9fa6dd5fdc34091d99de0))
- 修改存储配置时，保持Secret Key为空将不更改 ([f0b24cc](https://github.com/continew-org/continew-admin-ui/commit/f0b24cc18afc8ee0cef185a385270b098cdd0b4f))
- 移除登录页h5时第三方登录对租户开启的判断 (GitCode#10@kiki1373639299) ([619ee77](https://github.com/continew-org/continew-admin-ui/commit/619ee77fb4a756ddef40fe276a988110742a8c0a))
-
-### 🐛 问题修复
-
- 系统内置用户，禁用分配角色功能 (GitCode#6@lishuyanla) ([1b1cbb8](https://github.com/continew-org/continew-admin-ui/commit/1b1cbb862789340ab580ef4a50126951be4bc491))
- 修复操作日志列表根据状态筛选不生效的问题 (GitHub#76@ali-pay) ([8ddc1ff](https://github.com/continew-org/continew-admin-ui/commit/8ddc1ff516caa1a784ab8fc56ab4db51eabbd88b))
- 修复个人中心角色信息展示错误 ([b1805dc](https://github.com/continew-org/continew-admin-ui/commit/b1805dc41beca98012c8bc292fbd67659dfaa91c))
- 补充UserInfo定义的新增字段 (GitCode#9@maqiang9527) ([d85ac20](https://github.com/continew-org/continew-admin-ui/commit/d85ac20d7e642c0fa43051010a7f62f09871ed3a))
- 修复腾讯云短信配置缺失问题，配置腾讯云短信，需要增加输入 sdkAppId 配置项 ([6477a6d](https://github.com/continew-org/continew-admin-ui/commit/6477a6de3e5d8a332ef020f4b2958702d494b958))
- 修复混合布局模式下详情页左侧菜单消失问题 (GitCode#12@kiki1373639299) ([069175b](https://github.com/continew-org/continew-admin-ui/commit/069175bf1648bc42371bbae58d56c9245ad8bbe0))
- 修复重命名文件夹后，文件管理目录导航显示错误 (GitHub#78@ppxb) ([26e3738](https://github.com/continew-org/continew-admin-ui/commit/26e3738b74fe22f31ff2d8c0c0863e9c10b5e1ce))
-
 ## [v4.0.0](https://github.com/continew-org/continew-admin-ui/compare/v3.7.0...v4.0.0) (2025-07-27)

 ### ✨ 新特性
--- a/README.md
+++ b/README.md
@@ -1,7 +1,7 @@
 # ContiNew Admin UI

 <a href="https://github.com/continew-org/continew-admin-ui" title="Release" target="_blank">
-<img src="https://img.shields.io/badge/RELEASE-v4.1.0-%23ff3f59.svg" alt="Release" />
+<img src="https://img.shields.io/badge/SNAPSHOT-v4.1.0-%23ff3f59.svg" alt="Release" />
 </a>
 <a href="https://vuejs.org/" title="Vue" target="_blank">
 <img src="https://img.shields.io/badge/Vue-3.5.4-%236CB52D.svg?logo=Vue.js" alt="Vue" />
@@ -137,14 +137,14 @@ public class DeptController extends BaseController<DeptService, DeptResp, DeptDe
 > 功能不会用？请查看 [功能手册](https://continew.top/docs/admin/function/tenant/management.html)。

 - 仪表盘：提供工作台、分析页，工作台提供功能快捷导航入口、最新公告、动态；分析页提供全面数据可视化能力
- 个人中心：支持基础信息修改、密码修改、邮箱绑定、手机号绑定（并提供行为验证码、短信限流等安全处理）、第三方账号绑定/解绑（微信登录）、头像裁剪上传
+- 个人中心：支持基础信息修改、密码修改、邮箱绑定、手机号绑定（并提供行为验证码、短信限流等安全处理）、第三方账号绑定/解绑、头像裁剪上传
 - 消息中心：提供站内信消息统一查看、标记已读、全部已读、删除等功能（目前仅支持系统通知消息）、提供个人公告查看
 - 用户管理：管理系统用户，包含新增、修改、删除、导入、导出、重置密码、分配角色等功能
 - 角色管理：管理系统用户的功能权限及数据权限，包含新增、修改、删除、分配角色等功能
 - 菜单管理：管理系统菜单及按钮权限，支持多级菜单，动态路由，包含新增、修改、删除等功能
 - 部门管理：管理系统组织架构，包含新增、修改、删除、导出等功能，以树形列表进行展示
 - 通知公告：管理系统公告，支持通知范围（所有人、指定用户）、通知方式（系统消息、登录弹窗）、定时发送、置顶设置
- 文件管理：管理系统文件及文件夹，支持回收站、上传/分片上传、下载、预览（目前支持图片、音视频、PDF、Word、Excel、PPT）、重命名、切换视图（列表、网格）等功能
+- 文件管理：管理系统文件及文件夹，支持上传、下载、预览（目前支持图片、音视频、PDF、Word、Excel、PPT）、重命名、切换视图（列表、网格）等功能
 - 字典管理：管理系统公用数据字典，例如：消息类型。支持字典标签背景色和排序等配置
 - 系统配置：
  - 网站配置：提供修改系统标题、Logo、favicon、版权信息等基础配置功能，以方便用户系统与其自身品牌形象保持一致
--- a/config/plugins/app-info.ts
+++ b/config/plugins/app-info.ts
@@ -11,7 +11,7 @@ export default function appInfo(): Plugin {
      // eslint-disable-next-line no-console
      console.log(
        boxen(
-          `${bold(green(`${bgGreen('ContiNew Admin v4.1.0')}`))}\n${cyan('在线文档：')}${underline('https://continew.top')}\n${cyan('吐槽广场：')}${underline('https://continew.top/docs/admin/issue-hub.html')}\n${cyan('常见问题：')}${underline('https://continew.top/docs/admin/faq.html')}\n${cyan('更新日志：')}${underline('https://continew.top/docs/admin/changelog/')}\n${cyan('持续迭代优化的，高质量多租户中后台管理系统框架')}`,
+          `${bold(green(`${bgGreen('ContiNew Admin v4.1.0-SNAPSHOT')}`))}\n${cyan('在线文档：')}${underline('https://continew.top')}\n${cyan('吐槽广场：')}${underline('https://continew.top/docs/admin/issue-hub.html')}\n${cyan('常见问题：')}${underline('https://continew.top/docs/admin/faq.html')}\n${cyan('更新日志：')}${underline('https://continew.top/docs/admin/changelog/')}\n${cyan('持续迭代优化的，高质量多租户中后台管理系统框架')}`,
          {
            padding: 1,
            margin: 1,
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
  "name": "continew-admin-ui",
  "type": "module",
-  "version": "4.1.0",
+  "version": "4.1.0-SNAPSHOT",
  "private": "true",
  "scripts": {
    "bootstrap": "pnpm install --registry=https://registry.npmmirror.com",
@@ -14,6 +14,7 @@
    "lint:fix": "eslint . --fix"
  },
  "dependencies": {
+    "i18n-jsautotranslate": "3.18.63",
    "@amap/amap-jsapi-loader": "^1.0.1",
    "@arco-design/color": "^0.4.0",
    "@arco-themes/vue-gi-demo": "^0.0.51",
--- a/src/apis/system/file.ts
+++ b/src/apis/system/file.ts
@@ -4,7 +4,6 @@ import http from '@/utils/http'
 export type * from './type'

 const BASE_URL = '/system/file'
-const RECYCLE_URL = `${BASE_URL}/recycle`

 /** @desc 上传文件 */
 export function uploadFile(data: FormData) {
@@ -45,23 +44,3 @@ export function createDir(parentPath: string, name: string) {
 export function calcDirSize(id: string) {
  return http.get<T.FileDirCalcSizeResp>(`${BASE_URL}/dir/${id}/size`)
 }
-
-/** @desc 查询回收站文件列表 */
-export function listRecycleFiles(query: T.FilePageQuery) {
-  return http.get<PageRes<T.FileItem[]>>(`${RECYCLE_URL}`, query)
-}
-
-/** @desc 还原回收站文件 */
-export function restoreRecycleFile(id: string) {
-  return http.put(`${RECYCLE_URL}/restore/${id}`)
-}
-
-/** @desc 删除回收站文件 */
-export function deleteRecycleFile(id: string) {
-  return http.del(`${RECYCLE_URL}/${id}`)
-}
-
-/** @desc 清空回收站 */
-export function cleanRecycleBin() {
-  return http.del(`${RECYCLE_URL}/clean`)
-}
--- a/src/apis/system/type.ts
+++ b/src/apis/system/type.ts
@@ -269,8 +269,6 @@ export interface StorageResp {
  endpoint: string
  bucketName: string
  domain: string
-  recycleBinEnabled: boolean
-  recycleBinPath: string
  description: string
  isDefault: boolean
  sort: number
--- a/src/assets/icons/wechat.svg
+++ b/src/assets/icons/wechat.svg
@@ -1 +0,0 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1760706428122" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4539" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M347.729118 353.0242c-16.487119 0-29.776737 13.389539-29.776737 29.776737S331.241998 412.677596 347.729118 412.677596s29.776737-13.389539 29.776737-29.776737-13.289617-29.876659-29.776737-29.876659zM577.749415 511.800156c-13.689305 0-24.880562 11.091335-24.880563 24.880562 0 13.689305 11.091335 24.880562 24.880563 24.880562 13.689305 0 24.880562-11.191257 24.880562-24.880562s-11.191257-24.880562-24.880562-24.880562zM500.909446 412.677596c16.487119 0 29.776737-13.389539 29.776737-29.776737s-13.389539-29.776737-29.776737-29.776737c-16.487119 0-29.776737 13.389539-29.776737 29.776737s13.289617 29.776737 29.776737 29.776737zM698.455113 511.600312c-13.689305 0-24.880562 11.091335-24.880562 24.880562 0 13.689305 11.091335 24.880562 24.880562 24.880562 13.689305 0 24.880562-11.091335 24.880562-24.880562-0.099922-13.689305-11.191257-24.880562-24.880562-24.880562z" fill="#00C800" p-id="4540"></path><path d="M511.601093 0.799375C229.12178 0.799375 0.000781 229.820453 0.000781 512.399688s229.021077 511.600312 511.600312 511.600312 511.600312-229.021077 511.600312-511.600312S794.180328 0.799375 511.601093 0.799375z m-90.229508 634.504294c-27.37861 0-49.361436-5.595628-76.839969-10.991413l-76.640125 38.469945 21.882904-65.948477c-54.957065-38.370023-87.73146-87.831382-87.73146-148.084309 0-104.318501 98.722873-186.554254 219.32865-186.554255 107.815769 0 202.34192 65.648712 221.327088 153.979703-6.994536-0.799375-13.989071-1.298985-21.083529-1.298985-104.118657 0-186.454333 77.739266-186.454332 173.564403 0 15.98751 2.498048 31.275566 6.794692 45.964091-6.794692 0.599532-13.689305 0.899297-20.583919 0.899297z m323.547228 76.839969l16.48712 54.757221-60.153006-32.874317c-21.882904 5.495706-43.965652 10.991413-65.848555 10.991413-104.318501 0-186.554254-71.344262-186.554255-159.175644 0-87.631538 82.135831-159.175644 186.554255-159.175644 98.523029 0 186.254489 71.444184 186.254488 159.175644 0.099922 49.461358-32.774395 93.227166-76.740047 126.301327z" fill="#00C800" p-id="4541"></path></svg>
--- a/src/hooks/index.ts
+++ b/src/hooks/index.ts
@@ -8,4 +8,3 @@ export * from './modules/useBreakpoint'
 export * from './modules/useDownload'
 export * from './modules/useResetReactive'
 export * from './modules/useMultipartUploader'
-export * from './modules/useRouteListener'
--- a/src/hooks/modules/useMultipartUploader.ts
+++ b/src/hooks/modules/useMultipartUploader.ts
@@ -100,7 +100,7 @@ export function useMultipartUploader(props: {
    if (typeof Worker !== 'undefined' && !md5Worker) {
      // eslint-disable-next-line no-console
      console.log('[Hooks] 初始化MD5 Worker...')
-      md5Worker = new Worker(new URL('../../utils/md5-worker.ts', import.meta.url), { type: 'module' })
+      md5Worker = new Worker('/src/utils/md5-worker.ts', { type: 'module' })
      md5Worker.onmessage = function (e) {
        const { type, taskId, md5, error } = e.data

@@ -141,27 +141,9 @@ export function useMultipartUploader(props: {
          totalTime: 0,
        }

-        // 根据文件大小动态调整分块和分片大小（优化：使用更小的分片以降低内存占用）
-        let blockSize: number
-        let chunkSize: number
-
-        if (file.size > 500 * 1024 * 1024) {
-          // 超大文件（> 500MB）
-          blockSize = 50 * 1024 * 1024 // 50MB块
-          chunkSize = 5 * 1024 * 1024 // 5MB分片
-        } else if (file.size > 100 * 1024 * 1024) {
-          // 大文件（100MB - 500MB）
-          blockSize = 30 * 1024 * 1024 // 30MB块
-          chunkSize = 3 * 1024 * 1024 // 3MB分片
-        } else if (file.size > 10 * 1024 * 1024) {
-          // 中等文件（10MB - 100MB）
-          blockSize = 10 * 1024 * 1024 // 10MB块
-          chunkSize = 1 * 1024 * 1024 // 1MB分片
-        } else {
-          // 小文件（< 10MB）
-          blockSize = 5 * 1024 * 1024 // 5MB块
-          chunkSize = 512 * 1024 // 512KB分片
-        }
+        // 根据文件大小动态调整分块和分片大小
+        const blockSize = file.size > 200 * 1024 * 1024 ? 50 * 1024 * 1024 : 25 * 1024 * 1024 // 50MB或25MB块
+        const chunkSize = file.size > 100 * 1024 * 1024 ? 10 * 1024 * 1024 : 2 * 1024 * 1024 // 10MB或2MB分片

        // eslint-disable-next-line no-console
        console.log(`[Hooks] 发送文件到Worker: ${file.name}, 大小: ${(file.size / 1024 / 1024).toFixed(2)}MB, 块大小: ${(blockSize / 1024 / 1024).toFixed(2)}MB, 分片大小: ${(chunkSize / 1024 / 1024).toFixed(2)}MB`)
--- a/src/hooks/modules/useRouteListener.ts
+++ b/src/hooks/modules/useRouteListener.ts
@@ -1,92 +0,0 @@
-/**
- * 路由变化监听 Hook
- * @description 使用发布订阅模式管理路由变化，避免重复监听导致的性能问题
- */
-
-import type { Handler } from 'mitt'
-import type { RouteLocationNormalized } from 'vue-router'
-import mitt from 'mitt'
-import { onUnmounted, ref } from 'vue'
-
-// 事件类型定义
-interface RouteChangeEvent {
-  to: RouteLocationNormalized
-  from?: RouteLocationNormalized
-}
-
-// 事件键定义
-const ROUTE_CHANGE_KEY = Symbol('ROUTE_CHANGE')
-
-// 事件发射器
-const emitter = mitt<{
-  [ROUTE_CHANGE_KEY]: RouteChangeEvent
-}>()
-
-// 最新路由状态
-const latestRoute = ref<RouteLocationNormalized | null>(null)
-
-/**
- * 设置路由变化事件
- * @param to 目标路由
- * @param from 来源路由
- */
-export function setRouteEmitter(to: RouteLocationNormalized, from?: RouteLocationNormalized) {
-  const event: RouteChangeEvent = { to, from }
-  emitter.emit(ROUTE_CHANGE_KEY, event)
-  latestRoute.value = to
-}
-
-/**
- * 路由监听 Hook
- * @returns 路由监听相关方法
- */
-export function useRouteListener() {
-  // 监听器列表
-  const listeners = new Set<Handler<RouteChangeEvent>>()
-
-  /**
-   * 监听路由变化
-   * @param handler 处理函数
-   * @param immediate 是否立即执行
-   */
-  function listenerRouteChange(
-    handler: (event: RouteChangeEvent) => void,
-    immediate = true,
-  ) {
-    emitter.on(ROUTE_CHANGE_KEY, handler)
-    listeners.add(handler)
-
-    if (immediate && latestRoute.value) {
-      handler({ to: latestRoute.value })
-    }
-
-    return handler
-  }
-
-  /**
-   * 移除路由监听器
-   * @param handler 要移除的处理函数
-   */
-  function removeRouteListener(handler?: Handler<RouteChangeEvent>) {
-    if (handler) {
-      emitter.off(ROUTE_CHANGE_KEY, handler)
-      listeners.delete(handler)
-    } else {
-      // 移除所有监听器
-      listeners.forEach((listener) => {
-        emitter.off(ROUTE_CHANGE_KEY, listener)
-      })
-      listeners.clear()
-    }
-  }
-
-  // 组件卸载时清理
-  onUnmounted(() => {
-    removeRouteListener()
-  })
-
-  return {
-    listenerRouteChange,
-    removeRouteListener,
-  }
-}
--- a/src/layout/LayoutColumns.vue
+++ b/src/layout/LayoutColumns.vue
@@ -1,154 +0,0 @@
-<template>
-  <div class="layout-columns">
-    <div v-show="isDesktop" class="layout-columns__left">
-      <!-- 左侧一级菜单区域 -->
-      <OneLevelMenu :menus="oneLevelMenus" @menu-click="handleMenuItemClickByItem"></OneLevelMenu>
-
-      <!-- 左侧二级菜单区域 -->
-      <div v-if="twoLevelMenus.length > 0" class="layout-columns__right-menu" :class="{ collapse: appStore.menuCollapse }">
-        <!-- 系统标题 -->
-        <div class="layout-columns__title">
-          <span v-show="!appStore.menuCollapse" class="system-name gi_line_1">{{ appStore.getTitle() }}</span>
-        </div>
-        <Menu
-          v-if="twoLevelMenus.length >= 1 || oneLevelMenuActiveRoute?.meta?.alwaysShow === true"
-          class="layout-columns__menu" :menus="twoLevelMenus" :menu-style="menuStyle"
-        />
-      </div>
-    </div>
-
-    <section class="layout-columns__content">
-      <Header />
-      <Tabs v-if="appStore.tab" />
-      <Main />
-      <GiFooter v-if="appStore.copyrightDisplay" />
-    </section>
-
-    <!-- 公告弹窗 -->
-    <NoticePopup ref="noticePopupRef" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import Header from './components/Header/index.vue'
-import Main from './components/Main.vue'
-import Menu from './components/Menu/index.vue'
-import OneLevelMenu from './components/OneLevelMenu/index.vue'
-import Tabs from './components/Tabs/index.vue'
-import { useAppStore } from '@/stores'
-import { useLevelMenu } from '@/layout/hooks/useLevelMenu'
-import { useDevice } from '@/hooks'
-import NoticePopup from '@/views/user/message/components/NoticePopup.vue'
-import { getToken } from '@/utils/auth'
-
-defineOptions({ name: 'LayoutColumns' })
-
-const appStore = useAppStore()
-const { isDesktop } = useDevice()
-
-const { oneLevelMenus, twoLevelMenus, oneLevelMenuActiveRoute, getOneLevelMenus, handleMenuItemClickByItem } = useLevelMenu()
-getOneLevelMenus()
-// 菜单样式 - 根据折叠状态动态调整宽度
-const menuStyle = computed(() => {
-  return {
-    width: appStore.menuCollapse ? '48px' : '200px',
-  }
-})
-// 公告弹窗引用
-const noticePopupRef = ref<InstanceType<typeof NoticePopup>>()
-
-// 检查并显示未读公告
-const checkAndShowNotices = () => {
-  const token = getToken()
-
-  // 如果有token，检查未读公告
-  if (token) {
-    setTimeout(() => {
-      noticePopupRef.value?.open()
-    }, 1000) // 延迟1秒显示，让页面先加载完成
-  }
-}
-onMounted(() => {
-  checkAndShowNotices()
-})
-</script>
-
-<style lang="scss" scoped>
-.layout-columns {
-  display: flex;
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-
-  &__left {
-    display: flex;
-    height: 100%;
-    overflow: hidden;
-    background-color: var(--color-bg-1);
-  }
-
-  &__right-menu {
-    display: flex;
-    flex-direction: column;
-    overflow: hidden;
-    background-color: var(--color-bg-1);
-    width: 200px;
-    transition: width 0.3s ease-in-out;
-    &.collapse {
-      width: 48px;
-    }
-  }
-
-  &__title {
-    height: 56px;
-    padding: 0 12px;
-    color: var(--color-text-1);
-    font-size: 20px;
-    line-height: 1;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-shrink: 0;
-    box-sizing: border-box;
-    border-bottom: 1px solid var(--color-border);
-    cursor: pointer;
-    user-select: none;
-    transition: all 0.3s ease-in-out;
-
-    .system-name {
-      padding-left: 6px;
-      white-space: nowrap;
-      transition: all 0.3s ease-in-out;
-      line-height: 1.5;
-      display: inline-flex;
-      align-items: center;
-      opacity: 1;
-      transform: translateX(0);
-
-      &:hover {
-        color: $color-theme !important;
-        cursor: pointer;
-      }
-
-      .layout-columns__right-menu.collapse & {
-        opacity: 0;
-        transform: translateX(-20px);
-      }
-    }
-  }
-  &__menu {
-    flex: 1;
-    overflow: auto;
-    border-right: 1px solid var(--color-border-2);
-    transition: all 0.3s ease-in-out;
-    width: 100%;
-  }
-
-  &__content {
-    display: flex;
-    flex: 1;
-    flex-direction: column;
-    overflow: hidden;
-  }
-}
-</style>
--- a/src/layout/LayoutMix.vue
+++ b/src/layout/LayoutMix.vue
@@ -1,38 +1,35 @@
-<!--
-  @file LayoutMix 组件
-  @description 混合布局组件，支持顶部导航和左侧菜单组合的布局方式
-->
 <template>
  <div class="layout-mix">
-    <!-- 左侧菜单区域 -->
    <section
      v-if="isDesktop" class="layout-mix-left" :class="{ 'app-menu-dark': appStore.menuDark }"
      :style="appStore.menuDark ? appStore.themeCSSVar : undefined"
    >
-      <Logo :collapsed="appStore.menuCollapse" />
-      <Menu :menus="twoLevelMenus" :menu-style="{ width: '200px', flex: 1 }" />
+      <Logo :collapsed="appStore.menuCollapse"></Logo>
+      <div class="menu-container">
+        <Menu :menus="leftMenus" :menu-style="{ width: '220px', flex: 1 }"></Menu>
+      </div>
      <WwAds class="ads" />
    </section>

-    <!-- 右侧内容区域 -->
    <section class="layout-mix-right">
      <header class="header">
-        <MenuFoldBtn />
+        <MenuFoldBtn></MenuFoldBtn>
        <a-menu
          v-if="isDesktop" mode="horizontal" :selected-keys="activeMenu" :auto-open-selected="false"
-          :trigger-props="menuTriggerProps" @menu-item-click="handleMenuItemClickByPath"
+          :trigger-props="{ animationName: 'slide-dynamic-origin' }" @menu-item-click="onMenuItemClick"
        >
-          <a-menu-item v-for="item in oneLevelMenus" :key="item.path">
+          <a-menu-item v-for="item in topMenus" :key="item.path">
            <template #icon>
-              <GiSvgIcon :name="getMenuIcon(item) || ''" :size="24" />
+              <GiSvgIcon :name="getMenuIcon(item)" :size="24" />
            </template>
            <span>{{ item.meta?.title || item.children?.[0]?.meta?.title || '' }}</span>
          </a-menu-item>
        </a-menu>
-        <HeaderRightBar />
+        <HeaderRightBar></HeaderRightBar>
      </header>
-      <Tabs v-if="appStore.tab" />
-      <Main />
+
+      <Tabs></Tabs>
+      <Main></Main>
      <GiFooter v-if="appStore.copyrightDisplay" />
    </section>

@@ -42,36 +39,38 @@
 </template>

 <script setup lang="ts">
+import { nextTick, onMounted, ref, watch } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
 import type { RouteRecordRaw } from 'vue-router'
+import { searchTree } from 'xe-utils'
+import Main from './components/Main.vue'
+import Tabs from './components/Tabs/index.vue'
+import Menu from './components/Menu/index.vue'
 import HeaderRightBar from './components/HeaderRightBar/index.vue'
 import Logo from './components/Logo.vue'
-import Main from './components/Main.vue'
-import Menu from './components/Menu/index.vue'
 import MenuFoldBtn from './components/MenuFoldBtn.vue'
-import Tabs from './components/Tabs/index.vue'
-import { useAppStore } from '@/stores'
-import { useLevelMenu } from '@/layout/hooks/useLevelMenu'
+import WwAds from './components/WwAds.vue'
+import GiFooter from '@/components/GiFooter/index.vue'
+import NoticePopup from '@/views/user/message/components/NoticePopup.vue'
+import { useAppStore, useRouteStore } from '@/stores'
+import { isExternal } from '@/utils/validate'
+import { filterTree } from '@/utils'
 import { useDevice } from '@/hooks'
 import { getToken } from '@/utils/auth'

-import WwAds from '@/layout/components/WwAds.vue'
-import NoticePopup from '@/views/user/message/components/NoticePopup.vue'
-
-/** 组件名称 */
 defineOptions({ name: 'LayoutMix' })
-
+const route = useRoute()
+const router = useRouter()
 const appStore = useAppStore()
+const routeStore = useRouteStore()
 const { isDesktop } = useDevice()
+// 过滤是菜单的路由
+const cloneRoutes = JSON.parse(JSON.stringify(routeStore.routes)) as RouteRecordRaw[]
+const menuRoutes = filterTree(cloneRoutes, (i) => i.meta?.hidden === false)

-/** 菜单配置 */
-const menuTriggerProps = {
-  animationName: 'slide-dynamic-origin',
-}
-
-const { oneLevelMenus, twoLevelMenus, oneLevelMenuActiveRoute, getOneLevelMenus, handleMenuItemClickByPath } = useLevelMenu()
-getOneLevelMenus()
-
-const activeMenu = computed(() => [oneLevelMenuActiveRoute.value?.path ?? ''])
+// 顶部一级菜单
+const topMenus = ref<RouteRecordRaw[]>([])
+topMenus.value = JSON.parse(JSON.stringify(menuRoutes))

 // 公告弹窗引用
 const noticePopupRef = ref<InstanceType<typeof NoticePopup>>()
@@ -83,20 +82,57 @@ const checkAndShowNotices = () => {
  // 如果有token，检查未读公告
  if (token) {
    setTimeout(() => {
-      console.log(noticePopupRef.value)
      noticePopupRef.value?.open()
    }, 1000) // 延迟1秒显示，让页面先加载完成
  }
 }
+
 const getMenuIcon = (item: RouteRecordRaw) => {
-  return item.meta?.icon || item.children?.[0]?.meta?.icon
+  return item.meta?.icon || item.children?.[0].meta?.icon
 }
+
+// 克隆是菜单的路由
+const cloneMenuRoutes: RouteRecordRaw[] = JSON.parse(JSON.stringify(menuRoutes))
+// 顶部一级菜单选中的
+const activeMenu = ref<string[]>([])
+// 左侧的菜单
+const leftMenus = ref<RouteRecordRaw[]>([])
+// 获取左侧菜单
+const getLeftMenus = (key: string) => {
+  const arr = searchTree(cloneMenuRoutes, (i) => i.path === key, { children: 'children' })
+  const rootPath = arr.length ? arr[0].path : ''
+  const obj = cloneMenuRoutes.find((i) => i.path === rootPath)
+  activeMenu.value = obj ? [obj.path] : ['']
+  leftMenus.value = obj ? (obj.children as RouteRecordRaw[]) : []
+}
+
+const onMenuItemClick = (key: string) => {
+  if (isExternal(key)) {
+    window.open(key)
+    return
+  }
+  setTimeout(() => getLeftMenus(key))
+  const obj = topMenus.value.find((i) => i.path === key)
+  if (obj && obj.redirect === 'noRedirect') return
+  router.push({ path: key })
+}
+
+watch(
+  () => route.path,
+  (newPath) => {
+    nextTick(() => {
+      getLeftMenus(newPath)
+    })
+  },
+  { immediate: true },
+)
+
 onMounted(() => {
  checkAndShowNotices()
 })
 </script>

-<style lang="scss" scoped>
+<style scoped lang="scss">
 :deep(.arco-menu-pop) {
  white-space: nowrap;
 }
@@ -105,13 +141,13 @@ onMounted(() => {

  // Menu菜单组件修改
  .arco-menu-icon {
-    padding: 10px 0;
    margin-right: 0;
+    padding: 10px 0;
  }

  .arco-menu-has-icon {
-    justify-content: center;
    padding: 0;
+    justify-content: center;
  }

  .arco-menu-title {
@@ -133,36 +169,43 @@ onMounted(() => {
 }

 .layout-mix {
+  height: 100%;
  display: flex;
  align-items: stretch;
-  height: 100%;
  overflow: hidden;

  &-left {
+    border-right: 1px solid var(--color-border);
+    background-color: var(--color-bg-1);
    display: flex;
    flex-direction: column;
    overflow: hidden;
-    background-color: var(--color-bg-1);
-    border-right: 1px solid var(--color-border);
+    height: 100vh;
+
+    .menu-container {
+      flex: 1;
+      overflow-y: auto;
+      overflow-x: hidden;
+    }
  }

  &-right {
-    display: flex;
    flex: 1;
+    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
 }

 .header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  height: 56px;
  padding: 0 $padding;
-  overflow: hidden;
+  height: 56px;
  color: var(--color-text-1);
  background: var(--color-bg-1);
  border-bottom: 1px solid var(--color-border);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  overflow: hidden;
 }
 </style>
--- a/src/layout/LayoutTop.vue
+++ b/src/layout/LayoutTop.vue
@@ -1,51 +0,0 @@
-<template>
-  <div class="layout-top">
-    <a-row align="center" class="layout-top__header">
-      <Logo></Logo>
-      <Menu class="layout-top__menu"></Menu>
-      <HeaderRightBar></HeaderRightBar>
-    </a-row>
-    <Tabs v-if="appStore.tab"></Tabs>
-    <Main></Main>
-  </div>
-</template>
-
-<script setup lang="ts">
-import HeaderRightBar from './components/HeaderRightBar/index.vue'
-import Logo from './components/Logo.vue'
-import Main from './components/Main.vue'
-import Menu from './components/Menu/index.vue'
-import Tabs from './components/Tabs/index.vue'
-import { useAppStore } from '@/stores'
-
-defineOptions({ name: 'LayoutTop' })
-
-const appStore = useAppStore()
-</script>
-
-<style lang="scss" scoped>
-.layout-top {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-
-  &__header {
-    width: 100%;
-    overflow: hidden;
-    box-sizing: border-box;
-    border-bottom: 1px solid var(--color-border);
-    background-color: var(--color-bg-1);
-    padding-right: 16px;
-  }
-
-  &__menu {
-    flex: 1;
-    overflow: hidden;
-
-    :deep(.arco-menu-inner) {
-      padding-left: 0;
-    }
-  }
-}
-</style>
--- a/src/layout/components/HeaderRightBar/SettingDrawer.vue
+++ b/src/layout/components/HeaderRightBar/SettingDrawer.vue
@@ -5,10 +5,29 @@
        「复制配置」按钮，并将配置粘贴到 src/config/settings.ts 文件中。
      </a-alert>
      <a-divider v-if="settingOpen" orientation="center">系统布局</a-divider>
-      <a-row v-if="settingOpen" :gutter="[8, 8]">
-        <a-col v-for="item in LAYOUT_OPTIONS" :key="item.value" :span="8">
-          <LayoutItem :mode="item.value" :name="item.label" @click="toggleLayout(item.value)" />
-        </a-col>
+      <a-row v-if="settingOpen" justify="center">
+        <a-space>
+          <a-badge>
+            <template #content>
+              <icon-check-circle-fill
+                v-if="appStore.layout === 'left'" style="color: rgb(var(--success-6))"
+                :size="16"
+              ></icon-check-circle-fill>
+            </template>
+            <LayoutItem mode="left" @click="appStore.layout = 'left'"></LayoutItem>
+            <p class="layout-text">默认布局</p>
+          </a-badge>
+          <a-badge>
+            <template #content>
+              <icon-check-circle-fill
+                v-if="appStore.layout === 'mix'" :size="16"
+                style="color: rgb(var(--success-6))"
+              ></icon-check-circle-fill>
+            </template>
+            <LayoutItem mode="mix" @click="appStore.layout = 'mix'"></LayoutItem>
+            <p class="layout-text">混合布局</p>
+          </a-badge>
+        </a-space>
      </a-row>

      <a-divider orientation="center">系统主题</a-divider>
@@ -92,15 +111,6 @@ defineOptions({ name: 'SettingDrawer' })
 const appStore = useAppStore()
 const visible = ref(false)
 const settingOpen = JSON.parse(import.meta.env.VITE_APP_SETTING)
-interface LayoutItemProps { label: string, value: App.AppSettings['layout'] }
-
-/** 布局选项 */
-const LAYOUT_OPTIONS: LayoutItemProps[] = [
-  { label: '默认布局', value: 'left' },
-  { label: '混合布局', value: 'mix' },
-  { label: '顶部布局', value: 'top' },
-  { label: '双列布局', value: 'columns' },
-]
 const tabModeList: App.TabItem[] = [
  { label: '卡片', value: 'card' },
  { label: '间隔卡片', value: 'card-gutter' },
@@ -180,10 +190,6 @@ const copySettings = () => {
    Message.error({ content: '请检查浏览器权限是否开启' })
  }
 }
-/** 切换布局 */
-const toggleLayout = (layout: App.AppSettings['layout']) => {
-  appStore.layout = layout
-}

 defineExpose({ open })
 </script>
--- a/src/layout/components/HeaderRightBar/components/LayoutItem.vue
+++ b/src/layout/components/HeaderRightBar/components/LayoutItem.vue
@@ -1,191 +1,62 @@
-<!--
-  @file LayoutItem 组件
-  @description 布局切换选项组件，支持左侧布局、顶部布局和混合布局三种模式
-->
 <template>
-  <a-badge class="w-full">
-    <!-- 选中状态标记 -->
-    <template #content>
-      <icon-check-circle-fill
-        v-if="appStore.layout === props.mode" style="color: rgb(var(--success-6))"
-        :size="16"
-      ></icon-check-circle-fill>
-    </template>
-
-    <!-- 布局预览 -->
-    <div class="layout-mode-item" :class="`layout-mode-item__${props.mode}`" @click="emit('click')">
-      <!-- 左侧布局 -->
-      <template v-if="props.mode === 'left'">
-        <div class="block-left"></div>
-        <div class="block-right"></div>
-      </template>
-
-      <!-- 顶部布局 -->
-      <template v-if="props.mode === 'top'">
-        <div class="block-top"></div>
-        <div class="block-bottom"></div>
-      </template>
-
-      <!-- 混合布局 -->
-      <template v-if="props.mode === 'mix'">
-        <div class="block-top"></div>
-        <div class="block-main">
-          <div class="block-left"></div>
-          <div class="block-right"></div>
-        </div>
-      </template>
-
-      <!-- 双列布局 -->
-      <template v-if="props.mode === 'columns'">
-        <div class="block-left block-column"></div>
-        <div class="block-left"></div>
-        <div class="block-right"></div>
-      </template>
-    </div>
-
-    <!-- 布局名称 -->
-    <p class="layout-mode-item__text">{{ props.name }}</p>
-  </a-badge>
+  <div class="layout-item" :class="`layout-item-${mode}`" @click="emit('click')"></div>
 </template>

 <script setup lang="ts">
-import { useAppStore } from '@/stores'
-
-defineOptions({
-  name: 'LayoutModeItem',
-})
-
-/** Props 默认值 */
-const props = withDefaults(defineProps<Props>(), {
-  mode: 'left',
-})
-
-/** Emits 定义 */
-const emit = defineEmits<{
-  (e: 'click'): void
-}>()
-
-/** 布局模式类型 */
-type LayoutMode = 'left' | 'top' | 'mix' | 'columns'
-
-/** Props 类型定义 */
 interface Props {
-  /** 布局模式 */
-  mode?: LayoutMode
-  /** 布局名称 */
-  name: string
+  mode: 'left' | 'top' | 'mix'
 }

-/** 应用状态 */
-const appStore = useAppStore()
+withDefaults(defineProps<Props>(), {})
+
+const emit = defineEmits(['click'])
 </script>

-<style lang="scss" scoped>
-// 布局项基础样式
-.layout-mode-item {
-  width: 100%;
+<style scoped lang="scss">
+.layout-item {
+  width: 60px;
  height: 50px;
-  padding: 4px;
-  display: flex;
-  cursor: pointer;
+  background-color: var(--color-fill-3);
+  border-radius: 3px;
  overflow: hidden;
  cursor: pointer;
  box-sizing: border-box;
-  border-radius: 2px;
-  background-color: var(--color-bg-5);
-  border: 1px solid var(--color-border-2);
-  box-shadow: 0 1px 2px -2px rgba(0, 0, 0, .08),
-    0 3px 6px 0 rgba(0, 0, 0, .06),
-    0 5px 12px 4px rgba(0, 0, 0, .04);
-
-  &__text {
-    font-size: 12px;
-    margin-top: 5px;
-    text-align: center;
-    color: var(--color-text-2);
+  position: relative;
+  &::before {
+    content: '';
+    width: 12px;
+    height: 100%;
+    background-color: rgb(var(--gray-9));
+    position: absolute;
+    top: 0;
+    left: 0;
+    display: none;
  }
-}
-
-.block-left,
-.block-right,
-.block-top,
-.block-bottom {
-  border-radius: 2px;
-}
-
-// 左侧布局样式
-.layout-mode-item__left {
-  .block-left {
-    width: 10px;
-    background-color: $color-theme;
+  &::after {
+    content: '';
+    width: 100%;
+    height: 10px;
+    background-color: rgb(var(--gray-9));
+    position: absolute;
+    top: 0;
+    left: 0;
+    display: none;
  }
-
-  .block-right {
-    flex: 1;
-    margin-left: 4px;
-    background-color: var(--color-fill-3);
-  }
-}
-
-// 顶部布局样式
-.layout-mode-item__top {
-  flex-direction: column;
-
-  .block-top {
-    height: 8px;
-    background-color: $color-theme;
-  }
-
-  .block-bottom {
-    flex: 1;
-    margin-top: 4px;
-    background-color: var(--color-fill-3);
-  }
-}
-
-// 混合布局样式
-.layout-mode-item__mix {
-  flex-direction: column;
-
-  .block-top {
-    height: 8px;
-    margin-bottom: 3px;
-    background-color: $color-theme;
-  }
-
-  .block-main {
-    flex: 1;
-    display: flex;
-
-    .block-left {
-      width: 10px;
-      background-color: $color-theme;
-    }
-
-    .block-right {
-      flex: 1;
-      margin-left: 3px;
-      background-color: var(--color-fill-3);
+  &-left {
+    &::before {
+      display: block;
    }
  }
-}
-
-// 双列布局样式
-.layout-mode-item__columns {
-
-  .block-left {
-    width: 10px;
-    background-color: $color-theme;
+  &-top {
+    &::after {
+      display: block;
+    }
  }
-
-  .block-right {
-    flex: 1;
-    margin-left: 4px;
-    background-color: var(--color-fill-3);
-  }
-
-  .block-column {
-    margin-right: 4px;
+  &-mix {
+    &::before,
+    &::after {
+      display: block;
+    }
  }
 }
 </style>
--- a/src/layout/components/Logo.vue
+++ b/src/layout/components/Logo.vue
@@ -2,7 +2,7 @@
  <section class="system-logo" :class="{ collapsed: props.collapsed }" @click="toHome">
    <img v-if="logo" class="logo" :src="logo" alt="logo" />
    <img v-else class="logo" src="/logo.svg" alt="logo" />
-    <span v-if="!props.hideName" class="system-name gi_line_1">{{ title }}</span>
+    <span class="system-name gi_line_1">{{ title }}</span>
  </section>
 </template>

@@ -11,19 +11,13 @@ import { useAppStore } from '@/stores'

 const props = withDefaults(defineProps<Props>(), {
  collapsed: false,
-  hideName: false,
-
 })
 const appStore = useAppStore()
 const title = computed(() => appStore.getTitle())
 const logo = computed(() => appStore.getLogo())

-/** Props 类型定义 */
 interface Props {
-  /** 是否折叠状态 */
  collapsed?: boolean
-  /** 是否隐藏名称 */
-  hideName?: boolean
 }
 const router = useRouter()
 // 跳转首页
--- a/src/layout/components/Menu/index.vue
+++ b/src/layout/components/Menu/index.vue
@@ -6,7 +6,7 @@
    :accordion="appStore.menuAccordion"
    :breakpoint="appStore.layout === 'mix' ? 'xl' : undefined"
    :trigger-props="{ animationName: 'slide-dynamic-origin' }"
-    :collapsed="mode === 'vertical' && isDesktop ? appStore.menuCollapse : false"
+    :collapsed="!isDesktop ? false : appStore.menuCollapse"
    :style="menuStyle"
    @menu-item-click="onMenuItemClick"
    @collapse="onCollapse"
@@ -44,7 +44,11 @@ const sidebarRoutes = computed(() => (props.menus ? props.menus : routeStore.rou

 // 菜单垂直模式/水平模式
 const mode = computed(() => {
-  return ['left', 'mix', 'columns'].includes(appStore.layout) ? 'vertical' : 'horizontal'
+  if (!['left', 'mix'].includes(appStore.layout)) {
+    return 'horizontal'
+  } else {
+    return 'vertical'
+  }
 })

 // 是否默认展开选中的菜单
--- a/src/layout/components/OneLevelMenu/MenuIcon.vue
+++ b/src/layout/components/OneLevelMenu/MenuIcon.vue
@@ -1,15 +0,0 @@
-<template>
-  <GiSvgIcon v-if="props.svgIcon" :name="props.svgIcon" :size="24"></GiSvgIcon>
-  <component :is="props.icon" v-else-if="props.icon"></component>
-</template>
-
-<script lang="ts" setup>
-interface Props {
-  svgIcon?: string
-  icon?: string
-}
-
-const props = defineProps<Props>()
-</script>
-
-<style lang="scss" scoped></style>
--- a/src/layout/components/OneLevelMenu/index.vue
+++ b/src/layout/components/OneLevelMenu/index.vue
@@ -1,107 +0,0 @@
-<template>
-  <div class="one-level-menu">
-    <Logo class="one-level-menu__logo" hide-name></Logo>
-    <div class="one-level-menu__wrap">
-      <a-scrollbar style="height:100%;overflow: auto;" :outer-style="{ width: '100%' }">
-        <ul class="one-level-menu__list">
-          <li
-            v-for="(item) in props.menus" :key="item.path" class="one-level-menu__item"
-            :class="{ 'one-level-menu__item--active': calcIsActive(item) }" @click="emits('menu-click', item)"
-          >
-            <MenuIcon :svg-icon="item?.meta?.icon || ''"></MenuIcon>
-            <p class="one-level-menu__item__title gi_line_1" :title="item?.meta?.title">{{ item?.meta?.title }}</p>
-          </li>
-        </ul>
-      </a-scrollbar>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { RouteRecordRaw } from 'vue-router'
-import Logo from '../Logo.vue'
-import MenuIcon from './MenuIcon.vue'
-
-interface Props {
-  menus?: RouteRecordRaw[]
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  menus: () => [],
-})
-
-const emits = defineEmits<{
-  (e: 'menu-click', item: RouteRecordRaw): void
-}>()
-
-const route = useRoute()
-const calcIsActive = (item: RouteRecordRaw) => {
-  return (route.path.startsWith(item.path) && item.path !== '/') || item.redirect === route.path
-}
-</script>
-
-<style lang="scss" scoped>
-:deep(.arco-scrollbar-track) {
-  display: none;
-}
-
-.one-level-menu {
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: column;
-  width: 68px;
-  height: 100%;
-  overflow: hidden;
-  background-color: var(--color-bg-1);
-  border-right: 1px solid var(--color-border-2);
-
-  &__logo {
-    justify-content: center;
-    border-bottom: 1px solid var(--color-border-2);
-
-    :deep(.logo) {
-      width: 40px;
-      height: 40px;
-    }
-  }
-
-  &__wrap {
-    display: flex;
-    flex: 1;
-    overflow: hidden;
-  }
-
-  &__list {
-    box-sizing: border-box;
-    padding: 4px 4px 0;
-  }
-
-  &__item {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    padding: 8px 0;
-    margin-bottom: 4px;
-    cursor: pointer;
-    border-radius: 4px;
-
-    &--active {
-      color: rgb(var(--primary-6));
-      background-color: var(--color-primary-light-2)
-    }
-
-    &:not(.one-level-menu__item--active):hover {
-      background-color: var(--color-fill-2);
-    }
-
-    &__title {
-      box-sizing: border-box;
-      padding: 0 8px;
-      margin-top: 8px;
-      font-size: 12px;
-      line-height: 1;
-    }
-  }
-}
-</style>
--- a/src/layout/hooks/useLevelMenu.ts
+++ b/src/layout/hooks/useLevelMenu.ts
@@ -1,96 +0,0 @@
-import type { RouteRecordRaw } from 'vue-router'
-import { eachTree, searchTree } from 'xe-utils'
-import { useRouteListener } from '@/hooks'
-import { useRouteStore } from '@/stores'
-import { filterTree } from '@/utils'
-import { isExternal } from '@/utils/validate'
-
-/** 获取一级菜单，二级菜单的hooks */
-export function useLevelMenu() {
-  const route = useRoute()
-  const router = useRouter()
-  const routeStore = useRouteStore()
-  const { listenerRouteChange } = useRouteListener()
-
-  // 克隆一份路由，避免直接操作原始路由
-  const cloneRoutes = JSON.parse(JSON.stringify(routeStore.routes)) as RouteRecordRaw[]
-  const showMenuList = filterTree(cloneRoutes, (i) => i.meta?.hidden === false) as RouteRecordRaw[]
-
-  // 一级菜单
-  const oneLevelMenus = ref<RouteRecordRaw[]>([])
-
-  // 二级菜单
-  const twoLevelMenus = computed(() => {
-    const path = route.matched[0].path
-    return showMenuList.find((i) => i.path === path)?.children || []
-  })
-
-  // 一级菜单选中的路由
-  const oneLevelMenuActiveRoute = ref<RouteRecordRaw | null>(null)
-
-  const getOneLevelMenuActiveRoute = (path: string) => {
-    const arr = searchTree(showMenuList, (i) => i.path === path)
-    return arr?.[0]
-  }
-
-  listenerRouteChange(({ to }) => {
-    oneLevelMenuActiveRoute.value = getOneLevelMenuActiveRoute(to.path)
-  })
-
-  // 获取一级菜单
-  function getOneLevelMenus() {
-    const cloneRoutes = JSON.parse(JSON.stringify(routeStore.routes)) as RouteRecordRaw[]
-    const showMenuList = filterTree(cloneRoutes, (i) => i.meta?.hidden === false) as RouteRecordRaw[]
-    eachTree(showMenuList, (i) => {
-      if (i?.children?.length === 1 && i?.meta?.alwaysShow !== true) {
-        if (i.meta) {
-          i.meta.title = i.meta?.title || i.children?.[0]?.meta?.title
-          i.meta.svgIcon = i.meta?.svgIcon || i.children?.[0]?.meta?.svgIcon
-          i.meta.icon = i.meta?.icon || i.children?.[0]?.meta?.icon
-        }
-        delete i.children
-      }
-    })
-    oneLevelMenus.value = showMenuList
-  }
-
-  // 菜单点击事件
-  function handleMenuItemClickByItem(item: RouteRecordRaw) {
-    let path = (item.redirect as string) || item.path
-    if ((!item.redirect && item?.children?.length) || (item.redirect === 'noRedirect' && item?.children?.length)) {
-      path = item.children?.[0]?.path
-    }
-    if (isExternal(path)) {
-      window.open(path)
-      return
-    }
-    if (item.redirect === 'noRedirect') {
-      router.replace({ path })
-      return
-    }
-    router.replace({ path })
-  }
-
-  // 菜单点击事件
-  function handleMenuItemClickByPath(path: string) {
-    if (isExternal(path)) {
-      window.open(path)
-      return
-    }
-    const obj = oneLevelMenus.value.find((i) => i.path === path)
-    if (obj?.redirect === 'noRedirect') {
-      router.push({ path: obj.children?.[0]?.path })
-      return
-    }
-    router.push({ path: (obj?.redirect as string) || path })
-  }
-
-  return {
-    oneLevelMenus,
-    twoLevelMenus,
-    oneLevelMenuActiveRoute,
-    getOneLevelMenus,
-    handleMenuItemClickByItem,
-    handleMenuItemClickByPath,
-  }
-}
--- a/src/layout/hooks/useMenus.ts
+++ b/src/layout/hooks/useMenus.ts
@@ -1,52 +0,0 @@
-import type { RouteRecordRaw } from 'vue-router'
-import { computed } from 'vue'
-import { eachTree } from 'xe-utils'
-import { useRouteStore } from '@/stores'
-import { filterTree } from '@/utils'
-
-/**
- * 菜单管理 Hooks
- * 用于获取和处理应用程序的菜单列表
- * 提供菜单的过滤、展平处理等功能
- * @returns {object} 包含处理后菜单列表的响应式对象
- */
-export function useMenu() {
-  // 路由存储实例，用于获取原始路由配置
-  const routeStore = useRouteStore()
-
-  /**
-   * 处理后的菜单列表
-   * 响应式计算属性，当路由配置变化时自动更新，
-   * > hidden:false那么代表这个路由项显示在左侧菜单栏中
-   * > 子项chidren只有一个hidden:false的子元素时, 且alwaysShow为false, 那么这个子项会被展平到父项中
-   * 包含以下处理逻辑：
-   * 1. 深拷贝原始路由配置避免直接修改
-   * 2. 过滤掉设置为隐藏的菜单项
-   * 3. 展平只有一个子项的菜单项（提升用户体验）
-   */
-  const menuList = computed(() => {
-    // 深拷贝路由配置，防止修改原始数据
-    const cloneRoutes = JSON.parse(JSON.stringify(routeStore.routes)) as RouteRecordRaw[]
-
-    // 过滤出非隐藏的菜单（meta.hidden !== false）
-    const showMenuList = filterTree(cloneRoutes, (i) => i.meta?.hidden === false) as RouteRecordRaw[]
-
-    // 遍历处理菜单树，展平只有一个子项的菜单项
-    eachTree(showMenuList, (i) => {
-      if (i?.children?.length === 1 && i?.meta?.alwaysShow !== true) {
-        if (i.meta) {
-          i.meta.title = i.meta?.title || i.children?.[0]?.meta?.title
-          i.meta.svgIcon = i.meta?.svgIcon || i.children?.[0]?.meta?.svgIcon
-          i.meta.icon = i.meta?.icon || i.children?.[0]?.meta?.icon
-        }
-        i.path = i.children?.[0]?.path
-        delete i.children
-      }
-    })
-    return showMenuList
-  })
-
-  return {
-    menuList,
-  }
-}
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -1,36 +1,15 @@
-<!--
-  @file Layout 组件
-  @description 布局根组件，支持默认布局、混合布局和顶部布局三种模式
-->
 <template>
-  <component :is="currentLayout" />
+  <LayoutMix v-if="appStore.layout === 'mix'"></LayoutMix>
+  <LayoutDefault v-else></LayoutDefault>
 </template>

 <script setup lang="ts">
+import LayoutDefault from './LayoutDefault.vue'
+import LayoutMix from './LayoutMix.vue'
 import { useAppStore } from '@/stores'

-/** 组件名称 */
 defineOptions({ name: 'Layout' })
-const LayoutDefault = defineAsyncComponent(() => import('./LayoutDefault.vue'))
-const LayoutColumns = defineAsyncComponent(() => import('./LayoutColumns.vue'))
-const LayoutMix = defineAsyncComponent(() => import('./LayoutMix.vue'))
-const LayoutTop = defineAsyncComponent(() => import('./LayoutTop.vue'))
-
-/** 状态管理 */
 const appStore = useAppStore()
-
-/** 布局组件映射 */
-const layoutMap = {
-  mix: LayoutMix,
-  top: LayoutTop,
-  default: LayoutDefault,
-  columns: LayoutColumns,
-} as const
-
-/** 当前布局组件 */
-const currentLayout = computed(() =>
-  layoutMap[appStore.layout as keyof typeof layoutMap] || layoutMap.default,
-)
 </script>

-<style lang="scss" scoped></style>
+<style scoped lang="scss"></style>
--- a/src/main.ts
+++ b/src/main.ts
@@ -27,6 +27,9 @@ import directives from './directives'
 // 状态管理
 import pinia from '@/stores'

+// 多语言切换
+import {translateJsVueUseModel} from './utils/translate' // 导入translate插件
+
 // 对特定组件进行默认配置
 Card.props.bordered = false

@@ -39,5 +42,6 @@ app.use(pinia)
 app.use(ArcoVue)
 app.use(ArcoVueIcon)
 app.use(directives)
+//app.use(translateJsVueUseModel)   //去掉注释，即可启用多语言切换能力。 具体多语言切换的设置，位于 /src/utils/translate.ts

 app.mount('#app')
--- a/src/types/app.d.ts
+++ b/src/types/app.d.ts
@@ -10,7 +10,7 @@ declare namespace App {
    menuAccordion: boolean
    menuDark: boolean
    copyrightDisplay: boolean
-    layout: 'left' | 'mix' | 'columns' | 'top'
+    layout: 'left' | 'mix'
    isOpenWatermark?: boolean
    watermark?: string
    enableColorWeaknessMode?: boolean
--- a/src/utils/md5-worker.ts
+++ b/src/utils/md5-worker.ts
@@ -111,7 +111,7 @@ function calculateFileMd5Optimized(file: File, taskId: string, blockSize: number
            const finalSpark = new SparkMD5.ArrayBuffer()
            blockHashes.forEach((hash) => {
              const hashBuffer = new TextEncoder().encode(hash)
-              finalSpark.append(hashBuffer.buffer.slice(hashBuffer.byteOffset, hashBuffer.byteOffset + hashBuffer.byteLength))
+              finalSpark.append(hashBuffer)
            })
            const finalMd5 = finalSpark.end()

--- a/src/utils/translate.ts
+++ b/src/utils/translate.ts
@@ -0,0 +1,54 @@
+import {translateJsVueUseModel, translate} from './translateVue3TS' // 导入 translate 的 VUE3 的 ts 插件
+
+/*
+    
+    translate.js AI 多语言切换模块的自定义配置。
+    如果不想启用，你可以通过以下方式中的任何一种进行禁用
+        1. 直接将所有配置全部注释掉
+        2. 将 /src/main.ts 中的这一行 app.use(translateJsVueUseModel) 注释掉即可。
+
+*/
+
+//打印包含具体执行时间的debug日志
+//translate.time.use = true;
+//window.translate.time.printTime = 100;
+
+// 针对翻译动作的性能监控 https://translate.zvo.cn/549733.html
+//translate.time.execute.start(); 
+
+// 设置当前切换所支持的语言 http://translate.zvo.cn/4056.html
+window.translate.selectLanguageTag.languages = 'chinese_simplified,english,korean,latin,french,russian'; 
+
+// 设置本地语种（当前网页的语种） ，如果你网页语种很多，比如国际化论坛，哪个国家发言的都有，那这里你可以不用设置，交给 translate.js 自动去识别当前网页语种 http://translate.zvo.cn/4066.html
+window.translate.language.setLocal('chinese_simplified');
+
+// 本地语种也进行强制翻译 http://translate.zvo.cn/289574.html
+//translate.language.translateLocal = true;
+
+// 翻译时忽略指定的文字不翻译 http://translate.zvo.cn/283381.html
+translate.ignore.text.push('ContiNew Admin'); 
+
+// 网页打开时自动隐藏文字，翻译完成后显示译文 http://translate.zvo.cn/549731.html
+// 注意，如果不启用本多语言切换能力，这个要注释掉，不然你网页的文本是会被隐藏的
+//window.translate.visual.webPageLoadTranslateBeforeHiddenText({inHeadTip: false});
+
+// 启用翻译中的遮罩层 http://translate.zvo.cn/407105.html
+window.translate.progress.api.startUITip();
+
+// 设置采用开源免费的 client.edge 无服务端翻译服务通道，无需任何注册接入即可直接使用 http://translate.zvo.cn/4081.html
+translate.service.use('client.edge');
+
+// 网页ajax请求触发自动翻译 http://translate.zvo.cn/4086.html
+translate.request.listener.start();
+
+// 开启页面元素动态监控，js改变的内容也会被翻译，参考文档： http://translate.zvo.cn/4067.html
+translate.listener.start();
+
+// 元素的内容整体翻译能力配置 ，提高翻译的语义 http://translate.zvo.cn/4078.html
+translate.whole.enableAll();
+
+//触发翻译执行，有关这个的说明可参考 http://translate.zvo.cn/547814.html
+translate.execute(); 
+
+//导出，其中translateJsVueUseModel为vue插件，translate为js函数
+export { translateJsVueUseModel, translate };
--- a/src/utils/translateVue3TS.ts
+++ b/src/utils/translateVue3TS.ts
@@ -0,0 +1,91 @@
+import { nextTick } from 'vue';
+import translate from 'i18n-jsautotranslate'
+
+/*
+
+  因为这个文件没什么需要用户单独设置的，只是整体对vue的适配，所以这个文件后续调好了会放到 npm 上，当前因为下面DOM渲染完毕触发的问题没有精准触发，所以暂时先放到这里进行方便优化调试
+
+
+*/
+
+var originalTrasnalteLog = translate.log;
+translate.log = function(obj){
+  if(typeof(obj) === 'string' && obj.indexOf('- translate.js -') !== -1){
+    //不显示 translate.js 的说明
+  }else{
+    originalTrasnalteLog(obj);
+  }
+}
+
+//vue3框架的一些单独设置
+translate.vue3 = {
+  /*
+      是否有 translate.execute() 代码的触发
+      有则是true，没有则是false
+      false则不会再dom渲染完后自动进行翻译,自然也不会显示 select 选择语言
+  */
+  isExecute: false, 
+}
+//如果网页上有 translate.execute() 代码的触发，那么就设置 isExecute 为 true
+translate.lifecycle.execute.trigger.push(function(data){
+  if(data.executeTriggerNumber === 1){
+      translate.vue3.isExecute = true;
+      translate.time.log('打开页面后，第一次触发 translate.execute() - 设置  translate.vue3.isExecute = true;');
+      return false;  
+  }
+});
+translate.time.log('设置vue3初始化配置 - translate.vue3');
+
+//将 translate 参数挂载到 window 上，方便在全局调用
+if(typeof(window.translate) === 'undefined'){
+  window.translate = translate;
+}
+translate.time.log('将 translate 参数挂载到 window 上，方便在全局调用');
+
+const translateJsVueUseModel = {
+  install(app) {
+    // 直接监听应用挂载完成
+    const originalMount = app.mount;
+    app.mount = function(...args) {
+      const root = originalMount.apply(this, args);
+      // 应用挂载完成后执行
+      // 使用双重nextTick确保DOM完全稳定后再执行翻译
+      // 第一个nextTick确保初始DOM渲染完成
+      nextTick(() => {
+        // 第二个nextTick确保可能的异步更新也完成
+        nextTick(() => {
+          
+          /*
+          
+              这里有问题，应该是vue的DOM渲染完毕后触发，但是实际打断点测试，DOM还没有渲染完就触发了，这里还需要跟踪优化
+          
+          
+          */
+
+
+          if(translate.vue3.isExecute){
+            translate.time.log('组件渲染完成，触发 translate.execute();');
+
+            //对vue3的某些第三方组件进行容错处理
+            translate.faultTolerance.documentCreateTextNode.use(); //对VUE的某些组件频繁渲染dom进行容错
+            translate.time.log('对vue3的某些第三方组件进行容错处理 - translate.faultTolerance.documentCreateTextNode.use();');
+
+            translate.execute();
+            setTimeout(() => {
+              translate.execute();
+            }, 100);
+            setTimeout(() => {
+              translate.execute();
+            }, 2000);
+          }else{
+            translate.time.log('组件渲染完成，但未发现translate.execute();存在，不进行翻译');
+          }
+        });
+      });
+      return root;
+    };
+  }
+};
+
+//export default translateJsVueUseModel;
+export { translateJsVueUseModel, translate };
--- a/src/views/dashboard/workplace/components/LatestActivity.vue
+++ b/src/views/dashboard/workplace/components/LatestActivity.vue
@@ -20,7 +20,7 @@
      <a-skeleton-line :rows="10" />
    </a-skeleton>
    <div v-else>
-      <a-empty v-if="dataList.length === 0" />
+      <a-empty v-if="dataList.length === 0">暂无动态</a-empty>
      <a-comment
        v-for="(item, index) in dataList"
        v-else
--- a/src/views/dashboard/workplace/components/Notice.vue
+++ b/src/views/dashboard/workplace/components/Notice.vue
@@ -12,7 +12,7 @@
      <a-skeleton-line :rows="5" />
    </a-skeleton>
    <div v-else>
-      <a-empty v-if="dataList.length === 0" />
+      <a-empty v-if="dataList.length === 0">暂无公告</a-empty>
      <div v-else>
        <div v-for="(item, idx) in dataList" :key="idx" class="item">
          <a-tag v-if="item.isTop" color="red">置顶</a-tag>
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -6,6 +6,9 @@
      <span>{{ title }}</span>
    </h3>

+    <!-- 多语言切换的 Select 下拉选择 -->
+    <LanguageSelect/>
+
    <a-row align="stretch" class="login-box">
      <a-col :xs="0" :sm="12" :md="13">
        <div class="login-left">
@@ -35,9 +38,6 @@
              <a class="item" title="使用 GitHub 账号登录" @click="onOauth('github')">
                <GiSvgIcon name="github" :size="24" />
              </a>
-              <a class="item" title="使用微信账号登录" @click="onOauth('wechat_open')">
-                <GiSvgIcon name="wechat" :size="24" />
-              </a>
            </div>
          </div>
        </div>
@@ -81,15 +81,12 @@
      <div class="list">
        <div v-if="isEmailLogin" class="mode item" @click="toggleLoginMode"><icon-user /> 账号/手机号登录</div>
        <div v-else class="mode item" @click="toggleLoginMode"><icon-email /> 邮箱登录</div>
-        <a class="item" title="使用 Gitee 账号登录" @click="onOauth('gitee')">
+        <a v-if="!tenantStore.isTenantConfigured" class="item" title="使用 Gitee 账号登录" @click="onOauth('gitee')">
          <GiSvgIcon name="gitee" :size="24" />
        </a>
-        <a class="item" title="使用 GitHub 账号登录" @click="onOauth('github')">
+        <a v-if="tenantStore.isTenantConfigured" class="item" title="使用 GitHub 账号登录" @click="onOauth('github')">
          <GiSvgIcon name="github" :size="24" />
        </a>
-        <a class="item" title="使用微信账号登录" @click="onOauth('wechat_open')">
-          <GiSvgIcon name="wechat" :size="24" />
-        </a>
      </div>
    </div>
  </div>
@@ -106,6 +103,7 @@ import { useAppStore } from '@/stores'
 import { useTenantStore } from '@/stores/modules/tenant'
 import { useDevice } from '@/hooks'
 import { getTenantIdByDomain, getTenantStatus } from '@/apis'
+import LanguageSelect from 'i18n-jsautotranslate/ArcoDesign/Vue3/LanguageSelect.vue';

 defineOptions({ name: 'Login' })

@@ -548,5 +546,13 @@ onMounted(() => {
      }
    }
  }
+
+  //多语言切换
+  .LanguageSelect {
+    position: fixed;
+    top: 20px;
+    right: 80px;
+    z-index: 999;
+  }
 }
 </style>
--- a/src/views/system/config/sms/AddModal.vue
+++ b/src/views/system/config/sms/AddModal.vue
@@ -37,15 +37,6 @@ const [form, resetForm] = useResetReactive({
  status: 1,
 })

-// 监听供应商变化，当选择腾讯云时自动填充厂商配置
-watch(() => form.supplier, async (newValue) => {
-  if (newValue === 'tencent') {
-    form.supplierConfig = '{"sdkAppId":""}'
-  } else {
-    form.supplierConfig = ''
-  }
-})
-
 const columns: ColumnItem[] = reactive([
  {
    label: '名称',
@@ -170,8 +161,6 @@ const columns: ColumnItem[] = reactive([
 const reset = () => {
  formRef.value?.formRef?.resetFields()
  resetForm()
-  // 重置时清空供应商配置
-  form.supplierConfig = ''
 }

 // 保存
--- a/src/views/system/config/storage/AddModal.vue
+++ b/src/views/system/config/storage/AddModal.vue
@@ -44,8 +44,6 @@ const { storage_type_enum } = useDict('storage_type_enum')

 const [form, resetForm] = useResetReactive({
  type: 2,
-  recycleBinEnabled: true,
-  recycleBinPath: '.RECYCLE.BIN/',
  isDefault: false,
  sort: 999,
  status: 2,
@@ -129,29 +127,6 @@ const columns: ColumnItem[] = reactive([
    required: true,
    show: () => form.type === 1,
  },
-  {
-    label: '启用回收站',
-    field: 'recycleBinEnabled',
-    type: 'switch',
-    span: 24,
-    props: {
-      type: 'round',
-      checkedValue: true,
-      uncheckedValue: false,
-      checkedText: '启用',
-      uncheckedText: '禁用',
-    },
-    disabled: () => isUpdate.value,
-  },
-  {
-    label: '回收站路径',
-    field: 'recycleBinPath',
-    type: 'input',
-    span: 24,
-    required: true,
-    show: () => form.recycleBinEnabled,
-    disabled: () => isUpdate.value,
-  },
  {
    label: '排序',
    field: 'sort',
--- a/src/views/system/config/storage/StorageLocal.vue
+++ b/src/views/system/config/storage/StorageLocal.vue
@@ -37,30 +37,8 @@
              <a-skeleton-line :widths="['60%']" :rows="2" />
            </a-skeleton>
            <a-descriptions v-else :column="1">
-              <a-descriptions-item label="存储路径">
-                <a-typography-paragraph
-                  :ellipsis="{
-                    rows: 1,
-                    showTooltip: true,
-                    css: true,
-                  }"
-                >
-                  {{ item.bucketName }}
-                </a-typography-paragraph>
-              </a-descriptions-item>
-              <a-descriptions-item label="访问路径">
-                <a-typography-paragraph
-                  :ellipsis="{
-                    rows: 1,
-                    showTooltip: true,
-                    css: true,
-                  }"
-                >
-                  {{ item.domain }}
-                </a-typography-paragraph>
-              </a-descriptions-item>
-              <a-descriptions-item label="启用回收站">{{ item.recycleBinEnabled ? '启用' : '禁用' }}</a-descriptions-item>
-              <a-descriptions-item label="回收站路径">{{ item.recycleBinPath }}</a-descriptions-item>
+              <a-descriptions-item label="存储路径">{{ item.bucketName }}</a-descriptions-item>
+              <a-descriptions-item label="访问路径">{{ item.domain }}</a-descriptions-item>
            </a-descriptions>
          </template>
        </CardBlock>
--- a/src/views/system/config/storage/StorageOss.vue
+++ b/src/views/system/config/storage/StorageOss.vue
@@ -38,31 +38,9 @@
            </a-skeleton>
            <a-descriptions v-else :column="1">
              <a-descriptions-item label="Access Key"><CellCopy :content="item.accessKey" /></a-descriptions-item>
-              <a-descriptions-item label="Endpoint">
-                <a-typography-paragraph
-                  :ellipsis="{
-                    rows: 1,
-                    showTooltip: true,
-                    css: true,
-                  }"
-                >
-                  {{ item.endpoint }}
-                </a-typography-paragraph>
-              </a-descriptions-item>
+              <a-descriptions-item label="Endpoint">{{ item.endpoint }}</a-descriptions-item>
              <a-descriptions-item label="Bucket">{{ item.bucketName }}</a-descriptions-item>
-              <a-descriptions-item label="自定义域名">
-                <a-typography-paragraph
-                  :ellipsis="{
-                    rows: 1,
-                    showTooltip: true,
-                    css: true,
-                  }"
-                >
-                  {{ item.domain }}
-                </a-typography-paragraph>
-              </a-descriptions-item>
-              <a-descriptions-item label="启用回收站">{{ item.recycleBinEnabled ? '启用' : '禁用' }}</a-descriptions-item>
-              <a-descriptions-item label="回收站路径">{{ item.recycleBinPath }}</a-descriptions-item>
+              <a-descriptions-item label="自定义域名">{{ item.domain }}</a-descriptions-item>
            </a-descriptions>
          </template>
        </CardBlock>
--- a/src/views/system/config/storage/components/CardAdd.vue
+++ b/src/views/system/config/storage/components/CardAdd.vue
@@ -59,7 +59,7 @@ const onAdd = () => {
  }

  .content {
-    height: 80px;
+    height: 48px;
  }
 }

@@ -78,15 +78,15 @@ const onAdd = () => {
  }

  :deep(.arco-card-body) {
-    padding-top: 55px;
-    padding-bottom: 53px;
+    padding-top: 45px;
+    padding-bottom: 63px;
  }
 }

 .card-large {
  :deep(.arco-card-body) {
-    padding-top: 75px;
-    padding-bottom: 63px;
+    padding-top: 65px;
+    padding-bottom: 73px;
  }
 }
 </style>
--- a/src/views/system/config/storage/components/CardBlock.vue
+++ b/src/views/system/config/storage/components/CardBlock.vue
@@ -250,11 +250,11 @@ const onUpdate = (record: StorageResp) => {
  }

  .content {
-    height: 80px;
+    height: 48px;
  }

  .content-large {
-    height: 110px;
+    height: 78px;
  }

  .extra {
--- a/src/views/system/file/main/FileMain/RecycleBinModal.vue
+++ b/src/views/system/file/main/FileMain/RecycleBinModal.vue
@@ -1,195 +0,0 @@
-<template>
-  <a-modal
-    v-model:visible="visible"
-    title="文件回收站"
-    :width="width >= 1100 ? 1100 : '100%'"
-    draggable
-    :footer="false"
-    @close="onClose"
-  >
-    <GiTable
-      row-key="id"
-      :data="dataList"
-      :columns="columns"
-      :loading="loading"
-      :scroll="{ x: '100%', y: '100%', minWidth: 600 }"
-      :pagination="pagination"
-      :disabled-tools="['size', 'setting', 'fullscreen']"
-      :disabled-column-keys="['label']"
-      @refresh="search"
-    >
-      <template #toolbar-left>
-        <a-input-search v-model="queryForm.originalName" placeholder="搜索名称" allow-clear style="width: 200px" @search="search" />
-        <a-button @click="reset">
-          <template #icon><icon-refresh /></template>
-          <template #default>重置</template>
-        </a-button>
-      </template>
-      <template #toolbar-right>
-        <a-button v-permission="['system:fileRecycle:clean']" type="outline" status="danger" @click="onClean">
-          <template #icon><icon-delete /></template>
-          <template #default>清空回收站</template>
-        </a-button>
-      </template>
-      <template #type="{ record }">{{ getFileType(record.type) }}</template>
-      <template #size="{ record }">
-        <span v-if="record.type === 0" v-permission="['system:file:calcDirSize']">
-          <a-link v-if="record.size === null" @click="calculateDirSize(record)">计算</a-link>
-          <span v-else>
-            {{ formatFileSize(record.size) }}
-          </span>
-        </span>
-        <span v-else>{{ formatFileSize(record.size) }}</span>
-      </template>
-      <template #action="{ record }">
-        <a-space>
-          <a-link v-permission="['system:fileRecycle:restore']" title="还原" @click="onRestore(record)">还原</a-link>
-          <a-link
-            v-permission="['system:fileRecycle:delete']"
-            status="danger"
-            title="删除"
-            @click="onDelete(record)"
-          >
-            删除
-          </a-link>
-        </a-space>
-      </template>
-    </GiTable>
-  </a-modal>
-</template>
-
-<script setup lang="ts">
-import { Message, Modal, type TableInstance } from '@arco-design/web-vue'
-import { useWindowSize } from '@vueuse/core/index'
-import {
-  type FileItem,
-  type FileQuery,
-  calcDirSize,
-  cleanRecycleBin,
-  deleteRecycleFile,
-  listRecycleFiles,
-  restoreRecycleFile,
-} from '@/apis/system/file'
-import { useTable } from '@/hooks'
-import { formatFileSize, isMobile } from '@/utils'
-import has from '@/utils/has'
-import { FileTypeList } from '@/constant/file'
-
-const emit = defineEmits<{
-  (e: 'close'): void
-}>()
-
-const visible = ref(false)
-const { width } = useWindowSize()
-
-const queryForm = reactive<FileQuery>({
-  sort: ['updateTime,desc'],
-})
-const {
-  tableData: dataList,
-  loading,
-  pagination,
-  search,
-  handleDelete,
-} = useTable((page) => listRecycleFiles({ ...queryForm, ...page }), { immediate: false })
-const columns: TableInstance['columns'] = [
-  {
-    title: '序号',
-    width: 66,
-    align: 'center',
-    render: ({ rowIndex }) => h('span', {}, rowIndex + 1 + (pagination.current - 1) * pagination.pageSize),
-  },
-  { title: '名称', dataIndex: 'originalName', slotName: 'originalName', minWidth: 100, ellipsis: true, tooltip: true },
-  { title: '类型', dataIndex: 'type', slotName: 'type', width: 100 },
-  { title: '大小', dataIndex: 'size', slotName: 'size' },
-  { title: '删除时间', dataIndex: 'updateTime', width: 180 },
-  {
-    title: '操作',
-    dataIndex: 'action',
-    slotName: 'action',
-    width: 130,
-    align: 'center',
-    fixed: !isMobile() ? 'right' : undefined,
-    show: has.hasPermOr(['system:fileRecycle:restore', 'system:fileRecycle:delete']),
-  },
-]
-
-// 重置
-const reset = () => {
-  queryForm.originalName = undefined
-  queryForm.type = undefined
-  search()
-}
-
-// 获取文件类型
-const getFileType = (type: number) => {
-  if (type === 0) return '文件夹'
-  return FileTypeList.find((item) => item.value === type)?.name
-}
-
-// 计算文件夹大小
-const calculateDirSize = async (record: FileItem) => {
-  if (record.type !== 0) return
-  try {
-    const { data } = await calcDirSize(record.id)
-    record.size = data.size
-  } catch (err) {
-    Message.error('计算失败，请重试')
-  }
-}
-
-// 还原
-const onRestore = (record: FileItem) => {
-  Modal.warning({
-    title: '提示',
-    content: `是否确定还原${record.type === 0 ? '文件夹' : '文件'}「${record.originalName}」？`,
-    hideCancel: false,
-    maskClosable: false,
-    onOk: async () => {
-      await restoreRecycleFile(record.id)
-      Message.success('还原成功')
-      search()
-    },
-  })
-}
-
-// 删除
-const onDelete = (record: FileItem) => {
-  return handleDelete(() => deleteRecycleFile(record.id), {
-    content: `是否确定删除${record.type === 0 ? '文件夹' : '文件'}「${record.originalName}」？`,
-    showModal: true,
-  })
-}
-
-// 清空回收站
-const onClean = () => {
-  Modal.warning({
-    title: '提示',
-    content: '是否确定清空回收站？',
-    hideCancel: false,
-    maskClosable: false,
-    onOk: async () => {
-      await cleanRecycleBin()
-      Message.success('清空成功')
-      search()
-    },
-  })
-}
-
-// 关闭
-const onClose = () => {
-  visible.value = false
-  dataList.value = []
-  emit('close')
-}
-
-// 打开
-const onOpen = () => {
-  reset()
-  visible.value = true
-}
-
-defineExpose({ onOpen })
-</script>
-
-<style scoped lang="scss"></style>
--- a/src/views/system/file/main/FileMain/index.vue
+++ b/src/views/system/file/main/FileMain/index.vue
@@ -31,14 +31,6 @@
            <a-button type="text" style="width: 100%; text-align: left;" @click="visible = true">
              分片上传
            </a-button>
-            <!-- 新建文件夹 -->
-            <a-divider style="margin: 0;"></a-divider>
-            <a-button v-permission="['system:file:createDir']" type="text" style="width: 100%; text-align: left;" :disabled="!queryForm.parentPath" @click="createDirModalVisible = !createDirModalVisible">
-              <template #icon>
-                <icon-folder />
-              </template>
-              新建文件夹
-            </a-button>
          </template>
        </a-dropdown>
        <a-modal v-model:visible="visible" title="分片上传" :width="width > 1350 ? 1350 : '100%'" :footer="false" @close="search">
@@ -71,19 +63,18 @@
            <icon-delete />
          </template>
        </a-button>
-
+        <a-button v-permission="['system:file:createDir']" type="primary" :disabled="!queryForm.parentPath" @click="createDirModalVisible = !createDirModalVisible">
+          <template #icon>
+            <icon-folder />
+          </template>
+          <template #default>新建文件夹</template>
+        </a-button>
        <a-button v-permission="['system:file:delete']" type="primary" @click="isBatchMode = !isBatchMode">
          <template #icon>
            <icon-select-all />
          </template>
          <template #default>{{ isBatchMode ? '取消批量' : '批量操作' }}</template>
        </a-button>
-        <a-button v-permission="['system:fileRecycle:list']" type="primary" @click="onRecycleBin">
-          <template #icon>
-            <icon-delete />
-          </template>
-          <template #default>回收站</template>
-        </a-button>
        <a-button-group>
          <a-tooltip content="视图">
            <a-button @click="toggleMode">
@@ -123,9 +114,6 @@
    <a-modal v-model:visible="createDirModalVisible" title="新建文件夹" @ok="handleCreateDir" @cancel="handleCancel">
      <a-input v-model="newDirName" placeholder="请输入文件夹名称" size="large" allow-clear />
    </a-modal>
-
-    <!-- 回收站 -->
-    <RecycleBinModal ref="RecycleBinModalRef" @close="search" />
  </div>
 </template>

@@ -140,7 +128,6 @@ import {
  previewFileVideoModal,
 } from '../../components/index'
 import FileGrid from './FileGrid.vue'
-import RecycleBinModal from './RecycleBinModal.vue'
 import useFileManage from './useFileManage'
 import { useTable } from '@/hooks'
 import { type FileItem, type FileQuery, createDir, deleteFile, listFile, uploadFile } from '@/apis/system/file'
@@ -175,9 +162,6 @@ const {
  search,
 } = useTable((page) => listFile({ ...queryForm, ...page }), { immediate: false, paginationOption })
 const filePreviewRef = ref()
-
-const pathNameMap = ref<Map<string, string>>(new Map())
-
 // 点击文件
 const handleClickFile = (item: FileItem) => {
  if (ImageTypes.includes(item.extension)) {
@@ -224,9 +208,7 @@ const handleClickFile = (item: FileItem) => {
 // 双击文件
 const handleDblclickFile = (item: FileItem) => {
  if (item.type === 0) {
-    const path = `${item.parentPath === '/' ? '' : item.parentPath}/${item.name}`
-    pathNameMap.value.set(path, item.originalName)
-    queryForm.parentPath = path
+    queryForm.parentPath = `${item.parentPath === '/' ? '' : item.parentPath}/${item.name}`
    search()
  }
 }
@@ -349,32 +331,10 @@ const handleCreateDir = async () => {
 // 解析路径生成面包屑列表
 const breadcrumbList = computed(() => {
  const path = queryForm.parentPath || '/'
-  if (path === '/') {
-    return []
-  }
-  const parts = path.split('/').filter((p) => p !== '')
-
+  const parts = path.split('/').filter((p) => p !== '') // 分割路径并过滤空字符串
  return parts.map((part, index) => {
-    const fullPath = `/${parts.slice(0, index + 1).join('/')}`
-    let displayName = pathNameMap.value.get(fullPath)
-
-    if (!displayName) {
-      const foundItem = fileList.value.find((item) => {
-        const itemPath = `${item.parentPath === '/' ? '' : item.parentPath}/${item.name}`
-        return itemPath === fullPath && item.type === 0
-      })
-
-      if (foundItem) {
-        displayName = foundItem.originalName
-        pathNameMap.value.set(fullPath, displayName)
-      }
-    }
-
-    if (!displayName) {
-      displayName = part
-    }
-
-    return { name: displayName, path: fullPath }
+    const fullPath = parts.slice(0, index + 1).join('/')
+    return { name: part || '根目录', path: `/${fullPath}` }
  })
 })

@@ -384,12 +344,6 @@ const handleBreadcrumbClick = (item) => {
  search()
 }

-// 回收站
-const RecycleBinModalRef = ref<InstanceType<typeof RecycleBinModal>>()
-const onRecycleBin = () => {
-  RecycleBinModalRef.value?.onOpen()
-}
-
 onMounted(() => {
  search()
 })
--- a/src/views/user/message/components/NoticePopup.vue
+++ b/src/views/user/message/components/NoticePopup.vue
@@ -126,7 +126,7 @@ const fetchNoticeDetail = async (index: number) => {
    console.error(`获取公告详情失败:`, error)
    // 创建一个错误状态的公告对象
    noticeCache.value.set(noticeId, {
-      id: noticeId || '',
+      id: noticeId,
      title: '获取公告失败',
      content: '获取公告内容失败，请稍后重试',
      createUserString: '',
--- a/src/views/user/profile/Social.vue
+++ b/src/views/user/profile/Social.vue
@@ -2,7 +2,7 @@
  <a-card title="第三方账号" bordered class="gradient-card">
    <div v-for="item in modeList" :key="item.title">
      <div class="item">
-        <GiSvgIcon :name="item.icon" :size="38" />
+        <div class="icon-wrapper"><GiSvgIcon :name="item.icon" :size="26" /></div>
        <div class="info">
          <div class="info-top">
            <span class="label">{{ item.title }}</span>
@@ -73,14 +73,6 @@ const initData = () => {
        jumpMode: 'link',
        status: socialList.value.includes('GITHUB'),
      },
-      {
-        title: '绑定微信',
-        icon: 'wechat',
-        subtitle: `${socialList.value.includes('WECHAT_OPEN') ? '' : '绑定后，'}可通过微信进行登录`,
-        type: 'wechat_open',
-        jumpMode: 'link',
-        status: socialList.value.includes('WECHAT_OPEN'),
-      },
    ]
  })
 }
--- a/src/views/user/type.ts
+++ b/src/views/user/type.ts
@@ -3,7 +3,7 @@ export interface ModeItem {
  icon: string
  subtitle: string
  value?: string
-  type: 'phone' | 'email' | 'wechat_open' | 'gitee' | 'github'
+  type: 'phone' | 'email' | 'gitee' | 'github'
  jumpMode?: 'link' | 'modal'
  status: boolean
  statusString: string
				`@@ -1 +0,0 @@`
				<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1760706428122" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4539" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M347.729118 353.0242c-16.487119 0-29.776737 13.389539-29.776737 29.776737S331.241998 412.677596 347.729118 412.677596s29.776737-13.389539 29.776737-29.776737-13.289617-29.876659-29.776737-29.876659zM577.749415 511.800156c-13.689305 0-24.880562 11.091335-24.880563 24.880562 0 13.689305 11.091335 24.880562 24.880563 24.880562 13.689305 0 24.880562-11.191257 24.880562-24.880562s-11.191257-24.880562-24.880562-24.880562zM500.909446 412.677596c16.487119 0 29.776737-13.389539 29.776737-29.776737s-13.389539-29.776737-29.776737-29.776737c-16.487119 0-29.776737 13.389539-29.776737 29.776737s13.289617 29.776737 29.776737 29.776737zM698.455113 511.600312c-13.689305 0-24.880562 11.091335-24.880562 24.880562 0 13.689305 11.091335 24.880562 24.880562 24.880562 13.689305 0 24.880562-11.091335 24.880562-24.880562-0.099922-13.689305-11.191257-24.880562-24.880562-24.880562z" fill="#00C800" p-id="4540"></path><path d="M511.601093 0.799375C229.12178 0.799375 0.000781 229.820453 0.000781 512.399688s229.021077 511.600312 511.600312 511.600312 511.600312-229.021077 511.600312-511.600312S794.180328 0.799375 511.601093 0.799375z m-90.229508 634.504294c-27.37861 0-49.361436-5.595628-76.839969-10.991413l-76.640125 38.469945 21.882904-65.948477c-54.957065-38.370023-87.73146-87.831382-87.73146-148.084309 0-104.318501 98.722873-186.554254 219.32865-186.554255 107.815769 0 202.34192 65.648712 221.327088 153.979703-6.994536-0.799375-13.989071-1.298985-21.083529-1.298985-104.118657 0-186.454333 77.739266-186.454332 173.564403 0 15.98751 2.498048 31.275566 6.794692 45.964091-6.794692 0.599532-13.689305 0.899297-20.583919 0.899297z m323.547228 76.839969l16.48712 54.757221-60.153006-32.874317c-21.882904 5.495706-43.965652 10.991413-65.848555 10.991413-104.318501 0-186.554254-71.344262-186.554255-159.175644 0-87.631538 82.135831-159.175644 186.554255-159.175644 98.523029 0 186.254489 71.444184 186.254488 159.175644 0.099922 49.461358-32.774395 93.227166-76.740047 126.301327z" fill="#00C800" p-id="4541"></path></svg>