From cb1a1e349fe599c23ee3dcc94a62f2ef33ff027d Mon Sep 17 00:00:00 2001
From: "Ray.Hao" <1490493387@qq.com>
Date: Fri, 16 Oct 2026 16:50:08 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E7=BB=84=E4=BB=B6=E5=B0=B1?=
 =?UTF-8?q?=E8=BF=91=E8=BF=81=E7=A7=BB=E3=80=81=E6=93=8D=E4=BD=9C=E8=8F=9C?=
 =?UTF-8?q?=E5=8D=95=E7=BB=84=E4=BB=B6=E5=8C=96=E5=B9=B6=E7=BB=9F=E4=B8=80?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=91=BD=E5=90=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 组件文件统一 PascalCase 并就近迁入所属目录
- 操作菜单抽为 ActionSheet 组件，危险操作确认拆为 useConfirmAction
- 导航栏测量拆为 useNavbarMetrics 并收缩对外接口
- 页面方法按动词约定重命名，show 前缀与 handle 误用一并修正
- 通知与菜单接口类型改用字面量联合并修正取值注释
- 多行空壳注释收回单行
---
 eslint.config.mjs                             |   9 +-
 package.json                                  |   3 +-
 src/api/file.ts                               |   8 +-
 src/api/menu.ts                               |  17 +-
 src/api/notice.ts                             |  11 +-
 .../index.vue => AppNavbar.vue}               | 118 ++++-----
 .../index.vue => AppProvider.vue}             |  11 +-
 src/composables/useActionSheet.ts             |  67 -----
 src/composables/useCacheCleaner.ts            |  22 +-
 src/composables/useConfirmAction.ts           |  42 +++
 src/composables/useCountdown.ts               |  32 ++-
 src/composables/useLogout.ts                  |  36 ++-
 src/composables/useNavbar.ts                  | 244 ------------------
 src/composables/useNavbarMetrics.ts           | 195 ++++++++++++++
 src/composables/useNavigation.ts              |  22 +-
 src/composables/useScanLogin.ts               |  52 +++-
 src/composables/useSmsLoginCode.ts            |  34 ++-
 src/composables/useTheme.ts                   |   8 +-
 src/config/index.ts                           |   4 +-
 src/config/work-menu.ts                       |   4 +-
 src/constants/index.ts                        |   4 +-
 src/constants/permissions.ts                  |   4 +-
 src/layouts/tabbar.vue                        |  20 +-
 src/pages/index/index.vue                     | 101 ++++----
 ...d-mobile-popup.vue => BindMobilePopup.vue} |  22 +-
 src/pages/login/index.vue                     |  25 +-
 .../{menu-section.vue => MenuSection.vue}     |  42 +--
 ...unity-card.vue => OfficialAccountCard.vue} |  49 ++--
 .../{profile-card.vue => ProfileCard.vue}     |  49 ++--
 .../{quick-cards.vue => QuickActions.vue}     |  12 +-
 src/pages/mine/index.vue                      | 243 +++++++++--------
 src/pages/work/index.vue                      |  26 +-
 src/store/modules/theme.ts                    |  12 +-
 src/store/modules/user.ts                     |  28 +-
 src/styles/index.scss                         |  28 +-
 src/styles/theme.scss                         |  20 +-
 src/subPages/mine/about/index.vue             |  38 +--
 src/subPages/mine/account/index.vue           |  97 +++----
 .../mine/profile/complete-profile/index.vue   |  36 +--
 src/subPages/mine/profile/index.vue           |  45 ++--
 src/subPages/mine/scan-confirm/index.vue      | 136 ++++++----
 src/subPages/mine/settings/network/index.vue  | 116 ++++++---
 src/subPages/mine/settings/theme/index.vue    |  27 +-
 src/subPages/work/components/ActionSheet.vue  |  61 +++++
 .../{custom-tree.vue => TreeView.vue}         | 103 +++++---
 src/subPages/work/config/index.vue            |  37 ++-
 src/subPages/work/dept/index.vue              |  73 +++---
 src/subPages/work/dict/index.vue              |  44 ++--
 src/subPages/work/dict/item/index.vue         |  51 ++--
 src/subPages/work/log/index.vue               |   4 +-
 src/subPages/work/menu/index.vue              | 177 +++++++------
 src/subPages/work/notice/index.vue            |  59 +++--
 src/subPages/work/role/assign-perm/index.vue  | 117 +++++----
 src/subPages/work/role/index.vue              |  45 ++--
 src/subPages/work/user/index.vue              |  78 +++---
 src/types/wot-ui-component-shims.d.ts         |  20 --
 src/utils/auth.ts                             |  47 ++--
 src/utils/permission.ts                       |   4 +-
 src/utils/request.ts                          |   8 +-
 src/utils/storage.ts                          |  10 +-
 tsconfig.json                                 |   5 +-
 tsconfig.templates.json                       |  11 +
 unocss.config.ts                              |   3 +-
 63 files changed, 1653 insertions(+), 1423 deletions(-)
 rename src/components/{custom-navbar/index.vue => AppNavbar.vue} (54%)
 rename src/components/{app-provider/index.vue => AppProvider.vue} (70%)
 delete mode 100644 src/composables/useActionSheet.ts
 create mode 100644 src/composables/useConfirmAction.ts
 delete mode 100644 src/composables/useNavbar.ts
 create mode 100644 src/composables/useNavbarMetrics.ts
 rename src/pages/login/components/{bind-mobile-popup.vue => BindMobilePopup.vue} (85%)
 rename src/pages/mine/components/{menu-section.vue => MenuSection.vue} (74%)
 rename src/pages/mine/components/{community-card.vue => OfficialAccountCard.vue} (65%)
 rename src/pages/mine/components/{profile-card.vue => ProfileCard.vue} (70%)
 rename src/pages/mine/components/{quick-cards.vue => QuickActions.vue} (88%)
 create mode 100644 src/subPages/work/components/ActionSheet.vue
 rename src/subPages/work/components/{custom-tree.vue => TreeView.vue} (79%)
 delete mode 100644 src/types/wot-ui-component-shims.d.ts
 create mode 100644 tsconfig.templates.json

diff --git a/eslint.config.mjs b/eslint.config.mjs
index 97e8193..f9d3b69 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -51,10 +51,11 @@ export default [
           definePage: "readonly", // uni-pages 页面宏
           getCurrentPages: "readonly", // uni-app 全局 API
           wx: "readonly", // 微信小程序 API
-          useToast: "readonly", // wot-design-uni
-          useDialog: "readonly", // wot-design-uni
-          useMessage: "readonly", // wot-design-uni
-          useNotify: "readonly", // wot-design-uni
+          UniHelper: "readonly", // uni-app 类型命名空间
+          useToast: "readonly", // @wot-ui/ui
+          useDialog: "readonly", // @wot-ui/ui
+          useMessage: "readonly", // @wot-ui/ui
+          useNotify: "readonly", // @wot-ui/ui
         },
       },
     },
diff --git a/package.json b/package.json
index b04f871..43a25f5 100644
--- a/package.json
+++ b/package.json
@@ -42,7 +42,8 @@
     "build:quickapp-webview-huawei": "uni build -p quickapp-webview-huawei",
     "build:quickapp-webview-union": "uni build -p quickapp-webview-union",
     "type-check": "vue-tsc --noEmit",
-    "check": "pnpm type-check && pnpm lint:eslint:check && pnpm lint:stylelint:check",
+    "type-check:templates": "node scripts/check-templates.mjs",
+    "check": "pnpm type-check && pnpm type-check:templates && pnpm lint:eslint:check && pnpm lint:stylelint:check",
     "lint:eslint:check": "eslint \"src/**/*.{vue,ts}\"",
     "lint:eslint": "eslint \"src/**/*.{vue,ts}\" --fix",
     "lint:prettier": "prettier --write \"**/*.{js,cjs,ts,json,css,scss,vue,html,md}\"",
