布局
布局定义 VISTA B 后台页面的基础骨架。标准页面由顶导航、左导航、页面标题、顶部操作和内容区域组成；没有对应功能时隐藏该区域，不保留空占位。
设计稿入口：
页面骨架
后台页面从上到下、从左到右分为五个区域。页面标题和顶部操作位于主内容区内部，内容区域承载表格、分页、卡片或业务组件。
区域职责
固定在页面顶部，承载产品切换、多标签、消息提醒和用户入口。
展示当前后台模块的页面树，支持展开收起和当前项高亮。
展示面包屑和当前业务上下文，例如正在配置的项目或空间。
放置筛选、主按钮、批量操作和页面级快捷操作。
承载业务主体，常见形态包括表格、卡片网格、详情表单和配置面板。
顶导航
顶导航固定在页面顶部。左侧放 HOME VISTA Logo 和后台总导航入口，中间放已打开页面的标签页，右侧放消息提醒和用户入口。没有消息、用户或多标签能力时，直接隐藏对应模块。
导航下拉
Logo 下拉用于切换后台一级产品或功能模块。菜单项左侧使用图标，右侧只在必要时展示状态或数量；当前模块使用浅色背景高亮。账号下拉展示用户名、邮箱、产品线、语言、修改密码和退出登录。
左导航
左导航承载当前后台模块内的页面树。一级导航表示父级功能，默认可展开收起；二级导航表示子级功能，选中项用浅灰或浅品牌色背景突出。导航项右侧可以出现新增、数量和更多操作。
页面标题
页面标题位于主内容区顶部。左侧使用面包屑表示当前层级，点击上级面包屑返回对应层级；右侧可展示当前项目或空间上下文。没有项目上下文时隐藏右侧内容。
顶部操作
顶部操作位于页面标题下方。左侧放筛选条件，右侧放页面级主操作；筛选项超过 5 个时需要分类或折叠。新增类主按钮使用品牌渐变并带加号，批量操作另起一行，删除类批量操作使用红色线框。
内容区域
内容区域承载页面主体。表格页默认撑满主内容宽度，并在表格底部右侧放分页；少于 5 列的表格宽度收窄到 768px，避免内容被拉得过散。卡片页使用响应式网格，单张卡片宽度控制在 220px 到 280px。
卡片内容
卡片内容用于平面图、户型图、立面图、住户表等缩略图场景。图片按大边撑满容器，住户表需要填充相同背景色。卡片 hover 时可露出拖拽排序、替换图片、查看大图和更多操作。
启用
启用
停用
使用规则
- B 端页面默认复用标准骨架，不为缺失功能保留空白区域。
- 左导航支持一级和二级，必要时可继续扩展，但当前项必须清晰可见。
- 1 到 5 个筛选项平铺，超过 5 个后分类或折叠。
- 新增类主按钮使用品牌渐变，图标使用加号。
- 批量操作与主操作分行展示，删除类使用危险色。
- 表格默认撑满主内容区，少于 5 列时收窄到
768px。 - 卡片网格响应式排列，单卡宽度控制在
220px到280px。
规格
| 项目 | 规范 |
|---|---|
| 顶导航 | 固定在页面顶部，承载产品切换、多标签、消息和用户入口 |
| 左导航 | 展示当前模块内的多层级菜单，页面无侧边菜单时隐藏 |
| 页面标题 | 展示面包屑和右侧上下文，页面无层级时可简化 |
| 顶部操作 | 包含筛选、主按钮和批量操作，无筛选或操作时隐藏对应内容 |
| 内容区域 | 承载表格、分页、卡片或业务组件，B 端页面必须提供 |
| 表格宽度 | 默认撑满主内容区，少于 5 列时收窄到 768px |
| 卡片宽度 | 单卡宽度控制在 220px 到 280px |