1.1 基础布局

管理端采用「顶部导航栏 + 左侧侧边栏 + 内联区」的三段式布局框架，所有页面共用该框架，仅内联区内容随路由切换而变化。

顶部导航栏

顶部导航栏固定在页面顶部，始终可见，不随页面内容滚动。采用两端对齐布局，分为左区和右区。

左区（从左至右）：

• 【侧边栏折叠图标】：点击展开或折叠左侧侧边栏
• 【当前位置导航】：显示当前页面所在层级路径，点击上级路径可快速跳转

右区（从左至右）：

• 【菜单搜索】：点击展开搜索框，支持按关键词快速定位系统菜单
• 【语言切换】：切换页面显示语言
• 【布局配置】：自定义页面 UI 布局与主题设置
• 【消息通知】：显示未读消息数量角标，点击进入消息中心
• 【全屏设置】：切换全屏/退出全屏模式
• 【用户信息】：展示当前登录用户名，点击展开下拉菜单，可执行返回首页、进入个人中心、退出登录操作

顶部导航栏交互说明：

• 所有功能图标默认仅展示图标，鼠标悬停时显示文字说明
• 【菜单搜索】点击展开搜索框，支持以下两种搜索方式：
  1. 关键词搜索：输入页面标题关键词，搜索结果实时展示所有包含该关键词的页面标题路由
  2. 路径搜索：输入路由路径，以 < 符号从小到大体现层级关系，例如"中大件订单列表 < 订单管理"。 点击搜索结果后，内联区将直接加载并展示对应页面。
• 【用户信息】展示当前登录用户的用户名，点击后以下拉菜单形式展开，可执行以下操作：
  • 返回首页：跳转至系统首页
  • 个人中心：在页面右侧弹出个人信息侧边窗口，包含以下三个标签页：
    1. 【基本信息】：可修改手机号、邮箱、昵称、姓名等信息，用户名不可
    2. 【安全信息】：修改登录密码
    3. 【社交登录】：绑定第三方应用账号，目前支持企业微信和钉钉
  • 退出登录：退出当前账号，返回登录页

左侧侧边栏

1. 折叠与展开 用户可通过点击顶部导航栏的【侧边栏折叠图标】图标切换侧边栏状态：

   • 展开状态：完整展示各级菜单的图标与文字标签
   • 折叠状态：仅展示一级菜单图标，鼠标悬停时显示对应菜单名称

2. 菜单结构 侧边栏采用多级树形菜单结构，最多支持三级层级：

   • 一级菜单：默认全部展示，左侧带有功能图标，右侧带有展开/收起箭头，点击箭头可展开或收起子菜单
   • 二级菜单：以缩进形式展示在一级菜单下方，可进一步展开对应的三级菜单
   • 三级菜单：为最末级导航项，点击后在内联区加载对应页面

3. 选中与高亮

   • 当前访问的页面对应菜单项高亮显示，便于用户感知所在位置
   • 若当前页面为二级或三级菜单，折叠子菜单时高亮其上级菜单
   • 页面刷新后，侧边栏自动定位并高亮至当前路由对应的菜单项

左侧侧边栏交互说明：

• 同一时间仅允许一个一级菜单处于展开状态，点击其他一级菜单时，当前展开的菜单自动收起
• 侧边栏支持纵向滚动，菜单项过多时不影响顶部导航栏的固定显示

内联区

内联区位于顶部导航栏下方、侧边栏右侧，用于展示当前所处页面的具体内容。点击侧边栏菜单项或顶部标签页时，内容区随之更新并显示对应页面。各功能页面的详细说明将在后续章节中逐一介绍。