diff --git a/src/api/file.ts b/src/api/file.ts
index 65daf30..bd63153 100644
--- a/src/api/file.ts
+++ b/src/api/file.ts
@@ -9,9 +9,7 @@ baseApi = import.meta.env.VITE_APP_BASE_API;
 // #endif
 
 const FileAPI = {
-  /**
-   * 文件上传地址
-   */
+  /** 文件上传地址 */
   uploadUrl: baseApi + "/api/v1/files",
 
   /**
@@ -55,9 +53,7 @@ const FileAPI = {
 
 export default FileAPI;
 
-/**
- * 文件API类型声明
- */
+/** 文件API类型声明 */
 export interface FileInfo {
   /** 文件名 */
   name: string;
diff --git a/src/api/menu.ts b/src/api/menu.ts
index 77f696e..b7e8e85 100644
--- a/src/api/menu.ts
+++ b/src/api/menu.ts
@@ -77,7 +77,14 @@ export interface MenuQuery {
   keywords?: string;
 }
 
-/** 菜单类型 */
+/**
+ * 菜单类型
+ *
+ * 与后端 MenuTypeEnum 一致：C 目录、M 菜单、E 外链、B 按钮。
+ */
+export type MenuType = "C" | "M" | "E" | "B";
+
+/** 菜单实体 */
 export interface MenuItem {
   children?: MenuItem[];
   component?: string;
@@ -93,8 +100,8 @@ export interface MenuItem {
   sort?: number;
   /** 状态(1:显示；0:隐藏) */
   visible?: number;
-  /** 菜单类型(C:目录；M:菜单；B:按钮) */
-  type?: string | number;
+  /** 菜单类型 */
+  type?: MenuType;
 }
 
 /** 菜单表单类型 */
@@ -103,8 +110,8 @@ export interface MenuForm {
   id?: string;
   name?: string;
   parentId: string;
-  /** 菜单类型(C:目录；M:菜单；B:按钮) */
-  type: string | number;
+  /** 菜单类型 */
+  type: MenuType;
   routeName?: string;
   routePath?: string;
   component?: string;
diff --git a/src/api/notice.ts b/src/api/notice.ts
index 5d4faea..fecd890 100644
--- a/src/api/notice.ts
+++ b/src/api/notice.ts
@@ -114,20 +114,17 @@ export interface NoticeForm {
 export interface NoticeItem {
   id: string;
   title?: string;
-  content?: string;
   /** 通知类型 */
   type?: number;
   publisherName?: string;
-  /** 优先级(0-低 1-中 2-高) */
-  priority?: number;
-  /** 目标类型(0-全体 1-指定) */
+  /** 目标类型(1-全体 2-指定) */
   targetType?: number;
-  /** 发布状态(0-未发布 1已发布 2已撤回) */
+  /** 发布状态(0-未发布 1-已发布 -1-已撤回) */
   publishStatus?: number;
   publishTime?: Date;
   revokeTime?: Date;
   /** 优先级(L-低 M-中 H-高) */
-  level?: string | number;
+  level?: string;
 }
 
 export interface NoticeDetail {
@@ -140,6 +137,6 @@ export interface NoticeDetail {
   /** 优先级(L-低 M-中 H-高) */
   level?: string;
   publishTime?: Date;
-  /** 发布状态(0-未发布 1-已发布 2-已撤回) */
+  /** 发布状态(0-未发布 1-已发布 -1-已撤回) */
   publishStatus?: number;
 }
diff --git a/src/components/custom-navbar/index.vue b/src/components/AppNavbar.vue
similarity index 54%
rename from src/components/custom-navbar/index.vue
rename to src/components/AppNavbar.vue
index b7c06a0..9b4228d 100644
--- a/src/components/custom-navbar/index.vue
+++ b/src/components/AppNavbar.vue
@@ -1,38 +1,38 @@
 <template>
-  <view v-if="fixed && placeholder" :style="{ height: totalHeight + 'px' }" />
+  <view v-if="fixed && placeholder" :style="{ height: totalHeightPx + 'px' }" />
   <view
-    class="custom-navbar"
-    :class="{ 'custom-navbar--fixed': fixed }"
+    class="app-navbar"
+    :class="{ 'app-navbar--fixed': fixed }"
     :style="{
-      height: totalHeight + 'px',
+      height: totalHeightPx + 'px',
       paddingTop: statusBarHeight + 'px',
-      background: bgColor,
+      background,
     }"
   >
-    <view class="custom-navbar__content" :style="{ height: contentHeight + 'px' }">
-      <view class="custom-navbar__left" :style="{ width: leftWidth + 'px' }">
-        <view v-if="showBack" class="custom-navbar__back" @click="handleBack">
+    <view class="app-navbar__content" :style="{ height: contentHeightPx + 'px' }">
+      <view class="app-navbar__left" :style="{ width: leftSlotWidth + 'px' }">
+        <view v-if="showBack" class="app-navbar__back" @click="handleBack">
           <wd-icon :name="backIcon" :size="backIconSize" :color="iconColor" />
         </view>
 
-        <view v-if="showHome" class="custom-navbar__home" @click="handleHome">
+        <view v-if="showHome" class="app-navbar__home" @click="handleHome">
           <wd-icon name="home" :size="backIconSize" :color="iconColor" />
         </view>
 
         <slot name="left" />
       </view>
 
-      <view class="custom-navbar__center">
-        <text v-if="title" class="custom-navbar__title" :style="{ color: titleColor }">
+      <view class="app-navbar__center">
+        <text v-if="title" class="app-navbar__title" :style="{ color: titleColor }">
           {{ title }}
         </text>
         <slot name="center" />
       </view>
 
-      <view class="custom-navbar__right" :style="{ width: rightWidth + 'px' }">
+      <view class="app-navbar__right" :style="{ width: rightSlotWidth + 'px' }">
         <slot name="right" />
         <!-- 微信端胶囊按钮占位，保证插槽内容不会顶到胶囊下方 -->
-        <view class="custom-navbar__capsule-space" :style="{ width: capsuleSpaceWidth + 'px' }" />
+        <view class="app-navbar__capsule-space" :style="{ width: capsuleSpaceWidth + 'px' }" />
       </view>
     </view>
   </view>
@@ -40,84 +40,81 @@
 
 <script setup lang="ts">
 import { computed } from "vue";
-import { useNavbar } from "@/composables/useNavbar";
+import { useNavbarMetrics } from "@/composables/useNavbarMetrics";
 
 interface Props {
   title?: string;
   titleColor?: string;
   /** 背景色或渐变，取值同 background 简写属性 */
-  bgColor?: string;
+  background?: string;
   showBack?: boolean;
   showHome?: boolean;
   backIcon?: string;
-  backIconSize?: string;
+  /** 返回与首页图标尺寸（px），wd-icon 的 size 以 px 为单位 */
+  backIconSize?: number;
   iconColor?: string;
   fixed?: boolean;
+  /** 固定在顶部时为内容区补一个等高占位块 */
   placeholder?: boolean;
-  navBarHeight?: number;
+  /** H5 / App 下的导航栏内容区高度（px） */
+  contentHeightPx?: number;
 }
 
 const props = withDefaults(defineProps<Props>(), {
   title: "",
   titleColor: "var(--color-text)",
-  bgColor: "var(--color-bg-card)",
+  background: "var(--color-bg-card)",
   showBack: true,
   showHome: false,
   backIcon: "arrow-left",
-  backIconSize: "40rpx",
+  backIconSize: 20,
   iconColor: "var(--color-text)",
   fixed: true,
   placeholder: false,
-  navBarHeight: 44,
+  contentHeightPx: 44,
 });
 
+/**
+ * back / home 事件仅用于通知挂载方，导航由组件自身完成：
+ * 存在上一页时返回，否则回到首页
+ */
 const emit = defineEmits<{
   (e: "back"): void;
   (e: "home"): void;
 }>();
 
-const navbar = useNavbar({ navBarHeight: props.navBarHeight });
-
-const fixed = computed(() => props.fixed);
-const placeholder = computed(() => props.placeholder);
+const navbar = useNavbarMetrics({ contentHeightPx: props.contentHeightPx });
 
 const statusBarHeight = computed(() => navbar.statusBarHeight.value);
-const navBarHeight = computed(() => navbar.navBarHeight);
-const totalHeight = computed(() => navbar.totalHeight.value);
-
-const contentHeight = computed(() => {
-  const height = totalHeight.value - statusBarHeight.value;
-  return height > 0 ? height : navBarHeight.value;
-});
-
-const menuButtonWidth = computed(() => navbar.menuButtonWidth.value);
-const menuButtonRightGap = computed(() => navbar.menuButtonRightGap.value);
-const menuButtonLeft = computed(() => navbar.menuButtonLeft.value);
+const contentHeightPx = computed(() => navbar.contentHeightPx.value);
+const totalHeightPx = computed(() => navbar.totalHeightPx.value);
 
 const capsuleSpaceWidth = computed(() => {
   let width = 0;
   // #ifdef MP-WEIXIN
-  if (menuButtonWidth.value > 0) {
-    width = menuButtonWidth.value + menuButtonRightGap.value;
+  if (navbar.capsuleWidthPx.value > 0) {
+    width = navbar.capsuleWidthPx.value + navbar.capsuleRightGapPx.value;
   }
   // #endif
   return width;
 });
 
-const rightContentWidth = computed(() => 96);
+// 右侧除胶囊外还要预留的插槽宽度（px）
+const RIGHT_SLOT_WIDTH = 96;
 
-const leftWidth = computed(() => {
+// 左侧插槽宽度（px）：微信端取胶囊左侧空间，其余端给固定值
+const leftSlotWidth = computed(() => {
   let width = 80;
   // #ifdef MP-WEIXIN
-  width = menuButtonLeft.value > 0 ? menuButtonLeft.value : 80;
+  width = navbar.capsuleLeftPx.value > 0 ? navbar.capsuleLeftPx.value : 80;
   // #endif
   return width;
 });
 
-const rightWidth = computed(() => {
+const rightSlotWidth = computed(() => {
   let width = 80;
   // #ifdef MP-WEIXIN
-  width = capsuleSpaceWidth.value + rightContentWidth.value;
+  width = capsuleSpaceWidth.value + RIGHT_SLOT_WIDTH;
   // #endif
   return width;
 });
@@ -141,7 +138,7 @@ function handleHome() {
 
 <script lang="ts">
 export default {
-  name: "CustomNavbar",
+  name: "AppNavbar",
   options: {
     virtualHost: true,
     styleIsolation: "shared",
@@ -150,7 +147,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.custom-navbar {
+.app-navbar {
   position: relative;
   z-index: var(--z-navbar);
   box-sizing: border-box;
@@ -164,29 +161,27 @@ export default {
   }
 }
 
-.custom-navbar__content {
-  position: relative;
-  z-index: var(--z-dropdown);
+/* 导航栏高度来自设备信息（px），内部尺寸同样用 px，避免窗口变宽时 rpx 被放大撑破内容区 */
+.app-navbar__content {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 0 16rpx;
+  padding: 0 8px;
 }
 
-.custom-navbar__left {
-  z-index: var(--z-dropdown);
+.app-navbar__left {
   display: flex;
   align-items: center;
 }
 
-.custom-navbar__back,
-.custom-navbar__home {
+.app-navbar__back,
+.app-navbar__home {
   display: flex;
   align-items: center;
   justify-content: center;
-  width: 64rpx;
-  height: 64rpx;
-  margin-right: 8rpx;
+  width: 32px;
+  height: 32px;
+  margin-right: 4px;
   border-radius: 50%;
 
   &:active {
@@ -194,11 +189,10 @@ export default {
   }
 }
 
-.custom-navbar__center {
+.app-navbar__center {
   position: absolute;
   top: 50%;
   left: 50%;
-  z-index: var(--z-dropdown);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -207,8 +201,7 @@ export default {
   transform: translate(-50%, -50%);
 }
 
-.custom-navbar__title {
-  z-index: var(--z-dropdown);
+.app-navbar__title {
   overflow: hidden;
   font-size: 32rpx;
   color: var(--color-text);
@@ -216,15 +209,14 @@ export default {
   white-space: nowrap;
 }
 
-.custom-navbar__right {
-  z-index: var(--z-dropdown);
+.app-navbar__right {
   display: flex;
   align-items: center;
   justify-content: flex-end;
 }
 
-.custom-navbar__capsule-space {
+.app-navbar__capsule-space {
   flex: 0 0 auto;
-  height: 2rpx;
+  height: 1px;
 }
 </style>
diff --git a/src/components/app-provider/index.vue b/src/components/AppProvider.vue
similarity index 70%
rename from src/components/app-provider/index.vue
rename to src/components/AppProvider.vue
index fe31b68..17254dc 100644
--- a/src/components/app-provider/index.vue
+++ b/src/components/AppProvider.vue
@@ -3,17 +3,19 @@ import { storeToRefs } from "pinia";
 import { useThemeStore } from "@/store";
 
 /**
- * 全局应用容器（主题配置唯一来源）
+ * 应用容器：主题与反馈组件的挂载点
  *
- * 页面内容与全局弹层（notify/toast/dialog）统一从 wd-config-provider 继承主题，
- * default / tabbar 两个 layout 共用，保证配置同源。
+ * 页面内容与全局弹层（notify/toast/dialog）从 wd-config-provider 继承主题，
+ * default / tabbar / blank 三类 layout 共用同一份注入逻辑。
+ * uni-app 的每个页面各自挂载一个实例，不是跨页常驻的单例。
  */
 const themeStore = useThemeStore();
 const { themeMode, themeVars } = storeToRefs(themeStore);
 
-// 页面自定义样式用的主题色（含透明度变体）与深色模式下的卡片填充色
+// 主色为 6 位十六进制时才能拆出 RGB 分量生成透明度变体
 const HEX6_RE = /^#[0-9a-fA-F]{6}$/;
 
+// 深色模式卡片填充色改由 wot 变量接管，避免深色下卡片发黑
 const providerStyle = computed(() => {
   const primary = themeStore.selectedThemeColor.primary;
   const styles = [`--color-primary: ${primary}`, "--wot-filled-oppo: var(--color-bg-card)"];
@@ -21,6 +23,7 @@ const providerStyle = computed(() => {
     const bigint = Number.parseInt(primary.slice(1), 16);
     const rgb = `${(bigint >> 16) & 255}, ${(bigint >> 8) & 255}, ${bigint & 255}`;
     styles.push(
+      `--color-primary-soft: rgba(${rgb}, 0.12)`,
       `--color-primary-alpha-20: rgba(${rgb}, 0.2)`,
       `--color-primary-alpha-15: rgba(${rgb}, 0.15)`
     );
diff --git a/src/composables/useActionSheet.ts b/src/composables/useActionSheet.ts
deleted file mode 100644
index 0f18652..0000000
--- a/src/composables/useActionSheet.ts
+++ /dev/null
@@ -1,67 +0,0 @@
-import { ref } from "vue";
-import { useToast, useDialog } from "@wot-ui/ui";
-
-/** 操作菜单项：name 用于展示，handler 选中后执行 */
-export interface ActionMenuOption {
-  name: string;
-  color?: string;
-  handler: () => void | Promise<void>;
-}
-
-/**
- * 列表页「更多操作」菜单（wd-action-sheet）统一逻辑
- *
- * 页面只需声明菜单项（含权限判断），选中分发与空菜单提示由这里处理：
- *
- * const { actionSheetVisible, actionSheetActions, showActions, handleActionSelect, confirmAction } =
- *   useActionSheet();
- */
-export function useActionSheet() {
-  const toast = useToast();
-  const { confirm } = useDialog();
-
-  const actionSheetVisible = ref(false);
-  const actionSheetActions = ref<{ name: string; color?: string }[]>([]);
-  let handlers: Record<string, () => void> = {};
-
-  /** 展示操作菜单，无可用项时提示「暂无操作权限」 */
-  function showActions(menus: ActionMenuOption[]) {
-    if (menus.length === 0) {
-      toast.warning("暂无操作权限");
-      return;
-    }
-    actionSheetActions.value = menus.map(({ name, color }) => ({ name, color }));
-    handlers = Object.fromEntries(menus.map((menu) => [menu.name, menu.handler]));
-    actionSheetVisible.value = true;
-  }
-
-  function handleActionSelect({ item }: { item: { name: string } }) {
-    handlers[item.name]?.();
-  }
-
-  /**
-   * 标准危险操作确认流程：确认弹窗 → 执行 → 成功提示，用户取消静默
-   *
-   * @param options.msg 确认弹窗提示文案
-   * @param options.action 确认后执行的操作
-   * @param options.title 确认弹窗标题，默认「确认删除」
-   * @param options.successText 成功提示文案，默认「删除成功」
-   */
-  async function confirmAction(options: {
-    msg: string;
-    action: () => Promise<void>;
-    title?: string;
-    successText?: string;
-  }) {
-    const { msg, action, title = "确认删除", successText = "删除成功" } = options;
-    try {
-      await confirm({ title, msg, headerImage: "warning" });
-      await action();
-      toast.success(successText);
-    } catch {
-      // 用户取消操作
-    }
-  }
-
-  return { actionSheetVisible, actionSheetActions, showActions, handleActionSelect, confirmAction };
-}
diff --git a/src/composables/useCacheCleaner.ts b/src/composables/useCacheCleaner.ts
index 78552e3..20e9373 100644
--- a/src/composables/useCacheCleaner.ts
+++ b/src/composables/useCacheCleaner.ts
@@ -4,16 +4,23 @@ import { Storage } from "@/utils/storage";
 import { formatBytes } from "@/utils/format";
 
 /**
- * 缓存体积与清理
+ * 缓存体积统计与清理
  *
- * 只统计并清理可重建的缓存（如用户信息缓存），登录态与主题偏好不参与，
- * 避免像 uni.clearStorage() 那样把 token 一起清掉导致下次启动退出登录。
+ * 统计与清理的范围都是「保留名单之外的全部本地键」：登录态与主题偏好保留，
+ * 其余键（用户信息缓存等）一并删除。
  */
 export function useCacheCleaner() {
   const toast = useToast();
+  /** 缓存体积的展示文案，未统计完成前为「计算中...」 */
   const usageText = ref("计算中...");
+  /** 是否正在清理，用于展示遮罩并挡住重复触发 */
   const isClearing = ref(false);
 
+  /**
+   * 统计可清理的缓存体积
+   *
+   * 读取失败时展示「获取失败」，避免把异常状态当成 0B。
+   */
   async function loadUsage() {
     try {
       usageText.value = formatBytes(Storage.getClearableBytes());
@@ -22,7 +29,12 @@ export function useCacheCleaner() {
     }
   }
 
-  async function clear() {
+  /**
+   * 清理缓存并刷新体积
+   *
+   * 体积获取失败或无缓存时不发起删除，成功删除后才提示清理成功。
+   */
+  async function clearCache() {
     if (usageText.value === "获取失败") {
       toast.info("获取缓存信息失败，请稍后重试");
       return;
@@ -51,5 +63,5 @@ export function useCacheCleaner() {
     }
   }
 
-  return { usageText, isClearing, loadUsage, clear };
+  return { usageText, isClearing, loadUsage, clearCache };
 }
diff --git a/src/composables/useConfirmAction.ts b/src/composables/useConfirmAction.ts
new file mode 100644
index 0000000..1fbd81b
--- /dev/null
+++ b/src/composables/useConfirmAction.ts
@@ -0,0 +1,42 @@
+import { useDialog, useToast } from "@wot-ui/ui";
+
+/**
+ * 危险操作确认流程
+ *
+ * 确认弹窗 → 执行 → 成功提示，与操作菜单、表单弹窗等界面无关。
+ */
+export function useConfirmAction() {
+  const toast = useToast();
+  const { confirm } = useDialog();
+
+  /**
+   * 确认后执行操作
+   *
+   * 用户取消时静默结束；执行失败会抛出，由调用方统一提示。
+   *
+   * @param options.msg - 确认弹窗的提示文案
+   * @param options.action - 确认后执行的操作
+   * @param options.title - 确认弹窗标题，默认「确认删除」
+   * @param options.successText - 成功提示文案，默认「删除成功」
+   */
+  async function confirmAction(options: {
+    msg: string;
+    action: () => Promise<void>;
+    title?: string;
+    successText?: string;
+  }): Promise<void> {
+    const { msg, action, title = "确认删除", successText = "删除成功" } = options;
+
+    try {
+      await confirm({ title, msg, headerImage: "warning" });
+    } catch {
+      // 用户取消确认弹窗
+      return;
+    }
+
+    await action();
+    toast.success(successText);
+  }
+
+  return { confirmAction };
+}
diff --git a/src/composables/useCountdown.ts b/src/composables/useCountdown.ts
index e1e8eef..cfbc99e 100644
--- a/src/composables/useCountdown.ts
+++ b/src/composables/useCountdown.ts
@@ -1,42 +1,56 @@
 import { ref, onUnmounted } from "vue";
 
 /**
- * 倒计时（按截止时间计算剩余秒数，页面隐藏或切后台后恢复时仍保持准确）
+ * 倒计时
+ *
+ * 按截止时间计算剩余秒数，页面隐藏或切后台再回来仍保持准确。
+ *
+ * @param durationSeconds - 倒计时总秒数，默认 60
  */
-export function useCountdown(duration = 60) {
-  const countdown = ref(0);
+export function useCountdown(durationSeconds = 60) {
+  /** 剩余秒数，未开始时为 0 */
+  const remainingSeconds = ref(0);
+  /** 是否正在倒计时 */
   const isRunning = ref(false);
-  let timer: ReturnType<typeof setInterval> | null = null;
+  // 截止时间戳，tick 每次按它重算，避免定时器漂移累积
   let deadline = 0;
+  let timer: ReturnType<typeof setInterval> | null = null;
 
+  // 按剩余时间刷新秒数，归零时自行停止
   function tick() {
     const remain = Math.ceil((deadline - Date.now()) / 1000);
-    countdown.value = Math.max(0, remain);
-    if (countdown.value <= 0) stop();
+    remainingSeconds.value = Math.max(0, remain);
+    if (remainingSeconds.value <= 0) stop();
   }
 
+  /**
+   * 开始倒计时
+   *
+   * 已在计时中重复调用会被忽略，不会重置截止时间。
+   */
   const start = () => {
     if (isRunning.value) return;
 
-    deadline = Date.now() + duration * 1000;
+    deadline = Date.now() + durationSeconds * 1000;
     isRunning.value = true;
     tick();
     timer = setInterval(tick, 1000);
   };
 
+  /** 停止倒计时并把剩余秒数清零 */
   const stop = () => {
     if (timer) {
       clearInterval(timer);
       timer = null;
     }
-    countdown.value = 0;
+    remainingSeconds.value = 0;
     isRunning.value = false;
   };
 
   onUnmounted(() => stop());
 
   return {
-    countdown,
+    remainingSeconds,
     isRunning,
     start,
     stop,
diff --git a/src/composables/useLogout.ts b/src/composables/useLogout.ts
index 2419ad5..9eae788 100644
--- a/src/composables/useLogout.ts
+++ b/src/composables/useLogout.ts
@@ -1,22 +1,46 @@
+import { ref } from "vue";
+import { useToast } from "@wot-ui/ui";
 import { useUserStore } from "@/store";
 
-/** 退出登录二次确认，确认后由 userStore.logout 清理会话并跳转登录页 */
+/**
+ * 退出登录流程
+ *
+ * 会话清理与跳转登录页由 userStore.logout 负责，这里只做二次确认、进行中反馈与防重入。
+ */
 export function useLogout() {
+  const toast = useToast();
   const userStore = useUserStore();
+  /** 退出流程进行中，用于禁用入口并挡住重复触发 */
+  const isLoggingOut = ref(false);
+
+  /**
+   * 发起退出登录
+   *
+   * 用户取消弹窗时不产生任何请求；确认后进入 isLoggingOut，
+   * 期间再次触发直接忽略，避免重复调用退出接口。
+   */
+  const requestLogout = () => {
+    if (isLoggingOut.value) return;
 
-  // 取消不做处理，确认后交给 logout 统一收尾
-  const confirmLogout = () => {
     uni.showModal({
-      title: "提示",
+      title: "退出登录",
       content: "确定要退出登录吗？",
+      confirmText: "退出",
       confirmColor: "#f53f3f",
       success: async (res) => {
-        if (res.confirm) {
+        if (!res.confirm) return;
+
+        isLoggingOut.value = true;
+        toast.loading("正在退出...");
+        try {
           await userStore.logout();
+        } finally {
+          toast.close();
+          isLoggingOut.value = false;
         }
       },
     });
   };
 
-  return { confirmLogout };
+  return { isLoggingOut, requestLogout };
 }
diff --git a/src/composables/useNavbar.ts b/src/composables/useNavbar.ts
deleted file mode 100644
index 750e7a4..0000000
--- a/src/composables/useNavbar.ts
+++ /dev/null
@@ -1,244 +0,0 @@
-import { ref, computed, type Ref, type ComputedRef } from "vue";
-
-/**
- * 微信小程序导航栏高度计算
- *
- * 参考 uni-ui 官方实现：https://github.com/dcloudio/uni-ui
- *
- * 重要说明：
- * 1. CSS 变量 --status-bar-height 在某些情况下不准确（小程序端固定 25px）
- * 2. 使用 uni.getWindowInfo().statusBarHeight 动态获取
- * 3. 微信小程序需要考虑胶囊按钮位置
- * 4. H5 没有状态栏，statusBarHeight 为 0
- *
- * 导航栏结构：
- * ┌─────────────────────────────┐
- * │        状态栏区域            │  statusBarHeight
- * ├─────────────────────────────┤
- * │    上边距                    │  menu.top - statusBarHeight
- * ├─────────────────────────────┤
- * │        胶囊按钮              │  menu.height
- * ├─────────────────────────────┤
- * │    下边距（与上边距相等）     │
- * └─────────────────────────────┘
- *
- * 导航栏高度计算公式（uni-ui 官方）：
- * navBarHeight = menu.height + (menu.top - statusBarHeight) * 2
- * totalHeight = statusBarHeight + navBarHeight
- */
-
-interface MenuButtonRect {
-  width: number;
-  height: number;
-  top: number;
-  right: number;
-  bottom: number;
-  left: number;
-}
-
-export interface UseNavbarOptions {
-  /** 导航栏内容高度，默认 44 */
-  navBarHeight?: number;
-  /** 是否有 TabBar，默认 false */
-  hasTabbar?: boolean;
-}
-
-export interface UseNavbarReturn {
-  // 高度信息
-  statusBarHeight: Ref<number>;
-  navBarHeight: number;
-  totalHeight: ComputedRef<number>;
-  contentPaddingTop: ComputedRef<string>;
-  safeAreaBottom: Ref<number>;
-
-  // 胶囊按钮信息
-  menuButton: Ref<MenuButtonRect | null>;
-  menuButtonRightGap: ComputedRef<number>;
-  menuButtonLeft: ComputedRef<number>;
-  menuButtonWidth: ComputedRef<number>;
-  contentWidth: ComputedRef<number>;
-
-  // 平台信息
-  platform: Ref<string>;
-  windowWidth: Ref<number>;
-
-  // 方法
-  init: () => void;
-}
-
-/**
- * 导航栏高度计算 Hook
- *
- * @param options 配置选项
- */
-export function useNavbar(options: UseNavbarOptions = {}): UseNavbarReturn {
-  const { navBarHeight = 44 } = options;
-
-  // 状态栏高度
-  const statusBarHeight = ref(0);
-  // 胶囊按钮信息
-  const menuButton = ref<MenuButtonRect | null>(null);
-  // 安全区域底部高度
-  const safeAreaBottom = ref(0);
-  // 窗口宽度
-  const windowWidth = ref(375);
-  // 平台标识
-  const platform = ref("");
-
-  // 计算导航栏总高度（参考 uni-ui 官方实现）
-  const totalHeight = computed(() => {
-    // #ifdef MP-WEIXIN
-    // 微信小程序：使用胶囊按钮精确计算
-    if (menuButton.value && menuButton.value.height > 0 && menuButton.value.top > 0) {
-      const { top, height } = menuButton.value;
-      // 导航栏高度 = 胶囊按钮高度 + 上下边距
-      // 上下边距 = (胶囊按钮top - 状态栏高度) * 2
-      const spaceHeight = top - statusBarHeight.value;
-      return statusBarHeight.value + height + spaceHeight * 2;
-    }
-    // #endif
-
-    // H5 / App：状态栏高度 + 导航栏高度
-    return statusBarHeight.value + navBarHeight;
-  });
-
-  // 页面内容区域的 paddingTop（用于避开固定导航栏）
-  const contentPaddingTop = computed(() => `${totalHeight.value}px`);
-
-  // 胶囊按钮右侧距离屏幕右边的距离（用于避开胶囊按钮）
-  const menuButtonRightGap = computed(() => {
-    // #ifdef MP-WEIXIN
-    if (menuButton.value && menuButton.value.right > 0) {
-      return windowWidth.value - menuButton.value.right;
-    }
-    // #endif
-    // H5 / App 不需要避让胶囊
-    return 10;
-  });
-
-  // 胶囊按钮左侧距离屏幕左边的距离
-  const menuButtonLeft = computed(() => {
-    // #ifdef MP-WEIXIN
-    if (menuButton.value) {
-      return menuButton.value.left;
-    }
-    // #endif
-    return 0;
-  });
-
-  // 胶囊按钮宽度
-  const menuButtonWidth = computed(() => {
-    // #ifdef MP-WEIXIN
-    if (menuButton.value) {
-      return menuButton.value.width;
-    }
-    // #endif
-    return 0;
-  });
-
-  // 页面内容区域可用宽度（避开胶囊按钮）
-  const contentWidth = computed(() => {
-    // #ifdef MP-WEIXIN
-    if (menuButton.value) {
-      // 内容区域宽度 = 胶囊按钮左侧距离 - 间距
-      const gap = menuButtonRightGap.value;
-      return menuButton.value.left - gap;
-    }
-    // #endif
-    return windowWidth.value;
-  });
-
-  // #ifdef MP-WEIXIN
-  const isValidMenuButtonRect = (rect: ReturnType<typeof uni.getMenuButtonBoundingClientRect>) => {
-    return !!rect && rect.width > 0 && rect.height > 0 && rect.top > 0 && rect.right > 0;
-  };
-
-  const setMenuButtonRectWithRetry = (maxRetry = 6, delayMs = 50) => {
-    // 兜底：合理的默认胶囊按钮尺寸，避免导航栏高度为 0
-    const applyDefaultMenuButton = () => {
-      menuButton.value = {
-        width: 87,
-        height: 32,
-        top: statusBarHeight.value + 6,
-        right: windowWidth.value - 10,
-        bottom: statusBarHeight.value + 38,
-        left: windowWidth.value - 97,
-      };
-    };
-
-    try {
-      const rect = uni.getMenuButtonBoundingClientRect();
-
-      if (isValidMenuButtonRect(rect)) {
-        menuButton.value = {
-          width: rect.width,
-          height: rect.height,
-          top: rect.top,
-          right: rect.right,
-          bottom: rect.bottom,
-          left: rect.left,
-        };
-        return;
-      }
-
-      if (maxRetry > 0) {
-        setTimeout(() => {
-          setMenuButtonRectWithRetry(maxRetry - 1, delayMs);
-        }, delayMs);
-      } else {
-        applyDefaultMenuButton();
-      }
-    } catch {
-      applyDefaultMenuButton();
-    }
-  };
-  // #endif
-
-  // 初始化
-  const init = () => {
-    try {
-      const windowInfo =
-        typeof uni.getWindowInfo === "function" ? uni.getWindowInfo() : uni.getSystemInfoSync();
-      const deviceInfo =
-        typeof uni.getDeviceInfo === "function" ? uni.getDeviceInfo() : uni.getSystemInfoSync();
-
-      statusBarHeight.value = windowInfo.statusBarHeight || 0;
-      safeAreaBottom.value = windowInfo.safeAreaInsets?.bottom || 0;
-      windowWidth.value = windowInfo.windowWidth || 375;
-      platform.value = deviceInfo.platform || "";
-
-      // #ifdef MP-WEIXIN
-      // 微信小程序：获取胶囊按钮位置
-      setMenuButtonRectWithRetry();
-      // #endif
-    } catch {
-      // 各字段已有声明处默认值兜底
-    }
-  };
-
-  // setup 阶段同步调用，避免首次渲染闪烁
-  init();
-
-  return {
-    // 高度信息
-    statusBarHeight,
-    navBarHeight,
-    totalHeight,
-    contentPaddingTop,
-    safeAreaBottom,
-
-    // 胶囊按钮信息
-    menuButton,
-    menuButtonRightGap,
-    menuButtonLeft,
-    menuButtonWidth,
-    contentWidth,
-
-    // 平台信息
-    platform,
-    windowWidth,
-
-    // 方法
-    init,
-  };
-}
diff --git a/src/composables/useNavbarMetrics.ts b/src/composables/useNavbarMetrics.ts
new file mode 100644
index 0000000..efc4df3
--- /dev/null
+++ b/src/composables/useNavbarMetrics.ts
@@ -0,0 +1,195 @@
+import { ref, computed, onUnmounted, type Ref, type ComputedRef } from "vue";
+
+/**
+ * 导航栏几何测量
+ *
+ * 参考 uni-ui 官方实现：https://github.com/dcloudio/uni-ui
+ *
+ * 微信小程序按胶囊按钮位置推算内容区高度：
+ * 状态栏 → 上边距 → 胶囊 → 下边距，上下边距相等，
+ * 内容区高度 = capsule.height + (capsule.top - statusBarHeight) * 2。
+ * H5 与 App 没有胶囊，直接取 fallbackContentHeightPx。
+ */
+
+// 胶囊按钮相对屏幕的矩形，单位 px
+interface CapsuleRect {
+  width: number;
+  height: number;
+  top: number;
+  right: number;
+  bottom: number;
+  left: number;
+}
+
+/** 导航栏测量配置 */
+export interface NavbarMetricsOptions {
+  /** H5 / App 无胶囊时的内容区高度（px），默认 44 */
+  contentHeightPx?: number;
+}
+
+/**
+ * 导航栏测量结果
+ *
+ * 长度单位统一为 px，与系统几何 API 保持一致。
+ */
+export interface NavbarMetrics {
+  /** 状态栏高度（px） */
+  statusBarHeight: Ref<number>;
+  /** 导航栏内容区高度（px），不含状态栏 */
+  contentHeightPx: ComputedRef<number>;
+  /** 导航栏总高度（px），含状态栏 */
+  totalHeightPx: ComputedRef<number>;
+  /** 胶囊左侧坐标（px），微信端即左侧可用宽度 */
+  capsuleLeftPx: ComputedRef<number>;
+  /** 胶囊右侧到屏幕右边缘的距离（px） */
+  capsuleRightGapPx: ComputedRef<number>;
+  /** 胶囊宽度（px） */
+  capsuleWidthPx: ComputedRef<number>;
+}
+
+/**
+ * 测量导航栏、状态栏与胶囊尺寸
+ *
+ * setup 阶段即完成首次读取，避免首屏闪烁；组件卸载时清理内部重试定时器。
+ *
+ * @param options - 无胶囊平台的内容区高度
+ */
+export function useNavbarMetrics(options: NavbarMetricsOptions = {}): NavbarMetrics {
+  const { contentHeightPx: fallbackContentHeightPx = 44 } = options;
+
+  const statusBarHeight = ref(0);
+  const capsuleRect = ref<CapsuleRect | null>(null);
+  const windowWidth = ref(375);
+
+  // 胶囊矩形可能晚于首次渲染就绪，重试定时器在卸载与重新测量时清理
+  let retryTimer: ReturnType<typeof setTimeout> | null = null;
+
+  // 清理重试定时器
+  const clearRetryTimer = () => {
+    if (retryTimer !== null) {
+      clearTimeout(retryTimer);
+      retryTimer = null;
+    }
+  };
+
+  // 导航栏内容区高度：微信端按胶囊推算，其余端用固定值
+  const contentHeightPx = computed(() => {
+    // #ifdef MP-WEIXIN
+    const capsule = capsuleRect.value;
+    if (capsule && capsule.height > 0 && capsule.top > 0) {
+      const spaceHeight = capsule.top - statusBarHeight.value;
+      return capsule.height + spaceHeight * 2;
+    }
+    // #endif
+
+    return fallbackContentHeightPx;
+  });
+
+  const totalHeightPx = computed(() => statusBarHeight.value + contentHeightPx.value);
+
+  const capsuleLeftPx = computed(() => {
+    // #ifdef MP-WEIXIN
+    if (capsuleRect.value) {
+      return capsuleRect.value.left;
+    }
+    // #endif
+    return 0;
+  });
+
+  // 微信端取窗口右边缘与胶囊右边缘的差值，其余端只留固定边距
+  const capsuleRightGapPx = computed(() => {
+    // #ifdef MP-WEIXIN
+    if (capsuleRect.value && capsuleRect.value.right > 0) {
+      return windowWidth.value - capsuleRect.value.right;
+    }
+    // #endif
+    return 10;
+  });
+
+  const capsuleWidthPx = computed(() => {
+    // #ifdef MP-WEIXIN
+    if (capsuleRect.value) {
+      return capsuleRect.value.width;
+    }
+    // #endif
+    return 0;
+  });
+
+  // #ifdef MP-WEIXIN
+  const isValidCapsuleRect = (rect: ReturnType<typeof uni.getMenuButtonBoundingClientRect>) => {
+    return !!rect && rect.width > 0 && rect.height > 0 && rect.top > 0 && rect.right > 0;
+  };
+
+  // 有限次重试读取胶囊矩形，仍未取到则回落到默认尺寸，避免内容区高度为 0
+  const readCapsuleRect = (maxRetry = 6, delayMs = 50) => {
+    const applyDefaultCapsuleRect = () => {
+      capsuleRect.value = {
+        width: 87,
+        height: 32,
+        top: statusBarHeight.value + 6,
+        right: windowWidth.value - 10,
+        bottom: statusBarHeight.value + 38,
+        left: windowWidth.value - 97,
+      };
+    };
+
+    try {
+      const rect = uni.getMenuButtonBoundingClientRect();
+
+      if (isValidCapsuleRect(rect)) {
+        capsuleRect.value = {
+          width: rect.width,
+          height: rect.height,
+          top: rect.top,
+          right: rect.right,
+          bottom: rect.bottom,
+          left: rect.left,
+        };
+        return;
+      }
+
+      if (maxRetry > 0) {
+        retryTimer = setTimeout(() => {
+          readCapsuleRect(maxRetry - 1, delayMs);
+        }, delayMs);
+      } else {
+        applyDefaultCapsuleRect();
+      }
+    } catch {
+      applyDefaultCapsuleRect();
+    }
+  };
+  // #endif
+
+  // 读取窗口与胶囊尺寸，取不到的值保留声明处默认值
+  const refreshMetrics = () => {
+    try {
+      const windowInfo =
+        typeof uni.getWindowInfo === "function" ? uni.getWindowInfo() : uni.getSystemInfoSync();
+
+      statusBarHeight.value = windowInfo.statusBarHeight || 0;
+      windowWidth.value = windowInfo.windowWidth || 375;
+
+      // #ifdef MP-WEIXIN
+      clearRetryTimer();
+      readCapsuleRect();
+      // #endif
+    } catch {
+      // 各字段已有声明处默认值兜底
+    }
+  };
+
+  // setup 阶段同步读取一次，避免首屏按默认尺寸渲染后再跳动
+  refreshMetrics();
+
+  onUnmounted(clearRetryTimer);
+
+  return {
+    statusBarHeight,
+    contentHeightPx,
+    totalHeightPx,
+    capsuleLeftPx,
+    capsuleRightGapPx,
+    capsuleWidthPx,
+  };
+}
diff --git a/src/composables/useNavigation.ts b/src/composables/useNavigation.ts
index a2f6046..40ce4e4 100644
--- a/src/composables/useNavigation.ts
+++ b/src/composables/useNavigation.ts
@@ -1,18 +1,32 @@
-import { checkLogin } from "@/utils/auth";
+import { ensureAuthenticated } from "@/utils/auth";
 
+// 导航目标：url 为空表示功能未开放
 interface NavItem {
   url?: string;
 }
 
+/**
+ * 业务菜单导航
+ *
+ * 站外地址在 H5 新开标签、其余端进内置 webview，站内地址走 navigateTo。
+ */
 export function useNavigation() {
   const toast = useToast();
-  const handleNavClick = (item: NavItem) => {
+
+  /**
+   * 按菜单配置跳转
+   *
+   * 未登录先跳登录页并带上来路；地址缺失或页面不存在时给出提示。
+   *
+   * @param item - 菜单项，url 支持站内路径与 http(s) 地址
+   */
+  const navigate = (item: NavItem) => {
     if (!item.url) {
       toast.info("功能开发中");
       return;
     }
 
-    if (!checkLogin()) return;
+    if (!ensureAuthenticated()) return;
 
     if (item.url.startsWith("http://") || item.url.startsWith("https://")) {
       // #ifdef H5
@@ -34,5 +48,5 @@ export function useNavigation() {
     });
   };
 
-  return { handleNavClick };
+  return { navigate };
 }
diff --git a/src/composables/useScanLogin.ts b/src/composables/useScanLogin.ts
index 0e22fd7..affb549 100644
--- a/src/composables/useScanLogin.ts
+++ b/src/composables/useScanLogin.ts
@@ -1,15 +1,28 @@
-import { checkLogin } from "@/utils/auth";
+import { ensureAuthenticated } from "@/utils/auth";
 
 /**
  * 扫码登录 PC 端
  *
- * 调起相机扫描 PC 端登录二维码，校验票据后跳转扫码确认页。
- * 未登录时跳转登录页，用户取消扫码静默处理。
+ * 调起相机扫描 PC 端登录二维码，只检查扫码结果非空；票据有效性与用户身份
+ * 由扫码确认页调用服务端校验，本方法不完成登录。
  */
 export function useScanLogin() {
   const toast = useToast();
-  const scanLogin = async () => {
-    if (!checkLogin()) return;
+
+  /**
+   * 调起相机扫码并进入确认页
+   *
+   * 未登录先跳登录页；当前环境无扫码能力时给出可读提示；
+   * 用户取消扫码静默结束，其余失败按原因提示。
+   */
+  const scanForLogin = async () => {
+    if (!ensureAuthenticated()) return;
+
+    if (!canScanCode()) {
+      toast.info("当前环境不支持扫码，请在 App 或小程序中使用");
+      return;
+    }
+
     try {
       const res = await uni.scanCode({ scanType: ["qrCode"] });
       const ticket = (res.result || "").trim();
@@ -20,10 +33,33 @@ export function useScanLogin() {
       uni.navigateTo({
         url: `/subPages/mine/scan-confirm/index?ticket=${encodeURIComponent(ticket)}`,
       });
-    } catch {
-      // 用户取消扫码，静默处理
+    } catch (error) {
+      const message = getScanErrorMessage(error);
+      if (message) toast.error(message);
     }
   };
 
-  return { scanLogin };
+  return { scanForLogin };
+}
+
+// 当前环境能否调起相机：H5 没有原生扫码能力
+function canScanCode(): boolean {
+  let supported = typeof uni.scanCode === "function";
+  // #ifdef H5
+  supported = false;
+  // #endif
+  return supported;
+}
+
+// 扫码失败提示文案：返回 null 表示用户主动取消，不做提示
+function getScanErrorMessage(error: unknown): string | null {
+  const errMsg = String((error as { errMsg?: string } | undefined)?.errMsg || "").toLowerCase();
+  if (errMsg.includes("cancel")) return null;
+  if (errMsg.includes("auth") || errMsg.includes("permission") || errMsg.includes("deny")) {
+    return "未获得相机权限，请在系统设置中开启后重试";
+  }
+  if (errMsg.includes("not support") || errMsg.includes("unsupported")) {
+    return "当前环境不支持扫码，请在 App 或小程序中使用";
+  }
+  return "扫码失败，请重试";
 }
diff --git a/src/composables/useSmsLoginCode.ts b/src/composables/useSmsLoginCode.ts
index b8d62b4..6ddb2e7 100644
--- a/src/composables/useSmsLoginCode.ts
+++ b/src/composables/useSmsLoginCode.ts
@@ -4,25 +4,38 @@ import { useCountdown } from "@/composables/useCountdown";
 import { getErrorMessage } from "@/utils/error";
 import AuthAPI from "@/api/auth";
 
-/** 手机号格式校验 */
+/**
+ * 判断手机号格式是否可用
+ *
+ * @param mobile - 待校验的手机号
+ * @returns 是否为 1 开头的 11 位数字
+ */
 export function isValidMobile(mobile: string): boolean {
   return /^1\d{10}$/.test((mobile || "").trim());
 }
 
 /**
- * 登录短信验证码发送（含 60s 倒计时与发送锁）
+ * 登录短信验证码发送
  *
- * @returns countdown 剩余秒数、isSending 发送中标志、sendCode 发送函数、resetCountdown 重置倒计时
+ * 含发送锁与 60 秒倒计时：请求返回前阻止重复点击，倒计时在发送成功后才启动。
  */
 export function useSmsLoginCode() {
   const toast = useToast();
-  const { countdown, start, stop } = useCountdown(60);
-  /** 发送中标志：请求返回前阻止重复点击（倒计时在发送成功后才启动） */
+  const { remainingSeconds, start, stop } = useCountdown(60);
+  /** 发送中标志，请求返回前阻止重复点击 */
   const isSending = ref(false);
 
-  /** 发送验证码，失败提示由这里统一处理 */
+  /**
+   * 发送验证码
+   *
+   * 手机号格式与重复发送在这里拦下，接口失败提示也由这里统一处理。
+   *
+   * @param mobile - 接收验证码的手机号
+   * @param fallback - 接口无错误信息时的兜底提示
+   * @returns 是否发送成功
+   */
   async function sendCode(mobile: string, fallback = "发送失败"): Promise<boolean> {
-    if (isSending.value || countdown.value > 0) return false;
+    if (isSending.value || remainingSeconds.value > 0) return false;
     if (!isValidMobile(mobile)) {
       toast.error("请输入正确的手机号");
       return false;
@@ -41,9 +54,14 @@ export function useSmsLoginCode() {
     }
   }
 
+  /**
+   * 重置倒计时
+   *
+   * 关闭弹窗等场景调用，让下次打开可以立即重新发送。
+   */
   function resetCountdown() {
     stop();
   }
 
-  return { countdown, isSending, sendCode, resetCountdown };
+  return { remainingSeconds, isSending, sendCode, resetCountdown };
 }
diff --git a/src/composables/useTheme.ts b/src/composables/useTheme.ts
index 1b7050d..cfe41ba 100644
--- a/src/composables/useTheme.ts
+++ b/src/composables/useTheme.ts
@@ -16,9 +16,7 @@ export function useTheme() {
     store.setThemeMode(mode);
   }
 
-  /**
-   * 在明暗两种模式间切换
-   */
+  /** 在明暗两种模式间切换 */
   function toggleThemeMode() {
     store.toggleThemeMode();
   }
@@ -31,9 +29,7 @@ export function useTheme() {
     store.setThemeColor(option);
   }
 
-  /**
-   * 初始化主题
-   */
+  /** 初始化主题 */
   function initTheme() {
     store.initTheme();
   }
diff --git a/src/config/index.ts b/src/config/index.ts
index 00d783b..e111e9a 100644
--- a/src/config/index.ts
+++ b/src/config/index.ts
@@ -1,5 +1,3 @@
-/**
- * 配置统一导出
- */
+/** 配置统一导出 */
 
 export * from "./work-menu";
diff --git a/src/config/work-menu.ts b/src/config/work-menu.ts
index 03b3793..3819cea 100644
--- a/src/config/work-menu.ts
+++ b/src/config/work-menu.ts
@@ -1,6 +1,4 @@
-/**
- * 工作台菜单配置
- */
+/** 工作台菜单配置 */
 
 export interface WorkMenuItem {
   icon: string;
diff --git a/src/constants/index.ts b/src/constants/index.ts
index d380f48..929a5f4 100644
--- a/src/constants/index.ts
+++ b/src/constants/index.ts
@@ -1,5 +1,3 @@
-/**
- * 常量统一出口：具体定义按领域拆分在同级文件
- */
+/** 常量统一出口：具体定义按领域拆分在同级文件 */
 export * from "./storage-keys";
 export * from "./permissions";
diff --git a/src/constants/permissions.ts b/src/constants/permissions.ts
index ad9de62..17d7f55 100644
--- a/src/constants/permissions.ts
+++ b/src/constants/permissions.ts
@@ -1,6 +1,4 @@
-/**
- * 权限相关常量
- */
+/** 权限相关常量 */
 
 /** 超级管理员角色标识 */
 export const ROLE_ROOT = "ROOT";
diff --git a/src/layouts/tabbar.vue b/src/layouts/tabbar.vue
index e59253a..49fe701 100644
--- a/src/layouts/tabbar.vue
+++ b/src/layouts/tabbar.vue
@@ -3,7 +3,7 @@
     <view class="page page--tabbar">
       <slot />
       <wd-tabbar
-        v-model="active"
+        v-model="activePath"
         bordered
         safe-area-inset-bottom
         fixed
@@ -25,35 +25,37 @@
 import { ref, nextTick } from "vue";
 import { onShow } from "@dcloudio/uni-app";
 
-/** tabbar 配置：name 与页面路径一一对应 */
+// tabbar 配置：name 与页面路径一一对应，切换时按 name 走 switchTab
 const tabbarList = [
   { name: "/pages/index/index", title: "首页", icon: "home" },
   { name: "/pages/work/index", title: "工作台", icon: "apps" },
   { name: "/pages/mine/index", title: "我的", icon: "user" },
 ];
 
-/** 当前激活项，用页面路径作为 name，初始化时根据当前页面设置 */
-const active = ref(tabbarList[0].name);
+// 当前激活项的页面路径
+const activePath = ref(tabbarList[0].name);
 
-function initActive() {
+// 按当前页面同步激活项：mounted 与 onShow 都要执行，切回标签时不能停留在旧值
+function syncActiveTab() {
   const pages = getCurrentPages();
   const currentPage = pages[pages.length - 1];
   const route = (currentPage?.route as string) || "";
   const matched = tabbarList.find((item) => item.name === `/${route}`);
   if (matched) {
-    active.value = matched.name;
+    activePath.value = matched.name;
   }
 }
 
+// 切换标签：先更新选中态再跳转，避免切换过程中高亮回弹
 function handleTabbarChange({ value }: { value: string }) {
-  active.value = value;
+  activePath.value = value;
   nextTick(() => {
     uni.switchTab({ url: value });
   });
 }
 
 onMounted(() => {
-  initActive();
+  syncActiveTab();
 
   // #ifdef APP-PLUS
   uni.hideTabBar();
@@ -61,7 +63,7 @@ onMounted(() => {
 });
 
 onShow(() => {
-  initActive();
+  syncActiveTab();
 });
 </script>
 
diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue
index 8989bc3..7f0d195 100644
--- a/src/pages/index/index.vue
+++ b/src/pages/index/index.vue
@@ -1,10 +1,11 @@
 <template>
   <view>
-    <!-- 轮播图 -->
+    <!-- 轮播图：height 控制轨道与图片高度，custom-style 给根节点确定高度（小程序内部 scroll-view 用 100%） -->
     <view class="relative">
       <wd-swiper
         v-model:current="activeSlideIndex"
-        custom-class="swiper-box"
+        custom-style="height: 420rpx"
+        height="420rpx"
         :list="swiperList"
         autoplay
       />
@@ -17,8 +18,7 @@
         <wd-grid-item
           v-for="(item, index) in quickNavList"
           :key="index"
-          use-slot
-          @click="handleNavClickWithGuard(item)"
+          @click="handleNavItemClick(item)"
         >
           <view class="quick-nav-card__item">
             <image class="quick-nav-card__icon" :src="item.icon" mode="aspectFit" />
@@ -39,7 +39,7 @@
     </view>
 
     <!-- 数据统计 -->
-    <view class="grid grid-cols-2 gap-16rpx m-24rpx">
+    <view class="home__stats">
       <view class="stat-card stat-card--uv">
         <image class="stat-card__icon" src="/static/icons/uv.svg" mode="aspectFit" />
         <view class="stat-card__header">
@@ -79,7 +79,7 @@
           </view>
         </view>
       </view>
-      <view class="w-full h-600rpx px-20rpx box-border">
+      <view class="chart-wrapper__canvas">
         <qiun-data-charts
           type="area"
           :chartData="chartData"
@@ -118,20 +118,20 @@ interface NavItem {
 
 const userStore = useUserStore();
 const themeStore = useThemeStore();
-const { handleNavClick } = useNavigation();
+const { navigate } = useNavigation();
 
 const activeSlideIndex = ref(0);
 const trendDays = ref(7);
 
 const swiperList = ref(["https://www.youlai.tech/storage/youlai/bg02.png"]);
 
-/** 访问概览数据 */
+// 访问概览数据
 const visitOverviewData = ref<VisitOverview>({
   todayUvCount: 0,
   todayPvCount: 0,
 } as VisitOverview);
 
-/** 通知公告文本 */
+// 公告列表：只取前两条拼成滚动文案
 const noticeList = ref<NoticeItem[]>([]);
 const noticeText = computed(() => {
   const titles = noticeList.value
@@ -141,30 +141,19 @@ const noticeText = computed(() => {
   return titles.length ? titles.join("    ") : "暂无通知";
 });
 
-const userPerms = computed(() => userStore.userInfo?.perms || []);
 const isAuthenticated = computed(() => userStore.isAuthenticated);
-const hasAnyPerm = computed(() => userPerms.value.length > 0);
 
-/** 默认菜单（未登录时显示） */
-const defaultNavList = computed(() => {
+// 快捷入口最多展示的数量
+const QUICK_NAV_LIMIT = 4;
+
+// 快捷入口：未登录时展示前几个作为引导，点击后统一跳登录页；
+// 已登录按权限过滤，不足 4 个就显示多少
+const quickNavList = computed<NavItem[]>(() => {
   const result: NavItem[] = [];
   for (const group of workMenuGroups) {
     for (const item of group.children) {
-      result.push(item);
-      if (result.length >= 4) return result;
-    }
-  }
-  return result;
-});
-
-/** 快捷入口：已登录按权限过滤，未登录显示默认菜单 */
-const quickNavList = computed(() => {
-  if (!isAuthenticated.value || !hasAnyPerm.value) return defaultNavList.value;
-  const result: NavItem[] = [];
-  for (const group of workMenuGroups) {
-    for (const item of group.children) {
-      if (hasPermission(item.perm)) result.push(item);
-      if (result.length >= 4) return result;
+      if (!isAuthenticated.value || hasPermission(item.perm)) result.push(item);
+      if (result.length >= QUICK_NAV_LIMIT) return result;
     }
   }
   return result;
@@ -190,7 +179,7 @@ const chartOpts = computed(() => ({
   },
 }));
 
-/** 加载通知公告 */
+// 加载公告：未登录不发请求，直接清空列表
 async function loadNoticeData() {
   if (!isAuthenticated.value) {
     noticeList.value = [];
@@ -204,14 +193,14 @@ async function loadNoticeData() {
   }
 }
 
-/** 加载访问概览统计 */
+// 加载访问概览：失败保留初始值，不打断页面
 function loadVisitOverviewData() {
   LogAPI.getVisitOverview()
     .then((data) => (visitOverviewData.value = data))
     .catch(() => {});
 }
 
-/** 加载访问趋势图表 */
+// 加载访问趋势：按当前天数取数，失败回落到空图表
 async function loadVisitTrendData() {
   const endDate = dayjs().format("YYYY-MM-DD");
   const startDate = dayjs()
@@ -233,21 +222,33 @@ async function loadVisitTrendData() {
   }
 }
 
-/** 快捷导航点击（未登录跳转登录） */
-function handleNavClickWithGuard(item: NavItem) {
-  if (!isAuthenticated.value || !hasAnyPerm.value) {
-    uni.navigateTo({ url: "/pages/login/index" });
+// 快捷导航点击：未登录先跳登录页，已登录按权限跳转
+function handleNavItemClick(item: NavItem) {
+  if (!isAuthenticated.value) {
+    navigateToLogin();
     return;
   }
-  handleNavClick(item);
+  navigate(item);
 }
 
-/** 跳转通知公告列表 */
+// 跳登录页并带上来路，登录成功后原路返回
+function navigateToLogin() {
+  const pages = getCurrentPages();
+  const currentPage = pages[pages.length - 1];
+  const redirect = encodeURIComponent(`/${currentPage.route}`);
+  uni.navigateTo({ url: `/pages/login/index?redirect=${redirect}` });
+}
+
+// 公告页需要登录态，未登录先跳登录页
 function handleNoticeClick() {
+  if (!isAuthenticated.value) {
+    navigateToLogin();
+    return;
+  }
   uni.navigateTo({ url: "/subPages/work/notice/index" });
 }
 
-/** 切换趋势时间范围 */
+// 切换趋势范围：同一范围重复点击不发请求
 function switchRange(value: number) {
   if (trendDays.value === value) return;
   trendDays.value = value;
@@ -265,15 +266,6 @@ onShow(() => {
 });
 </script>
 
-<!-- 非 scoped：覆盖 wd-swiper 内部节点高度 -->
-<style lang="scss">
-.swiper-box,
-.swiper-box .wd-swiper__item,
-.swiper-box image {
-  height: 420rpx;
-}
-</style>
-
 <style lang="scss" scoped>
 .hero-fade {
   position: absolute;
@@ -291,6 +283,14 @@ onShow(() => {
   );
 }
 
+/* 统计卡片网格：一组布局样式集中在这里，模板只留一个语义类 */
+.home__stats {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 16rpx;
+  margin: 24rpx;
+}
+
 .chart-wrapper {
   box-sizing: border-box;
   overflow: hidden;
@@ -299,6 +299,13 @@ onShow(() => {
   border-radius: 16rpx;
   box-shadow: var(--shadow-sm);
 
+  &__canvas {
+    box-sizing: border-box;
+    width: 100%;
+    height: 600rpx;
+    padding: 0 20rpx;
+  }
+
   &__header {
     display: flex;
     gap: 24rpx;
diff --git a/src/pages/login/components/bind-mobile-popup.vue b/src/pages/login/components/BindMobilePopup.vue
similarity index 85%
rename from src/pages/login/components/bind-mobile-popup.vue
rename to src/pages/login/components/BindMobilePopup.vue
index 132c450..0a569ef 100644
--- a/src/pages/login/components/bind-mobile-popup.vue
+++ b/src/pages/login/components/BindMobilePopup.vue
@@ -33,11 +33,13 @@
           <view
             class="bind-mobile__code-btn"
             :class="
-              countdown > 0 ? 'bind-mobile__code-btn--disabled' : 'bind-mobile__code-btn--active'
+              remainingSeconds > 0
+                ? 'bind-mobile__code-btn--disabled'
+                : 'bind-mobile__code-btn--active'
             "
             @click="handleSendCode"
           >
-            {{ countdown > 0 ? `${countdown}s` : "获取验证码" }}
+            {{ remainingSeconds > 0 ? `${remainingSeconds}s` : "获取验证码" }}
           </view>
         </view>
 
@@ -75,15 +77,21 @@ const emit = defineEmits<{
 
 const toast = useToast();
 const userStore = useUserStore();
-const { countdown, sendCode, resetCountdown } = useSmsLoginCode();
+const { remainingSeconds, sendCode, resetCountdown } = useSmsLoginCode();
 
 const mobile = ref("18888888888");
 const code = ref("");
 const isSubmitting = ref(false);
-/** 待绑定的微信 openid，由父组件通过 open 传入 */
+// 待绑定的微信 openid，由父组件通过 open 传入，不随表单清理
 let openid = "";
 
-/** 打开弹窗并记录待绑定的 openid */
+/**
+ * 打开绑定弹窗
+ *
+ * 重置手机号与验证码（避免上一次输入残留），并记录待绑定的 openid。
+ *
+ * @param boundOpenid - 静默登录返回的微信 openid
+ */
 function open(boundOpenid: string) {
   openid = boundOpenid;
   mobile.value = "18888888888";
@@ -91,6 +99,7 @@ function open(boundOpenid: string) {
   visible.value = true;
 }
 
+// 关闭弹窗：停掉倒计时并清空验证码，手机号保留便于再次打开
 function handleClose() {
   resetCountdown();
   code.value = "";
@@ -100,6 +109,7 @@ async function handleSendCode() {
   await sendCode(mobile.value);
 }
 
+// 确认绑定：本地校验通过后换会话，成功后由父组件跳转
 async function handleConfirm() {
   if (isSubmitting.value) return;
   if (!isValidMobile(mobile.value)) {
@@ -167,7 +177,7 @@ defineExpose({ open });
 
   &--active {
     color: var(--color-primary);
-    background-color: var(--color-primary-light);
+    background-color: var(--color-primary-soft);
   }
 
   &--disabled {
diff --git a/src/pages/login/index.vue b/src/pages/login/index.vue
index 6e4fd35..8334cf8 100644
--- a/src/pages/login/index.vue
+++ b/src/pages/login/index.vue
@@ -7,7 +7,7 @@
     </view>
 
     <!-- 导航栏：透明悬浮于渐变背景上，返回逻辑由组件内聚（栈空时回首页） -->
-    <custom-navbar bg-color="transparent" placeholder />
+    <app-navbar background="transparent" placeholder />
 
     <!-- 主内容 -->
     <view class="login__body">
@@ -215,7 +215,7 @@ import { useUserStore } from "@/store/modules/user";
 import { useSmsLoginCode, isValidMobile } from "@/composables/useSmsLoginCode";
 import { getErrorMessage } from "@/utils/error";
 import AuthAPI from "@/api/auth";
-import BindMobilePopup from "./components/bind-mobile-popup.vue";
+import BindMobilePopup from "./components/BindMobilePopup.vue";
 
 definePage({
   name: "login",
@@ -234,7 +234,7 @@ const isLoggingIn = ref(false);
 const isPwdVisible = ref(false);
 const hasAcceptedPolicy = ref(false);
 const loginMode = ref<"PASSWORD" | "SMS" | "WECHAT">("PASSWORD");
-const { countdown: smsCountdown, sendCode } = useSmsLoginCode();
+const { remainingSeconds: smsCountdown, sendCode } = useSmsLoginCode();
 
 const formData = ref({
   username: "admin",
@@ -397,12 +397,12 @@ const handleSendCode = async () => {
   await sendCode(formData.value.username);
 };
 
-// 微信登录
-/** 微信手机号快捷填充按钮回调事件 */
+// 微信手机号快捷登录的事件载荷：手机号需要 code 换取，用户取消时为空
 interface WxPhoneLoginEvent {
   detail: { code?: string };
 }
 
+// 微信一键登录：未勾选协议时先弹协议确认，再继续换号流程
 const handleWechatPhoneLogin = async (e: WxPhoneLoginEvent) => {
   const phoneCode = e.detail.code;
   if (!hasAcceptedPolicy.value) {
@@ -410,7 +410,7 @@ const handleWechatPhoneLogin = async (e: WxPhoneLoginEvent) => {
     return;
   }
   if (!phoneCode) {
-    await handleWechatSilentLogin();
+    await doWechatSilentLogin();
     return;
   }
   await doWechatPhoneLogin(phoneCode);
@@ -418,7 +418,7 @@ const handleWechatPhoneLogin = async (e: WxPhoneLoginEvent) => {
 
 async function doWechatPhoneLogin(phoneCode: string) {
   if (!phoneCode) {
-    await handleWechatSilentLogin();
+    await doWechatSilentLogin();
     return;
   }
   isLoggingIn.value = true;
@@ -429,13 +429,13 @@ async function doWechatPhoneLogin(phoneCode: string) {
     await completeLogin();
   } catch {
     toast.info("正在尝试其他登录方式...");
-    await handleWechatSilentLogin();
+    await doWechatSilentLogin();
   } finally {
     isLoggingIn.value = false;
   }
 }
 
-const handleWechatSilentLogin = async () => {
+const doWechatSilentLogin = async () => {
   isLoggingIn.value = true;
   try {
     const { code } = await uni.login();
@@ -453,12 +453,13 @@ const handleWechatSilentLogin = async () => {
   }
 };
 
-/** 绑定手机号成功后的会话初始化与跳转 */
+// 登录成功：补拉用户资料后回跳来源页面，延迟用于展示成功提示
 async function completeLogin() {
   await userStore.loadUserInfo();
   setTimeout(() => uni.reLaunch({ url: redirect.value }), 800);
 }
 
+// 协议入口：按类型区分用户协议与隐私政策
 const navigateToAgreement = (type: string) => {
   const url =
     type === "user"
@@ -482,7 +483,7 @@ onLoad((options) => {
     135deg,
     var(--color-bg-page) 0%,
     var(--color-bg-card) 50%,
-    var(--color-primary-light) 100%
+    var(--color-primary-soft) 100%
   );
 }
 
@@ -709,7 +710,7 @@ onLoad((options) => {
   border-radius: 16rpx;
   &--active {
     color: var(--color-primary);
-    background-color: var(--color-primary-light);
+    background-color: var(--color-primary-soft);
   }
 
   &--disabled {
diff --git a/src/pages/mine/components/menu-section.vue b/src/pages/mine/components/MenuSection.vue
similarity index 74%
rename from src/pages/mine/components/menu-section.vue
rename to src/pages/mine/components/MenuSection.vue
index e8061be..e45719b 100644
--- a/src/pages/mine/components/menu-section.vue
+++ b/src/pages/mine/components/MenuSection.vue
@@ -1,13 +1,8 @@
 <template>
   <view class="menu-section">
     <text class="menu-section__title">{{ title }}</text>
-    <view class="menu-list">
-      <view
-        v-for="item in items"
-        :key="item.key"
-        class="menu-row"
-        @click="emit('select', item.key)"
-      >
+    <view class="menu-section__list">
+      <view v-for="item in items" :key="item.id" class="menu-row" @click="emit('select', item.id)">
         <view class="menu-row__icon" :class="`menu-row__icon--${item.tone}`">
           <wd-icon :name="item.icon" size="18" :color="iconColors[item.tone]" />
         </view>
@@ -23,8 +18,14 @@
 </template>
 
 <script lang="ts" setup>
-export interface MenuItem {
-  key: string;
+/**
+ * 设置菜单项
+ *
+ * 只描述展示所需字段，跳转目标与动作由调用方的配置补充。
+ */
+export interface SettingsMenuItem {
+  /** 稳定标识，用于分发，不用展示文案 */
+  id: string;
   icon: string;
   tone: "primary" | "warning" | "danger" | "success" | "info";
   title: string;
@@ -32,9 +33,10 @@ export interface MenuItem {
   value?: string;
 }
 
-const iconColors: Record<MenuItem["tone"], string> = {
+// 语义色映射：tone 决定图标底色变体与图标颜色
+const iconColors: Record<SettingsMenuItem["tone"], string> = {
   primary: "var(--color-primary)",
-  warning: "var(--color-primary)",
+  warning: "var(--color-warning)",
   danger: "var(--color-danger)",
   success: "var(--color-success)",
   info: "var(--color-info)",
@@ -42,11 +44,16 @@ const iconColors: Record<MenuItem["tone"], string> = {
 
 defineProps<{
   title: string;
-  items: MenuItem[];
+  items: SettingsMenuItem[];
 }>();
 
+/**
+ * select：上报被点击项
+ *
+ * 载荷是菜单项 id 而不是标题，展示文案可能重复，不能作为标识。
+ */
 const emit = defineEmits<{
-  select: [key: string];
+  select: [id: string];
 }>();
 </script>
 
@@ -66,7 +73,7 @@ const emit = defineEmits<{
   }
 }
 
-.menu-list {
+.menu-section__list {
   overflow: hidden;
 }
 
@@ -91,11 +98,14 @@ const emit = defineEmits<{
   height: 72rpx;
   border-radius: 22rpx;
 
-  &--primary,
-  &--warning {
+  &--primary {
     background: var(--color-primary-alpha-15);
   }
 
+  &--warning {
+    background: var(--color-warning-light);
+  }
+
   &--danger {
     background: var(--color-danger-light);
   }
diff --git a/src/pages/mine/components/community-card.vue b/src/pages/mine/components/OfficialAccountCard.vue
similarity index 65%
rename from src/pages/mine/components/community-card.vue
rename to src/pages/mine/components/OfficialAccountCard.vue
index 7036780..16b46ea 100644
--- a/src/pages/mine/components/community-card.vue
+++ b/src/pages/mine/components/OfficialAccountCard.vue
@@ -1,31 +1,32 @@
 <template>
-  <view class="community-card" @click="emit('open')">
-    <image class="community-card__bg" src="/static/images/official-bg.png" mode="aspectFill" />
-    <view class="community-card__mask" />
-    <view class="community-card__logo">
-      <image src="/static/images/logo.png" mode="aspectFit" class="w-full h-full" />
+  <view class="official-card" @click="emit('open')">
+    <image class="official-card__bg" src="/static/images/official-bg.png" mode="aspectFill" />
+    <view class="official-card__mask" />
+    <view class="official-card__logo">
+      <image class="official-card__logo-img" src="/static/images/logo.png" mode="aspectFit" />
     </view>
-    <view class="community-card__body">
-      <view class="community-card__title-row">
-        <text class="community-card__title">关注有来技术</text>
-        <wd-tag type="success" plain custom-class="community-card__tag">官方社区</wd-tag>
+    <view class="official-card__body">
+      <view class="official-card__title-row">
+        <text class="official-card__title">关注有来技术</text>
+        <wd-tag type="success" variant="plain" custom-class="official-card__tag">官方社区</wd-tag>
       </view>
-      <text class="community-card__desc">开源更新、实战内容、交流群入口，统一在这里查看</text>
+      <text class="official-card__desc">开源更新、实战内容、交流群入口，统一在这里查看</text>
     </view>
-    <view class="community-card__arrow">
+    <view class="official-card__arrow">
       <wd-icon name="right" size="16" color="var(--color-text-secondary)" />
     </view>
   </view>
 </template>
 
 <script lang="ts" setup>
+/** open：请求进入公众号介绍页，目标地址由父级决定 */
 const emit = defineEmits<{
   open: [];
 }>();
 </script>
 
 <style lang="scss" scoped>
-.community-card {
+.official-card {
   position: relative;
   display: flex;
   gap: 24rpx;
@@ -37,7 +38,7 @@ const emit = defineEmits<{
   box-shadow: var(--shadow-md);
 }
 
-.community-card__bg {
+.official-card__bg {
   position: absolute;
   top: 0;
   right: 0;
@@ -47,10 +48,9 @@ const emit = defineEmits<{
   width: 100%;
   height: 100%;
   pointer-events: none;
-  opacity: 1;
 }
 
-.community-card__mask {
+.official-card__mask {
   position: absolute;
   top: 0;
   right: 0;
@@ -65,7 +65,7 @@ const emit = defineEmits<{
   );
 }
 
-.community-card__logo {
+.official-card__logo {
   position: relative;
   z-index: var(--z-content);
   box-sizing: border-box;
@@ -78,14 +78,19 @@ const emit = defineEmits<{
   box-shadow: var(--shadow-sm);
 }
 
-.community-card__body {
+.official-card__logo-img {
+  width: 100%;
+  height: 100%;
+}
+
+.official-card__body {
   position: relative;
   z-index: var(--z-content);
   flex: 1;
   min-width: 0;
 }
 
-.community-card__arrow {
+.official-card__arrow {
   position: relative;
   z-index: var(--z-content);
   display: flex;
@@ -97,14 +102,14 @@ const emit = defineEmits<{
   border-radius: 999rpx;
 }
 
-.community-card__title-row {
+.official-card__title-row {
   display: flex;
   gap: 16rpx;
   align-items: center;
   margin-top: 14rpx;
 }
 
-.community-card__title {
+.official-card__title {
   flex-shrink: 0;
   font-size: 32rpx;
   font-weight: 600;
@@ -114,14 +119,14 @@ const emit = defineEmits<{
 }
 
 /* wd-tag 外层是自定义组件节点，压掉其行高避免与标题错位 */
-.community-card__tag {
+.official-card__tag {
   display: flex;
   flex-shrink: 0;
   align-items: center;
   line-height: 1;
 }
 
-.community-card__desc {
+.official-card__desc {
   display: -webkit-box;
   margin-top: 10rpx;
   overflow: hidden;
diff --git a/src/pages/mine/components/profile-card.vue b/src/pages/mine/components/ProfileCard.vue
similarity index 70%
rename from src/pages/mine/components/profile-card.vue
rename to src/pages/mine/components/ProfileCard.vue
index 1de61f8..3286318 100644
--- a/src/pages/mine/components/profile-card.vue
+++ b/src/pages/mine/components/ProfileCard.vue
@@ -1,14 +1,14 @@
 <template>
   <view class="profile-card">
     <view class="profile-card__header">
-      <view class="profile-card__left" @click="emit('profile')">
+      <view class="profile-card__avatar-wrap" @click="emit('profile')">
         <image class="profile-card__avatar" :src="avatar" mode="aspectFill" lazy-load />
-        <view v-if="isAuthenticated" class="profile-card__online-dot" />
+        <view v-if="isAuthenticated" class="profile-card__auth-dot" />
       </view>
 
-      <view class="profile-card__main" @click="emit('profile')">
+      <view class="profile-card__info" @click="emit('profile')">
         <view class="profile-card__top">
-          <text class="profile-card__name">{{ name }}</text>
+          <text class="profile-card__name">{{ displayName }}</text>
         </view>
 
         <view v-if="isAuthenticated" class="profile-card__tags">
@@ -29,17 +29,13 @@
         <text v-else class="profile-card__hint">登录使用更多功能</text>
       </view>
 
-      <view
-        v-if="isAuthenticated"
-        class="profile-card__scan"
-        aria-label="扫一扫"
-        @click.stop="emit('scan')"
-      >
+      <!-- 组件内唯一的扫描入口：调起相机扫 PC 端登录二维码，登录在扫码确认页完成 -->
+      <view v-if="isAuthenticated" class="profile-card__scan" @click.stop="emit('scan')">
         <wd-icon name="scan" size="18" color="var(--color-text-inverse)" />
       </view>
 
-      <view v-else class="profile-card__action" @click.stop="emit('login')">
-        <wd-button custom-class="profile-card__button" size="small">立即登录</wd-button>
+      <view v-else class="profile-card__login" @click.stop="emit('login')">
+        <wd-button custom-class="profile-card__login-button" size="small">立即登录</wd-button>
       </view>
     </view>
   </view>
@@ -47,13 +43,20 @@
 
 <script lang="ts" setup>
 defineProps<{
+  /** 已登录时展示账号与部门，未登录展示登录入口 */
   isAuthenticated: boolean;
   avatar: string;
-  name: string;
+  /** 展示用昵称，区别于账号 username */
+  displayName: string;
   username: string;
   deptName: string;
 }>();
 
+/**
+ * profile / login / scan：只上报点击意图
+ *
+ * scan 表示请求调起扫码流程，票据校验与登录在扫码确认页完成。
+ */
 const emit = defineEmits<{
   profile: [];
   login: [];
@@ -62,18 +65,19 @@ const emit = defineEmits<{
 </script>
 
 <style lang="scss" scoped>
+/* 卡片落在 Hero 主色渐变上，前景固定白色：背景始终用半透明玻璃色，
+   不支持 backdrop-filter 时只是少了模糊，不会退化成白底白字 */
 .profile-card {
   position: relative;
   display: flex;
   padding: 28rpx 28rpx;
   overflow: hidden;
-  background: var(--color-bg-card-alpha-95);
+  background: linear-gradient(135deg, var(--color-glass) 0%, var(--color-glass-light) 100%);
   border: 1rpx solid var(--color-border-glass);
   border-radius: 28rpx;
   box-shadow: var(--shadow-md);
 
   @supports (backdrop-filter: blur(20px)) or (-webkit-backdrop-filter: blur(20px)) {
-    background: linear-gradient(135deg, var(--color-glass) 0%, var(--color-glass-light) 100%);
     -webkit-backdrop-filter: blur(20px);
     backdrop-filter: blur(20px);
   }
@@ -86,7 +90,7 @@ const emit = defineEmits<{
   width: 100%;
 }
 
-.profile-card__left {
+.profile-card__avatar-wrap {
   position: relative;
   flex-shrink: 0;
   width: 120rpx;
@@ -103,7 +107,8 @@ const emit = defineEmits<{
   box-shadow: var(--shadow-sm);
 }
 
-.profile-card__online-dot {
+/* 认证状态标识：依据登录态，不表示实时在线 */
+.profile-card__auth-dot {
   position: absolute;
   right: 4rpx;
   bottom: 4rpx;
@@ -114,7 +119,7 @@ const emit = defineEmits<{
   border-radius: 50%;
 }
 
-.profile-card__main {
+.profile-card__info {
   flex: 1;
   min-width: 0;
 }
@@ -153,21 +158,21 @@ const emit = defineEmits<{
   align-items: center;
   align-self: flex-start;
   justify-content: center;
-  width: 64rpx;
-  height: 64rpx;
+  width: 88rpx;
+  height: 88rpx;
   margin-left: auto;
   background: var(--color-glass-light);
   border: 1rpx solid var(--color-border-glass);
   border-radius: 999rpx;
 }
 
-.profile-card__action {
+.profile-card__login {
   flex-shrink: 0;
   align-self: center;
   margin-left: auto;
 }
 
-.profile-card__button {
+.profile-card__login-button {
   flex-shrink: 0;
   min-width: 156rpx;
   height: 72rpx;
diff --git a/src/pages/mine/components/quick-cards.vue b/src/pages/mine/components/QuickActions.vue
similarity index 88%
rename from src/pages/mine/components/quick-cards.vue
rename to src/pages/mine/components/QuickActions.vue
index e4d9481..555f7d5 100644
--- a/src/pages/mine/components/quick-cards.vue
+++ b/src/pages/mine/components/QuickActions.vue
@@ -1,7 +1,7 @@
 <template>
-  <view class="quick-cards">
+  <view class="quick-actions">
     <view class="quick-card" @click="emit('profile')">
-      <view class="quick-card__icon quick-card__icon--info">
+      <view class="quick-card__icon quick-card__icon--primary">
         <wd-icon name="user" size="28" color="var(--color-primary)" />
       </view>
       <view class="quick-card__body">
@@ -22,6 +22,7 @@
 </template>
 
 <script lang="ts" setup>
+/** profile / account：只上报点击意图，登录校验与跳转由父级决定 */
 const emit = defineEmits<{
   profile: [];
   account: [];
@@ -29,14 +30,13 @@ const emit = defineEmits<{
 </script>
 
 <style lang="scss" scoped>
-.quick-cards {
+.quick-actions {
   position: relative;
   z-index: var(--z-sticky);
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 20rpx;
   margin-top: 24rpx;
-  margin-bottom: 0;
 }
 
 .quick-card {
@@ -62,8 +62,8 @@ const emit = defineEmits<{
   height: 84rpx;
   border-radius: 22rpx;
 
-  &--info {
-    background: var(--color-primary-light);
+  &--primary {
+    background: var(--color-primary-soft);
   }
 
   &--success {
diff --git a/src/pages/mine/index.vue b/src/pages/mine/index.vue
index 3d71074..df84a43 100644
--- a/src/pages/mine/index.vue
+++ b/src/pages/mine/index.vue
@@ -1,42 +1,47 @@
 <template>
-  <view>
-    <view class="mine-hero" :style="{ paddingTop: `${navbar.totalHeight.value}px` }">
-      <custom-navbar
-        :bg-color="isScrolled ? headerBackground : 'transparent'"
+  <view class="mine">
+    <view class="mine__hero" :style="{ paddingTop: `${navbar.totalHeightPx.value}px` }">
+      <view class="mine__hero-bg" :style="{ background: heroGradient }" />
+
+      <app-navbar
+        :background="isScrolled ? heroGradient : 'transparent'"
         title-color="var(--color-text-inverse)"
         icon-color="var(--color-text-inverse)"
         :show-back="false"
         :placeholder="false"
       >
         <template #center>
-          <text class="mine-navbar__title">个人中心</text>
+          <text class="mine__navbar-title">个人中心</text>
         </template>
-      </custom-navbar>
+      </app-navbar>
 
-      <view class="mine-hero__content">
+      <view class="mine__hero-content">
         <profile-card
           :is-authenticated="isAuthenticated"
           :avatar="avatar"
-          :name="displayName"
+          :display-name="displayName"
           :username="username"
           :dept-name="deptName"
-          @profile="openProfile"
+          @profile="navigateToProfile"
           @login="navigateToLogin"
-          @scan="scanLogin"
+          @scan="scanForLogin"
         />
 
-        <view class="community-slot">
-          <view class="community-slot__bg" :style="{ background: headerBackground }" />
-          <community-card @open="openOfficialAccount" />
+        <view class="mine__community">
+          <official-account-card @open="navigateToOfficialAccount" />
         </view>
 
-        <quick-cards v-if="isAuthenticated" @profile="openProfile" @account="openAccount" />
+        <quick-actions
+          v-if="isAuthenticated"
+          @profile="navigateToProfile"
+          @account="navigateToAccountSecurity"
+        />
       </view>
     </view>
 
-    <view class="mine-body">
-      <menu-section title="系统工具" :items="toolMenus" @select="handleMenuSelect" />
-      <menu-section title="帮助与支持" :items="helpMenus" @select="handleMenuSelect" />
+    <view class="mine__body">
+      <menu-section title="系统工具" :items="toolMenuItems" @select="handleMenuSelect" />
+      <menu-section title="帮助与支持" :items="helpMenuItems" @select="handleMenuSelect" />
 
       <wd-button
         v-if="isAuthenticated"
@@ -44,19 +49,16 @@
         variant="plain"
         size="large"
         block
-        @click="confirmLogout"
+        :disabled="isLoggingOut"
+        @click="requestLogout"
       >
         退出登录
       </wd-button>
     </view>
 
-    <wd-loading
-      v-if="isClearing"
-      v-model="isClearing"
-      text="正在清理..."
-      mask
-      custom-class="loading-center"
-    />
+    <view v-if="isClearing" class="mine__cache-loading">
+      <wd-loading text="正在清理..." inherit-color />
+    </view>
   </view>
 </template>
 
@@ -66,14 +68,14 @@ import { onPageScroll, onShow } from "@dcloudio/uni-app";
 import { storeToRefs } from "pinia";
 import { useUserStore, useThemeStore } from "@/store";
 import { useRouter } from "uni-mini-router";
-import { useNavbar } from "@/composables/useNavbar";
+import { useNavbarMetrics } from "@/composables/useNavbarMetrics";
 import { useScanLogin } from "@/composables/useScanLogin";
 import { useLogout } from "@/composables/useLogout";
 import { useCacheCleaner } from "@/composables/useCacheCleaner";
-import ProfileCard from "./components/profile-card.vue";
-import CommunityCard from "./components/community-card.vue";
-import QuickCards from "./components/quick-cards.vue";
-import MenuSection, { type MenuItem } from "./components/menu-section.vue";
+import ProfileCard from "./components/ProfileCard.vue";
+import OfficialAccountCard from "./components/OfficialAccountCard.vue";
+import QuickActions from "./components/QuickActions.vue";
+import MenuSection, { type SettingsMenuItem } from "./components/MenuSection.vue";
 
 definePage({
   name: "mine",
@@ -81,14 +83,18 @@ definePage({
   layout: "tabbar",
 });
 
+// 菜单项：route 跳转页面，action 执行本地动作
+type SettingsMenuEntry = SettingsMenuItem &
+  ({ kind: "route"; target: string; requiresAuth?: boolean } | { kind: "action" });
+
 const userStore = useUserStore();
 const themeStore = useThemeStore();
 const router = useRouter();
-const navbar = useNavbar({ hasTabbar: true });
-const { scanLogin } = useScanLogin();
-const { confirmLogout } = useLogout();
+const navbar = useNavbarMetrics();
+const { scanForLogin } = useScanLogin();
+const { isLoggingOut, requestLogout } = useLogout();
 
-/** 滚动后导航栏补上渐变背景，否则内容会从透明导航栏下穿过 */
+// 滚动后导航栏补上背景，否则内容会从透明导航栏下穿过
 const isScrolled = ref(false);
 onPageScroll(({ scrollTop }) => {
   isScrolled.value = scrollTop > 0;
@@ -107,40 +113,51 @@ const displayName = computed(() =>
 const username = computed(() => userInfo.value?.username || "未设置账号");
 const deptName = computed(() => (isAuthenticated.value ? userInfo.value?.deptName || "" : ""));
 
-const headerBackground = computed(() => {
+// 主色渐变：Hero 画布与滚动后的导航栏共用一份，主题色为 6 位十六进制时叠加透明度
+const heroGradient = computed(() => {
   const color = themeStore.themeVars.colorTheme || "var(--color-primary)";
-  const colorWithAlpha = color.length === 7 ? `${color}E6` : color;
-  const colorWithAlpha2 = color.length === 7 ? `${color}CC` : color;
-  return `linear-gradient(135deg, ${colorWithAlpha} 0%, ${colorWithAlpha2} 100%)`;
+  const heroStartColor = color.length === 7 ? `${color}E6` : color;
+  const heroEndColor = color.length === 7 ? `${color}CC` : color;
+  return `linear-gradient(135deg, ${heroStartColor} 0%, ${heroEndColor} 100%)`;
 });
 
-const appVersion = ref("1.0.0");
-const {
-  usageText: storageUsageText,
-  isClearing,
-  loadUsage: loadStorageUsage,
-  clear: clearCache,
-} = useCacheCleaner();
+// 版本号：构建时注入，小程序端会被发布版本覆盖
+const appVersion = ref(import.meta.env.VITE_APP_VERSION);
+const { usageText: storageUsageText, isClearing, loadUsage, clearCache } = useCacheCleaner();
 
 // 常用功能在前，维护操作在后
-const toolMenus = computed<MenuItem[]>(() => [
+const toolMenuItems = computed<SettingsMenuEntry[]>(() => [
   {
-    key: "notice",
+    id: "notice",
+    kind: "route",
+    target: "/subPages/work/notice/index",
+    requiresAuth: true,
     icon: "notification",
     tone: "primary",
     title: "消息通知",
     desc: "查看系统通知与公告",
   },
-  { key: "theme", icon: "settings", tone: "primary", title: "主题设置", desc: "主题色与明暗模式" },
   {
-    key: "network",
+    id: "theme",
+    kind: "route",
+    target: "/subPages/mine/settings/theme/index",
+    icon: "settings",
+    tone: "primary",
+    title: "主题设置",
+    desc: "主题色与明暗模式",
+  },
+  {
+    id: "network",
+    kind: "route",
+    target: "/subPages/mine/settings/network/index",
     icon: "wifi",
     tone: "primary",
     title: "网络检测",
     desc: "检测网络与服务器连接",
   },
   {
-    key: "clear-cache",
+    id: "clear-cache",
+    kind: "action",
     icon: "delete",
     tone: "danger",
     title: "清理缓存",
@@ -149,16 +166,20 @@ const toolMenus = computed<MenuItem[]>(() => [
   },
 ]);
 
-const helpMenus = computed<MenuItem[]>(() => [
+const helpMenuItems = computed<SettingsMenuEntry[]>(() => [
   {
-    key: "agreement",
+    id: "agreement",
+    kind: "route",
+    target: "/subPages/mine/settings/agreement/index",
     icon: "file",
     tone: "success",
     title: "用户协议",
     desc: "了解产品使用规则",
   },
   {
-    key: "about",
+    id: "about",
+    kind: "route",
+    target: "/subPages/mine/about/index",
     icon: "info-circle",
     tone: "info",
     title: "关于系统",
@@ -167,146 +188,148 @@ const helpMenus = computed<MenuItem[]>(() => [
   },
 ]);
 
-const menuRoutes: Record<string, string> = {
-  notice: "/subPages/work/notice/index",
-  network: "/subPages/mine/settings/network/index",
-  theme: "/subPages/mine/settings/theme/index",
-  agreement: "/subPages/mine/settings/agreement/index",
-  about: "/subPages/mine/about/index",
-};
+// 菜单分发：先按 id 找到配置，再按 kind 走跳转或本地动作
+function handleMenuSelect(id: string) {
+  const entry = [...toolMenuItems.value, ...helpMenuItems.value].find((item) => item.id === id);
+  if (!entry) return;
 
-function handleMenuSelect(key: string) {
-  if (key === "clear-cache") {
+  if (entry.kind === "action") {
     clearCache();
     return;
   }
-  if (key === "notice" && !isAuthenticated.value) {
+  if (entry.requiresAuth && !isAuthenticated.value) {
     navigateToLogin();
     return;
   }
-  const path = menuRoutes[key];
-  if (path) {
-    router.push({ path });
-  }
+  router.push({ path: entry.target });
 }
 
-// 登录
-const navigateToLogin = () => {
+// 登录页带回跳地址，登录成功后原路返回
+function navigateToLogin() {
   const pages = getCurrentPages();
   const currentPage = pages[pages.length - 1];
   const currentPagePath = `/${currentPage.route}`;
   router.push({ path: "/pages/login/index", query: { redirect: currentPagePath } });
-};
+}
 
-const openProfile = () => {
+// 资料页要求登录，未登录先跳登录页
+function navigateToProfile() {
   if (!isAuthenticated.value) {
     navigateToLogin();
     return;
   }
   router.push({ path: "/subPages/mine/profile/index" });
-};
+}
 
-// 账号和安全
-const openAccount = () => {
+// 账号安全页要求登录，未登录先跳登录页
+function navigateToAccountSecurity() {
   if (!isAuthenticated.value) {
     navigateToLogin();
     return;
   }
   router.push({ path: "/subPages/mine/account/index" });
-};
+}
 
-// 有来技术公众号
-const openOfficialAccount = () => {
+// 公众号介绍页对游客开放，不需要登录
+function navigateToOfficialAccount() {
   uni.navigateTo({
     url: "/subPages/mine/official/index",
   });
-};
+}
 
+// 已登录但资料为空：token 在、userInfo 缺失的断档态由补拉修复
 const hasUserProfile = computed(() => {
   const info = userInfo.value;
   return !!(info && (info.userId || info.username || info.nickname));
 });
 
-const loadUserInfoIfNeeded = async () => {
-  // 已登录但资料未加载时补拉（loadUserInfo），专治「token 在、userInfo 空」的断档态
+// 资料未加载时补拉一次，失败不阻塞页面渲染
+async function ensureUserInfoLoaded() {
   if (!isAuthenticated.value || hasUserProfile.value) return;
   try {
     await userStore.loadUserInfo();
   } catch {
-    // ignore
+    // 补拉失败保持空态，下次 onShow 再试
   }
-};
+}
 
-const syncMiniProgramVersion = () => {
+// 小程序端版本号以发布版本为准，其他端取构建时注入的包版本
+function syncAppVersion() {
   // #ifdef MP-WEIXIN
-  appVersion.value = uni.getAccountInfoSync().miniProgram.version || "1.0.0";
+  appVersion.value = uni.getAccountInfoSync().miniProgram.version || appVersion.value;
   // #endif
-};
+}
 
 onShow(async () => {
-  await loadUserInfoIfNeeded();
-  await loadStorageUsage();
-  syncMiniProgramVersion();
+  await ensureUserInfoLoaded();
+  await loadUsage();
+  syncAppVersion();
 });
 </script>
 
 <style lang="scss" scoped>
-.mine-hero {
-  position: relative;
-  padding-bottom: 24rpx;
-  overflow: visible;
+.mine {
+  min-height: 100vh;
 }
 
-/* 渐变以社区卡片为锚点：底边压在卡片中线、上沿穿到导航栏后面，形成卡片被背景分割的效果 */
-.community-slot {
+.mine__hero {
   position: relative;
 }
 
-.community-slot__bg {
+/* Hero 画布由页面拥有：固定高度从屏幕顶部铺到社区卡片中线，不随卡片显隐或文案换行变化 */
+.mine__hero-bg {
   position: absolute;
-  right: -28rpx;
-  bottom: 50%;
-  left: -28rpx;
-  z-index: -1;
-  height: 800rpx;
+  top: 0;
+  right: 0;
+  left: 0;
+  z-index: var(--z-base);
+  height: 480rpx;
   pointer-events: none;
 }
 
-.mine-hero__content {
+.mine__hero-content {
   position: relative;
-  z-index: var(--z-sticky);
+  z-index: var(--z-content);
   display: flex;
   flex-direction: column;
   gap: 20rpx;
   padding: 20rpx 28rpx 0;
 }
 
-.mine-navbar__title {
+.mine__community {
+  position: relative;
+}
+
+.mine__navbar-title {
   font-size: 32rpx;
   font-weight: 600;
   color: var(--color-text-inverse);
   letter-spacing: 2rpx;
 }
 
-.mine-body {
+.mine__body {
   position: relative;
-  z-index: var(--z-base);
+  z-index: var(--z-content);
   display: flex;
   flex-direction: column;
   gap: 24rpx;
-  padding: 0 28rpx 40rpx;
-  margin-top: 0;
+  padding: 24rpx 28rpx 40rpx;
   background: var(--color-bg-page);
   border-top-left-radius: 48rpx;
   border-top-right-radius: 48rpx;
 }
 
-.loading-center {
+.mine__cache-loading {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: var(--z-overlay);
   display: flex;
-  flex-direction: column;
   align-items: center;
   justify-content: center;
+  color: var(--color-text-inverse);
   background: var(--color-overlay);
-  border-radius: 24rpx;
 }
 </style>
diff --git a/src/pages/work/index.vue b/src/pages/work/index.vue
index 3a27f9a..441d6c0 100644
--- a/src/pages/work/index.vue
+++ b/src/pages/work/index.vue
@@ -1,17 +1,15 @@
 <template>
   <view>
-    <custom-navbar title="工作台" :show-back="false" placeholder />
-    <!-- tabbar 壳为全出血（index/mine 的沉浸式头需要贴边），工作台网格用工具类补齐
-         横向 32rpx / 顶部 16rpx，与 default 壳的 .page 内边距保持一致 -->
+    <app-navbar title="工作台" :show-back="false" placeholder />
+    <!-- tabbar 壳为全出血（index/mine 的沉浸式头需要贴边），工作台网格需要自己补横向留白 -->
     <view class="px-32rpx pt-16rpx">
-      <template v-for="(item, index) in visibleGridList" :key="index">
+      <template v-for="(item, index) in visibleGroups" :key="index">
         <wd-card :title="item.title">
           <wd-grid clickable :column="4">
             <wd-grid-item
               v-for="(child, childIndex) in item.children"
               :key="childIndex"
-              use-slot
-              @click="handleNavClick(child)"
+              @click="navigate(child)"
             >
               <view class="p-2">
                 <image class="w-72rpx h-72rpx rounded-8rpx" :src="child.icon" />
@@ -29,7 +27,7 @@
 import { computed } from "vue";
 import { useNavigation } from "@/composables/useNavigation";
 import { workMenuGroups } from "@/config/work-menu";
-import { hasPermission as checkPermission } from "@/utils/permission";
+import { hasPermission } from "@/utils/permission";
 
 definePage({
   name: "work",
@@ -40,20 +38,20 @@ definePage({
   layout: "tabbar",
 });
 
-const { handleNavClick } = useNavigation();
+const { navigate } = useNavigation();
 
-// 检查是否有权限
-const hasPermission = (perm: string) => {
+// 无权限码的菜单视为公开入口，其余按当前账号的权限码判断
+const isMenuAllowed = (perm: string) => {
   if (!perm) return true;
-  return checkPermission(perm);
+  return hasPermission(perm);
 };
 
-// 根据权限过滤后的菜单列表
-const visibleGridList = computed(() => {
+// 根据权限过滤后的菜单分组，未授权分组整体不展示
+const visibleGroups = computed(() => {
   return workMenuGroups
     .map((group) => ({
       ...group,
-      children: group.children.filter((item) => hasPermission(item.perm)),
+      children: group.children.filter((item) => isMenuAllowed(item.perm)),
     }))
     .filter((group) => group.children.length > 0);
 });
diff --git a/src/store/modules/theme.ts b/src/store/modules/theme.ts
index d08ae85..dca731c 100644
--- a/src/store/modules/theme.ts
+++ b/src/store/modules/theme.ts
@@ -55,9 +55,7 @@ export const useThemeStore = defineStore("theme", () => {
 
   // 方法
 
-  /**
-   * 按当前主题状态同步导航栏颜色
-   */
+  /** 按当前主题状态同步导航栏颜色 */
   const syncNavigationBarTheme = () => {
     uni.setNavigationBarColor({
       frontColor: themeMode.value === "light" ? "#000000" : "#ffffff",
@@ -75,9 +73,7 @@ export const useThemeStore = defineStore("theme", () => {
     syncNavigationBarTheme();
   };
 
-  /**
-   * 在明暗两种模式间切换
-   */
+  /** 在明暗两种模式间切换 */
   const toggleThemeMode = () => {
     setThemeMode(themeMode.value === "light" ? "dark" : "light");
   };
@@ -91,9 +87,7 @@ export const useThemeStore = defineStore("theme", () => {
     Storage.set(THEME_COLOR_KEY, color);
   };
 
-  /**
-   * 初始化主题：同步导航栏（需等首个页面渲染完成，nextTick 保证时序）
-   */
+  /** 初始化主题：同步导航栏（需等首个页面渲染完成，nextTick 保证时序） */
   const initTheme = () => {
     nextTick(() => {
       syncNavigationBarTheme();
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index 57fcbab..07a31ac 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -51,27 +51,21 @@ export const useUserStore = defineStore("user", () => {
 
   // 登录方法
 
-  /**
-   * 账号密码登录
-   */
+  /** 账号密码登录 */
   const loginByPassword = async (data: PasswordLoginParams) => {
     const result = await AuthAPI.loginByPassword(data);
     setAccessToken(result.accessToken);
     return result;
   };
 
-  /**
-   * 短信验证码登录
-   */
+  /** 短信验证码登录 */
   const loginBySms = async (data: SmsLoginParams) => {
     const result = await AuthAPI.loginBySms(data);
     setAccessToken(result.accessToken);
     return result;
   };
 
-  /**
-   * 微信小程序静默登录
-   */
+  /** 微信小程序静默登录 */
   const loginByWxMa = async (code: string) => {
     const result = await AuthAPI.wxMaSilentLogin(code);
     if (result.accessToken) {
@@ -80,18 +74,14 @@ export const useUserStore = defineStore("user", () => {
     return result;
   };
 
-  /**
-   * 微信小程序一键登录（企业小程序）
-   */
+  /** 微信小程序一键登录（企业小程序） */
   const loginByWxMaPhone = async (data: WxMaPhoneLoginParams) => {
     const result = await AuthAPI.wxMaPhoneLogin(data);
     setAccessToken(result.accessToken);
     return result;
   };
 
-  /**
-   * 微信小程序绑定手机号
-   */
+  /** 微信小程序绑定手机号 */
   const bindMobileForWxMa = async (data: WxMaBindMobileParams) => {
     const result = await AuthAPI.wxMaBindMobile(data);
     setAccessToken(result.accessToken);
@@ -100,9 +90,7 @@ export const useUserStore = defineStore("user", () => {
 
   // 用户信息方法
 
-  /**
-   * 加载当前登录用户信息（请求接口、更新响应式状态、写入存储）
-   */
+  /** 加载当前登录用户信息（请求接口、更新响应式状态、写入存储） */
   const loadUserInfo = async () => {
     const data = await UserAPI.getCurrentUser();
     Storage.set(USER_INFO_KEY, data);
@@ -110,9 +98,7 @@ export const useUserStore = defineStore("user", () => {
     return data;
   };
 
-  /**
-   * 登出：远端退出 + 本地清理（内存与持久化）+ 跳转登录页（唯一导航入口）
-   */
+  /** 登出：远端退出 + 本地清理（内存与持久化）+ 跳转登录页（唯一导航入口） */
   const logout = async () => {
     try {
       await AuthAPI.logout();
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 0bd4115..e2bd880 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -34,13 +34,16 @@ body {
 // 1. default layout 自动包裹 .page —— 标准内容页：内边距 16rpx/32rpx、画布底色、满屏高
 // 2. tabbar layout 自动包裹 .page.page--tabbar —— tab 页：全出血 + 底部 tabbar 高度补偿
 // 3. blank layout 不包裹 —— 全出血页（登录/扫码确认/webview/监控）在 definePage 声明 layout: "blank"，
-//    页面自行管理背景与高度；状态栏/胶囊避让统一用 custom-navbar 的 placeholder
+//    页面自行管理背景与高度；状态栏/胶囊避让统一用 app-navbar 的 placeholder
 // 4. 唯一例外：work 页在 tabbar layout 下需要横向内边距，用工具类包裹（见该页注释）
 .page {
   box-sizing: border-box;
   min-height: 100vh;
   padding: 16rpx 32rpx 0;
   background-color: var(--color-bg-page);
+  // wd-card 默认带横向与底部外边距：页面 gutter 已提供横向留白，这里只保留底部间距
+  --wot-card-margin-horizontal: 0;
+  --wot-card-margin-bottom: 16rpx;
 }
 
 .page--tabbar {
@@ -56,32 +59,13 @@ body {
   overflow: hidden;
   background: var(--color-bg-card);
   border-radius: 16rpx;
-
-  .wd-drop-menu {
-    flex: 1;
-  }
-
-  .wd-drop-menu-item {
-    flex: 1;
-  }
 }
 
-// 全局 wd-card 间距
-.page .wd-card,
-.filter-bar .wd-card {
-  margin: 0;
-  margin-bottom: 16rpx;
-}
-
-// 弹窗底部按钮
+// 弹窗底部按钮：按钮用 block 撑满，容器只负责排列与间距
 .popup-actions {
   display: flex;
   gap: 16rpx;
   margin-top: 24rpx;
-
-  .wd-button {
-    flex: 1;
-  }
 }
 
 // 底部弹窗圆角
@@ -165,5 +149,3 @@ body {
 .color-text-placeholder {
   color: var(--color-text-placeholder);
 }
-
-
diff --git a/src/styles/theme.scss b/src/styles/theme.scss
index a2b583f..fd27c25 100644
--- a/src/styles/theme.scss
+++ b/src/styles/theme.scss
@@ -1,11 +1,13 @@
-// 明暗主题 CSS 变量，随 wot-design-uni 的 .wot-theme-dark 类切换
+// 明暗主题 CSS 变量，随 @wot-ui/ui 的 .wot-theme-dark 类切换
 
 // 浅色主题
 :root,
 page {
-  --z-dropdown: 100;
-  --z-sticky: 200;
-  --z-navbar: 700;
+  // 层级：页面内定位块 5 < wot 弹层(tabbar/popup/action-sheet) 10 < 下拉菜单 12 < 导航栏 15
+  // < dialog 99 < toast 100 < 全局操作遮罩 90（低于 toast，保证遮罩期间提示可见）
+  --z-sticky: 5;
+  --z-navbar: 15;
+  --z-overlay: 90;
 
   // 组件内分层：底图 0 < 遮罩 1 < 内容 2
   --z-base: 0;
@@ -14,7 +16,8 @@ page {
 
   // 语义色取 Arco 色板基色，-light 为配套的 90% 白浅底
   --color-primary: #165dff;
-  --color-primary-light: #e8efff;
+  // 主色柔和底：跟随主题色，由 app-provider 按所选主色注入 rgba
+  --color-primary-soft: #e8efff;
   --color-success: #00b42a;
   --color-success-light: #e6f8ea;
   --color-warning: #ff7d00;
@@ -71,14 +74,15 @@ page {
   --wot-button-radius-main: 24rpx;
   // 单元格点击态统一走项目填充色，避免各页面用 :deep 加 !important 硬压
   --wot-cell-bg-active: var(--color-fill-2);
-  --wot-fab-z-index: 999;
+  // 悬浮按钮压在页面内容之上、wot 弹层（10）之下
+  --wot-fab-z-index: 6;
 }
 
 // 暗色主题
 .wot-theme-dark {
-  // 基色与浅色主题一致，-light 转为 90% 深色底
+  // 基色与浅色主题一致，柔和底改为深色卡片上的低透明度叠加
   --color-primary: #165dff;
-  --color-primary-light: #151c2c;
+  --color-primary-soft: rgba(22, 93, 255, 0.16);
   --color-success: #00b42a;
   --color-success-light: #122417;
   --color-warning: #ff7d00;
diff --git a/src/subPages/mine/about/index.vue b/src/subPages/mine/about/index.vue
index 2f63465..392152d 100644
--- a/src/subPages/mine/about/index.vue
+++ b/src/subPages/mine/about/index.vue
@@ -25,21 +25,21 @@
           <wd-cell-group border>
             <wd-cell
               title="vue3-element-admin"
-              icon="desktop"
+              prefix-icon="desktop"
               clickable
               is-link
               @click="openProjectIntro('vue3-element-admin')"
             />
             <wd-cell
               title="vue3-element-admin-js"
-              icon="desktop"
+              prefix-icon="desktop"
               clickable
               is-link
               @click="openProjectIntro('vue3-element-admin-js')"
             />
             <wd-cell
               title="vue3-element-template"
-              icon="desktop"
+              prefix-icon="desktop"
               clickable
               is-link
               @click="openProjectIntro('vue3-element-template')"
@@ -51,7 +51,7 @@
           <wd-cell-group border>
             <wd-cell
               title="youlai-app"
-              icon="mobile"
+              prefix-icon="mobile"
               clickable
               is-link
               @click="openProjectIntro('youlai-app')"
@@ -63,42 +63,42 @@
           <wd-cell-group border>
             <wd-cell
               title="youlai-boot"
-              icon="cloud"
+              prefix-icon="cloud"
               clickable
               is-link
               @click="openProjectIntro('youlai-boot')"
             />
             <wd-cell
               title="youlai-gin"
-              icon="cloud"
+              prefix-icon="cloud"
               clickable
               is-link
               @click="openProjectIntro('youlai-gin')"
             />
             <wd-cell
               title="youlai-nest"
-              icon="cloud"
+              prefix-icon="cloud"
               clickable
               is-link
               @click="openProjectIntro('youlai-nest')"
             />
             <wd-cell
               title="youlai-django"
-              icon="cloud"
+              prefix-icon="cloud"
               clickable
               is-link
               @click="openProjectIntro('youlai-django')"
             />
             <wd-cell
               title="youlai-think"
-              icon="cloud"
+              prefix-icon="cloud"
               clickable
               is-link
               @click="openProjectIntro('youlai-think')"
             />
             <wd-cell
               title="youlai-aspnet"
-              icon="cloud"
+              prefix-icon="cloud"
               clickable
               is-link
               @click="openProjectIntro('youlai-aspnet')"
@@ -110,7 +110,7 @@
           <wd-cell-group border>
             <wd-cell
               title="youlai-boot-tenant"
-              icon="cloud"
+              prefix-icon="cloud"
               clickable
               is-link
               @click="openProjectIntro('youlai-boot-tenant')"
@@ -125,21 +125,21 @@
         <wd-cell
           title="官方网站"
           value="www.youlai.tech"
-          icon="link"
+          prefix-icon="link"
           clickable
-          @click="openUrl('https://www.youlai.tech')"
+          @click="openExternalUrl('https://www.youlai.tech')"
         />
         <wd-cell
           title="GitHub"
           value="github.com/youlaitech"
-          icon="link"
+          prefix-icon="link"
           clickable
-          @click="openUrl('https://github.com/youlaitech')"
+          @click="openExternalUrl('https://github.com/youlaitech')"
         />
         <wd-cell
           title="联系邮箱"
           value="youlaitech@163.com"
-          icon="email"
+          prefix-icon="email"
           clickable
           @click="copyText('youlaitech@163.com')"
         />
@@ -288,13 +288,14 @@ const openProjectIntro = (key: ProjectIntroKey) => {
 
 const goCurrentProjectRepo = () => {
   if (!currentProject.value) return;
-  openUrl(currentProject.value.repoUrl);
+  openExternalUrl(currentProject.value.repoUrl);
 };
 const getYear = () => {
   return new Date().getFullYear();
 };
 
-const openUrl = (url: string) => {
+// H5 新开标签打开，其余端复制链接到剪贴板
+const openExternalUrl = (url: string) => {
   // #ifdef H5
   window.open(url, "_blank");
   // #endif
@@ -321,6 +322,7 @@ onMounted(() => {
 
 <style lang="scss" scoped>
 .about {
+  // 项目名较长时按单元格标题截断，避免撑破右侧内容
   :deep(.wd-cell__title) {
     max-width: 360rpx;
     overflow: hidden;
diff --git a/src/subPages/mine/account/index.vue b/src/subPages/mine/account/index.vue
index 34fa95c..e50a82f 100644
--- a/src/subPages/mine/account/index.vue
+++ b/src/subPages/mine/account/index.vue
@@ -3,40 +3,46 @@
     <wd-card>
       <wd-cell-group border>
         <wd-cell
-          icon="safe"
+          prefix-icon="safe"
           title="账户密码"
           value="修改"
           is-link
-          @click="handleOpenDialog(DialogType.PASSWORD)"
+          @click="handleOpenPopup(SecurityAction.PASSWORD)"
         />
         <wd-cell
-          icon="mobile"
+          prefix-icon="mobile"
           title="绑定手机"
           :value="userProfile?.mobile || '未绑定手机号'"
           is-link
-          @click="handleOpenDialog(DialogType.MOBILE)"
+          @click="handleOpenPopup(SecurityAction.MOBILE)"
         />
         <wd-cell
-          icon="email"
+          prefix-icon="email"
           title="绑定邮箱"
           :value="userProfile?.email ? userProfile.email : '未绑定邮箱'"
           is-link
-          @click="handleOpenDialog(DialogType.EMAIL)"
+          @click="handleOpenPopup(SecurityAction.EMAIL)"
         />
         <!-- #ifdef MP-WEIXIN -->
-        <wd-cell icon="message" title="微信" value="解绑" is-link @click="handleUnbindWechat" />
+        <wd-cell
+          prefix-icon="message"
+          title="微信"
+          value="解绑"
+          is-link
+          @click="handleUnbindWechat"
+        />
         <!-- #endif -->
       </wd-cell-group>
     </wd-card>
 
     <!--用户信息编辑弹出框-->
     <wd-popup
-      v-model="dialog.visible"
+      v-model="popup.visible"
       position="bottom"
       custom-style="border-top-left-radius: 24rpx; border-top-right-radius: 24rpx;"
     >
       <wd-form
-        v-if="dialog.type === DialogType.PASSWORD"
+        v-if="popup.type === SecurityAction.PASSWORD"
         ref="passwordChangeFormRef"
         :model="passwordChangeForm"
         :schema="passwordRules"
@@ -70,11 +76,11 @@
           </wd-form-item>
         </wd-cell-group>
         <view class="p-24rpx">
-          <wd-button size="large" block @click="handleSubmit">提交</wd-button>
+          <wd-button size="large" block @click="handleSecuritySubmit">提交</wd-button>
         </view>
       </wd-form>
       <wd-form
-        v-if="dialog.type === DialogType.MOBILE"
+        v-if="popup.type === SecurityAction.MOBILE"
         ref="mobileBindingFormRef"
         :model="mobileBindingForm"
         :schema="mobileRules"
@@ -89,8 +95,7 @@
             <wd-input v-model="mobileBindingForm.code" clearable placeholder="请输入验证码">
               <template #suffix>
                 <wd-button
-                  type=""
-                  plain
+                  variant="plain"
                   :disabled="mobileCountdown > 0"
                   @click="handleSendVerificationCode('MOBILE')"
                 >
@@ -101,11 +106,11 @@
           </wd-form-item>
         </wd-cell-group>
         <view class="p-24rpx">
-          <wd-button size="large" block @click="handleSubmit">提交</wd-button>
+          <wd-button size="large" block @click="handleSecuritySubmit">提交</wd-button>
         </view>
       </wd-form>
       <wd-form
-        v-if="dialog.type === DialogType.EMAIL"
+        v-if="popup.type === SecurityAction.EMAIL"
         ref="emailBindingFormRef"
         :model="emailBindingForm"
         :schema="emailRules"
@@ -120,8 +125,7 @@
             <wd-input v-model="emailBindingForm.code" clearable placeholder="请输入验证码">
               <template #suffix>
                 <wd-button
-                  type=""
-                  plain
+                  variant="plain"
                   :disabled="emailCountdown > 0"
                   @click="handleSendVerificationCode('EMAIL')"
                 >
@@ -132,7 +136,7 @@
           </wd-form-item>
         </wd-cell-group>
         <view class="p-24rpx">
-          <wd-button size="large" block @click="handleSubmit">提交</wd-button>
+          <wd-button size="large" block @click="handleSecuritySubmit">提交</wd-button>
         </view>
       </wd-form>
     </wd-popup>
@@ -188,18 +192,20 @@ const emailRules = toFormSchema({
   code: [{ required: true, message: "请填写验证码" }],
 });
 
-enum DialogType {
+// 账号安全页可执行的动作：修改密码、绑定手机、绑定邮箱
+enum SecurityAction {
   PASSWORD = "password",
   MOBILE = "mobile",
   EMAIL = "email",
 }
 
-const dialog = reactive({
+const popup = reactive({
   visible: false,
-  type: "" as DialogType, // 修改账号资料,修改密码、绑定手机、绑定邮箱
+  type: "" as SecurityAction,
 });
 
-const userProfile = ref<UserProfile>(); //用户信息
+// 当前用户资料，用于展示微信绑定状态
+const userProfile = ref<UserProfile>();
 const passwordChangeForm = reactive<PasswordChangeForm>({});
 const mobileBindingForm = reactive<MobileBindingForm>({});
 const emailBindingForm = reactive<EmailBindingForm>({});
@@ -207,9 +213,10 @@ const passwordChangeFormRef = ref();
 const mobileBindingFormRef = ref();
 const emailBindingFormRef = ref();
 
-const { countdown: mobileCountdown, start: startMobileCountdown } = useCountdown(60);
-const { countdown: emailCountdown, start: startEmailCountdown } = useCountdown(60);
+const { remainingSeconds: mobileCountdown, start: startMobileCountdown } = useCountdown(60);
+const { remainingSeconds: emailCountdown, start: startEmailCountdown } = useCountdown(60);
 
+// 解绑微信：二次确认后调用接口，成功后重新拉取资料刷新绑定状态
 const handleUnbindWechat = async () => {
   try {
     await confirm({
@@ -225,40 +232,34 @@ const handleUnbindWechat = async () => {
   }
 };
 
-/** 加载用户信息 */
+// 加载用户资料
 const loadUserProfile = async () => {
   userProfile.value = await UserAPI.getProfile();
 };
 
-/**
- * 打开弹窗
- * @param type 弹窗类型 ACCOUNT: 账号资料 PASSWORD: 修改密码 MOBILE: 绑定手机 EMAIL: 绑定邮箱
- */
-const handleOpenDialog = (type: DialogType) => {
-  dialog.type = type;
-  dialog.visible = true;
+// 打开弹窗并清空对应表单，type 决定展示哪个表单
+const handleOpenPopup = (type: SecurityAction) => {
+  popup.type = type;
+  popup.visible = true;
   switch (type) {
-    case DialogType.PASSWORD:
+    case SecurityAction.PASSWORD:
       passwordChangeForm.oldPassword = "";
       passwordChangeForm.newPassword = "";
       passwordChangeForm.confirmPassword = "";
       break;
-    case DialogType.MOBILE:
+    case SecurityAction.MOBILE:
       mobileBindingForm.mobile = "";
       mobileBindingForm.code = "";
       break;
-    case DialogType.EMAIL:
+    case SecurityAction.EMAIL:
       emailBindingForm.email = "";
       emailBindingForm.code = "";
       break;
   }
 };
 
-/**
- *  发送验证码
- *
- * @param contactType 联系方式类型 MOBILE: 手机号码  EMAIL: 邮箱
- */
+// 发送验证码：先校验对应联系方式，成功后再启动该表单的倒计时
+// contactType 取 MOBILE 或 EMAIL，与接口参数保持一致
 const handleSendVerificationCode = async (contactType: string) => {
   try {
     if (contactType === "MOBILE") {
@@ -281,30 +282,30 @@ const handleSendVerificationCode = async (contactType: string) => {
   }
 };
 
-// 提交表单
-async function handleSubmit() {
+// 提交当前弹窗对应的表单：三个表单各自校验，成功后就地关闭弹窗
+async function handleSecuritySubmit() {
   try {
-    if (dialog.type === DialogType.PASSWORD) {
+    if (popup.type === SecurityAction.PASSWORD) {
       const { valid } = await passwordChangeFormRef.value.validate();
       if (valid) {
         await UserAPI.changePassword(passwordChangeForm);
         toast.info("密码修改成功");
-        dialog.visible = false;
+        popup.visible = false;
       }
-    } else if (dialog.type === DialogType.MOBILE) {
+    } else if (popup.type === SecurityAction.MOBILE) {
       const { valid } = await mobileBindingFormRef.value.validate();
       if (valid) {
         await UserAPI.bindMobile(mobileBindingForm);
         toast.info("手机号绑定成功");
-        dialog.visible = false;
+        popup.visible = false;
         loadUserProfile();
       }
-    } else if (dialog.type === DialogType.EMAIL) {
+    } else if (popup.type === SecurityAction.EMAIL) {
       const { valid } = await emailBindingFormRef.value.validate();
       if (valid) {
         await UserAPI.bindEmail(emailBindingForm);
         toast.info("邮箱绑定成功");
-        dialog.visible = false;
+        popup.visible = false;
         loadUserProfile();
       }
     }
diff --git a/src/subPages/mine/profile/complete-profile/index.vue b/src/subPages/mine/profile/complete-profile/index.vue
index 3e1d6ab..f71e544 100644
--- a/src/subPages/mine/profile/complete-profile/index.vue
+++ b/src/subPages/mine/profile/complete-profile/index.vue
@@ -59,7 +59,7 @@
           <input
             v-model="profileForm.nickname"
             type="nickname"
-            class="profile-form__nickname-input"
+            class="profile-form__input"
             placeholder="请输入昵称"
             :maxlength="20"
           />
@@ -68,7 +68,7 @@
           <wd-input
             v-model="profileForm.nickname"
             placeholder="请输入昵称"
-            custom-class="profile-form__nickname-input"
+            custom-class="profile-form__input"
           />
           <!-- #endif -->
         </view>
@@ -91,8 +91,7 @@
           <wd-input
             v-model="profileForm.mobile"
             placeholder="请输入手机号"
-            prop="mobile"
-            custom-class="profile-form__nickname-input"
+            custom-class="profile-form__input"
           />
         </view>
       </wd-form>
@@ -117,7 +116,7 @@
 
     <!-- 头像裁剪 -->
     <wd-img-cropper
-      v-model="cropperVisible"
+      v-model="isCropperVisible"
       :img-src="originalImageSrc"
       @confirm="handleAvatarConfirm"
     />
@@ -162,10 +161,11 @@ const formRules = toFormSchema({
 });
 
 const isLoading = ref(false);
-const cropperVisible = ref(false);
+const isCropperVisible = ref(false);
 const originalImageSrc = ref("");
 const profileFormRef = ref();
 
+// 提交按钮的可用条件：昵称与手机号都已填写
 const canComplete = computed(() => {
   return profileForm.nickname && profileForm.mobile;
 });
@@ -182,19 +182,17 @@ onLoad((options) => {
   }
 });
 
-/** 微信头像选择按钮回调事件（open-type="chooseAvatar"） */
-interface WxChooseAvatarEvent {
-  detail: { avatarUrl: string };
-}
-
-/** wd-img-cropper 裁剪确认事件 */
+// 头像裁剪确认事件：载荷是裁剪后的临时文件路径
 interface ImgCropperConfirmEvent {
   tempFilePath: string;
 }
 
-const handleChooseAvatar = async (e: WxChooseAvatarEvent) => {
+// 微信头像选择按钮回调：头像地址由平台下发，直接上传到文件服务
+const handleChooseAvatar = async (event: UniHelper.ButtonOnChooseavatarEvent) => {
+  const avatarUrl: string | undefined = event.detail?.avatarUrl;
+  if (!avatarUrl) return;
+
   try {
-    const { avatarUrl } = e.detail;
     toast.loading("上传中...");
     const fileInfo: FileInfo = await FileAPI.upload(avatarUrl);
     profileForm.avatar = fileInfo.url;
@@ -211,7 +209,7 @@ const chooseAvatar = () => {
     sourceType: ["album", "camera"],
     success: (res) => {
       originalImageSrc.value = res.tempFilePaths[0];
-      cropperVisible.value = true;
+      isCropperVisible.value = true;
     },
     fail: () => {
       toast.error("选择图片失败");
@@ -219,6 +217,7 @@ const chooseAvatar = () => {
   });
 };
 
+// 裁剪完成：上传裁剪后的头像并回填表单
 const handleAvatarConfirm = async (event: ImgCropperConfirmEvent) => {
   try {
     const { tempFilePath } = event;
@@ -231,6 +230,7 @@ const handleAvatarConfirm = async (event: ImgCropperConfirmEvent) => {
   }
 };
 
+// 提交完善信息：先写资料再绑手机号，成功后回跳来源页面
 const handleComplete = async () => {
   try {
     const { valid, errors } = await profileFormRef.value.validate();
@@ -262,6 +262,7 @@ const handleComplete = async () => {
   }
 };
 
+// 跳过完善：二次确认后直接回跳
 const handleSkip = async () => {
   try {
     await confirm({
@@ -316,7 +317,8 @@ const handleSkip = async () => {
     color: var(--color-danger);
   }
 
-  &__nickname-input {
+  // 输入框改成填充式外观：页面自绘表单项，不沿用 wd-input 的默认边框样式
+  &__input {
     :deep(.wd-input__inner) {
       padding: 24rpx 20rpx;
       background: var(--color-fill-1);
@@ -381,6 +383,7 @@ const handleSkip = async () => {
   .gender-radio {
     flex: 1;
 
+    // 单选项均分一行并居中显示
     :deep(.wd-radio) {
       justify-content: center;
       width: 100%;
@@ -392,6 +395,7 @@ const handleSkip = async () => {
   &__submit {
     margin-bottom: 30rpx;
 
+    // 提交按钮作为页面主动作，高度与字号单独放大
     :deep(.wd-button) {
       height: 88rpx;
       font-size: 32rpx;
diff --git a/src/subPages/mine/profile/index.vue b/src/subPages/mine/profile/index.vue
index a500954..be3db48 100644
--- a/src/subPages/mine/profile/index.vue
+++ b/src/subPages/mine/profile/index.vue
@@ -17,33 +17,31 @@
               />
             </view>
           </wd-cell>
-          <wd-cell title="昵称" :value="userProfile.nickname" is-link @click="openDialog()" />
+          <wd-cell title="昵称" :value="userProfile.nickname" is-link @click="openProfilePopup()" />
           <wd-cell
             title="性别"
             :value="userProfile.gender === 1 ? '男' : userProfile.gender === 2 ? '女' : '未知'"
             is-link
-            @click="openDialog()"
+            @click="openProfilePopup()"
           />
           <wd-cell title="用户名" :value="userProfile.username" />
           <wd-cell title="部门" :value="userProfile.deptName" />
           <wd-cell title="角色" :value="userProfile.roleNames" />
-          <view class="profile-last-cell-wrap">
-            <wd-cell title="创建日期" :value="userProfile.createTime" />
-          </view>
+          <wd-cell title="创建日期" :value="userProfile.createTime" />
         </wd-cell-group>
       </wd-card>
     </view>
 
     <!--头像裁剪-->
     <wd-img-cropper
-      v-if="avatarShow"
-      v-model="avatarShow"
+      v-if="isCropperVisible"
+      v-model="isCropperVisible"
       :img-src="originalSrc"
       @confirm="handleAvatarConfirm"
     />
 
     <!--用户信息编辑弹出框-->
-    <wd-popup v-if="dialogState.visible" v-model="dialogState.visible" position="bottom">
+    <wd-popup v-if="popup.visible" v-model="popup.visible" position="bottom">
       <wd-form
         ref="userProfileFormRef"
         :model="userProfileForm"
@@ -76,7 +74,7 @@
 <script setup lang="ts">
 import UserAPI, { type UserProfile, UserProfileForm } from "@/api/user";
 import FileAPI, { type FileInfo } from "@/api/file";
-import { checkLogin } from "@/utils/auth";
+import { ensureAuthenticated } from "@/utils/auth";
 import { getErrorMessage } from "@/utils/error";
 import { toFormSchema } from "@/utils/form-schema";
 
@@ -86,11 +84,11 @@ definePage({
 });
 
 const toast = useToast();
-const originalSrc = ref<string>(""); //选取的原图路径
-const avatarShow = ref<boolean>(false); //显示头像裁剪
-const userProfile = ref<UserProfile>(); //用户信息
+const originalSrc = ref<string>("");
+const isCropperVisible = ref(false);
+const userProfile = ref<UserProfile>();
 
-/** 加载用户信息 */
+// 加载用户资料
 const loadUserProfile = async () => {
   userProfile.value = await UserAPI.getProfile();
 };
@@ -101,12 +99,11 @@ function handleAvatarUpload() {
     count: 1,
     success: (res) => {
       originalSrc.value = res.tempFilePaths[0];
-      avatarShow.value = true;
+      isCropperVisible.value = true;
     },
   });
 }
-// 头像裁剪完成
-/** wd-img-cropper 裁剪确认事件 */
+// 头像裁剪完成事件：载荷是裁剪后的临时文件路径
 interface ImgCropperConfirmEvent {
   tempFilePath: string;
 }
@@ -136,20 +133,16 @@ const rules = toFormSchema({
   gender: [{ required: true, message: "请选择性别" }],
 });
 
-const dialogState = reactive({
+const popup = reactive({
   visible: false,
 });
 
 const userProfileForm = reactive<UserProfileForm>({});
 const userProfileFormRef = ref();
 
-/**
- * 打开弹窗
- * @param type 弹窗类型 ACCOUNT: 账号资料 PASSWORD: 修改密码 MOBILE: 绑定手机 EMAIL: 绑定邮箱
- */
-const openDialog = () => {
-  dialogState.visible = true;
-  // 初始化表单数据
+// 打开资料编辑弹窗，并用当前资料回填表单
+const openProfilePopup = () => {
+  popup.visible = true;
   userProfileForm.nickname = userProfile.value?.nickname;
   userProfileForm.gender = userProfile.value?.gender;
 };
@@ -160,7 +153,7 @@ function handleSubmit() {
     if (valid) {
       UserAPI.updateProfile(userProfileForm).then(() => {
         toast.info("账号资料修改成功");
-        dialogState.visible = false;
+        popup.visible = false;
         loadUserProfile();
       });
     }
@@ -169,7 +162,7 @@ function handleSubmit() {
 
 // 检查登录状态
 onLoad(() => {
-  if (!checkLogin()) return;
+  if (!ensureAuthenticated()) return;
 
   // #ifdef H5
   document.addEventListener("touchstart", handleTouchStart, { passive: false });
diff --git a/src/subPages/mine/scan-confirm/index.vue b/src/subPages/mine/scan-confirm/index.vue
index 2dd61b6..7bb6b6f 100644
--- a/src/subPages/mine/scan-confirm/index.vue
+++ b/src/subPages/mine/scan-confirm/index.vue
@@ -1,36 +1,55 @@
 <template>
   <view class="scan-confirm">
-    <custom-navbar title="扫码登录确认" placeholder />
+    <app-navbar title="扫码登录确认" placeholder />
 
     <view class="scan-confirm__body">
       <view class="scan-confirm__card">
         <image class="scan-confirm__logo" src="/static/images/logo.png" mode="aspectFit" />
-        <text class="scan-confirm__tip">PC 端扫码登录</text>
-        <text class="scan-confirm__user">{{ scanResult?.nickname || "未知用户" }}</text>
-        <text class="scan-confirm__hint">是否确认在 PC 端登录？</text>
 
-        <view class="scan-confirm__actions">
-          <wd-button
-            type="error"
-            plain
-            block
-            :disabled="!scanResult"
-            :loading="isCancelling"
-            @click="handleCancel"
-          >
-            取消登录
-          </wd-button>
-          <wd-button block :disabled="!scanResult" :loading="isLoading" @click="handleConfirm">
-            确认登录
-          </wd-button>
-        </view>
+        <template v-if="status === 'invalid'">
+          <text class="scan-confirm__user">二维码不可用</text>
+          <text class="scan-confirm__hint">二维码已过期或已被使用，请重新扫描</text>
+          <view class="scan-confirm__actions">
+            <wd-button block @click="handleBackToScan">重新扫码</wd-button>
+          </view>
+        </template>
+
+        <template v-else>
+          <text class="scan-confirm__tip">PC 端扫码登录</text>
+          <wd-loading v-if="status === 'verifying'" text="正在校验二维码" />
+          <template v-else>
+            <text class="scan-confirm__user">{{ scanResult?.nickname || "未知用户" }}</text>
+            <text class="scan-confirm__hint">是否确认在 PC 端登录？</text>
+          </template>
+
+          <view class="scan-confirm__actions">
+            <wd-button
+              type="danger"
+              variant="plain"
+              block
+              :disabled="status !== 'ready'"
+              :loading="status === 'cancelling'"
+              @click="handleCancel"
+            >
+              取消登录
+            </wd-button>
+            <wd-button
+              block
+              :disabled="status !== 'ready'"
+              :loading="status === 'confirming'"
+              @click="handleConfirm"
+            >
+              确认登录
+            </wd-button>
+          </view>
+        </template>
       </view>
     </view>
   </view>
 </template>
 
 <script lang="ts" setup>
-import { onLoad } from "@dcloudio/uni-app";
+import { onLoad, onUnload } from "@dcloudio/uni-app";
 import { useToast } from "@wot-ui/ui";
 import { getErrorMessage } from "@/utils/error";
 import AuthAPI, { type QrCodeScanResult } from "@/api/auth";
@@ -41,69 +60,92 @@ definePage({
   layout: "blank",
 });
 
+// 页面阶段：校验中 / 可操作 / 确认中 / 取消中 / 有效票据已处理完
+// 确认与取消共用同一状态，任一请求进行中或已处理完时都不再接受新的提交
+type ScanConfirmStatus =
+  "verifying" | "ready" | "confirming" | "cancelling" | "finished" | "invalid";
+
 const toast = useToast();
 
-// toast 停留时长，读完提示再返回上一页
-const TOAST_DURATION = 800;
+// 结果提示读完再返回上一页的延迟（毫秒）
+const RETURN_DELAY_MS = 800;
 
-// 确认按钮 loading 态，防止连点重复确认
-const isLoading = ref(false);
-// 取消按钮 loading 态，防止连点重复取消
-const isCancelling = ref(false);
+const status = ref<ScanConfirmStatus>("verifying");
 // 从扫码入口经 query 传入的票据
 const ticket = ref("");
-// scan 接口返回的脱敏用户信息，请求完成前按钮保持禁用
+// scan 接口返回的脱敏用户信息
 const scanResult = ref<QrCodeScanResult | null>(null);
+// 返回定时器：页面卸载时清理，避免离开后仍触发 navigateBack
+let returnTimer: ReturnType<typeof setTimeout> | null = null;
 
-// 进入页面先标记已扫码，让 PC 端立即显示「已扫码」并展示头像/昵称
-const markScanned = async (code: string) => {
+// 延迟返回上一页，让结果提示有可读时间
+function scheduleReturn(delay = RETURN_DELAY_MS) {
+  returnTimer = setTimeout(() => uni.navigateBack(), delay);
+}
+
+// 标记已扫码：让 PC 端立即显示「已扫码」并展示头像与昵称
+async function markScanned(code: string) {
   try {
     scanResult.value = await AuthAPI.markQrLoginScanned(code);
+    status.value = "ready";
   } catch (error) {
+    status.value = "invalid";
     toast.error(getErrorMessage(error, "二维码无效或已过期"));
-    setTimeout(() => uni.navigateBack(), TOAST_DURATION);
   }
-};
+}
 
-// 用户点击「确认登录」：授权 PC 端用该票据换取会话
-const handleConfirm = async () => {
-  if (isLoading.value) return;
-  isLoading.value = true;
+// 确认登录：授权 PC 端用该票据换取会话，失败退回可重试状态
+async function handleConfirm() {
+  if (status.value !== "ready") return;
+  status.value = "confirming";
   try {
     await AuthAPI.confirmQrLogin(ticket.value);
+    status.value = "finished";
     toast.success("已确认登录");
-    setTimeout(() => uni.navigateBack(), TOAST_DURATION);
+    scheduleReturn();
   } catch (error) {
     toast.error(getErrorMessage(error, "确认失败"));
-  } finally {
-    isLoading.value = false;
+    status.value = "ready";
   }
-};
+}
 
-// 用户点击「取消登录」：撤回扫码，PC 端状态变为 CANCELED
-const handleCancel = async () => {
-  if (isCancelling.value) return;
-  isCancelling.value = true;
+// 取消登录：撤回扫码，无论接口成败都结束本次流程并返回
+async function handleCancel() {
+  if (status.value !== "ready") return;
+  status.value = "cancelling";
   try {
     await AuthAPI.cancelQrLogin(ticket.value);
     toast.info("已取消登录");
   } catch {
-    // 取消失败不影响返回
+    // 撤回失败不影响返回，PC 端二维码超时后自动失效
   } finally {
-    setTimeout(() => uni.navigateBack(), TOAST_DURATION);
+    status.value = "finished";
+    scheduleReturn();
   }
-};
+}
+
+// 无效二维码时返回扫码入口重新扫描
+function handleBackToScan() {
+  uni.navigateBack();
+}
 
 onLoad((options) => {
   const code = options?.ticket ? decodeURIComponent(options.ticket) : "";
   if (!code) {
+    status.value = "invalid";
     toast.error("二维码无效");
-    setTimeout(() => uni.navigateBack(), TOAST_DURATION);
     return;
   }
   ticket.value = code;
   markScanned(code);
 });
+
+onUnload(() => {
+  if (returnTimer !== null) {
+    clearTimeout(returnTimer);
+    returnTimer = null;
+  }
+});
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/subPages/mine/settings/network/index.vue b/src/subPages/mine/settings/network/index.vue
index 2db3a7a..35223f1 100644
--- a/src/subPages/mine/settings/network/index.vue
+++ b/src/subPages/mine/settings/network/index.vue
@@ -1,13 +1,13 @@
 <template>
-  <view>
-    <view class="py-24rpx px-32rpx">
+  <view class="network">
+    <view class="pt-8rpx">
       <text class="network__tip-text">
-        温馨提示：点击下方「开始测试」按钮，即可自动检测当前网络延迟。
+        温馨提示：点击下方「开始测试」按钮，即可检测当前网络到接口服务的连接质量。
       </text>
     </view>
 
-    <view class="px-32rpx">
-      <wd-button block plain @click="startTest">开始测试</wd-button>
+    <view class="mt-16rpx">
+      <wd-button block variant="plain" :loading="isTesting" @click="startTest">开始测试</wd-button>
     </view>
 
     <view v-if="isTesting" class="network__loading">
@@ -15,16 +15,27 @@
       <text class="network__loading-text">正在测试中...</text>
     </view>
 
-    <view v-if="result !== null" class="px-32rpx">
+    <view v-if="result" class="network__result">
       <view class="result-card">
         <view class="result-card__header">测试结果</view>
         <view class="result-card__row">
-          <text style="color: var(--color-text-secondary)">网络延迟</text>
-          <text :class="['text-36rpx font-600', statusColor]">{{ result }}ms</text>
+          <text class="result-card__label">接口服务</text>
+          <text
+            class="result-card__value"
+            :class="result.reachable ? 'color-success' : 'color-danger'"
+          >
+            {{ result.reachable ? "可访问" : "不可访问" }}
+          </text>
         </view>
         <view class="result-card__row">
-          <text style="color: var(--color-text-secondary)">网络状态</text>
-          <text :class="['font-500', statusColor]">{{ statusText }}</text>
+          <text class="result-card__label">响应耗时</text>
+          <text class="text-36rpx font-600" :class="statusColor">
+            {{ result.costMs === null ? "--" : `${result.costMs}ms` }}
+          </text>
+        </view>
+        <view class="result-card__row">
+          <text class="result-card__label">网络状态</text>
+          <text class="font-500" :class="statusColor">{{ statusText }}</text>
         </view>
       </view>
     </view>
@@ -32,61 +43,76 @@
 </template>
 
 <script lang="ts" setup>
-import { onLoad } from "@dcloudio/uni-app";
-
 definePage({
   name: "network",
   style: { navigationBarTitleText: "网络检测" },
 });
 
-const result = ref<number | null>(null);
+// 一次探测的结果：可达性用布尔值，耗时单独记录，不可达时不参与质量分档
+interface ProbeResult {
+  reachable: boolean;
+  costMs: number | null;
+}
+
+const result = ref<ProbeResult | null>(null);
 const isTesting = ref(false);
 
+// 耗时分档：100ms 以内优秀，300ms 以内良好，500ms 以内一般，其余较差
 const statusText = computed(() => {
-  if (result.value == null) return "";
-  if (result.value < 100) return "优秀";
-  if (result.value < 300) return "良好";
-  if (result.value < 500) return "一般";
+  if (!result.value) return "";
+  if (!result.value.reachable) return "不可访问";
+  const cost = result.value.costMs ?? 0;
+  if (cost < 100) return "优秀";
+  if (cost < 300) return "良好";
+  if (cost < 500) return "一般";
   return "较差";
 });
 
 const statusColor = computed(() => {
-  if (result.value == null) return "";
-  if (result.value < 100) return "color-success";
-  if (result.value < 300) return "color-primary";
-  if (result.value < 500) return "color-warning";
+  if (!result.value) return "";
+  if (!result.value.reachable) return "color-danger";
+  const cost = result.value.costMs ?? 0;
+  if (cost < 100) return "color-success";
+  if (cost < 300) return "color-primary";
+  if (cost < 500) return "color-warning";
   return "color-danger";
 });
 
-const startTest = async () => {
+// 探测目标：与请求层同源，微信端用完整地址，其余端走代理前缀
+function getProbeUrl(): string {
+  let baseUrl = import.meta.env.VITE_APP_BASE_API;
+  // #ifdef MP-WEIXIN
+  baseUrl = import.meta.env.VITE_APP_API_URL;
+  // #endif
+  return `${baseUrl}/`;
+}
+
+// 探测接口服务地址：拿到响应即视为可达，状态码不参与判断
+async function startTest() {
+  if (isTesting.value) return;
+
   isTesting.value = true;
   result.value = null;
+  const startedAt = Date.now();
+
   try {
-    const startTime = Date.now();
-    // #ifdef MP-WEIXIN
-    await new Promise<void>((resolve) => {
-      wx.request({
-        url: "https://www.baidu.com",
+    await new Promise<void>((resolve, reject) => {
+      uni.request({
+        url: getProbeUrl(),
         method: "GET",
+        timeout: 10000,
+        // 接口服务地址本身没有业务数据，只要拿到响应即说明链路可达，状态码不参与判断
         success: () => resolve(),
-        fail: () => resolve(),
+        fail: (error) => reject(error),
       });
     });
-    // #endif
-    // #ifdef H5
-    await fetch("https://www.baidu.com", { mode: "no-cors" });
-    // #endif
-    result.value = Date.now() - startTime;
+    result.value = { reachable: true, costMs: Date.now() - startedAt };
   } catch {
-    result.value = 9999;
+    result.value = { reachable: false, costMs: null };
   } finally {
     isTesting.value = false;
   }
-};
-
-onLoad(() => {
-  uni.setNavigationBarTitle({ title: "网络测试" });
-});
+}
 </script>
 
 <style lang="scss" scoped>
@@ -113,6 +139,14 @@ onLoad(() => {
       border-top: 1rpx solid var(--color-border-light);
     }
   }
+
+  &__label {
+    color: var(--color-text-secondary);
+  }
+
+  &__value {
+    font-weight: 500;
+  }
 }
 
 .network__tip-text {
@@ -132,4 +166,8 @@ onLoad(() => {
   font-size: 24rpx;
   color: var(--color-text-secondary);
 }
+
+.network__result {
+  margin-top: 24rpx;
+}
 </style>
diff --git a/src/subPages/mine/settings/theme/index.vue b/src/subPages/mine/settings/theme/index.vue
index c3117ff..95924d1 100644
--- a/src/subPages/mine/settings/theme/index.vue
+++ b/src/subPages/mine/settings/theme/index.vue
@@ -46,7 +46,7 @@
       </wd-cell>
 
       <!-- 自定义颜色 -->
-      <wd-cell title="自定义颜色" is-link @click="showCustomInput">
+      <wd-cell title="自定义颜色" is-link @click="openCustomColorInput">
         <template #icon>
           <wd-icon name="edit" size="16" class="mr-12rpx" />
         </template>
@@ -62,7 +62,7 @@
             <text class="text-28rpx font-500" :style="{ color: currentPrimaryColor }">
               主题色文本
             </text>
-            <wd-tag type="primary" size="small" variant="filled">标签</wd-tag>
+            <wd-tag type="primary" size="small">标签</wd-tag>
           </view>
         </template>
       </wd-cell>
@@ -70,18 +70,20 @@
 
     <!-- 操作按钮 -->
     <view class="mt-32rpx">
-      <wd-button plain size="large" block @click="handleResetTheme">重置为默认主题</wd-button>
+      <wd-button variant="plain" size="large" block @click="handleResetTheme">
+        重置为默认主题
+      </wd-button>
     </view>
 
     <!-- 自定义颜色输入弹窗 -->
-    <wd-popup v-model="showCustomColorInput" position="bottom" custom-class="popup-bottom">
+    <wd-popup v-model="customColorInputVisible" position="bottom" custom-class="popup-bottom">
       <view class="popup-content">
         <view class="popup-header">
           <text class="popup-header__title">自定义主题色</text>
           <view
             class="w-64rpx h-64rpx flex-center rounded-full"
             hover-class="bg-[var(--color-text-placeholder)]/16"
-            @click="showCustomColorInput = false"
+            @click="customColorInputVisible = false"
           >
             <wd-icon name="close" size="18" class="color-text-secondary" />
           </view>
@@ -105,7 +107,9 @@
         </view>
 
         <view class="popup-footer">
-          <wd-button type="info" plain @click="showCustomColorInput = false">取消</wd-button>
+          <wd-button type="info" variant="plain" @click="customColorInputVisible = false">
+            取消
+          </wd-button>
           <wd-button @click="applyCustomColor">应用</wd-button>
         </view>
       </view>
@@ -122,7 +126,6 @@ definePage({
   style: { navigationBarTitleText: "主题设置" },
 });
 
-// 使用主题组合函数
 const { isDark, themeColorOptions, toggleThemeMode, setThemeColor, selectedThemeColor } =
   useTheme();
 
@@ -131,7 +134,7 @@ const { confirm } = useDialog();
 
 // 自定义颜色输入
 const customColor = ref("");
-const showCustomColorInput = ref(false);
+const customColorInputVisible = ref(false);
 
 // 当前生效的主题色主色
 const currentPrimaryColor = computed(() => selectedThemeColor.value.primary);
@@ -143,9 +146,9 @@ const handleSelectColor = (color: (typeof themeColorOptions)[0]) => {
   toast.success("主题色已更新");
 };
 
-// 显示自定义颜色输入
-const showCustomInput = () => {
-  showCustomColorInput.value = true;
+// 打开自定义颜色输入
+const openCustomColorInput = () => {
+  customColorInputVisible.value = true;
   customColor.value = currentPrimaryColor.value;
 };
 
@@ -165,7 +168,7 @@ const applyCustomColor = () => {
   }
 
   setThemeColor({ name: "自定义", value: "custom", primary: color });
-  showCustomColorInput.value = false;
+  customColorInputVisible.value = false;
   toast.success("自定义主题色已应用");
 };
 
diff --git a/src/subPages/work/components/ActionSheet.vue b/src/subPages/work/components/ActionSheet.vue
new file mode 100644
index 0000000..9840c9a
--- /dev/null
+++ b/src/subPages/work/components/ActionSheet.vue
@@ -0,0 +1,61 @@
+<template>
+  <wd-action-sheet v-model="visible" :actions="options" cancel-text="取消" @select="handleSelect" />
+</template>
+
+<script setup lang="ts">
+import { ref } from "vue";
+import { useToast } from "@wot-ui/ui";
+import { getErrorMessage } from "@/utils/error";
+
+/**
+ * 操作菜单命令
+ *
+ * id 是分发身份，label 只用于展示，两者不共用。
+ */
+export interface ActionSheetCommand {
+  id: string;
+  label: string;
+  color?: string;
+  /** 选中后执行的动作，返回的 Promise 会被分发处捕获 */
+  execute: () => void | Promise<void>;
+}
+
+const toast = useToast();
+
+/** 菜单显隐 */
+const visible = ref(false);
+/** 展示给 wd-action-sheet 的选项，name 填展示文案 */
+const options = ref<{ name: string; color?: string }[]>([]);
+// 与 options 同序的命令表，选中后按索引取回
+let commands: ActionSheetCommand[] = [];
+
+/**
+ * 展示操作菜单
+ *
+ * 列表为空说明当前账号没有可用操作，提示后不再弹出空菜单。
+ *
+ * @param list - 按当前账号权限拼装的操作命令
+ */
+function open(list: ActionSheetCommand[]) {
+  if (list.length === 0) {
+    toast.warning("暂无操作权限");
+    return;
+  }
+
+  commands = list;
+  options.value = list.map(({ label, color }) => ({ name: label, color }));
+  visible.value = true;
+}
+
+// 组件回传的是选项索引，按索引取回命令，不按展示文案反查；执行失败在此统一提示
+function handleSelect({ index }: { index: number }) {
+  const command = commands[index];
+  if (!command) return;
+
+  Promise.resolve(command.execute()).catch((error) => {
+    toast.error(getErrorMessage(error, "操作失败"));
+  });
+}
+
+defineExpose({ open, visible });
+</script>
diff --git a/src/subPages/work/components/custom-tree.vue b/src/subPages/work/components/TreeView.vue
similarity index 79%
rename from src/subPages/work/components/custom-tree.vue
rename to src/subPages/work/components/TreeView.vue
index ae02a29..ca2373e 100644
--- a/src/subPages/work/components/custom-tree.vue
+++ b/src/subPages/work/components/TreeView.vue
@@ -1,25 +1,25 @@
 <template>
-  <view class="custom-tree">
-    <view v-for="item in flatNodes" :key="item.value" class="custom-tree-node">
+  <view class="tree-view">
+    <view v-for="item in flatNodes" :key="item.value" class="tree-node">
       <view
-        class="custom-tree-node__content"
+        class="tree-node__content"
         :style="{ paddingLeft: item.level * 32 + 24 + 'rpx' }"
         @click="handleNodeClick(item)"
       >
         <!-- 展开/收起图标 -->
-        <view class="custom-tree-node__expand" @click.stop="handleExpand(item)">
+        <view class="tree-node__expand" @click.stop="handleExpand(item)">
           <wd-icon
             v-if="item.hasChildren"
             :name="isExpanded(item.value) ? 'arrow-down' : 'arrow-right'"
             size="14"
-            class="custom-tree-node__arrow"
-            :class="{ 'custom-tree-node__arrow--expanded': isExpanded(item.value) }"
+            class="tree-node__arrow"
+            :class="{ 'tree-node__arrow--expanded': isExpanded(item.value) }"
           />
-          <view v-else class="custom-tree-node__expand-placeholder" />
+          <view v-else class="tree-node__expand-placeholder" />
         </view>
 
         <!-- 多选框 -->
-        <view v-if="checkable" class="custom-tree-node__checkbox" @click.stop="handleCheck(item)">
+        <view v-if="checkable" class="tree-node__checkbox" @click.stop="handleCheck(item)">
           <wd-checkbox
             :model-value="isChecked(item.value)"
             :indeterminate="isIndeterminate(item.value)"
@@ -37,7 +37,7 @@
           :checked="isChecked(item.value)"
           :indeterminate="isIndeterminate(item.value)"
         >
-          <view class="custom-tree-node__label-wrapper">
+          <view class="tree-node__label-wrapper">
             <wd-icon
               v-if="item.hasChildren"
               name="folder"
@@ -47,17 +47,13 @@
               "
             />
             <wd-icon v-else name="file" size="16" class="color-text-secondary" />
-            <text class="custom-tree-node__label">{{ item.label }}</text>
+            <text class="tree-node__label">{{ item.label }}</text>
           </view>
         </slot>
 
         <!-- 操作按钮 -->
         <slot name="action" :node="item.raw" :level="item.level">
-          <view
-            v-if="showAction"
-            class="custom-tree-node__action"
-            @click.stop="handleNodeAction(item)"
-          >
+          <view v-if="showAction" class="tree-node__action" @click.stop="handleNodeAction(item)">
             <wd-icon name="more" size="16" class="color-text-secondary" />
           </view>
         </slot>
@@ -66,25 +62,35 @@
   </view>
 </template>
 
-<script lang="ts" setup>
+<script lang="ts" setup generic="T extends TreeOption">
 import { ref, computed, watch } from "vue";
 
+/**
+ * 树节点
+ *
+ * value 与 label 是树组件自身的字段，其余业务字段通过索引签名扩展，
+ * 由使用方按需声明具体类型。
+ */
 export interface TreeOption {
-  [key: string]: unknown;
   value: string;
   label: string;
+  /** 节点是否禁用 */
+  disabled?: boolean;
   children?: TreeOption[];
+  /** 业务扩展字段，由使用方声明具体类型 */
+  [key: string]: unknown;
 }
 
-interface FlatNode extends TreeOption {
+// 扁平化后的节点：原始节点 + 层级与子节点信息
+type FlatNode = T & {
   level: number;
   hasChildren: boolean;
-  raw: TreeOption;
-}
+  raw: T;
+};
 
 interface Props {
   /** 树形数据源 */
-  data?: TreeOption[];
+  data?: T[];
   /** 节点值的字段名 */
   valueKey?: string;
   /** 节点标签的字段名 */
@@ -120,18 +126,29 @@ const props = withDefaults(defineProps<Props>(), {
 
 const emit = defineEmits<{
   /** 点击节点时触发 */
-  (_e: "click", _node: TreeOption): void;
+  (_e: "click", _node: T): void;
   /** 展开/收起节点时触发 */
-  (_e: "expand", _node: TreeOption, _expanded: boolean): void;
+  (_e: "expand", _node: T, _expanded: boolean): void;
   /** 点击操作按钮时触发 */
-  (_e: "action", _node: TreeOption): void;
+  (_e: "action", _node: T): void;
   /** 多选选中变化时触发 */
-  (_e: "check", _checkedKeys: string[], _info: { checked: boolean; node: TreeOption }): void;
+  (_e: "check", _checkedKeys: string[], _info: { checked: boolean; node: T }): void;
 }>();
 
-/** 展开的节点 key 集合 */
+defineSlots<{
+  content(_props: {
+    node: T;
+    level: number;
+    expanded: boolean;
+    checked: boolean;
+    indeterminate: boolean;
+  }): unknown;
+  action(_props: { node: T; level: number }): unknown;
+}>();
+
+// 展开的节点 key 集合
 const expandedKeys = ref<Set<string>>(new Set(props.defaultExpandedKeys));
-/** 选中的节点 key 集合（多选模式，内部维护） */
+// 选中的节点 key 集合：多选状态下内部维护，不直接写回 props.checkedKeys
 const internalCheckedKeys = ref<Set<string>>(new Set(props.checkedKeys));
 
 // 监听外部 checkedKeys 变化
@@ -143,12 +160,12 @@ watch(
   { immediate: true }
 );
 
-/** 扁平化树结构，根据展开状态计算可见节点 */
+// 扁平化树结构：只展开集合内的节点，未展开的分支不下发
 const flatNodes = computed(() => {
   const result: FlatNode[] = [];
-  function traverse(nodes: TreeOption[], level: number) {
+  function traverse(nodes: T[], level: number) {
     for (const node of nodes) {
-      const children = node[props.childrenKey] as TreeOption[] | undefined;
+      const children = node[props.childrenKey] as T[] | undefined;
       result.push({
         ...node,
         value: String(node[props.valueKey]),
@@ -166,17 +183,17 @@ const flatNodes = computed(() => {
   return result;
 });
 
-/** 判断节点是否展开 */
+// 是否处于展开集合中
 function isExpanded(value: string) {
   return expandedKeys.value.has(value);
 }
 
-/** 处理节点点击 */
+// 节点点击：只上报原始业务节点，选中与跳转由使用方处理
 function handleNodeClick(node: FlatNode) {
   emit("click", node.raw);
 }
 
-/** 处理节点展开/收起 */
+// 展开/收起：无子节点的节点不可展开
 function handleExpand(node: FlatNode) {
   if (!node.hasChildren) return;
   const value = node.value;
@@ -190,17 +207,17 @@ function handleExpand(node: FlatNode) {
   emit("expand", node.raw, next.has(value));
 }
 
-/** 处理操作按钮点击 */
+// 操作按钮点击：上报原始节点，菜单内容由使用方按权限拼装
 function handleNodeAction(node: FlatNode) {
   emit("action", node.raw);
 }
 
-/** 判断节点是否选中（多选模式） */
+// 是否在多选集合中
 function isChecked(value: string) {
   return internalCheckedKeys.value.has(value);
 }
 
-/** 判断是否半选状态（部分子节点选中） */
+// 半选状态：checkStrictly 关闭时，子节点部分选中即半选
 function isIndeterminate(value: string) {
   if (props.checkStrictly) return false;
   const node = findNodeByValue(value, props.data);
@@ -215,7 +232,7 @@ function isIndeterminate(value: string) {
   return checkedCount > 0 && checkedCount < childValues.length;
 }
 
-/** 根据 value 查找节点 */
+// 按 value 深度优先查找节点
 function findNodeByValue(value: string, nodes: TreeOption[]): TreeOption | null {
   for (const node of nodes) {
     if (String(node[props.valueKey]) === value) return node;
@@ -228,7 +245,7 @@ function findNodeByValue(value: string, nodes: TreeOption[]): TreeOption | null
   return null;
 }
 
-/** 获取所有子节点的 value 数组 */
+// 收集全部后代节点的 value
 function getAllChildValues(nodes: TreeOption[]): string[] {
   const result: string[] = [];
   function traverse(list: TreeOption[]) {
@@ -242,7 +259,7 @@ function getAllChildValues(nodes: TreeOption[]): string[] {
   return result;
 }
 
-/** 获取所有父节点的 value 数组 */
+// 收集从根到目标节点的祖先 value，用于父子联动时回写父节点
 function getAllParentValues(value: string, nodes: TreeOption[], parents: string[] = []): string[] {
   for (const node of nodes) {
     const nodeValue = String(node[props.valueKey]);
@@ -256,7 +273,7 @@ function getAllParentValues(value: string, nodes: TreeOption[], parents: string[
   return [];
 }
 
-/** 处理多选选中状态变化 */
+// 多选切换：checkStrictly 关闭时联动子节点，并按子节点结果回写父节点
 function handleCheck(node: FlatNode) {
   const value = node.value;
   const checked = !internalCheckedKeys.value.has(value);
@@ -306,7 +323,7 @@ function handleCheck(node: FlatNode) {
   emit("check", Array.from(newCheckedKeys), { checked, node: node.raw });
 }
 
-/** 监听数据变化，默认展开全部 */
+// 数据变化且默认全展开时，重算展开集合
 watch(
   () => props.data,
   (data) => {
@@ -330,11 +347,11 @@ watch(
 </script>
 
 <style lang="scss" scoped>
-.custom-tree {
+.tree-view {
   background: var(--color-bg-card);
 }
 
-.custom-tree-node {
+.tree-node {
   &__content {
     display: flex;
     align-items: center;
diff --git a/src/subPages/work/config/index.vue b/src/subPages/work/config/index.vue
index 24c834c..a60f26f 100644
--- a/src/subPages/work/config/index.vue
+++ b/src/subPages/work/config/index.vue
@@ -12,11 +12,11 @@
     <view class="mt-16rpx">
       <wd-card v-for="item in configs" :key="item.id" @click="openConfigDialog(item.id)">
         <view class="flex-between">
-          <text class="font-bold text-32rpx">{{ item.configName }}</text>
+          <text class="text-32rpx font-semibold">{{ item.configName }}</text>
           <view
             class="item-action"
             hover-class="item-action--hover"
-            @click.stop="showConfigActions(item)"
+            @click.stop="openConfigActions(item)"
           >
             <wd-icon name="more" size="18" class="color-text-secondary" />
           </view>
@@ -66,8 +66,8 @@
           </wd-form-item>
         </wd-form>
         <view class="popup-actions">
-          <wd-button type="info" variant="plain" @click="closeConfigDialog">取消</wd-button>
-          <wd-button :loading="isSubmitting" @click="submitConfigForm">保存</wd-button>
+          <wd-button type="info" variant="plain" block @click="closeConfigDialog">取消</wd-button>
+          <wd-button :loading="isSubmitting" block @click="submitConfigForm">保存</wd-button>
         </view>
       </view>
     </wd-popup>
@@ -86,12 +86,7 @@
     </wd-fab>
 
     <!-- 操作菜单 -->
-    <wd-action-sheet
-      v-model="actionSheetVisible"
-      :actions="actionSheetActions"
-      cancel-text="取消"
-      @select="handleActionSelect"
-    />
+    <ActionSheet ref="actionSheetRef" />
   </view>
 </template>
 
@@ -99,7 +94,8 @@
 import { onLoad } from "@dcloudio/uni-app";
 import { toFormSchema } from "@/utils/form-schema";
 import { useToast } from "@wot-ui/ui";
-import { useActionSheet, type ActionMenuOption } from "@/composables/useActionSheet";
+import ActionSheet, { type ActionSheetCommand } from "@/subPages/work/components/ActionSheet.vue";
+import { useConfirmAction } from "@/composables/useConfirmAction";
 import { usePagedList } from "@/composables/usePagedList";
 import ConfigAPI, { type ConfigPageQuery, ConfigItem, ConfigForm } from "@/api/config";
 import { hasPermission } from "@/utils/permission";
@@ -110,8 +106,8 @@ definePage({
 });
 
 const toast = useToast();
-const { actionSheetVisible, actionSheetActions, showActions, handleActionSelect, confirmAction } =
-  useActionSheet();
+const { confirmAction } = useConfirmAction();
+const actionSheetRef = ref<InstanceType<typeof ActionSheet>>();
 const formRef = ref();
 const isSubmitting = ref(false);
 
@@ -191,18 +187,19 @@ function closeConfigDialog() {
 }
 
 // 更多操作
-function showConfigActions(item: ConfigItem) {
-  const menus: ActionMenuOption[] = [];
+function openConfigActions(item: ConfigItem) {
+  const commands: ActionSheetCommand[] = [];
 
   if (hasPermission("sys:config:update")) {
-    menus.push({ name: "编辑", handler: () => openConfigDialog(item.id!) });
+    commands.push({ id: "edit", label: "编辑", execute: () => openConfigDialog(item.id!) });
   }
 
   if (hasPermission("sys:config:delete")) {
-    menus.push({
-      name: "删除",
+    commands.push({
+      id: "delete",
+      label: "删除",
       color: "var(--color-danger)",
-      handler: () =>
+      execute: () =>
         confirmAction({
           msg: `确定要删除配置「${item.configName}」吗？`,
           action: async () => {
@@ -213,7 +210,7 @@ function showConfigActions(item: ConfigItem) {
     });
   }
 
-  showActions(menus);
+  actionSheetRef.value?.open(commands);
 }
 
 onLoad(() => {
diff --git a/src/subPages/work/dept/index.vue b/src/subPages/work/dept/index.vue
index e69ff0a..430345e 100644
--- a/src/subPages/work/dept/index.vue
+++ b/src/subPages/work/dept/index.vue
@@ -11,7 +11,7 @@
 
     <!-- 部门树形列表 -->
     <view class="mt-16rpx">
-      <CustomTree
+      <TreeView
         :data="treeData"
         :default-expand-all="true"
         :show-action="true"
@@ -27,7 +27,7 @@
             </wd-tag>
           </view>
         </template>
-      </CustomTree>
+      </TreeView>
 
       <wd-empty v-if="deptList.length === 0" icon="search-line" tip="暂无数据" />
     </view>
@@ -75,8 +75,8 @@
           </wd-form-item>
         </wd-form>
         <view class="popup-actions">
-          <wd-button type="info" variant="plain" @click="closeDeptDialog">取消</wd-button>
-          <wd-button :loading="isSubmitting" @click="submitDeptForm">保存</wd-button>
+          <wd-button type="info" variant="plain" block @click="closeDeptDialog">取消</wd-button>
+          <wd-button :loading="isSubmitting" block @click="submitDeptForm">保存</wd-button>
         </view>
       </view>
     </wd-popup>
@@ -95,12 +95,7 @@
     </wd-fab>
 
     <!-- 操作菜单 -->
-    <wd-action-sheet
-      v-model="actionSheetVisible"
-      :actions="actionSheetActions"
-      cancel-text="取消"
-      @select="handleActionSelect"
-    />
+    <ActionSheet ref="actionSheetRef" />
   </view>
 </template>
 
@@ -110,10 +105,12 @@ import { toFormSchema } from "@/utils/form-schema";
 import { findOptionChain } from "@/utils/tree";
 import { useToast } from "@wot-ui/ui";
 import type { CascaderOption } from "@wot-ui/ui/components/wd-cascader/types";
-import { useActionSheet, type ActionMenuOption } from "@/composables/useActionSheet";
+import ActionSheet, { type ActionSheetCommand } from "@/subPages/work/components/ActionSheet.vue";
+import { useConfirmAction } from "@/composables/useConfirmAction";
 import DeptAPI, { type DeptQuery, DeptItem, DeptForm } from "@/api/dept";
+import { getErrorMessage } from "@/utils/error";
 import { hasPermission } from "@/utils/permission";
-import CustomTree, { type TreeOption } from "@/subPages/work/components/custom-tree.vue";
+import TreeView, { type TreeOption } from "@/subPages/work/components/TreeView.vue";
 
 definePage({
   name: "dept",
@@ -121,8 +118,8 @@ definePage({
 });
 
 const toast = useToast();
-const { actionSheetVisible, actionSheetActions, showActions, handleActionSelect, confirmAction } =
-  useActionSheet();
+const { confirmAction } = useConfirmAction();
+const actionSheetRef = ref<InstanceType<typeof ActionSheet>>();
 const formRef = ref();
 const isSubmitting = ref(false);
 
@@ -141,10 +138,20 @@ const initialFormData: DeptForm = {
 
 const formData = reactive<DeptForm>({ ...initialFormData });
 
-// 转换为树组件数据格式
-const treeData = computed(() => deptList.value.map((dept) => transformDeptToTree(dept)));
+// 树组件节点：部门实体字段 + 树节点要求的 value/label
+interface DeptTreeOption extends TreeOption {
+  id?: number;
+  name?: string;
+  status?: number;
+  children?: DeptTreeOption[];
+}
 
-function transformDeptToTree(dept: DeptItem): TreeOption {
+// 转换为树组件数据格式
+const treeData = computed<DeptTreeOption[]>(() =>
+  deptList.value.map((dept) => transformDeptToTree(dept))
+);
+
+function transformDeptToTree(dept: DeptItem): DeptTreeOption {
   return {
     value: String(dept.id),
     label: dept.name ?? "",
@@ -189,35 +196,39 @@ function loadDeptList() {
     .then((data) => {
       deptList.value = data;
     })
-    .catch(() => {
-      // API 层已处理错误提示
+    .catch((error) => {
+      toast.error(getErrorMessage(error, "加载失败"));
     });
 }
 
 // 处理节点操作按钮点击
-function handleNodeAction(node: TreeOption) {
+function handleNodeAction(node: DeptTreeOption) {
   const dept: DeptItem = {
     id: node.id,
-    name: node.label,
+    name: node.name ?? node.label,
     status: node.status,
-    children: node.children,
-  } as DeptItem;
+  };
 
-  const menus: ActionMenuOption[] = [];
+  const commands: ActionSheetCommand[] = [];
 
   if (hasPermission("sys:dept:create")) {
-    menus.push({ name: "新增子部门", handler: () => handleAddChild(dept) });
+    commands.push({
+      id: "add-child",
+      label: "新增子部门",
+      execute: () => openChildDeptDialog(dept),
+    });
   }
 
   if (hasPermission("sys:dept:update")) {
-    menus.push({ name: "编辑", handler: () => openDeptDialog(dept) });
+    commands.push({ id: "edit", label: "编辑", execute: () => openDeptDialog(dept) });
   }
 
   if (hasPermission("sys:dept:delete")) {
-    menus.push({
-      name: "删除",
+    commands.push({
+      id: "delete",
+      label: "删除",
       color: "var(--color-danger)",
-      handler: () =>
+      execute: () =>
         confirmAction({
           msg: `确定要删除部门「${dept.name}」吗？`,
           action: async () => {
@@ -228,7 +239,7 @@ function handleNodeAction(node: TreeOption) {
     });
   }
 
-  showActions(menus);
+  actionSheetRef.value?.open(commands);
 }
 
 // 打开弹窗（新增/编辑）
@@ -260,7 +271,7 @@ async function openDeptDialog(dept?: DeptItem) {
 }
 
 // 新增子部门：按新增流程打开弹窗，并预设上级部门
-function handleAddChild(dept: DeptItem) {
+function openChildDeptDialog(dept: DeptItem) {
   openDeptDialog();
   formData.parentId = dept.id!;
   parentSelected.value = dept.id!;
diff --git a/src/subPages/work/dict/index.vue b/src/subPages/work/dict/index.vue
index 3d1a56e..d473763 100644
--- a/src/subPages/work/dict/index.vue
+++ b/src/subPages/work/dict/index.vue
@@ -10,11 +10,11 @@
     </view>
 
     <view class="mt-16rpx">
-      <wd-card v-for="item in dicts" :key="item.id" @click="openDictItemPage(item)">
+      <wd-card v-for="item in dicts" :key="item.id" @click="navigateToDictItem(item)">
         <view class="flex-start">
           <view class="flex-1">
             <view class="flex-start">
-              <text class="font-bold text-32rpx">{{ item.name }}</text>
+              <text class="text-32rpx font-semibold">{{ item.name }}</text>
             </view>
             <text class="text-24rpx color-text-secondary">字典编码：{{ item.dictCode }}</text>
           </view>
@@ -28,7 +28,7 @@
           <view
             class="item-action"
             hover-class="item-action--hover"
-            @click.stop="showDictActions(item)"
+            @click.stop="openDictActions(item)"
           >
             <wd-icon name="more" size="18" class="color-text-secondary" />
           </view>
@@ -69,18 +69,13 @@
           </wd-form-item>
         </wd-form>
         <view class="popup-actions">
-          <wd-button type="info" variant="plain" @click="closeDictDialog">取消</wd-button>
-          <wd-button :loading="isSubmitting" @click="submitDictForm">保存</wd-button>
+          <wd-button type="info" variant="plain" block @click="closeDictDialog">取消</wd-button>
+          <wd-button :loading="isSubmitting" block @click="submitDictForm">保存</wd-button>
         </view>
       </view>
     </wd-popup>
 
-    <wd-action-sheet
-      v-model="actionSheetVisible"
-      :actions="actionSheetActions"
-      cancel-text="取消"
-      @select="handleActionSelect"
-    />
+    <ActionSheet ref="actionSheetRef" />
     <wd-fab
       v-if="hasPermission('sys:dict:create') && !dialog.visible"
       :expandable="false"
@@ -100,7 +95,8 @@ import { onLoad } from "@dcloudio/uni-app";
 import { useRouter } from "uni-mini-router";
 import { toFormSchema } from "@/utils/form-schema";
 import { useToast } from "@wot-ui/ui";
-import { useActionSheet, type ActionMenuOption } from "@/composables/useActionSheet";
+import ActionSheet, { type ActionSheetCommand } from "@/subPages/work/components/ActionSheet.vue";
+import { useConfirmAction } from "@/composables/useConfirmAction";
 import { usePagedList } from "@/composables/usePagedList";
 import DictAPI, { type DictTypeForm, type DictTypePageQuery, type DictTypeItem } from "@/api/dict";
 import { hasPermission } from "@/utils/permission";
@@ -113,8 +109,8 @@ definePage({
 
 const router = useRouter();
 const toast = useToast();
-const { actionSheetVisible, actionSheetActions, showActions, handleActionSelect, confirmAction } =
-  useActionSheet();
+const { confirmAction } = useConfirmAction();
+const actionSheetRef = ref<InstanceType<typeof ActionSheet>>();
 const formRef = ref();
 const isSubmitting = ref(false);
 
@@ -152,7 +148,8 @@ function loadDictTypeList() {
   reload();
 }
 
-function openDictItemPage(item: DictTypeItem) {
+// 跳转字典数据页
+function navigateToDictItem(item: DictTypeItem) {
   if (!item.dictCode) return;
   router.push({
     path: "/subPages/work/dict/item/index",
@@ -198,18 +195,21 @@ function closeDictDialog() {
   Object.assign(formData, initialFormData);
 }
 
-function showDictActions(item: DictTypeItem) {
-  const menus: ActionMenuOption[] = [{ name: "字典数据", handler: () => openDictItemPage(item) }];
+function openDictActions(item: DictTypeItem) {
+  const commands: ActionSheetCommand[] = [
+    { id: "dict-item", label: "字典数据", execute: () => navigateToDictItem(item) },
+  ];
 
   if (hasPermission("sys:dict:update")) {
-    menus.push({ name: "编辑", handler: () => openDictDialog(item.id) });
+    commands.push({ id: "edit", label: "编辑", execute: () => openDictDialog(item.id) });
   }
 
   if (hasPermission("sys:dict:delete")) {
-    menus.push({
-      name: "删除",
+    commands.push({
+      id: "delete",
+      label: "删除",
       color: "var(--color-danger)",
-      handler: () =>
+      execute: () =>
         confirmAction({
           msg: `删除字典「${item.name}」会同时删除其字典数据，确定继续吗？`,
           action: async () => {
@@ -221,7 +221,7 @@ function showDictActions(item: DictTypeItem) {
     });
   }
 
-  showActions(menus);
+  actionSheetRef.value?.open(commands);
 }
 
 onLoad(() => {
diff --git a/src/subPages/work/dict/item/index.vue b/src/subPages/work/dict/item/index.vue
index b24b136..6baed39 100644
--- a/src/subPages/work/dict/item/index.vue
+++ b/src/subPages/work/dict/item/index.vue
@@ -17,7 +17,7 @@
               <wd-tag v-if="tagComponentType(item.tagType)" :type="tagComponentType(item.tagType)">
                 {{ item.label }}
               </wd-tag>
-              <text v-else class="font-bold text-32rpx">{{ item.label }}</text>
+              <text v-else class="text-32rpx font-semibold">{{ item.label }}</text>
             </view>
             <text class="text-24rpx color-text-secondary">
               字典值：{{ item.value }} · 排序：{{ item.sort }}
@@ -33,7 +33,7 @@
           <view
             class="item-action"
             hover-class="item-action--hover"
-            @click.stop="showItemActions(item)"
+            @click.stop="openItemActions(item)"
           >
             <wd-icon name="more" size="18" class="color-text-secondary" />
           </view>
@@ -62,7 +62,7 @@
             <wd-input v-model="formData.value" placeholder="请输入字典项值" />
           </wd-form-item>
           <wd-form-item prop="tagType" title="标签类型">
-            <wd-radio-group v-model="formData.tagType" size="small" type="button">
+            <wd-radio-group v-model="formData.tagType" type="button">
               <wd-radio value="">无</wd-radio>
               <wd-radio
                 v-for="option in TAG_TYPE_OPTIONS"
@@ -77,7 +77,7 @@
             <wd-switch v-model="formData.status" :active-value="1" :inactive-value="0" />
           </wd-form-item>
           <wd-form-item prop="sort" title="排序">
-            <wd-input-number v-model="formData.sort" :min="0" />
+            <wd-input-number v-model="formData.sort!" :min="0" />
           </wd-form-item>
           <wd-form-item prop="remark" title="备注">
             <wd-textarea
@@ -89,18 +89,13 @@
           </wd-form-item>
         </wd-form>
         <view class="popup-actions">
-          <wd-button type="info" variant="plain" @click="closeItemDialog">取消</wd-button>
-          <wd-button :loading="isSubmitting" @click="submitItemForm">保存</wd-button>
+          <wd-button type="info" variant="plain" block @click="closeItemDialog">取消</wd-button>
+          <wd-button :loading="isSubmitting" block @click="submitItemForm">保存</wd-button>
         </view>
       </view>
     </wd-popup>
 
-    <wd-action-sheet
-      v-model="actionSheetVisible"
-      :actions="actionSheetActions"
-      cancel-text="取消"
-      @select="handleActionSelect"
-    />
+    <ActionSheet ref="actionSheetRef" />
     <wd-fab
       v-if="hasPermission('sys:dict-item:create') && !dialog.visible"
       :expandable="false"
@@ -119,7 +114,8 @@
 import { onLoad } from "@dcloudio/uni-app";
 import { toFormSchema } from "@/utils/form-schema";
 import { useToast } from "@wot-ui/ui";
-import { useActionSheet, type ActionMenuOption } from "@/composables/useActionSheet";
+import ActionSheet, { type ActionSheetCommand } from "@/subPages/work/components/ActionSheet.vue";
+import { useConfirmAction } from "@/composables/useConfirmAction";
 import { usePagedList } from "@/composables/usePagedList";
 import DictAPI, { type DictItemForm, type DictItemPageQuery, type DictItem } from "@/api/dict";
 import { hasPermission } from "@/utils/permission";
@@ -132,8 +128,8 @@ definePage({
 });
 
 const toast = useToast();
-const { actionSheetVisible, actionSheetActions, showActions, handleActionSelect, confirmAction } =
-  useActionSheet();
+const { confirmAction } = useConfirmAction();
+const actionSheetRef = ref<InstanceType<typeof ActionSheet>>();
 
 const dictCode = ref<string>("");
 const pageTitle = ref<string>("字典数据");
@@ -173,7 +169,7 @@ const initialFormData: DictItemForm = {
   tagType: "",
 };
 
-/** 标签类型选项，值为后端存储的语义名 */
+// 标签类型选项：值用后端存储的语义名，label 仅用于展示
 const TAG_TYPE_OPTIONS = [
   { value: "primary", label: "主要" },
   { value: "success", label: "成功" },
@@ -182,7 +178,7 @@ const TAG_TYPE_OPTIONS = [
   { value: "danger", label: "危险" },
 ];
 
-/** 语义名与 wd-tag 类型的对应关系，info 用默认样式呈现 */
+// 语义名与 wd-tag 类型的对应关系：info 没有同名类型，走默认样式
 const TAG_COMPONENT_TYPES: Record<string, TagType> = {
   primary: "primary",
   success: "success",
@@ -191,9 +187,9 @@ const TAG_COMPONENT_TYPES: Record<string, TagType> = {
   info: "default",
 };
 
-/** 字典项标签在 wd-tag 上的呈现类型，无标签类型时返回空串 */
-function tagComponentType(tagType?: string): TagType | "" {
-  return TAG_COMPONENT_TYPES[tagType ?? ""] ?? "";
+// 字典项标签在 wd-tag 上的呈现类型，未配置标签类型时返回 undefined 走纯文本
+function tagComponentType(tagType?: string): TagType | undefined {
+  return TAG_COMPONENT_TYPES[tagType ?? ""];
 }
 
 const formData = reactive<DictItemForm>({ ...initialFormData });
@@ -258,18 +254,19 @@ function closeItemDialog() {
   Object.assign(formData, initialFormData);
 }
 
-function showItemActions(item: DictItem) {
-  const menus: ActionMenuOption[] = [];
+function openItemActions(item: DictItem) {
+  const commands: ActionSheetCommand[] = [];
 
   if (hasPermission("sys:dict-item:update")) {
-    menus.push({ name: "编辑", handler: () => openItemDialog(item.id) });
+    commands.push({ id: "edit", label: "编辑", execute: () => openItemDialog(item.id) });
   }
 
   if (hasPermission("sys:dict-item:delete")) {
-    menus.push({
-      name: "删除",
+    commands.push({
+      id: "delete",
+      label: "删除",
       color: "var(--color-danger)",
-      handler: () =>
+      execute: () =>
         confirmAction({
           msg: `确定要删除字典数据「${item.label}」吗？`,
           action: async () => {
@@ -281,7 +278,7 @@ function showItemActions(item: DictItem) {
     });
   }
 
-  showActions(menus);
+  actionSheetRef.value?.open(commands);
 }
 
 onLoad((query) => {
diff --git a/src/subPages/work/log/index.vue b/src/subPages/work/log/index.vue
index 0581a61..8c07ae2 100644
--- a/src/subPages/work/log/index.vue
+++ b/src/subPages/work/log/index.vue
@@ -16,9 +16,9 @@
         <view class="flex-start">
           <view class="flex-1">
             <view class="flex-start mt-12rpx">
-              <text class="font-bold text-32rpx">{{ item.operatorName }}</text>
+              <text class="text-32rpx font-semibold">{{ item.operatorName }}</text>
               <wd-tag
-                plain
+                variant="plain"
                 size="small"
                 class="ml-16rpx"
                 :type="item.status === 1 ? 'success' : 'danger'"
diff --git a/src/subPages/work/menu/index.vue b/src/subPages/work/menu/index.vue
index bdebf93..cf7f5d5 100644
--- a/src/subPages/work/menu/index.vue
+++ b/src/subPages/work/menu/index.vue
@@ -5,13 +5,13 @@
         v-model="queryParams.keywords"
         placeholder="搜索菜单名称"
         hide-cancel
-        @search="handleSearch"
+        @search="loadMenuList"
       />
     </view>
 
     <!-- 菜单树形列表 -->
     <view class="mt-16rpx">
-      <custom-tree
+      <tree-view
         :data="treeData"
         :default-expand-all="true"
         :show-action="true"
@@ -35,7 +35,7 @@
             </wd-tag>
           </view>
         </template>
-      </custom-tree>
+      </tree-view>
 
       <wd-empty v-if="menuList.length === 0" icon="search-line" tip="暂无数据" />
     </view>
@@ -74,7 +74,7 @@
               <wd-input v-model="formData.name" placeholder="请输入菜单名称" />
             </wd-form-item>
             <wd-form-item prop="type" title="菜单类型" required>
-              <wd-radio-group v-model="formData.type" size="small" type="button">
+              <wd-radio-group v-model="formData.type" type="button">
                 <wd-radio
                   v-for="option in typeOptions"
                   :key="option.value"
@@ -130,8 +130,8 @@
           </wd-form>
         </scroll-view>
         <view class="popup-actions">
-          <wd-button type="info" variant="plain" @click="closeMenuDialog">取消</wd-button>
-          <wd-button :loading="isSubmitting" @click="submitMenuForm">保存</wd-button>
+          <wd-button type="info" variant="plain" block @click="closeMenuDialog">取消</wd-button>
+          <wd-button :loading="isSubmitting" block @click="submitMenuForm">保存</wd-button>
         </view>
       </view>
     </wd-popup>
@@ -150,12 +150,7 @@
     </wd-fab>
 
     <!-- 操作菜单 -->
-    <wd-action-sheet
-      v-model="actionSheetVisible"
-      :actions="actionSheetActions"
-      cancel-text="取消"
-      @select="handleActionSelect"
-    />
+    <ActionSheet ref="actionSheetRef" />
   </view>
 </template>
 
@@ -164,11 +159,12 @@ import { onLoad } from "@dcloudio/uni-app";
 import { toFormSchema } from "@/utils/form-schema";
 import { findOptionChain } from "@/utils/tree";
 import { useToast } from "@wot-ui/ui";
-import { useActionSheet, type ActionMenuOption } from "@/composables/useActionSheet";
-import MenuAPI, { type MenuQuery, MenuItem, MenuForm } from "@/api/menu";
+import ActionSheet, { type ActionSheetCommand } from "@/subPages/work/components/ActionSheet.vue";
+import { useConfirmAction } from "@/composables/useConfirmAction";
+import MenuAPI, { type MenuQuery, type MenuItem, type MenuForm, type MenuType } from "@/api/menu";
 import { hasPermission } from "@/utils/permission";
 import { getErrorMessage } from "@/utils/error";
-import CustomTree, { type TreeOption } from "@/subPages/work/components/custom-tree.vue";
+import TreeView, { type TreeOption } from "@/subPages/work/components/TreeView.vue";
 import type { CascaderOption } from "@wot-ui/ui/components/wd-cascader/types";
 
 definePage({
@@ -177,8 +173,8 @@ definePage({
 });
 
 const toast = useToast();
-const { actionSheetVisible, actionSheetActions, showActions, handleActionSelect, confirmAction } =
-  useActionSheet();
+const { confirmAction } = useConfirmAction();
+const actionSheetRef = ref<InstanceType<typeof ActionSheet>>();
 const formRef = ref();
 const isSubmitting = ref(false);
 
@@ -186,6 +182,7 @@ const queryParams = reactive<MenuQuery>({ keywords: "" });
 const menuList = ref<MenuItem[]>([]);
 const dialog = reactive({ visible: false });
 
+// 表单初始值：新增默认建菜单，排序在打开弹窗时按同级末尾补齐
 const initialFormData: MenuForm = {
   id: undefined,
   parentId: "0",
@@ -204,10 +201,40 @@ const initialFormData: MenuForm = {
 
 const formData = reactive<MenuForm>({ ...initialFormData });
 
-// 转换为树组件数据格式
-const treeData = computed(() => menuList.value.map((menu: MenuItem) => transformMenuToTree(menu)));
+// 树组件节点：菜单实体字段 + 树节点要求的 value/label
+interface MenuTreeOption extends TreeOption {
+  id?: string;
+  name?: string;
+  type?: MenuType;
+  icon?: string;
+  visible?: number;
+  perm?: string;
+  children?: MenuTreeOption[];
+}
 
-function transformMenuToTree(menu: MenuItem): TreeOption {
+// 菜单类型在列表里的标签颜色
+const MENU_TYPE_TAG: Record<MenuType, "primary" | "success" | "warning" | "danger"> = {
+  C: "warning",
+  M: "success",
+  E: "primary",
+  B: "danger",
+};
+
+// 菜单类型的中文名称
+const MENU_TYPE_TEXT: Record<MenuType, string> = {
+  C: "目录",
+  M: "菜单",
+  E: "外链",
+  B: "按钮",
+};
+
+// 菜单列表转树节点：value/label 供树组件使用，业务字段随节点透传给操作菜单
+const treeData = computed<MenuTreeOption[]>(() =>
+  menuList.value.map((menu: MenuItem) => transformMenuToTree(menu))
+);
+
+// 递归转换：子节点沿用同一套字段，空 id 用空串占位以满足树组件契约
+function transformMenuToTree(menu: MenuItem): MenuTreeOption {
   return {
     value: menu.id ?? "",
     label: menu.name ?? "",
@@ -221,29 +248,14 @@ function transformMenuToTree(menu: MenuItem): TreeOption {
   };
 }
 
-// 菜单类型标签
-function normalizeMenuType(type?: string | number) {
-  if (type === 1 || type === "1") return "C";
-  if (type === 2 || type === "2") return "M";
-  if (type === 3 || type === "3") return "B";
-  return type;
+// 菜单类型对应的标签颜色，类型缺失时按主色展示
+function getMenuTypeTag(type?: MenuType) {
+  return (type && MENU_TYPE_TAG[type]) || "primary";
 }
 
-function getMenuTypeTag(type?: string | number): "primary" | "success" | "warning" | "danger" {
-  const map: Record<string, "primary" | "success" | "warning" | "danger"> = {
-    C: "warning",
-    M: "success",
-    E: "primary",
-    B: "danger",
-  };
-  const key = String(normalizeMenuType(type) || "M");
-  return map[key] || "primary";
-}
-
-function getMenuTypeText(type?: string | number) {
-  const map: Record<string, string> = { C: "目录", M: "菜单", E: "外链", B: "按钮" };
-  const key = String(normalizeMenuType(type) || "M");
-  return map[key] || "菜单";
+// 菜单类型对应的中文名称，类型缺失时按「菜单」展示
+function getMenuTypeText(type?: MenuType) {
+  return (type && MENU_TYPE_TEXT[type]) || "菜单";
 }
 
 // 上级菜单选择器
@@ -265,10 +277,8 @@ const menuMap = computed(() => {
   return map;
 });
 
-// 已选上级的菜单类型，顶级菜单取不到节点
-const parentIsMenu = computed(
-  () => normalizeMenuType(menuMap.value.get(String(formData.parentId))?.type) === "M"
-);
+// 已选上级是否为菜单：菜单下只能挂按钮，顶级或目录下只能挂目录/菜单/外链
+const parentIsMenu = computed(() => menuMap.value.get(String(formData.parentId))?.type === "M");
 
 // 按钮只能挂在菜单下，其余类型只能挂在顶级或目录下
 const typeOptions = computed(() => [
@@ -294,6 +304,7 @@ const descendantIds = computed(() => {
 // 上级选项：按当前类型禁用不兼容的层级
 const parentCascaderOptions = computed(() => markParentDisabled(parentOptions.value));
 
+// 递归标记上级选项：禁用项在级联选择器里不可选，但仍会展示层级
 function markParentDisabled(options: OptionType[]): CascaderOption[] {
   return options.map((option) => ({
     ...option,
@@ -302,16 +313,16 @@ function markParentDisabled(options: OptionType[]): CascaderOption[] {
   }));
 }
 
-/** 上级选项是否禁用：自身与下级不可选，按钮只能挂菜单下，其余类型只能挂顶级或目录下 */
+// 上级选项是否禁用：自身与下级不可选，按钮只能挂菜单下，其余类型只能挂顶级或目录下
 function isDisabledParent(option: OptionType): boolean {
   const value = String(option.value);
   if (formData.id && (value === String(formData.id) || descendantIds.value.has(value))) return true;
 
-  const optionIsMenu = normalizeMenuType(menuMap.value.get(value)?.type) === "M";
+  const optionIsMenu = menuMap.value.get(value)?.type === "M";
   return formData.type === "B" ? !optionIsMenu : optionIsMenu;
 }
 
-/** 同级菜单的下一个排序值，新增菜单默认排在末尾 */
+// 同级菜单的下一个排序值，新增菜单默认排在末尾
 function resolveNextSort(parentId?: string): number {
   const siblings =
     !parentId || parentId === "0"
@@ -320,7 +331,7 @@ function resolveNextSort(parentId?: string): number {
   return siblings.reduce((max, menu) => Math.max(max, menu.sort ?? 0), 0) + 1;
 }
 
-/** 同级按钮权限里出现次数最多的模块名，用作新增页面的按钮前缀 */
+// 同级按钮权限里出现次数最多的模块名，用作新增页面的按钮前缀
 function deriveButtonPermPrefix(parentId: string): string {
   const siblings =
     !parentId || parentId === "0"
@@ -328,7 +339,7 @@ function deriveButtonPermPrefix(parentId: string): string {
       : (menuMap.value.get(String(parentId))?.children ?? []);
   const counter = new Map<string, number>();
   siblings.forEach((menu) => {
-    if (normalizeMenuType(menu.type) !== "B" || !menu.perm) return;
+    if (menu.type !== "B" || !menu.perm) return;
     const module = menu.perm.split(":").slice(0, -1).join(":");
     if (module) counter.set(module, (counter.get(module) ?? 0) + 1);
   });
@@ -344,7 +355,7 @@ function deriveButtonPermPrefix(parentId: string): string {
   return prefix;
 }
 
-// 上级菜单确认选择
+// 选择上级后收敛菜单类型：挂到菜单下只能是按钮，否则按钮要退回菜单
 const handleParentConfirm = ({
   value,
   selectedOptions,
@@ -379,51 +390,51 @@ const rules = toFormSchema({
   parentId: [{ required: true, message: "请选择上级菜单" }],
 });
 
-const handleSearch = () => loadMenuList();
-
+// 加载菜单树：接口直接返回树结构，前端只做展示映射
 function loadMenuList() {
-  MenuAPI.getList(queryParams).then((data) => {
-    menuList.value = data;
-  });
+  MenuAPI.getList(queryParams)
+    .then((data) => {
+      menuList.value = data;
+    })
+    .catch((error) => {
+      toast.error(getErrorMessage(error, "加载失败"));
+    });
 }
 
-// 处理节点操作按钮点击
-function handleNodeAction(node: TreeOption) {
-  const menu: MenuItem = {
-    id: node.id,
-    name: node.label,
-    type: node.type,
-    visible: node.visible,
-    children: node.children,
-  } as MenuItem;
-
-  const menus: ActionMenuOption[] = [];
+// 节点操作菜单：按钮节点不提供新增子菜单，其余命令按权限拼装
+function handleNodeAction(node: MenuTreeOption) {
+  const commands: ActionSheetCommand[] = [];
 
   // 按钮(B)类型节点不允许再有下级
-  if (hasPermission("sys:menu:create") && normalizeMenuType(String(node.type)) !== "B") {
-    menus.push({ name: "新增子菜单", handler: () => handleAddChild(menu) });
+  if (hasPermission("sys:menu:create") && node.type !== "B") {
+    commands.push({
+      id: "add-child",
+      label: "新增子菜单",
+      execute: () => openChildMenuDialog(node),
+    });
   }
 
   if (hasPermission("sys:menu:update")) {
-    menus.push({ name: "编辑", handler: () => openMenuDialog(menu) });
+    commands.push({ id: "edit", label: "编辑", execute: () => openMenuDialog(node) });
   }
 
   if (hasPermission("sys:menu:delete")) {
-    menus.push({
-      name: "删除",
+    commands.push({
+      id: "delete",
+      label: "删除",
       color: "var(--color-danger)",
-      handler: () =>
+      execute: () =>
         confirmAction({
-          msg: `确定要删除菜单「${menu.name}」吗？`,
+          msg: `确定要删除菜单「${node.name}」吗？`,
           action: async () => {
-            await MenuAPI.deleteByIds(menu.id!);
+            await MenuAPI.deleteByIds(node.id!);
             loadMenuList();
           },
         }),
     });
   }
 
-  showActions(menus);
+  actionSheetRef.value?.open(commands);
 }
 
 // 打开弹窗（新增/编辑）
@@ -458,7 +469,7 @@ async function openMenuDialog(menu?: MenuItem) {
 }
 
 // 新增子菜单：按新增流程打开弹窗，并预设上级菜单
-function handleAddChild(menu: MenuItem) {
+function openChildMenuDialog(menu: MenuItem) {
   openMenuDialog();
   formData.parentId = menu.id!;
   parentSelected.value = menu.id!;
@@ -469,12 +480,12 @@ function handleAddChild(menu: MenuItem) {
     menu.name ||
     "";
   // 菜单下只能挂按钮，目录下默认新增菜单
-  formData.type = normalizeMenuType(menu.type) === "M" ? "B" : "M";
+  formData.type = menu.type === "M" ? "B" : "M";
   formData.sort = resolveNextSort(menu.id!);
 }
 
-// 按类型清理无关字段，避免误提交
-function normalizeMenuPayload() {
+// 组装提交数据：按类型丢弃无关字段，避免把上次输入或不需要的字段提交给后端
+function buildMenuPayload() {
   const payload: MenuForm = { ...formData };
 
   if (payload.type === "E") {
@@ -500,7 +511,7 @@ function normalizeMenuPayload() {
   return payload;
 }
 
-// 提交表单
+// 提交表单：校验通过后按 id 判断新增或修改，成功后刷新列表
 function submitMenuForm() {
   formRef.value.validate().then(({ valid }: { valid: boolean }) => {
     if (!valid) return;
@@ -509,7 +520,7 @@ function submitMenuForm() {
       return;
     }
     isSubmitting.value = true;
-    const payload = normalizeMenuPayload();
+    const payload = buildMenuPayload();
     const action = formData.id ? MenuAPI.update(formData.id, payload) : MenuAPI.create(payload);
     action
       .then(() => {
@@ -526,7 +537,7 @@ function submitMenuForm() {
   });
 }
 
-// 关闭弹窗
+// 关闭弹窗并重置表单，避免下次打开残留上次输入
 function closeMenuDialog() {
   dialog.visible = false;
   formRef.value?.reset();
diff --git a/src/subPages/work/notice/index.vue b/src/subPages/work/notice/index.vue
index 760d49b..e796a45 100644
--- a/src/subPages/work/notice/index.vue
+++ b/src/subPages/work/notice/index.vue
@@ -49,7 +49,7 @@
           <view
             class="item-action"
             hover-class="item-action--hover"
-            @click.stop="showNoticeActions(item)"
+            @click.stop="openNoticeActions(item)"
           >
             <wd-icon name="more" size="16" class="color-text-secondary" />
           </view>
@@ -128,18 +128,13 @@
           </wd-form-item>
         </wd-form>
         <view class="popup-actions">
-          <wd-button type="info" variant="plain" @click="closeNoticeDialog">取消</wd-button>
-          <wd-button :loading="isSubmitting" @click="submitNoticeForm">保存</wd-button>
+          <wd-button type="info" variant="plain" block @click="closeNoticeDialog">取消</wd-button>
+          <wd-button :loading="isSubmitting" block @click="submitNoticeForm">保存</wd-button>
         </view>
       </view>
     </wd-popup>
 
-    <wd-action-sheet
-      v-model="actionSheetVisible"
-      :actions="actionSheetActions"
-      cancel-text="取消"
-      @select="handleActionSelect"
-    />
+    <ActionSheet ref="actionSheetRef" />
     <wd-fab
       v-if="hasPermission('sys:notice:create') && !dialog.visible && !detailDialog.visible"
       :expandable="false"
@@ -158,7 +153,8 @@
 import { onLoad } from "@dcloudio/uni-app";
 import { toFormSchema } from "@/utils/form-schema";
 import { useToast } from "@wot-ui/ui";
-import { useActionSheet, type ActionMenuOption } from "@/composables/useActionSheet";
+import ActionSheet, { type ActionSheetCommand } from "@/subPages/work/components/ActionSheet.vue";
+import { useConfirmAction } from "@/composables/useConfirmAction";
 import { usePagedList } from "@/composables/usePagedList";
 import NoticeAPI, {
   type NoticePageQuery,
@@ -174,8 +170,8 @@ definePage({
 });
 
 const toast = useToast();
-const { actionSheetVisible, actionSheetActions, showActions, handleActionSelect, confirmAction } =
-  useActionSheet();
+const { confirmAction } = useConfirmAction();
+const actionSheetRef = ref<InstanceType<typeof ActionSheet>>();
 const formRef = ref();
 const isSubmitting = ref(false);
 
@@ -228,9 +224,9 @@ const getStatusText = (status?: number): string => {
 };
 
 // 获取级别文本
-const getLevelText = (level?: string | number): string => {
+const getLevelText = (level?: string): string => {
   const map: Record<string, string> = { L: "低", M: "中", H: "高" };
-  return level ? map[String(level)] || String(level) : "-";
+  return level ? map[level] || level : "-";
 };
 
 // 格式化时间
@@ -303,18 +299,25 @@ function submitNoticeForm() {
 }
 
 // 更多操作
-function showNoticeActions(item: NoticeItem) {
-  const menus: ActionMenuOption[] = [{ name: "查看", handler: () => openNoticeDetail(item) }];
+function openNoticeActions(item: NoticeItem) {
+  const commands: ActionSheetCommand[] = [
+    { id: "detail", label: "查看", execute: () => openNoticeDetail(item) },
+  ];
 
   if (item.publishStatus !== 1) {
     if (hasPermission("sys:notice:update")) {
-      menus.push({ name: "编辑", handler: () => openNoticeDialog(Number(item.id)) });
+      commands.push({
+        id: "edit",
+        label: "编辑",
+        execute: () => openNoticeDialog(Number(item.id)),
+      });
     }
     if (hasPermission("sys:notice:delete")) {
-      menus.push({
-        name: "删除",
+      commands.push({
+        id: "delete",
+        label: "删除",
         color: "var(--color-danger)",
-        handler: () =>
+        execute: () =>
           confirmAction({
             msg: `确定要删除通知「${item.title}」吗？`,
             action: async () => {
@@ -325,9 +328,10 @@ function showNoticeActions(item: NoticeItem) {
       });
     }
     if (hasPermission("sys:notice:publish")) {
-      menus.push({
-        name: "发布",
-        handler: () =>
+      commands.push({
+        id: "publish",
+        label: "发布",
+        execute: () =>
           confirmAction({
             title: "确认发布",
             msg: `确定要发布通知「${item.title}」吗？`,
@@ -340,10 +344,11 @@ function showNoticeActions(item: NoticeItem) {
       });
     }
   } else if (hasPermission("sys:notice:revoke")) {
-    menus.push({
-      name: "撤回",
+    commands.push({
+      id: "revoke",
+      label: "撤回",
       color: "var(--color-warning)",
-      handler: () =>
+      execute: () =>
         confirmAction({
           title: "确认撤回",
           msg: `确定要撤回通知「${item.title}」吗？`,
@@ -356,7 +361,7 @@ function showNoticeActions(item: NoticeItem) {
     });
   }
 
-  showActions(menus);
+  actionSheetRef.value?.open(commands);
 }
 
 onLoad(() => {
diff --git a/src/subPages/work/role/assign-perm/index.vue b/src/subPages/work/role/assign-perm/index.vue
index f232aa2..250b557 100644
--- a/src/subPages/work/role/assign-perm/index.vue
+++ b/src/subPages/work/role/assign-perm/index.vue
@@ -1,7 +1,7 @@
 <template>
-  <view class="assign-perm">
+  <view class="permissions">
     <!-- 固定头部：搜索栏 + 操作栏 -->
-    <view class="header">
+    <view class="permissions__header">
       <view class="role-bar">
         <text class="role-bar__label">角色</text>
         <text class="role-bar__value">{{ roleName || "-" }}</text>
@@ -9,17 +9,15 @@
 
       <view class="action-bar">
         <view class="action-bar__left">
-          <wd-button type="" size="small" variant="plain" @click="handleSelectAll">全选</wd-button>
-          <wd-button type="" size="small" variant="plain" @click="handleClearAll">
-            取消全选
-          </wd-button>
+          <wd-button size="small" variant="plain" @click="handleSelectAll">全选</wd-button>
+          <wd-button size="small" variant="plain" @click="handleClearAll">取消全选</wd-button>
         </view>
       </view>
     </view>
 
     <!-- 可滚动区域：权限树 -->
-    <scroll-view class="tree-container" scroll-y>
-      <custom-tree
+    <scroll-view class="permissions__tree" scroll-y>
+      <tree-view
         :data="menuTree"
         :checkable="true"
         :checked-keys="checkedKeys"
@@ -30,8 +28,8 @@
         @check="handleCheck"
       >
         <template #content="{ node, checked }">
-          <view class="node-content">
-            <view class="node-content__info">
+          <view class="permissions__node">
+            <view class="permissions__node-info">
               <wd-icon
                 v-if="node.type === 'C'"
                 name="folder"
@@ -50,7 +48,7 @@
                 size="16"
                 :color="checked ? 'var(--color-primary)' : 'var(--color-text-secondary)'"
               />
-              <text class="node-content__label" :class="{ 'is-checked': checked }">
+              <text class="permissions__node-label" :class="{ 'is-checked': checked }">
                 {{ node.name }}
               </text>
             </view>
@@ -58,31 +56,32 @@
               v-if="node.type"
               size="small"
               :type="node.type === 'C' ? 'primary' : node.type === 'M' ? 'success' : 'warning'"
-              plain
+              variant="plain"
             >
               {{ node.type === "C" ? "目录" : node.type === "M" ? "菜单" : "按钮" }}
             </wd-tag>
           </view>
         </template>
-      </custom-tree>
+      </tree-view>
 
       <wd-empty v-if="menuTree.length === 0" icon="search-line" tip="暂无菜单数据" />
     </scroll-view>
 
     <!-- 固定底部操作栏 -->
-    <view class="bottom-bar">
-      <wd-button type="info" variant="plain" @click="handleCancel">取消</wd-button>
-      <wd-button :loading="isSubmitting" @click="handleSubmit">保存</wd-button>
+    <view class="permissions__actions">
+      <wd-button type="info" variant="plain" block @click="handleCancel">取消</wd-button>
+      <wd-button :loading="isSubmitting" block @click="handleSubmit">保存</wd-button>
     </view>
   </view>
 </template>
 
 <script lang="ts" setup>
 import { onLoad } from "@dcloudio/uni-app";
-import MenuAPI, { type MenuItem } from "@/api/menu";
+import MenuAPI, { type MenuItem, type MenuType } from "@/api/menu";
 import RoleAPI from "@/api/role";
-import CustomTree from "@/subPages/work/components/custom-tree.vue";
-import type { TreeOption } from "@/subPages/work/components/custom-tree.vue";
+import { getErrorMessage } from "@/utils/error";
+import TreeView from "@/subPages/work/components/TreeView.vue";
+import type { TreeOption } from "@/subPages/work/components/TreeView.vue";
 
 definePage({
   name: "role-assign-perm",
@@ -97,14 +96,22 @@ const roleName = ref("");
 const menuList = ref<MenuItem[]>([]);
 const checkedKeys = ref<string[]>([]);
 
+// 树组件节点：菜单实体字段 + 树节点要求的 value/label
+interface PermissionTreeOption extends TreeOption {
+  id: string;
+  name: string;
+  type?: MenuType;
+  children?: PermissionTreeOption[];
+}
+
 // 转换菜单为树结构
-const menuTree = computed<TreeOption[]>(() => {
+const menuTree = computed<PermissionTreeOption[]>(() => {
   if (!menuList.value.length) return [];
   return transformMenuToTree(menuList.value);
 });
 
 // 转换菜单为树组件格式
-function transformMenuToTree(menus: MenuItem[]): TreeOption[] {
+function transformMenuToTree(menus: MenuItem[]): PermissionTreeOption[] {
   return menus.map((menu) => {
     const id = String(menu.id);
     const name = menu.name ?? "";
@@ -124,18 +131,18 @@ function handleCheck(keys: string[]) {
   checkedKeys.value = keys;
 }
 
-// 全选
+// 全选：包含所有层级的菜单 id
 function handleSelectAll() {
   const allIds = getAllMenuIds(menuList.value);
   checkedKeys.value = allIds;
 }
 
-// 取消全选
+// 取消全选：直接清空勾选集合，不逐层回退
 function handleClearAll() {
   checkedKeys.value = [];
 }
 
-// 获取所有菜单ID
+// 收集所有层级的菜单 id
 function getAllMenuIds(menus: MenuItem[]): string[] {
   const ids: string[] = [];
   function traverse(list: MenuItem[]) {
@@ -148,25 +155,27 @@ function getAllMenuIds(menus: MenuItem[]): string[] {
   return ids;
 }
 
-// 取消
+// 取消：不保存直接返回
 function handleCancel() {
   uni.navigateBack();
 }
 
-// 提交
+// 提交：勾选结果是字符串 id，提交前转回数字
 async function handleSubmit() {
   isSubmitting.value = true;
   try {
     await RoleAPI.assignMenus(roleId.value, checkedKeys.value.map(Number));
     toast.success("保存成功");
     uni.navigateBack();
+  } catch (error) {
+    toast.error(getErrorMessage(error, "保存失败"));
   } finally {
     isSubmitting.value = false;
   }
 }
 
-// 加载数据
-async function loadData() {
+// 加载角色权限页所需的菜单树、已授权菜单与角色名
+async function loadRolePermissions() {
   try {
     // 并行加载菜单列表和角色已有权限
     const [menus, roleMenuIds, roleForm] = await Promise.all([
@@ -185,7 +194,7 @@ async function loadData() {
 onLoad((query) => {
   if (query?.id) {
     roleId.value = Number(query.id);
-    loadData();
+    loadRolePermissions();
   }
 });
 </script>
@@ -195,14 +204,14 @@ export default { options: { styleIsolation: "shared" } };
 </script>
 
 <style lang="scss" scoped>
-.assign-perm {
+.permissions {
   display: flex;
   flex-direction: column;
   height: 100vh;
   background: var(--color-bg-card);
 }
 
-.header {
+.permissions__header {
   display: flex;
   flex-shrink: 0;
   align-items: center;
@@ -240,53 +249,51 @@ export default { options: { styleIsolation: "shared" } };
   }
 }
 
-.tree-container {
+.permissions__tree {
   flex: 1;
-  height: 0; // 重要：让 flex + scroll-view 生效
+  height: 0; // scroll-view 要拿到确定高度，flex 剩余空间才生效
   background: var(--color-bg-card);
 }
 
-.node-content {
+.permissions__node {
   display: flex;
   flex: 1;
   gap: 16rpx;
   align-items: center;
   justify-content: flex-start;
   min-width: 0;
+}
 
-  &__info {
-    display: flex;
-    gap: 16rpx;
-    min-width: 0;
-  }
+.permissions__node-info {
+  display: flex;
+  gap: 16rpx;
+  min-width: 0;
+}
 
-  &__label {
-    overflow: hidden;
-    font-size: 28rpx;
-    color: var(--color-text);
-    text-overflow: ellipsis;
-    white-space: nowrap;
+.permissions__node-label {
+  overflow: hidden;
+  font-size: 28rpx;
+  color: var(--color-text);
+  text-overflow: ellipsis;
+  white-space: nowrap;
 
-    &.is-checked {
-      color: var(--color-primary);
-    }
+  &.is-checked {
+    color: var(--color-primary);
   }
 }
 
-.node-content :deep(.wd-tag) {
+// 类型标签右对齐，与左侧名称拉开
+.permissions__node :deep(.wd-tag) {
   margin-left: auto;
 }
 
-.bottom-bar {
+// 按钮用 block 撑满，容器只负责排列、间距与底部安全区
+.permissions__actions {
   display: flex;
   flex-shrink: 0;
   gap: 24rpx;
-  padding: 24rpx;
+  padding: 24rpx 24rpx calc(24rpx + env(safe-area-inset-bottom));
   background: var(--color-bg-card);
   box-shadow: 0 -2rpx 16rpx rgba(0, 0, 0, 0.05);
 }
-
-.bottom-bar :deep(.wd-button) {
-  flex: 1;
-}
 </style>
diff --git a/src/subPages/work/role/index.vue b/src/subPages/work/role/index.vue
index ccd8ea9..969d07f 100644
--- a/src/subPages/work/role/index.vue
+++ b/src/subPages/work/role/index.vue
@@ -43,7 +43,7 @@
           <view
             class="item-action"
             hover-class="item-action--hover"
-            @click.stop="showRoleActions(item)"
+            @click.stop="openRoleActions(item)"
           >
             <wd-icon name="more" size="18" class="color-text-secondary" />
           </view>
@@ -95,8 +95,8 @@
           </wd-form-item>
         </wd-form>
         <view class="popup-actions">
-          <wd-button type="info" variant="plain" @click="closeRoleDialog">取消</wd-button>
-          <wd-button :loading="isSubmitting" @click="submitRoleForm">保存</wd-button>
+          <wd-button type="info" variant="plain" block @click="closeRoleDialog">取消</wd-button>
+          <wd-button :loading="isSubmitting" block @click="submitRoleForm">保存</wd-button>
         </view>
       </view>
     </wd-popup>
@@ -115,12 +115,7 @@
     </wd-fab>
 
     <!-- 操作菜单 -->
-    <wd-action-sheet
-      v-model="actionSheetVisible"
-      :actions="actionSheetActions"
-      cancel-text="取消"
-      @select="handleActionSelect"
-    />
+    <ActionSheet ref="actionSheetRef" />
   </view>
 </template>
 
@@ -128,7 +123,8 @@
 import { onLoad } from "@dcloudio/uni-app";
 import { toFormSchema } from "@/utils/form-schema";
 import { useToast } from "@wot-ui/ui";
-import { useActionSheet, type ActionMenuOption } from "@/composables/useActionSheet";
+import ActionSheet, { type ActionSheetCommand } from "@/subPages/work/components/ActionSheet.vue";
+import { useConfirmAction } from "@/composables/useConfirmAction";
 import { usePagedList } from "@/composables/usePagedList";
 import RoleAPI, { type RolePageQuery, RoleItem, RoleForm } from "@/api/role";
 import { hasPermission } from "@/utils/permission";
@@ -139,8 +135,8 @@ definePage({
 });
 
 const toast = useToast();
-const { actionSheetVisible, actionSheetActions, showActions, handleActionSelect, confirmAction } =
-  useActionSheet();
+const { confirmAction } = useConfirmAction();
+const actionSheetRef = ref<InstanceType<typeof ActionSheet>>();
 const formRef = ref();
 const isSubmitting = ref(false);
 
@@ -234,22 +230,27 @@ function closeRoleDialog() {
 }
 
 // 更多操作
-function showRoleActions(item: RoleItem) {
-  const menus: ActionMenuOption[] = [];
+function openRoleActions(item: RoleItem) {
+  const commands: ActionSheetCommand[] = [];
 
   if (hasPermission("sys:role:update")) {
-    menus.push({ name: "编辑", handler: () => openRoleDialog(item.id) });
+    commands.push({ id: "edit", label: "编辑", execute: () => openRoleDialog(item.id) });
   }
 
   if (hasPermission("sys:role:assign")) {
-    menus.push({ name: "分配权限", handler: () => handleAssignPerm(item.id!) });
+    commands.push({
+      id: "assign-perm",
+      label: "分配权限",
+      execute: () => navigateToAssignPerm(item.id!),
+    });
   }
 
   if (hasPermission("sys:role:delete")) {
-    menus.push({
-      name: "删除",
+    commands.push({
+      id: "delete",
+      label: "删除",
       color: "var(--color-danger)",
-      handler: () =>
+      execute: () =>
         confirmAction({
           msg: `确定要删除角色「${item.name}」吗？`,
           action: async () => {
@@ -260,11 +261,11 @@ function showRoleActions(item: RoleItem) {
     });
   }
 
-  showActions(menus);
+  actionSheetRef.value?.open(commands);
 }
 
-// 分配权限
-function handleAssignPerm(id: number) {
+// 跳转分配权限页
+function navigateToAssignPerm(id: number) {
   uni.navigateTo({
     url: "/subPages/work/role/assign-perm/index?id=" + id,
   });
diff --git a/src/subPages/work/user/index.vue b/src/subPages/work/user/index.vue
index 499da3e..5f0f902 100644
--- a/src/subPages/work/user/index.vue
+++ b/src/subPages/work/user/index.vue
@@ -9,7 +9,7 @@
       />
     </view>
 
-    <!-- 排序筛选：搜索框→筛选 12rpx -->
+    <!-- 筛选栏：搜索框下方留白，具体间距跟随公共规则 -->
     <view class="filter-bar" @click="closeOutside">
       <view class="flex-1">
         <wd-drop-menu>
@@ -26,11 +26,7 @@
         <wd-drop-menu>
           <wd-drop-menu-item title="筛选">
             <view class="p-4">
-              <wd-input
-                v-model="queryParams.keywords"
-                label="关键字"
-                placeholder="用户名/昵称/手机号"
-              />
+              <wd-input v-model="queryParams.keywords" placeholder="用户名/昵称/手机号" />
               <wd-cell
                 title="创建时间"
                 :value="createTimeLabel"
@@ -45,8 +41,10 @@
                 allow-same-day
               />
               <view class="popup-actions">
-                <wd-button type="info" variant="plain" @click="resetUserFilter">重置</wd-button>
-                <wd-button @click="applyUserFilter">查询</wd-button>
+                <wd-button type="info" variant="plain" block @click="resetUserFilter">
+                  重置
+                </wd-button>
+                <wd-button block @click="applyUserFilter">查询</wd-button>
               </view>
             </view>
           </wd-drop-menu-item>
@@ -54,7 +52,7 @@
       </view>
     </view>
 
-    <!-- 用户列表：筛选→列表 16rpx -->
+    <!-- 用户列表：与筛选栏之间留出一段间距 -->
     <view class="mt-16rpx">
       <wd-card v-for="item in users" :key="item.id" @click="openUserDialog(item)">
         <!-- 主信息行：头像 + 昵称/角色部门 + 状态 -->
@@ -101,7 +99,7 @@
           <view
             class="item-action"
             hover-class="item-action--hover"
-            @click.stop="showUserActions(item)"
+            @click.stop="openUserActions(item)"
           >
             <wd-icon name="more" size="18" class="color-text-secondary" />
           </view>
@@ -179,8 +177,8 @@
           </wd-form-item>
         </wd-form>
         <view class="popup-actions">
-          <wd-button type="info" variant="plain" @click="closeUserDialog">取消</wd-button>
-          <wd-button :loading="isSubmitting" @click="handleUserSubmit">保存</wd-button>
+          <wd-button type="info" variant="plain" block @click="closeUserDialog">取消</wd-button>
+          <wd-button :loading="isSubmitting" block @click="submitUserForm">保存</wd-button>
         </view>
       </view>
     </wd-popup>
@@ -191,7 +189,7 @@
         hasPermission('sys:user:create') &&
         !dialog.visible &&
         !resetPwdDialog.visible &&
-        !actionSheetVisible
+        !actionSheetRef?.visible
       "
       :expandable="false"
       :gap="{ bottom: 32 }"
@@ -204,12 +202,7 @@
     </wd-fab>
 
     <!-- 操作菜单 -->
-    <wd-action-sheet
-      v-model="actionSheetVisible"
-      :actions="actionSheetActions"
-      cancel-text="取消"
-      @select="handleActionSelect"
-    />
+    <ActionSheet ref="actionSheetRef" />
 
     <!-- 重置密码弹窗 -->
     <wd-popup v-model="resetPwdDialog.visible" position="bottom" custom-class="popup-bottom">
@@ -221,10 +214,10 @@
           </wd-form-item>
         </wd-form>
         <view class="popup-actions">
-          <wd-button type="info" variant="plain" @click="resetPwdDialog.visible = false">
+          <wd-button type="info" variant="plain" block @click="resetPwdDialog.visible = false">
             取消
           </wd-button>
-          <wd-button :loading="resetPwdDialog.isSubmitting" @click="handleResetPassword">
+          <wd-button :loading="resetPwdDialog.isSubmitting" block @click="handleResetPassword">
             确认
           </wd-button>
         </view>
@@ -240,11 +233,13 @@ import type { CascaderOption } from "@wot-ui/ui/components/wd-cascader/types";
 import { toFormSchema } from "@/utils/form-schema";
 import { findOptionChain } from "@/utils/tree";
 import { useQueue, useToast } from "@wot-ui/ui";
-import { useActionSheet, type ActionMenuOption } from "@/composables/useActionSheet";
+import ActionSheet, { type ActionSheetCommand } from "@/subPages/work/components/ActionSheet.vue";
+import { useConfirmAction } from "@/composables/useConfirmAction";
 import { usePagedList } from "@/composables/usePagedList";
 import UserAPI, { type UserPageQuery, UserItem, UserForm } from "@/api/user";
 import RoleAPI from "@/api/role";
 import DeptAPI from "@/api/dept";
+import { getErrorMessage } from "@/utils/error";
 import { hasPermission } from "@/utils/permission";
 
 definePage({
@@ -254,8 +249,8 @@ definePage({
 
 const toast = useToast();
 const { closeOutside } = useQueue();
-const { actionSheetVisible, actionSheetActions, showActions, handleActionSelect, confirmAction } =
-  useActionSheet();
+const { confirmAction } = useConfirmAction();
+const actionSheetRef = ref<InstanceType<typeof ActionSheet>>();
 const formRef = ref();
 const isSubmitting = ref(false);
 
@@ -416,7 +411,7 @@ async function openUserDialog(user?: UserItem) {
 }
 
 // 提交表单
-function handleUserSubmit() {
+function submitUserForm() {
   formRef.value.validate().then(({ valid }: { valid: boolean }) => {
     if (!valid) return;
     isSubmitting.value = true;
@@ -427,6 +422,9 @@ function handleUserSubmit() {
         closeUserDialog();
         loadUserList();
       })
+      .catch((error) => {
+        toast.error(getErrorMessage(error, "操作失败"));
+      })
       .finally(() => {
         isSubmitting.value = false;
       });
@@ -448,26 +446,38 @@ const resetPwdDialog = reactive({
 const resetPwdForm = reactive({ password: "" });
 const resetPwdFormRef = ref();
 
+const resetPwdRules = toFormSchema({
+  password: [
+    { required: true, message: "请输入新密码" },
+    { min: 6, message: "新密码不少于 6 位" },
+  ],
+});
+
 // 更多操作
-function showUserActions(item: UserItem) {
-  const menus: ActionMenuOption[] = [];
+function openUserActions(item: UserItem) {
+  const commands: ActionSheetCommand[] = [];
 
   // 重置密码
   if (hasPermission("sys:user:reset-password")) {
-    menus.push({ name: "重置密码", handler: () => openResetPwdDialog(item) });
+    commands.push({
+      id: "reset-password",
+      label: "重置密码",
+      execute: () => openResetPwdDialog(item),
+    });
   }
 
   // 编辑
   if (hasPermission("sys:user:update")) {
-    menus.push({ name: "编辑", handler: () => openUserDialog(item) });
+    commands.push({ id: "edit", label: "编辑", execute: () => openUserDialog(item) });
   }
 
   // 删除
   if (hasPermission("sys:user:delete")) {
-    menus.push({
-      name: "删除",
+    commands.push({
+      id: "delete",
+      label: "删除",
       color: "var(--color-danger)",
-      handler: () =>
+      execute: () =>
         confirmAction({
           msg: `确定要删除用户「${item.nickname}」吗？`,
           action: async () => {
@@ -478,7 +488,7 @@ function showUserActions(item: UserItem) {
     });
   }
 
-  showActions(menus);
+  actionSheetRef.value?.open(commands);
 }
 
 // 打开重置密码弹窗
@@ -503,7 +513,7 @@ async function handleResetPassword() {
     toast.success("密码重置成功");
     resetPwdDialog.visible = false;
   } catch (error) {
-    // API 已处理错误提示
+    toast.error(getErrorMessage(error, "密码重置失败"));
   } finally {
     resetPwdDialog.isSubmitting = false;
   }
diff --git a/src/types/wot-ui-component-shims.d.ts b/src/types/wot-ui-component-shims.d.ts
deleted file mode 100644
index a46c130..0000000
--- a/src/types/wot-ui-component-shims.d.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-declare module "@wot-ui/ui/components/wd-button/wd-button.vue" {
-  import type { DefineComponent } from "vue";
-
-  const component: DefineComponent<Record<string, unknown>, Record<string, unknown>, any>;
-  export default component;
-}
-
-declare module "@wot-ui/ui/components/wd-config-provider/wd-config-provider.vue" {
-  import type { DefineComponent } from "vue";
-
-  const component: DefineComponent<Record<string, unknown>, Record<string, unknown>, any>;
-  export default component;
-}
-
-declare module "@wot-ui/ui/components/wd-root-portal/wd-root-portal.vue" {
-  import type { DefineComponent } from "vue";
-
-  const component: DefineComponent<Record<string, unknown>, Record<string, unknown>, any>;
-  export default component;
-}
diff --git a/src/utils/auth.ts b/src/utils/auth.ts
index 0ca1800..05fce6a 100644
--- a/src/utils/auth.ts
+++ b/src/utils/auth.ts
@@ -4,38 +4,35 @@ import { ACCESS_TOKEN_KEY, REFRESH_TOKEN_KEY } from "@/constants";
 /**
  * 认证工具函数
  *
- * 使用示例：
- *
- * 1. 检查登录状态并自动跳转：
- *    if (!checkLogin()) return; // 未登录会自动跳转到登录页
- *
- * 2. 静默检查登录状态统一走 user store 的 isAuthenticated
+ * 登录态的唯一事实来源是 user store 的 isAuthenticated（由 accessToken 派生）；
+ * 需要静默判断登录态时直接读 store，本模块只负责令牌持久化与缺令牌时的跳转。
  */
 
 /**
  * 获取访问令牌
- * @returns 返回访问令牌，如果不存在则返回null
+ *
+ * @returns 访问令牌，未登录时为 null
  */
 export function getAccessToken(): string | null {
   return Storage.get<string>(ACCESS_TOKEN_KEY) || null;
 }
 
 /**
- * 设置访问令牌
- * @param token 访问令牌
+ * 保存访问令牌
+ *
+ * @param token - 登录接口返回的访问令牌
  */
 export function setAccessToken(token: string): void {
   Storage.set(ACCESS_TOKEN_KEY, token);
 }
 
-/**
- * 清除所有令牌
- */
+/** 清除全部令牌 */
 export function clearTokens(): void {
   Storage.remove(ACCESS_TOKEN_KEY);
   Storage.remove(REFRESH_TOKEN_KEY);
 }
 
+// 当前页面路径（含查询参数），用于登录后跳回原页面
 function getCurrentPagePath(): string {
   const pages = getCurrentPages();
   if (pages.length === 0) return "/pages/index/index";
@@ -52,22 +49,22 @@ function getCurrentPagePath(): string {
 }
 
 /**
- * 检查用户登录状态，未登录则跳转到登录页面
- * @param silent 是否静默检查，不跳转登录页面
- * @returns 返回用户是否已登录
+ * 确保已登录
+ *
+ * 缺少令牌时跳转登录页并带上来路地址，navigateTo 失败（页面栈已满）时改用 reLaunch。
+ *
+ * @returns 是否已登录
  */
-export function checkLogin(silent: boolean = false): boolean {
+export function ensureAuthenticated(): boolean {
   if (getAccessToken()) return true;
 
-  if (!silent) {
-    const redirect = encodeURIComponent(getCurrentPagePath());
-    uni.navigateTo({
-      url: `/pages/login/index?redirect=${redirect}`,
-      fail: () => {
-        uni.reLaunch({ url: "/pages/login/index" });
-      },
-    });
-  }
+  const redirect = encodeURIComponent(getCurrentPagePath());
+  uni.navigateTo({
+    url: `/pages/login/index?redirect=${redirect}`,
+    fail: () => {
+      uni.reLaunch({ url: "/pages/login/index" });
+    },
+  });
 
   return false;
 }
diff --git a/src/utils/permission.ts b/src/utils/permission.ts
index ce74ad8..7f83a60 100644
--- a/src/utils/permission.ts
+++ b/src/utils/permission.ts
@@ -1,9 +1,7 @@
 import { useUserStore } from "@/store";
 import { ROLE_ROOT, PERM_ALL } from "@/constants";
 
-/**
- * 判断当前用户是否拥有指定权限点（任一命中即可，根角色或通配权限直接放行）
- */
+/** 判断当前用户是否拥有指定权限点（任一命中即可，根角色或通配权限直接放行） */
 export function hasPermission(perm: string | string[]): boolean {
   if (!perm) return false;
 
diff --git a/src/utils/request.ts b/src/utils/request.ts
index cb1f93d..3551dca 100644
--- a/src/utils/request.ts
+++ b/src/utils/request.ts
@@ -10,16 +10,12 @@ let isRedirecting401 = false;
 // request 层不直接依赖 store，避免 request → store → api → request 循环引用
 let unauthorizedHandler: (() => void) | null = null;
 
-/**
- * 注册会话失效回调（内存 token、userInfo 等由回调所属方统一清理）
- */
+/** 注册会话失效回调（内存 token、userInfo 等由回调所属方统一清理） */
 export function setUnauthorizedHandler(handler: () => void): void {
   unauthorizedHandler = handler;
 }
 
-/**
- * 请求错误类
- */
+/** 请求错误类 */
 export class RequestError extends Error {
   /** HTTP 状态码 */
   statusCode: number;
diff --git a/src/utils/storage.ts b/src/utils/storage.ts
index 2572539..dfaaf69 100644
--- a/src/utils/storage.ts
+++ b/src/utils/storage.ts
@@ -3,19 +3,11 @@
  * 提供uni-app Storage操作方法
  */
 
-import {
-  ACCESS_TOKEN_KEY,
-  REFRESH_TOKEN_KEY,
-  THEME_MODE_KEY,
-  THEME_COLOR_KEY,
-} from "@/constants";
+import { ACCESS_TOKEN_KEY, REFRESH_TOKEN_KEY, THEME_MODE_KEY, THEME_COLOR_KEY } from "@/constants";
 
 /** 清理缓存时保留的键：登录态与主题偏好（清掉会导致下次启动退出登录、设置被重置） */
 const PRESERVED_KEYS = [ACCESS_TOKEN_KEY, REFRESH_TOKEN_KEY, THEME_MODE_KEY, THEME_COLOR_KEY];
 
-/**
- * localStorage 存储
- */
 function set<T>(key: string, value: T): void {
   uni.setStorageSync(key, JSON.stringify(value));
 }
diff --git a/tsconfig.json b/tsconfig.json
index 56d4aa8..c7e609d 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -21,9 +21,10 @@
     "plugins": ["@uni-helper/uni-types/volar-plugin"],
     // 禁用原生组件严格类型检查（uni-app 原生组件与 Volar 的兼容性问题）
     "nativeTags": ["block", "component", "template", "slot"],
-    // 忽略 slot props 隐式 any 类型错误（递归组件 slot 转发的已知限制）
+    // 模板类型检查在 vue-tsc 默认工程里关闭：@wot-ui/ui 内部 SFC 模板（canvas id / inputmode
+    // 等原生属性写法）在严格模板模式下报错，工程无法只针对自有文件开启。
+    // 自有文件的模板检查走 tsconfig.templates.json + scripts/check-templates.mjs。
     "strictTemplates": false,
-    // Wot UI 的 SFC 模板类型与当前 uni 类型存在兼容问题，脚本类型仍保留检查
     "skipTemplateCodegen": true
   },
   "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
diff --git a/tsconfig.templates.json b/tsconfig.templates.json
new file mode 100644
index 0000000..39c7a93
--- /dev/null
+++ b/tsconfig.templates.json
@@ -0,0 +1,11 @@
+{
+  // 模板类型检查专用配置：开启 strictTemplates 后 @wot-ui/ui 内部 SFC 会报错，
+  // 因此该配置只用于 scripts/check-templates.mjs，脚本只统计 src 下的错误
+  "extends": "./tsconfig.json",
+  "vueCompilerOptions": {
+    "plugins": ["@uni-helper/uni-types/volar-plugin"],
+    "nativeTags": ["block", "component", "template", "slot"],
+    "strictTemplates": true,
+    "skipTemplateCodegen": false
+  }
+}
diff --git a/unocss.config.ts b/unocss.config.ts
index ff74f9d..26f37c5 100644
--- a/unocss.config.ts
+++ b/unocss.config.ts
@@ -11,6 +11,7 @@ export default {
     presetWeappAttributify(),
   ],
   // 只保留实际复用的组合；语义色直接用 color-* 类，其余交给 presetWeapp 自带规则
+  // flex-* 系列固定 flex 方向并统一交叉轴居中，需要其他对齐时直接写工具类
   shortcuts: [
     {
       "flex-center": "flex justify-center items-center",
@@ -18,8 +19,6 @@ export default {
       "flex-start": "flex justify-start items-center",
       "flex-end": "flex justify-end items-center",
       "flex-between": "flex justify-between items-center",
-
-      "font-bold": "font-semibold",
     },
   ],