EtPanel · 停靠面板
侧/底停靠面板:标题栏(标题 + 工具位 + 动作组)+ 内容区,状态只由 props 来。
紧凑 24文件
文件 · 12 项
默认 32文件
文件 · 12 项
宽松 40文件
文件 · 12 项
API
Props
| 名称 | 类型 | 默认 | 说明 |
|---|---|---|---|
| panel | Object | null | 布局节点:{ id, title, size, min, max, collapsed, hidden, closable } |
| maximized | Boolean | false | 全屏态(由 EtDock / EtWorkbench 持有并传入;同刻全局只有一个面板为真) |
| bodyScroll | Boolean | true | 内容区滚动(默认开;关掉后内容自溢出由消费方自己管) |
Emits
| 事件 | 载荷 | 说明 |
|---|---|---|
| collapse | panel.id | 标题栏折叠钮按下;载荷 = 面板 id。本件不自存状态,产品改树后回写 props.panel |
| expand | panel.id | 折叠态下点击把手展开;载荷 = 面板 id |
| close | panel.id | 关闭钮按下;载荷 = 面板 id(隐藏 ≠ 不可达,产品可用 showPanel 拉回) |
| maximize | panel.id | 最大化钮按下;载荷 = 面板 id(写进树的 maximized) |
| restore | — | 从最大化还原(无载荷:还原的就是本面板) |
Slots
| 槽 | 吃什么 | 作用域 |
|---|---|---|
| #tools | 标题栏右侧工具位(关闭 / 最大化 / 自定义) | — |
| default | 面板内容(要滚动就套 EtScrollArea) | |
键盘 · 可访问名 · 密度
| 键盘 | 不接管按键 |
|---|---|
| 可访问名 | aria-label |
| 密度 | --et-chrome-bg--et-chrome-separator--et-density-base-font--et-density-line-height |
行为
- 标题栏 = 标题 + tools 工具位 + 动作组(折叠 / 最大化|还原 / 关闭)。
- 本件不存
collapsed/maximized:单一事实源是布局树,写树入口在 EtWorkbench。 - 折叠态内容用
v-if不渲染(省 DOM,折叠后面板不占事件天然成立)。 - 全屏只做视觉放大 + 层级抬升,不用 fixed 定位(那会提出工作台流、盖住 chrome)。
closable !== false才渲染关闭钮;三个动作钮都带aria-label(G4)。
令牌与门禁
--et-panel-header-height(28px,不随密度档变化)、--et-icon-sm(标题栏图标 16 档)。- G7:标题栏高度钉死,内容溢出走内部滚动。