31b60e84ce
- 新增 ManagerRegistry 单例注册表，统一管理所有 Manager 实例 - 新增 BaseManager 基类，自动管理事件订阅清理 - 新增 BaseDialogManager 基类，统一对话框生命周期管理 - 重构 15 个 Manager 使用新基类 - 重构 Toolbar 按钮和 Menu 按钮移除 engine 参数依赖 - 删除 BimComponent 基类（已不再使用） - 为所有 Manager 和核心模块添加中文 JSDoc 注释
1960 lines
55 KiB
TypeScript
1960 lines
55 KiB
TypeScript
/**
|
||
* 对话框管理器抽象基类
|
||
* 子类需要实现 dialogId、dialogTitle 和 createContent 方法
|
||
*/
|
||
declare abstract class BaseDialogManager extends BaseManager {
|
||
/** 对话框实例 */
|
||
protected dialog: BimDialog | null;
|
||
/** 对话框是否可见 */
|
||
protected isVisible: boolean;
|
||
/** 对话框唯一标识（子类必须实现） */
|
||
protected abstract get dialogId(): string;
|
||
/** 对话框标题，支持国际化 key（子类必须实现） */
|
||
protected abstract get dialogTitle(): string;
|
||
/** 对话框宽度，默认 300 */
|
||
protected get dialogWidth(): number;
|
||
/** 对话框高度，默认 'auto' 自适应 */
|
||
protected get dialogHeight(): number | 'auto';
|
||
/** 对话框选项，默认可拖拽不可缩放 */
|
||
protected get dialogOptions(): DialogManagerOptions;
|
||
/** 创建对话框内容（子类必须实现） */
|
||
protected abstract createContent(): HTMLElement;
|
||
/** 对话框关闭时的回调，子类可重写 */
|
||
protected onDialogClose(): void;
|
||
/** 对话框创建后的回调，子类可重写 */
|
||
protected onDialogCreated(): void;
|
||
/** 销毁前的回调，子类可重写 */
|
||
protected onBeforeDestroy(): void;
|
||
/**
|
||
* 获取对话框位置
|
||
* 默认定位在容器右侧居中，子类可重写
|
||
*/
|
||
protected getDialogPosition(): {
|
||
x: number;
|
||
y: number;
|
||
};
|
||
/** 显示对话框 */
|
||
show(): void;
|
||
/** 隐藏对话框 */
|
||
hide(): void;
|
||
/** 切换对话框显示状态 */
|
||
toggle(): void;
|
||
/** 获取对话框是否打开 */
|
||
isOpen(): boolean;
|
||
/** 销毁对话框 */
|
||
protected destroyDialog(): void;
|
||
/** 销毁管理器 */
|
||
destroy(): void;
|
||
}
|
||
|
||
/**
|
||
* Manager 抽象基类
|
||
* - 自动获取 Registry 实例
|
||
* - 自动管理事件订阅的清理
|
||
*/
|
||
declare abstract class BaseManager {
|
||
/** 注册表实例 */
|
||
protected registry: ManagerRegistry;
|
||
/** 事件订阅列表，用于自动清理 */
|
||
private subscriptions;
|
||
constructor();
|
||
/**
|
||
* 订阅事件（自动追踪，destroy 时自动取消）
|
||
* @param event 事件名称
|
||
* @param handler 事件处理函数
|
||
*/
|
||
protected subscribe<K extends keyof EngineEvents>(event: K, handler: (payload: EngineEvents[K]) => void): void;
|
||
/**
|
||
* 发送事件
|
||
* @param event 事件名称
|
||
* @param payload 事件数据
|
||
*/
|
||
protected emit<K extends keyof EngineEvents>(event: K, payload: EngineEvents[K]): void;
|
||
/**
|
||
* 销毁 Manager，清理所有订阅
|
||
* 子类应该调用 super.destroy()
|
||
*/
|
||
destroy(): void;
|
||
}
|
||
|
||
declare class BimButtonGroup implements IBimComponent {
|
||
private container;
|
||
private options;
|
||
private groups;
|
||
private activeBtnIds;
|
||
private btnRefs;
|
||
private dropdownElement;
|
||
private hoverTimeout;
|
||
private customColors;
|
||
private unsubscribeLocale;
|
||
private unsubscribeTheme;
|
||
private readonly DEFAULT_ICON;
|
||
constructor(options: ButtonGroupOptions);
|
||
protected emit<K extends keyof EngineEvents>(event: K, payload: EngineEvents[K]): void;
|
||
private initContainer;
|
||
/**
|
||
* 设置事件拦截，防止事件冒泡到下层元素（如 3D 引擎）
|
||
*/
|
||
private setupEventInterception;
|
||
private updatePosition;
|
||
/**
|
||
* 应用样式到容器
|
||
*/
|
||
private applyStyles;
|
||
/**
|
||
* 设置主题的primary颜色（用于边框等）
|
||
*/
|
||
private setPrimaryColor;
|
||
/**
|
||
* 设置主题颜色
|
||
* 只会应用到没有被用户自定义的颜色属性上
|
||
*/
|
||
setTheme(theme: ThemeConfig): void;
|
||
/**
|
||
* 应用主题系统的 CSS 变量到容器
|
||
* 供 glass-pill 等样式变体使用
|
||
*/
|
||
private applyThemeCssVars;
|
||
/**
|
||
* 同步 CSS 变量到所有 dropdown 元素
|
||
* dropdown 被添加到 body，无法继承容器的 CSS 变量
|
||
*/
|
||
private syncDropdownCssVars;
|
||
/**
|
||
* 直接设置颜色（强制覆盖）
|
||
* 设置的颜色会被标记为自定义，后续的 setTheme 不会覆盖它们
|
||
*/
|
||
setColors(colors: ButtonGroupColors): void;
|
||
init(): Promise<void>;
|
||
setLocales(): void;
|
||
addGroup(groupId: string, beforeGroupId?: string): void;
|
||
addButton(config: ButtonConfig): void;
|
||
private findButton;
|
||
render(): void;
|
||
private renderGroup;
|
||
private renderButton;
|
||
/**
|
||
* 设置按钮的激活状态
|
||
* @param id 按钮 ID
|
||
* @param active 可选，如果不传则切换(toggle)当前状态
|
||
*/
|
||
setBtnActive(id: string, active?: boolean): void;
|
||
private handleClick;
|
||
/**
|
||
* 互斥关闭同范围内的其它已激活按钮，并触发它们的 onClick
|
||
* @param button 当前被激活的按钮
|
||
*/
|
||
private deactivateExclusiveSiblings;
|
||
private handleMouseEnter;
|
||
private handleMouseLeave;
|
||
private showDropdown;
|
||
private renderDropdownItem;
|
||
private closeDropdown;
|
||
private updateButtonState;
|
||
private getIcon;
|
||
updateButtonVisibility(id: string, visible: boolean): void;
|
||
setShowLabel(show: boolean): void;
|
||
private updateLabelsVisibility;
|
||
private findButtonById;
|
||
setBackgroundColor(color: string): void;
|
||
private isVisible;
|
||
destroy(): void;
|
||
}
|
||
|
||
/**
|
||
* 通用弹窗组件类
|
||
* 支持拖拽、缩放、自定义内容和位置。
|
||
*/
|
||
declare class BimDialog implements IBimComponent {
|
||
private element;
|
||
private options;
|
||
private container;
|
||
private header;
|
||
private contentArea;
|
||
private _isDestroyed;
|
||
private _isInitialized;
|
||
private unsubscribeTheme;
|
||
private unsubscribeLocale;
|
||
private rafId;
|
||
/**
|
||
* 构造函数
|
||
* @param options 弹窗配置选项
|
||
*/
|
||
constructor(options: DialogOptions);
|
||
/**
|
||
* 设置主题
|
||
* @param theme 全局主题配置
|
||
*/
|
||
setTheme(theme: ThemeConfig): void;
|
||
/**
|
||
* 初始化组件功能 (接口实现)
|
||
*/
|
||
init(): void;
|
||
setLocales(): void;
|
||
/**
|
||
* 创建弹窗的 DOM 结构
|
||
*/
|
||
private createDom;
|
||
/**
|
||
* 设置元素尺寸
|
||
*/
|
||
private setSize;
|
||
/**
|
||
* 根据内容自动调整弹窗宽度
|
||
* @param recenter 是否重新计算定位（例如保持居中），默认 true
|
||
*/
|
||
fitWidth(recenter?: boolean): void;
|
||
/**
|
||
* 根据内容自动调整弹窗高度
|
||
*
|
||
* 设计说明：
|
||
* - 主要用于“内容展开/收起”场景（比如测量面板展开后，Dialog 高度跟随变化）
|
||
* - 默认不改变用户拖拽后的当前位置，只做边界夹紧，避免弹窗超出容器
|
||
*
|
||
* @param recenter 是否根据 options.position 重新定位（默认 false）
|
||
*/
|
||
fitHeight(recenter?: boolean): void;
|
||
/**
|
||
* 边界夹紧：保持当前 left/top 不变的前提下，确保弹窗不超出容器
|
||
* 说明：用于 fitHeight / fitWidth 后的“尺寸变化”场景，避免弹窗被裁切。
|
||
*/
|
||
private clampToContainer;
|
||
/**
|
||
* 初始化弹窗位置
|
||
*/
|
||
private initPosition;
|
||
/**
|
||
* 初始化拖拽功能 (性能优化 + 解决粘手)
|
||
*/
|
||
private initDrag;
|
||
/**
|
||
* 初始化缩放功能 (性能优化 + 解决粘手)
|
||
*/
|
||
private initResize;
|
||
/**
|
||
* 动态设置内容
|
||
* @param content 内容元素或 HTML 字符串
|
||
*/
|
||
setContent(content: HTMLElement | string): void;
|
||
/**
|
||
* 关闭弹窗并销毁
|
||
*/
|
||
close(): void;
|
||
/**
|
||
* 销毁组件 (接口实现)
|
||
*/
|
||
destroy(): void;
|
||
}
|
||
|
||
export declare class BimEngine {
|
||
container: HTMLElement;
|
||
private wrapper;
|
||
private registry;
|
||
toolbar: ToolbarManager | null;
|
||
constructTreeBtn: ConstructTreeManagerBtn | null;
|
||
buttonGroup: ButtonGroupManager | null;
|
||
dialog: DialogManager | null;
|
||
engine: EngineManager | null;
|
||
rightKey: RightKeyManager | null;
|
||
propertyPanel: PropertyPanelManager | null;
|
||
measure: MeasureDialogManager | null;
|
||
sectionPlane: SectionPlaneDialogManager | null;
|
||
sectionAxis: SectionAxisDialogManager | null;
|
||
sectionBox: SectionBoxDialogManager | null;
|
||
walkControl: WalkControlManager | null;
|
||
map: MapDialogManager | null;
|
||
constructor(container: HTMLElement | string, options?: {
|
||
locale?: LocaleType;
|
||
theme?: ThemeType;
|
||
});
|
||
emit<K extends keyof EngineEvents>(event: K, payload: EngineEvents[K]): void;
|
||
on<K extends keyof EngineEvents>(event: K, listener: (payload: EngineEvents[K]) => void): () => void;
|
||
setLocale(locale: LocaleType): void;
|
||
getLocale(): LocaleType;
|
||
setTheme(theme: 'dark' | 'light'): void;
|
||
setCustomTheme(theme: ThemeConfig): void;
|
||
private init;
|
||
private updateTheme;
|
||
destroy(): void;
|
||
}
|
||
|
||
/**
|
||
* 树节点类
|
||
* 负责渲染单个节点、处理交互和递归
|
||
*/
|
||
declare class BimTreeNode {
|
||
config: TreeNodeConfig;
|
||
element: HTMLElement;
|
||
children: BimTreeNode[];
|
||
parent: BimTreeNode | null;
|
||
checkState: TreeNodeCheckState;
|
||
private contentEl;
|
||
private switcherEl;
|
||
private checkboxEl;
|
||
private titleEl;
|
||
private actionsEl;
|
||
private childrenContainer;
|
||
private onExpandChange;
|
||
private onCheckChange;
|
||
private onNodeClick;
|
||
private renderActions?;
|
||
constructor(config: TreeNodeConfig, options: TreeOptions, callbacks: {
|
||
onExpand: (n: BimTreeNode) => void;
|
||
onCheck: (n: BimTreeNode) => void;
|
||
onClick: (n: BimTreeNode) => void;
|
||
});
|
||
/**
|
||
* 创建节点 DOM
|
||
*/
|
||
private createDom;
|
||
/**
|
||
* 设置高亮选中状态 (Select 模式下)
|
||
*/
|
||
setSelected(selected: boolean): void;
|
||
/**
|
||
* 更新显示文本 (国际化支持) -> 移除国际化，直接显示
|
||
*/
|
||
updateLabel(): void;
|
||
/**
|
||
* 切换展开状态
|
||
*/
|
||
toggleExpand(force?: boolean): void;
|
||
/**
|
||
* 切换选中状态 (用户点击)
|
||
*/
|
||
toggleCheck(): void;
|
||
/**
|
||
* 设置选中状态 (API调用或联动)
|
||
* @param state 新状态
|
||
* @param fireEvent 是否触发事件
|
||
*/
|
||
setChecked(state: TreeNodeCheckState, fireEvent?: boolean): void;
|
||
/**
|
||
* 更新复选框 UI 样式
|
||
*/
|
||
updateCheckboxUI(): void;
|
||
/**
|
||
* 添加子节点实例
|
||
*/
|
||
appendChild(childNode: BimTreeNode): void;
|
||
/**
|
||
* 销毁
|
||
*/
|
||
destroy(): void;
|
||
}
|
||
|
||
/**
|
||
* Blur Token
|
||
* CSS backdrop-filter blur value (e.g., '24px')
|
||
*/
|
||
declare type BlurToken = string;
|
||
|
||
/** 按钮内部文字图标排列 */
|
||
declare type ButtonAlign = 'vertical' | 'horizontal';
|
||
|
||
/** 按钮配置 */
|
||
export declare interface ButtonConfig {
|
||
id: string;
|
||
type: ButtonType;
|
||
label: string;
|
||
icon?: string;
|
||
keepActive?: boolean;
|
||
/**
|
||
* 是否互斥（开关互斥）
|
||
*
|
||
* 行为说明：
|
||
* - 当按钮从“未激活”切换到“激活”时，如果该按钮开启了 exclusive，
|
||
* 会自动关闭同互斥范围内的其它已激活按钮，并触发它们的 onClick（用于执行关闭逻辑）。
|
||
* - 一级按钮：互斥范围 = 同 groupId 下的一级按钮
|
||
* - 二级按钮：互斥范围 = 同 groupId 且同 parentId 下的二级按钮
|
||
*
|
||
* 注意：该能力通常与 keepActive 搭配使用。
|
||
*/
|
||
exclusive?: boolean;
|
||
isActive?: boolean;
|
||
disabled?: boolean;
|
||
onClick?: (button: OptButton) => void;
|
||
children?: ButtonConfig[];
|
||
groupId?: string;
|
||
parentId?: string;
|
||
/** 按钮内部图标文字排列 (默认 vertical，即图标在上) */
|
||
align?: ButtonAlign;
|
||
/** 图标大小 (正方形，单位 px，默认 32) */
|
||
iconSize?: number;
|
||
/** 按钮最小宽度 (单位 px，默认 50) */
|
||
minWidth?: number;
|
||
}
|
||
|
||
declare interface ButtonGroupColors {
|
||
backgroundColor?: string;
|
||
btnBackgroundColor?: string;
|
||
btnHoverColor?: string;
|
||
btnActiveColor?: string;
|
||
iconColor?: string;
|
||
iconActiveColor?: string;
|
||
textColor?: string;
|
||
textActiveColor?: string;
|
||
}
|
||
|
||
/**
|
||
* 按钮组管理器
|
||
* 统一管理多个按钮组的创建、主题更新和销毁
|
||
*/
|
||
declare class ButtonGroupManager extends BaseManager {
|
||
/** 按钮组映射表 */
|
||
private groups;
|
||
/** 容器元素 */
|
||
private container;
|
||
constructor(container: HTMLElement);
|
||
/**
|
||
* 创建按钮组
|
||
* @param id 按钮组 ID
|
||
* @param options 按钮组配置
|
||
* @returns 按钮组实例
|
||
*/
|
||
create(id: string, options: Omit<ButtonGroupOptions, 'container'>): BimButtonGroup;
|
||
/**
|
||
* 获取按钮组
|
||
* @param id 按钮组 ID
|
||
* @returns 按钮组实例
|
||
*/
|
||
get(id: string): BimButtonGroup | undefined;
|
||
/**
|
||
* 更新所有按钮组的主题
|
||
* @param theme 主题配置
|
||
*/
|
||
updateTheme(theme: ThemeConfig): void;
|
||
/** 销毁管理器和所有按钮组 */
|
||
destroy(): void;
|
||
}
|
||
|
||
export declare interface ButtonGroupOptions extends ButtonGroupColors {
|
||
container: HTMLElement | string;
|
||
/** 样式类型 (默认 'default') */
|
||
type?: ButtonGroupType;
|
||
/** 屏幕位置 (如 top-left) */
|
||
position?: GroupPosition;
|
||
/** 按钮组排列方向 (默认 row) */
|
||
direction?: GroupDirection;
|
||
/** 按钮内部图标文字排列 (默认 vertical) */
|
||
align?: ButtonAlign;
|
||
/** 菜单展开方向 */
|
||
expand?: ExpandDirection;
|
||
showLabel?: boolean;
|
||
visibility?: Record<string, boolean>;
|
||
className?: string;
|
||
}
|
||
|
||
/** 按钮组样式类型 */
|
||
declare type ButtonGroupType = 'default' | 'glass-pill';
|
||
|
||
declare type ButtonType = 'button' | 'menu';
|
||
|
||
/**
|
||
* 角色模型类型
|
||
*/
|
||
declare type CharacterModel = 'office-male' | 'construction-worker';
|
||
|
||
export declare interface CollapseItemConfig {
|
||
/** 唯一标识符 */
|
||
id: string;
|
||
/** 标题文本的翻译键 (例如 'panel.attributes') */
|
||
title: string;
|
||
/** 内容: HTML字符串 或 HTMLElement */
|
||
content: string | HTMLElement;
|
||
/** 标题栏左侧图标 (SVG 字符串, 可选) */
|
||
icon?: string;
|
||
/** 标题栏右侧额外内容 (可选) */
|
||
extra?: string | HTMLElement;
|
||
/** 是否禁用 */
|
||
disabled?: boolean;
|
||
/** 自定义类名 */
|
||
className?: string;
|
||
}
|
||
|
||
export declare interface CollapseOptions {
|
||
/** 挂载容器 */
|
||
container: HTMLElement | string;
|
||
/** 面板项列表 */
|
||
items: CollapseItemConfig[];
|
||
/** 是否开启手风琴模式 (默认 false) */
|
||
accordion?: boolean;
|
||
/** 初始展开的面板 ID 列表 */
|
||
activeIds?: string[];
|
||
/** 是否显示边框 (默认 true) */
|
||
bordered?: boolean;
|
||
/** 是否幽灵模式 (默认 false) */
|
||
ghost?: boolean;
|
||
/** 自定义类名 */
|
||
className?: string;
|
||
/** 切换面板时的回调 */
|
||
onChange?: (activeIds: string[]) => void;
|
||
}
|
||
|
||
/**
|
||
* BIM Engine SDK - Unified Theme System
|
||
*
|
||
* Design Principles:
|
||
* 1. Semantic naming - colors describe PURPOSE, not appearance
|
||
* 2. Hierarchical structure - organized by category for scalability
|
||
* 3. Complete coverage - all UI states and component needs
|
||
* 4. Accessibility - ensures proper contrast ratios
|
||
* 5. Glassmorphism support - includes transparency and blur values
|
||
*
|
||
* Color Palette Reference: Tailwind CSS (slate, blue, red, green, amber)
|
||
*/
|
||
/**
|
||
* Semantic Color Token
|
||
* Represents a single color value with optional transparency
|
||
*/
|
||
declare type ColorToken = string;
|
||
|
||
/**
|
||
* 构件树管理器
|
||
* 管理左上角的构件树按钮和对话框
|
||
*/
|
||
declare class ConstructTreeManagerBtn extends BaseManager {
|
||
/** 按钮组实例 */
|
||
private toolbar;
|
||
/** 按钮容器元素 */
|
||
private toolbarContainer;
|
||
/** 主容器元素 */
|
||
private container;
|
||
/** 构件树对话框实例 */
|
||
private dialog;
|
||
constructor(container: HTMLElement);
|
||
/** 初始化按钮 */
|
||
private init;
|
||
/** 打开构件树对话框 */
|
||
openConstructTreeDialog(): void;
|
||
/** 刷新渲染 */
|
||
refresh(): void;
|
||
/** 销毁管理器 */
|
||
destroy(): void;
|
||
/**
|
||
* 添加按钮组
|
||
* @param groupId 组 ID
|
||
* @param beforeGroupId 插入位置
|
||
*/
|
||
addGroup(groupId: string, beforeGroupId?: string): void;
|
||
/**
|
||
* 添加按钮
|
||
* @param config 按钮配置
|
||
*/
|
||
addButton(config: ButtonConfig): void;
|
||
/**
|
||
* 设置按钮可见性
|
||
* @param id 按钮 ID
|
||
* @param v 是否可见
|
||
*/
|
||
setButtonVisibility(id: string, v: boolean): void;
|
||
/**
|
||
* 设置是否显示标签
|
||
* @param show 是否显示
|
||
*/
|
||
setShowLabel(show: boolean): void;
|
||
/**
|
||
* 设置按钮组可见性
|
||
* @param visible 是否可见
|
||
*/
|
||
setVisible(visible: boolean): void;
|
||
/**
|
||
* 设置背景颜色
|
||
* @param color 颜色值
|
||
*/
|
||
setBackgroundColor(color: string): void;
|
||
/**
|
||
* 设置按钮组颜色
|
||
* @param colors 颜色配置
|
||
*/
|
||
setColors(colors: ButtonGroupColors): void;
|
||
}
|
||
|
||
/**
|
||
* 描述列表项配置
|
||
*/
|
||
export declare interface DescriptionItem {
|
||
/** 标签文本 (直接显示，组件内部不翻译) */
|
||
label: string;
|
||
/** 内容文本或元素 */
|
||
value: string | HTMLElement;
|
||
/** 行级自定义标签颜色 */
|
||
labelColor?: string;
|
||
/** 行级自定义内容颜色 */
|
||
valueColor?: string;
|
||
/** 自定义类名 */
|
||
className?: string;
|
||
}
|
||
|
||
/**
|
||
* 描述列表组件配置
|
||
*/
|
||
export declare interface DescriptionOptions {
|
||
/** 挂载容器 */
|
||
container: HTMLElement | string;
|
||
/** 数据项列表 */
|
||
items: DescriptionItem[];
|
||
/**
|
||
* 是否显示边框 (默认 false)
|
||
* 开启后，将显示行间分割线以及 Key-Value 之间的纵向分割线
|
||
*/
|
||
bordered?: boolean;
|
||
/** 标签固定宽度 (例如 '80px')，若不设置则自适应 */
|
||
labelWidth?: string;
|
||
/** 全局标签颜色 */
|
||
labelColor?: string;
|
||
/** 全局内容颜色 */
|
||
valueColor?: string;
|
||
/** 全局字体大小 */
|
||
fontSize?: string;
|
||
/** 标签内边距 (默认 '0 4px') */
|
||
labelPadding?: string;
|
||
/** 内容内边距 (默认 '0 4px') */
|
||
valuePadding?: string;
|
||
/** 自定义类名 */
|
||
className?: string;
|
||
}
|
||
|
||
/**
|
||
* 弹窗颜色配置
|
||
*/
|
||
declare interface DialogColors {
|
||
/** 窗体背景颜色，默认 rgba(17, 17, 17, 0.95) */
|
||
backgroundColor?: string;
|
||
/** 标题栏背景颜色，默认 #2a2a2a */
|
||
headerBackgroundColor?: string;
|
||
/** 标题文字颜色，默认 #fff */
|
||
titleColor?: string;
|
||
/** 内容文字颜色，默认 #ccc */
|
||
textColor?: string;
|
||
/** 边框颜色，默认 #444 */
|
||
borderColor?: string;
|
||
}
|
||
|
||
/**
|
||
* 对话框管理器
|
||
* 统一管理对话框的创建、主题更新和销毁
|
||
*/
|
||
declare class DialogManager extends BaseManager {
|
||
/** 容器元素 */
|
||
private container;
|
||
/** 活跃的对话框列表 */
|
||
private activeDialogs;
|
||
constructor(container: HTMLElement);
|
||
/**
|
||
* 创建对话框
|
||
* @param options 对话框配置选项
|
||
* @returns 对话框实例
|
||
*/
|
||
create(options: Omit<DialogOptions, 'container'>): BimDialog;
|
||
/** 显示信息对话框 */
|
||
showInfoDialog(): void;
|
||
/**
|
||
* 更新所有对话框的主题
|
||
* @param theme 主题配置
|
||
*/
|
||
updateTheme(theme: ThemeConfig): void;
|
||
/** 销毁管理器和所有对话框 */
|
||
destroy(): void;
|
||
}
|
||
|
||
/** 对话框配置选项 */
|
||
declare interface DialogManagerOptions {
|
||
/** 是否可拖拽 */
|
||
draggable?: boolean;
|
||
/** 是否可调整大小 */
|
||
resizable?: boolean;
|
||
}
|
||
|
||
/**
|
||
* 弹窗配置选项接口
|
||
*/
|
||
export declare interface DialogOptions extends DialogColors {
|
||
/** 弹窗挂载的父容器 */
|
||
container: HTMLElement;
|
||
/** 弹窗标题 */
|
||
title?: string;
|
||
/** 弹窗内容，支持 HTML 字符串或 HTMLElement */
|
||
content?: HTMLElement | string;
|
||
/** 弹窗宽度，数字（像素）或字符串（如 '50%'） */
|
||
width?: number | string;
|
||
/** 弹窗高度 */
|
||
height?: number | string;
|
||
/** 弹窗位置 */
|
||
position?: DialogPosition;
|
||
/** 是否可拖拽 */
|
||
draggable?: boolean;
|
||
/** 是否可调整大小 */
|
||
resizable?: boolean;
|
||
/** 最小宽度限制 */
|
||
minWidth?: number;
|
||
/** 最小高度限制 */
|
||
minHeight?: number;
|
||
/** 关闭时的回调函数 */
|
||
onClose?: () => void;
|
||
/** 打开时的回调函数 */
|
||
onOpen?: () => void;
|
||
/** 弹窗唯一标识 ID (可选) */
|
||
id?: string;
|
||
}
|
||
|
||
/**
|
||
* 弹窗位置类型定义
|
||
* 可以是预设的字符串位置（如 'center', 'top-left' 等），
|
||
* 也可以是具体的坐标对象 { x, y }
|
||
*/
|
||
export declare type DialogPosition = 'center' | 'top-left' | 'top-center' | 'top-right' | 'left-center' | 'right-center' | 'bottom-left' | 'bottom-center' | 'bottom-right' | {
|
||
x: number;
|
||
y: number;
|
||
};
|
||
|
||
export declare interface EngineEvents {
|
||
'ui:open-dialog': {
|
||
id: string;
|
||
data?: any;
|
||
};
|
||
'ui:close-dialog': {
|
||
id: string;
|
||
};
|
||
'engine:model-loaded': {
|
||
url: string;
|
||
};
|
||
'engine:object-clicked': {
|
||
objectId: string;
|
||
position: {
|
||
x: number;
|
||
y: number;
|
||
z: number;
|
||
};
|
||
};
|
||
'ui:tree-node-check': {
|
||
id: string;
|
||
checked: boolean;
|
||
node: any;
|
||
};
|
||
'ui:tree-node-select': {
|
||
id: string;
|
||
selected: boolean;
|
||
node: any;
|
||
};
|
||
'ui:tree-node-expand': {
|
||
id: string;
|
||
expanded: boolean;
|
||
};
|
||
'ui:collapse-change': {
|
||
activeIds: string[];
|
||
};
|
||
'sys:theme-changed': {
|
||
theme: string;
|
||
};
|
||
'sys:locale-changed': {
|
||
locale: string;
|
||
};
|
||
'walk:path-mode-toggle': {
|
||
isActive: boolean;
|
||
};
|
||
'walk:walk-mode-toggle': {
|
||
isActive: boolean;
|
||
};
|
||
'walk:plan-view-toggle': {
|
||
isActive: boolean;
|
||
};
|
||
'walk:speed-change': {
|
||
speed: number;
|
||
};
|
||
'walk:gravity-toggle': {
|
||
enabled: boolean;
|
||
};
|
||
'walk:collision-toggle': {
|
||
enabled: boolean;
|
||
};
|
||
'map:opened': {};
|
||
'map:closed': {};
|
||
}
|
||
|
||
/**
|
||
* 3D 引擎管理器
|
||
* 封装底层 3D 引擎，提供模型加载、相机控制、测量等功能
|
||
*/
|
||
declare class EngineManager extends BaseManager {
|
||
/** 容器元素 */
|
||
private container;
|
||
/** 引擎实例 */
|
||
private engineInstance;
|
||
/** 右键菜单管理器 */
|
||
rightKey: RightKeyManager | null;
|
||
constructor(container: HTMLElement);
|
||
/**
|
||
* 初始化 3D 引擎
|
||
* @param options 引擎配置选项
|
||
* @returns 是否初始化成功
|
||
*/
|
||
initialize(options?: Omit<EngineOptions, 'container'>): boolean;
|
||
/**
|
||
* 检查引擎是否已初始化
|
||
* @returns 是否已初始化
|
||
*/
|
||
isInitialized(): boolean;
|
||
/**
|
||
* 加载模型
|
||
* @param url 模型 URL
|
||
* @param options 加载选项
|
||
*/
|
||
loadModel(url: string, options?: ModelLoadOptions): void;
|
||
/**
|
||
* 获取底层引擎实例
|
||
* @returns 引擎实例
|
||
*/
|
||
getEngine(): any;
|
||
/** 相机回到初始位置 */
|
||
CameraGoHome(): void;
|
||
/**
|
||
* 激活测量模式
|
||
* @param mode 测量模式
|
||
*/
|
||
activateMeasure(mode: MeasureMode): void;
|
||
/** 停用测量模式 */
|
||
deactivateMeasure(): void;
|
||
/**
|
||
* 获取当前测量类型
|
||
* @returns 当前测量模式
|
||
*/
|
||
getCurrentMeasureType(): MeasureMode | null;
|
||
/** 销毁引擎管理器 */
|
||
destroy(): void;
|
||
}
|
||
|
||
/**
|
||
* 引擎配置选项
|
||
* 用于 Engine 组件的初始化
|
||
*/
|
||
export declare interface EngineOptions {
|
||
/** 容器元素 */
|
||
container: HTMLElement;
|
||
/** 背景颜色（十六进制数字如 0x333333，或 CSS 字符串如 'linear-gradient(...)'） */
|
||
backgroundColor?: number | string;
|
||
/** WebGL 版本 */
|
||
version?: 'v1' | 'v2';
|
||
/** 是否显示性能统计 */
|
||
showStats?: boolean;
|
||
/** 是否显示视图立方体 */
|
||
showViewCube?: boolean;
|
||
}
|
||
|
||
/** 二级菜单展开方向 */
|
||
declare type ExpandDirection = 'up' | 'down' | 'left' | 'right';
|
||
|
||
/** 按钮组排列方向 (Flex-direction) */
|
||
declare type GroupDirection = 'row' | 'column';
|
||
|
||
/** 弹窗/按钮组位置 */
|
||
declare type GroupPosition = 'center' | 'top-left' | 'top-center' | 'top-right' | 'left-center' | 'right-center' | 'bottom-left' | 'bottom-center' | 'bottom-right' | {
|
||
x: number;
|
||
y: number;
|
||
} | 'static';
|
||
|
||
/**
|
||
* BIM 引擎组件通用接口
|
||
* 所有受引擎管理的 UI 组件都必须实现此接口
|
||
*/
|
||
export declare interface IBimComponent {
|
||
/**
|
||
* 初始化组件
|
||
* 用于创建 DOM、绑定事件、加载资源等
|
||
* 支持同步或异步操作
|
||
*/
|
||
init(): void | Promise<void>;
|
||
/**
|
||
* 设置主题
|
||
* 组件应在此方法中将 ThemeConfig 映射为自身的 CSS 变量或样式
|
||
*/
|
||
setTheme(theme: ThemeConfig): void;
|
||
/**
|
||
* 设置语言
|
||
*/
|
||
setLocales(): void;
|
||
/**
|
||
* 销毁组件
|
||
* 清理 DOM 事件监听、定时器和引用
|
||
*/
|
||
destroy(): void;
|
||
}
|
||
|
||
/**
|
||
* 语言<E8AFAD><E8A880>码类型
|
||
*/
|
||
declare type LocaleType = 'zh-CN' | 'en-US';
|
||
|
||
/**
|
||
* Manager 注册表 - 单例模式
|
||
* 提供所有 Manager 的全局访问点，替代 engine 层层传递
|
||
*/
|
||
declare class ManagerRegistry {
|
||
/** 单例实例 */
|
||
private static instance;
|
||
/** 事件发射器 */
|
||
private eventEmitter;
|
||
/** 主容器元素 */
|
||
container: HTMLElement | null;
|
||
/** 包装容器元素 */
|
||
wrapper: HTMLElement | null;
|
||
/** 工具栏管理器 */
|
||
toolbar: ToolbarManager | null;
|
||
/** 对话框管理器 */
|
||
dialog: DialogManager | null;
|
||
/** 3D 引擎管理器 */
|
||
engine3d: EngineManager | null;
|
||
/** 按钮组管理器 */
|
||
buttonGroup: ButtonGroupManager | null;
|
||
/** 右键菜单管理器 */
|
||
rightKey: RightKeyManager | null;
|
||
/** 构件树管理器 */
|
||
constructTree: ConstructTreeManagerBtn | null;
|
||
/** 属性面板管理器 */
|
||
propertyPanel: PropertyPanelManager | null;
|
||
/** 测量对话框管理器 */
|
||
measure: MeasureDialogManager | null;
|
||
/** 漫游控制管理器 */
|
||
walkControl: WalkControlManager | null;
|
||
/** 地图对话框管理器 */
|
||
map: MapDialogManager | null;
|
||
/** 拾取面剖切对话框管理器 */
|
||
sectionPlane: SectionPlaneDialogManager | null;
|
||
/** 轴向剖切对话框管理器 */
|
||
sectionAxis: SectionAxisDialogManager | null;
|
||
/** 剖切盒对话框管理器 */
|
||
sectionBox: SectionBoxDialogManager | null;
|
||
/** 漫游路径对话框管理器 */
|
||
walkPath: WalkPathDialogManager | null;
|
||
/** 漫游平面图对话框管理器 */
|
||
walkPlanView: WalkPlanViewDialogManager | null;
|
||
private constructor();
|
||
/** 获取单例实例 */
|
||
static getInstance(): ManagerRegistry;
|
||
/** 重置单例（用于测试或重新初始化） */
|
||
static reset(): void;
|
||
/**
|
||
* 发送事件
|
||
* @param event 事件名称
|
||
* @param payload 事件数据
|
||
*/
|
||
emit<K extends keyof EngineEvents>(event: K, payload: EngineEvents[K]): void;
|
||
/**
|
||
* 订阅事件
|
||
* @param event 事件名称
|
||
* @param listener 事件处理函数
|
||
* @returns 取消订阅的函数
|
||
*/
|
||
on<K extends keyof EngineEvents>(event: K, listener: (payload: EngineEvents[K]) => void): () => void;
|
||
/**
|
||
* 取消订阅事件
|
||
* @param event 事件名称
|
||
* @param listener 事件处理函数
|
||
*/
|
||
off<K extends keyof EngineEvents>(event: K, listener: (payload: EngineEvents[K]) => void): void;
|
||
/** 清除所有事件监听器 */
|
||
clearEvents(): void;
|
||
}
|
||
|
||
/**
|
||
* 地图对话框管理器
|
||
* 继承自 BaseDialogManager，提供地图面板的对话框管理功能
|
||
*/
|
||
declare class MapDialogManager extends BaseDialogManager {
|
||
/** 地图面板实例 */
|
||
private panel;
|
||
/** 对话框唯一标识 */
|
||
protected get dialogId(): string;
|
||
/** 对话框标题（国际化 key） */
|
||
protected get dialogTitle(): string;
|
||
/** 对话框宽度 */
|
||
protected get dialogWidth(): number;
|
||
/** 对话框高度 */
|
||
protected get dialogHeight(): number;
|
||
/** 初始化 */
|
||
init(): void;
|
||
/**
|
||
* 获取对话框位置
|
||
* 定位在容器左下角
|
||
*/
|
||
protected getDialogPosition(): {
|
||
x: number;
|
||
y: number;
|
||
};
|
||
/** 创建对话框内容 */
|
||
protected createContent(): HTMLElement;
|
||
/** 对话框创建后的回调 */
|
||
protected onDialogCreated(): void;
|
||
/** 对话框关闭时的回调 */
|
||
protected onDialogClose(): void;
|
||
/** 销毁前的清理 */
|
||
protected onBeforeDestroy(): void;
|
||
/** 隐藏对话框 */
|
||
hide(): void;
|
||
}
|
||
|
||
/**
|
||
* 测量配置项（由组件内部维护默认值，并读取/写入缓存）
|
||
*/
|
||
declare interface MeasureConfig {
|
||
unit: MeasureUnit;
|
||
precision: MeasurePrecision;
|
||
}
|
||
|
||
/**
|
||
* 测量对话框管理器
|
||
* 继承自 BaseDialogManager，提供测量工具的对话框管理功能
|
||
*/
|
||
declare class MeasureDialogManager extends BaseDialogManager {
|
||
/** 测量面板实例 */
|
||
private panel;
|
||
/** 测量配置（单位、精度等） */
|
||
private config;
|
||
/** 对话框唯一标识 */
|
||
protected get dialogId(): string;
|
||
/** 对话框标题（国际化 key） */
|
||
protected get dialogTitle(): string;
|
||
/** 对话框宽度 */
|
||
protected get dialogWidth(): number;
|
||
/**
|
||
* 创建对话框内容
|
||
* 初始化测量面板并设置回调
|
||
*/
|
||
protected createContent(): HTMLElement;
|
||
/** 对话框创建后的回调，自适应高度 */
|
||
protected onDialogCreated(): void;
|
||
/** 对话框关闭时的回调，取消工具栏按钮激活状态 */
|
||
protected onDialogClose(): void;
|
||
/** 销毁前的清理，停用测量功能并销毁面板 */
|
||
protected onBeforeDestroy(): void;
|
||
/**
|
||
* 获取当前激活的测量模式
|
||
* @returns 当前测量模式，如 'distance'、'angle' 等
|
||
*/
|
||
getActiveMode(): MeasureMode | null;
|
||
/**
|
||
* 切换测量模式
|
||
* @param mode 目标测量模式
|
||
*/
|
||
switchMode(mode: MeasureMode): void;
|
||
/**
|
||
* 设置测量结果
|
||
* @param result 测量结果对象
|
||
*/
|
||
setMeasureResult(result: MeasureResult | null): void;
|
||
/**
|
||
* 获取测量配置
|
||
* @returns 测量配置副本
|
||
*/
|
||
getConfig(): MeasureConfig | null;
|
||
/**
|
||
* 设置测量配置
|
||
* @param partial 部分配置
|
||
* @param persist 是否持久化
|
||
*/
|
||
setConfig(partial: Partial<MeasureConfig>, persist?: boolean): void;
|
||
/** 清除所有测量结果 */
|
||
clearAll(): void;
|
||
/** 打开测量设置面板 */
|
||
openSettings(): void;
|
||
}
|
||
|
||
/**
|
||
* 测量相关的通用类型定义
|
||
*
|
||
* 说明：
|
||
* - 这些类型定义在通用 types 目录下，避免组件间直接耦合
|
||
* - Engine 组件、MeasurePanel 组件、Manager 都可以引用这些类型
|
||
*/
|
||
/**
|
||
* 测量方式（8 种）
|
||
*
|
||
* 说明：
|
||
* - id 采用英文驼峰/小写，便于程序内部使用
|
||
* - 显示名称必须通过国际化 key 获取（见 locales）
|
||
*/
|
||
declare type MeasureMode = 'distance' | 'minDistance' | 'angle' | 'elevation' | 'volume' | 'laserDistance' | 'slope' | 'spaceVolume';
|
||
|
||
/**
|
||
* 精度（小数位数）
|
||
* - 0 -> 0
|
||
* - 1 -> 0.0
|
||
* - 2 -> 0.00
|
||
* - 3 -> 0.000
|
||
*/
|
||
declare type MeasurePrecision = 0 | 1 | 2 | 3;
|
||
|
||
/**
|
||
* 测量结果数据
|
||
*
|
||
* 说明：
|
||
* - 真实测量未实现，因此结果由外部通过 setResult 传入。
|
||
* - 不同测量方式对应不同字段；未传入则 UI 显示 “--”。
|
||
*/
|
||
declare interface MeasureResult {
|
||
/** 距离（单位：mm） */
|
||
distanceMm?: number;
|
||
/** 最小距离（单位：mm） */
|
||
minDistanceMm?: number;
|
||
/** 角度（单位：deg） */
|
||
angleDeg?: number;
|
||
/** 标高（单位：mm） */
|
||
elevationMm?: number;
|
||
/** 体积（单位：m³） */
|
||
volumeM3?: number;
|
||
/** 激光测距（单位：mm） */
|
||
laserDistanceMm?: number;
|
||
/** 坡度（单位：%） */
|
||
slopePercent?: number;
|
||
/** 空间体积（单位：m³） */
|
||
spaceVolumeM3?: number;
|
||
/** 可选：展示测量点/结果点坐标（单位由引擎侧定义，这里只负责显示） */
|
||
xyz?: MeasureXYZ;
|
||
}
|
||
|
||
/**
|
||
* 距离/标高等“长度类”单位
|
||
*/
|
||
declare type MeasureUnit = 'm' | 'cm' | 'mm' | 'km';
|
||
|
||
/**
|
||
* 3D 坐标（可选展示）
|
||
*/
|
||
declare interface MeasureXYZ {
|
||
x: number;
|
||
y: number;
|
||
z: number;
|
||
}
|
||
|
||
/**
|
||
* 菜单项配置接口 (用于简化的对象配置)
|
||
*/
|
||
declare interface MenuItemConfig {
|
||
id: string;
|
||
label: string;
|
||
onClick?: () => void;
|
||
icon?: string;
|
||
group?: string;
|
||
order?: number;
|
||
children?: MenuItemConfig[];
|
||
disabled?: boolean;
|
||
visible?: boolean;
|
||
}
|
||
|
||
/**
|
||
* 模型加载选项
|
||
* 用于配置模型的位置、旋转和缩放
|
||
*/
|
||
export declare interface ModelLoadOptions {
|
||
/** 模型初始位置 [x, y, z] */
|
||
position?: [number, number, number];
|
||
/** 模型初始旋转 [x, y, z]（弧度） */
|
||
rotation?: [number, number, number];
|
||
/** 模型初始缩放 [x, y, z] */
|
||
scale?: [number, number, number];
|
||
/** 模型 ID（可选，如果不提供则自动生成） */
|
||
id?: string;
|
||
}
|
||
|
||
/**
|
||
* 节点点击行为类型
|
||
*/
|
||
export declare type NodeClickAction = 'select' | 'expand';
|
||
|
||
declare interface OptButton extends ButtonConfig {
|
||
children?: OptButton[];
|
||
}
|
||
|
||
/**
|
||
* 属性面板管理器
|
||
* 显示选中构件的属性信息和材质信息
|
||
*/
|
||
declare class PropertyPanelManager extends BaseManager {
|
||
/** 对话框 ID */
|
||
private dialogId;
|
||
/** 对话框实例 */
|
||
private dialog;
|
||
constructor();
|
||
/** 初始化，监听打开事件 */
|
||
init(): void;
|
||
/** 显示属性面板 */
|
||
show(): void;
|
||
/** 创建属性标签页内容 */
|
||
private createPropsTabContent;
|
||
/** 创建材质标签页内容 */
|
||
private createMaterialTabContent;
|
||
/** 创建基本信息内容 */
|
||
private createBaseInfoContent;
|
||
/** 创建高级信息内容 */
|
||
private createAdvancedInfoContent;
|
||
/** 创建材质内容 */
|
||
private createMaterialContent;
|
||
/**
|
||
* 检查面板是否打开
|
||
* @returns 是否打开
|
||
*/
|
||
isOpen(): boolean;
|
||
/** 隐藏面板 */
|
||
hide(): void;
|
||
/** 销毁管理器 */
|
||
destroy(): void;
|
||
}
|
||
|
||
/**
|
||
* 右键菜单管理器
|
||
* 支持注册多个上下文处理器，动态生成右键菜单
|
||
*/
|
||
declare class RightKeyManager extends BaseManager {
|
||
/** 容器元素 */
|
||
private container;
|
||
/** 右键面板实例 */
|
||
private rightKeyPanel;
|
||
/** 上下文处理器列表 */
|
||
private contextHandlers;
|
||
constructor(container: HTMLElement);
|
||
/** 销毁管理器 */
|
||
destroy(): void;
|
||
/**
|
||
* 注册上下文处理器
|
||
* @param handler 处理器函数，返回菜单项配置
|
||
*/
|
||
registerHandler(handler: (e: MouseEvent) => MenuItemConfig[] | null): void;
|
||
/**
|
||
* 显示菜单
|
||
* @param x 横坐标
|
||
* @param y 纵坐标
|
||
* @param items 菜单项配置
|
||
* @param groupOrder 分组顺序
|
||
*/
|
||
showMenu(x: number, y: number, items: MenuItemConfig[], groupOrder?: string[]): void;
|
||
/** 隐藏菜单 */
|
||
hide(): void;
|
||
/** 处理右键点击事件 */
|
||
private handleContextMenu;
|
||
}
|
||
|
||
/**
|
||
* 轴向类型
|
||
*/
|
||
declare type SectionAxis = 'x' | 'y' | 'z';
|
||
|
||
/**
|
||
* 轴向剖切对话框管理器
|
||
* 继承自 BaseDialogManager，提供 X/Y/Z 轴向剖切的对话框管理功能
|
||
*/
|
||
declare class SectionAxisDialogManager extends BaseDialogManager {
|
||
/** 轴向剖切面板实例 */
|
||
private panel;
|
||
/** 对话框唯一标识 */
|
||
protected get dialogId(): string;
|
||
/** 对话框标题（国际化 key） */
|
||
protected get dialogTitle(): string;
|
||
/** 对话框宽度 */
|
||
protected get dialogWidth(): number;
|
||
/**
|
||
* 获取对话框位置
|
||
* 定位在容器右下角
|
||
*/
|
||
protected getDialogPosition(): {
|
||
x: number;
|
||
y: number;
|
||
};
|
||
/**
|
||
* 创建对话框内容
|
||
* 初始化轴向剖切面板并设置回调
|
||
*/
|
||
protected createContent(): HTMLElement;
|
||
/** 对话框创建后的回调，自适应高度 */
|
||
protected onDialogCreated(): void;
|
||
/** 对话框关闭时的回调，取消工具栏按钮激活状态 */
|
||
protected onDialogClose(): void;
|
||
/** 销毁前的清理，销毁面板实例 */
|
||
protected onBeforeDestroy(): void;
|
||
/**
|
||
* 获取剖切面隐藏状态
|
||
* @returns 是否隐藏
|
||
*/
|
||
getHiddenState(): boolean;
|
||
/**
|
||
* 设置剖切面隐藏状态
|
||
* @param isHidden 是否隐藏
|
||
*/
|
||
setHiddenState(isHidden: boolean): void;
|
||
/**
|
||
* 获取当前激活的剖切轴向
|
||
* @returns 当前轴向 'x' | 'y' | 'z'
|
||
*/
|
||
getActiveAxis(): SectionAxis;
|
||
/**
|
||
* 设置剖切轴向
|
||
* @param axis 目标轴向
|
||
*/
|
||
setActiveAxis(axis: SectionAxis): void;
|
||
}
|
||
|
||
/**
|
||
* 剖切盒轴向范围
|
||
*/
|
||
declare interface SectionBoxAxisRange {
|
||
/** 最小值（0-100的百分比） */
|
||
min: number;
|
||
/** 最大值（0-100的百分比） */
|
||
max: number;
|
||
}
|
||
|
||
/**
|
||
* 剖切盒对话框管理器
|
||
* 继承自 BaseDialogManager，提供六面体剖切盒的对话框管理功能
|
||
*/
|
||
declare class SectionBoxDialogManager extends BaseDialogManager {
|
||
/** 剖切盒面板实例 */
|
||
private panel;
|
||
/** 对话框唯一标识 */
|
||
protected get dialogId(): string;
|
||
/** 对话框标题（国际化 key） */
|
||
protected get dialogTitle(): string;
|
||
/** 对话框宽度 */
|
||
protected get dialogWidth(): number;
|
||
/**
|
||
* 获取对话框位置
|
||
* 定位在容器右下角
|
||
*/
|
||
protected getDialogPosition(): {
|
||
x: number;
|
||
y: number;
|
||
};
|
||
/**
|
||
* 创建对话框内容
|
||
* 初始化剖切盒面板并设置回调
|
||
*/
|
||
protected createContent(): HTMLElement;
|
||
/** 对话框创建后的回调，自适应高度 */
|
||
protected onDialogCreated(): void;
|
||
/** 对话框关闭时的回调，取消工具栏按钮激活状态 */
|
||
protected onDialogClose(): void;
|
||
/** 销毁前的清理，销毁面板实例 */
|
||
protected onBeforeDestroy(): void;
|
||
/**
|
||
* 获取剖切盒隐藏状态
|
||
* @returns 是否隐藏
|
||
*/
|
||
getHiddenState(): boolean;
|
||
/**
|
||
* 设置剖切盒隐藏状态
|
||
* @param isHidden 是否隐藏
|
||
*/
|
||
setHiddenState(isHidden: boolean): void;
|
||
/**
|
||
* 获取剖切盒反向状态
|
||
* @returns 是否反向（显示盒内/盒外）
|
||
*/
|
||
getReversedState(): boolean;
|
||
/**
|
||
* 设置剖切盒反向状态
|
||
* @param isReversed 是否反向
|
||
*/
|
||
setReversedState(isReversed: boolean): void;
|
||
/**
|
||
* 获取剖切盒范围
|
||
* @returns 六面体范围 { minX, maxX, minY, maxY, minZ, maxZ }
|
||
*/
|
||
getRange(): SectionBoxRange | null;
|
||
/**
|
||
* 设置剖切盒范围
|
||
* @param range 部分或全部范围值
|
||
*/
|
||
setRange(range: Partial<SectionBoxRange>): void;
|
||
}
|
||
|
||
/**
|
||
* 剖切盒范围数据
|
||
*/
|
||
declare interface SectionBoxRange {
|
||
/** X轴范围 */
|
||
x: SectionBoxAxisRange;
|
||
/** Y轴范围 */
|
||
y: SectionBoxAxisRange;
|
||
/** Z轴范围 */
|
||
z: SectionBoxAxisRange;
|
||
}
|
||
|
||
/**
|
||
* 拾取面剖切对话框管理器
|
||
* 继承自 BaseDialogManager，提供拾取面剖切功能的对话框管理
|
||
*/
|
||
declare class SectionPlaneDialogManager extends BaseDialogManager {
|
||
/** 剖切面板实例 */
|
||
private panel;
|
||
/** 对话框唯一标识 */
|
||
protected get dialogId(): string;
|
||
/** 对话框标题（国际化 key） */
|
||
protected get dialogTitle(): string;
|
||
/** 对话框宽度 */
|
||
protected get dialogWidth(): number;
|
||
/** 对话框高度 */
|
||
protected get dialogHeight(): number;
|
||
/** 初始化 */
|
||
init(): void;
|
||
/**
|
||
* 获取对话框位置
|
||
* 定位在容器右下角
|
||
*/
|
||
protected getDialogPosition(): {
|
||
x: number;
|
||
y: number;
|
||
};
|
||
/** 创建对话框内容 */
|
||
protected createContent(): HTMLElement;
|
||
/** 对话框关闭时的回调 */
|
||
protected onDialogClose(): void;
|
||
/** 销毁前的清理 */
|
||
protected onBeforeDestroy(): void;
|
||
}
|
||
|
||
/**
|
||
* Shadow Token
|
||
* CSS box-shadow value
|
||
*/
|
||
declare type ShadowToken = string;
|
||
|
||
/**
|
||
* Complete Theme Configuration Interface
|
||
*
|
||
* All colors use semantic naming to describe their purpose.
|
||
* Components should map these to their internal CSS variables.
|
||
*/
|
||
export declare interface ThemeConfig {
|
||
/** Theme identifier: 'dark' | 'light' | custom name */
|
||
name: string;
|
||
/** Primary brand color - used for key actions, links, active states */
|
||
primary: ColorToken;
|
||
/** Primary color on hover */
|
||
primaryHover: ColorToken;
|
||
/** Primary color when pressed/active */
|
||
primaryActive: ColorToken;
|
||
/** Subtle primary for backgrounds (e.g., selected row) */
|
||
primarySubtle: ColorToken;
|
||
/** Success color - confirmations, completed states */
|
||
success: ColorToken;
|
||
/** Success color on hover */
|
||
successHover: ColorToken;
|
||
/** Subtle success for backgrounds */
|
||
successSubtle: ColorToken;
|
||
/** Warning color - caution, pending states */
|
||
warning: ColorToken;
|
||
/** Warning color on hover */
|
||
warningHover: ColorToken;
|
||
/** Subtle warning for backgrounds */
|
||
warningSubtle: ColorToken;
|
||
/** Danger/Error color - destructive actions, errors */
|
||
danger: ColorToken;
|
||
/** Danger color on hover */
|
||
dangerHover: ColorToken;
|
||
/** Subtle danger for backgrounds */
|
||
dangerSubtle: ColorToken;
|
||
/** Info color - informational states */
|
||
info: ColorToken;
|
||
/** Info color on hover */
|
||
infoHover: ColorToken;
|
||
/** Subtle info for backgrounds */
|
||
infoSubtle: ColorToken;
|
||
/** Base/canvas background - the deepest layer (app background) */
|
||
bgBase: ColorToken;
|
||
/** Elevated surface - panels, cards, dialogs floating above base */
|
||
bgElevated: ColorToken;
|
||
/** Overlay background - modals, dropdowns, popovers */
|
||
bgOverlay: ColorToken;
|
||
/** Inset/recessed background - inputs, wells, sunken areas */
|
||
bgInset: ColorToken;
|
||
/**
|
||
* Glassmorphism surface - semi-transparent with blur
|
||
* Used for floating toolbars, modern panels
|
||
*/
|
||
bgGlass: ColorToken;
|
||
/** Glassmorphism blur amount */
|
||
bgGlassBlur: BlurToken;
|
||
/** Primary text - headings, body text, high emphasis */
|
||
textPrimary: ColorToken;
|
||
/** Secondary text - descriptions, labels, medium emphasis */
|
||
textSecondary: ColorToken;
|
||
/** Tertiary text - placeholders, hints, low emphasis */
|
||
textTertiary: ColorToken;
|
||
/** Disabled text - inactive elements */
|
||
textDisabled: ColorToken;
|
||
/** Inverted text - text on primary/dark backgrounds */
|
||
textInverse: ColorToken;
|
||
/** Link text color */
|
||
textLink: ColorToken;
|
||
/** Link text on hover */
|
||
textLinkHover: ColorToken;
|
||
/** Default icon color */
|
||
iconDefault: ColorToken;
|
||
/** Icon on hover */
|
||
iconHover: ColorToken;
|
||
/** Active/selected icon */
|
||
iconActive: ColorToken;
|
||
/** Disabled icon */
|
||
iconDisabled: ColorToken;
|
||
/** Inverted icon (on colored backgrounds) */
|
||
iconInverse: ColorToken;
|
||
/** Default border - inputs, cards, containers */
|
||
borderDefault: ColorToken;
|
||
/** Subtle border - dividers, separators */
|
||
borderSubtle: ColorToken;
|
||
/** Strong border - focus rings, emphasis */
|
||
borderStrong: ColorToken;
|
||
/** Disabled border */
|
||
borderDisabled: ColorToken;
|
||
/** Divider color - horizontal/vertical separators */
|
||
divider: ColorToken;
|
||
/**
|
||
* Component Background States
|
||
* Used for buttons, list items, interactive elements
|
||
*/
|
||
/** Default component background (often transparent) */
|
||
componentBg: ColorToken;
|
||
/** Component background on hover */
|
||
componentBgHover: ColorToken;
|
||
/** Component background when pressed */
|
||
componentBgActive: ColorToken;
|
||
/** Component background when selected */
|
||
componentBgSelected: ColorToken;
|
||
/** Disabled component background */
|
||
componentBgDisabled: ColorToken;
|
||
/** Focus ring color */
|
||
focusRing: ColorToken;
|
||
/** Focus ring offset color (for contrast) */
|
||
focusRingOffset: ColorToken;
|
||
/** Selection background (text selection, highlighted items) */
|
||
selectionBg: ColorToken;
|
||
/** Selection text color */
|
||
selectionText: ColorToken;
|
||
/** Small shadow - subtle elevation (buttons, small cards) */
|
||
shadowSm: ShadowToken;
|
||
/** Medium shadow - moderate elevation (dropdowns, popovers) */
|
||
shadowMd: ShadowToken;
|
||
/** Large shadow - high elevation (modals, dialogs) */
|
||
shadowLg: ShadowToken;
|
||
/** Extra large shadow - maximum elevation */
|
||
shadowXl: ShadowToken;
|
||
/** Glow shadow for active/highlighted elements */
|
||
shadowGlow: ShadowToken;
|
||
/** Scrollbar track background */
|
||
scrollbarTrack: ColorToken;
|
||
/** Scrollbar thumb */
|
||
scrollbarThumb: ColorToken;
|
||
/** Scrollbar thumb on hover */
|
||
scrollbarThumbHover: ColorToken;
|
||
/** 浮动容器背景 (支持 rgba 实现毛玻璃效果) */
|
||
floatingBg: ColorToken;
|
||
/** 浮动容器边框 */
|
||
floatingBorder: ColorToken;
|
||
/** 浮动容器阴影 */
|
||
floatingShadow: ShadowToken;
|
||
/** 浮动按钮背景 */
|
||
floatingBtnBg: ColorToken;
|
||
/** 浮动按钮边框 */
|
||
floatingBtnBorder: ColorToken;
|
||
/** 浮动按钮阴影 */
|
||
floatingBtnShadow: ShadowToken;
|
||
/** 浮动按钮悬停背景 */
|
||
floatingBtnBgHover: ColorToken;
|
||
/** 浮动按钮悬停阴影 */
|
||
floatingBtnShadowHover: ShadowToken;
|
||
/** 浮动组件图标颜色 */
|
||
floatingIconColor: ColorToken;
|
||
/** 浮动组件图标悬停颜色 */
|
||
floatingIconColorHover: ColorToken;
|
||
/** 面板背景 (支持毛玻璃) */
|
||
panelBg: ColorToken;
|
||
/** 面板边框 */
|
||
panelBorder: ColorToken;
|
||
/** 面板 Header 背景 */
|
||
panelHeaderBg: ColorToken;
|
||
/** 面板圆角 */
|
||
panelRadius: string;
|
||
/** Tab 容器背景 */
|
||
tabBg: ColorToken;
|
||
/** Tab 项背景 */
|
||
tabItemBg: ColorToken;
|
||
/** Tab 项悬停背景 */
|
||
tabItemBgHover: ColorToken;
|
||
/** Tab 激活项背景 */
|
||
tabItemBgActive: ColorToken;
|
||
/** Tab 激活项文字颜色 */
|
||
tabItemTextActive: ColorToken;
|
||
/**
|
||
* Component-specific overrides
|
||
* Only define these when absolutely necessary
|
||
*/
|
||
overrides?: {
|
||
/** Dialog specific colors */
|
||
dialog?: {
|
||
headerBg?: ColorToken;
|
||
footerBg?: ColorToken;
|
||
};
|
||
/** Toolbar specific colors */
|
||
toolbar?: {
|
||
bg?: ColorToken;
|
||
buttonBg?: ColorToken;
|
||
buttonBgHover?: ColorToken;
|
||
buttonBgActive?: ColorToken;
|
||
};
|
||
/** Input specific colors */
|
||
input?: {
|
||
bg?: ColorToken;
|
||
bgFocus?: ColorToken;
|
||
placeholder?: ColorToken;
|
||
};
|
||
};
|
||
}
|
||
|
||
/**
|
||
* Theme type definition
|
||
*/
|
||
export declare type ThemeType = 'dark' | 'light' | 'custom';
|
||
|
||
/**
|
||
* 工具栏管理器
|
||
* 提供工具栏按钮的添加、显示/隐藏、主题更新等功能
|
||
*/
|
||
declare class ToolbarManager extends BaseManager {
|
||
/** 工具栏实例 */
|
||
private toolbar;
|
||
/** 工具栏容器元素 */
|
||
private toolbarContainer;
|
||
/** 主容器元素 */
|
||
private container;
|
||
constructor(container: HTMLElement);
|
||
/** 初始化工具栏 */
|
||
private init;
|
||
/**
|
||
* 更新工具栏主题
|
||
* @param theme 主题配置
|
||
*/
|
||
updateTheme(theme: ThemeConfig): void;
|
||
/** 刷新工具栏渲染 */
|
||
refresh(): void;
|
||
/** 销毁工具栏 */
|
||
destroy(): void;
|
||
/**
|
||
* 添加按钮组
|
||
* @param groupId 组 ID
|
||
* @param beforeGroupId 插入到指定组之前
|
||
*/
|
||
addGroup(groupId: string, beforeGroupId?: string): void;
|
||
/**
|
||
* 添加按钮
|
||
* @param config 按钮配置
|
||
*/
|
||
addButton(config: ButtonConfig): void;
|
||
/**
|
||
* 设置按钮可见性
|
||
* @param id 按钮 ID
|
||
* @param v 是否可见
|
||
*/
|
||
setButtonVisibility(id: string, v: boolean): void;
|
||
/**
|
||
* 设置是否显示标签
|
||
* @param show 是否显示
|
||
*/
|
||
setShowLabel(show: boolean): void;
|
||
/**
|
||
* 设置按钮激活状态
|
||
* @param id 按钮 ID
|
||
* @param active 是否激活
|
||
*/
|
||
setBtnActive(id: string, active?: boolean): void;
|
||
/**
|
||
* 设置工具栏可见性
|
||
* @param visible 是否可见
|
||
*/
|
||
setVisible(visible: boolean): void;
|
||
/**
|
||
* 设置背景颜色
|
||
* @param color 颜色值
|
||
*/
|
||
setBackgroundColor(color: string): void;
|
||
/**
|
||
* 设置按钮组颜色
|
||
* @param colors 颜色配置
|
||
*/
|
||
setColors(colors: ButtonGroupColors): void;
|
||
/** 隐藏工具栏 */
|
||
hide(): void;
|
||
/** 显示工具栏 */
|
||
show(): void;
|
||
/**
|
||
* 获取工具栏容器
|
||
* @returns 容器元素
|
||
*/
|
||
getContainer(): HTMLElement | null;
|
||
}
|
||
|
||
/**
|
||
* 节点勾选状态枚举
|
||
*/
|
||
export declare enum TreeNodeCheckState {
|
||
Unchecked = 0,
|
||
Checked = 1,
|
||
Indeterminate = 2
|
||
}
|
||
|
||
/**
|
||
* 树节点配置接口
|
||
*/
|
||
export declare interface TreeNodeConfig {
|
||
/** 唯一标识符 */
|
||
id: string;
|
||
/** 显示文本的翻译键 */
|
||
label: string;
|
||
/** 节点图标 (SVG string 或 URL) */
|
||
icon?: string;
|
||
/** 子节点列表 */
|
||
children?: TreeNodeConfig[];
|
||
/** 初始展开状态 (默认 false) */
|
||
expanded?: boolean;
|
||
/** 初始选中状态 (默认 false) */
|
||
checked?: boolean;
|
||
/** 是否禁用 (默认 false) */
|
||
disabled?: boolean;
|
||
/** 自定义业务数据 */
|
||
data?: any;
|
||
/** 是否是叶子节点 (用于异步加载场景，暂留接口) */
|
||
isLeaf?: boolean;
|
||
/** 点击整行的行为 (默认 'select') */
|
||
clickAction?: NodeClickAction;
|
||
}
|
||
|
||
/**
|
||
* 树组件配置选项
|
||
*/
|
||
export declare interface TreeOptions {
|
||
/** 树的数据源 */
|
||
data: TreeNodeConfig[];
|
||
/** 是否显示复选框 (默认 true) */
|
||
checkable?: boolean;
|
||
/**
|
||
* 父子节点选中状态是否关联 (默认 true)
|
||
* true: 选中父选子，子全选自动选父
|
||
* false: 独立选中
|
||
*/
|
||
checkStrictly?: boolean;
|
||
/** 默认展开所有节点 (默认 false) */
|
||
defaultExpandAll?: boolean;
|
||
/** 缩进宽度 (像素，默认 24) */
|
||
indent?: number;
|
||
/** 是否启用搜索功能 (默认 false) */
|
||
enableSearch?: boolean;
|
||
/** 搜索框占位符 */
|
||
searchPlaceholder?: string;
|
||
/** 节点勾选回调 */
|
||
onNodeCheck?: (node: BimTreeNode) => void;
|
||
/** 节点选择回调 */
|
||
onNodeSelect?: (node: BimTreeNode) => void;
|
||
/** 节点展开/折叠回调 */
|
||
onNodeExpand?: (node: BimTreeNode) => void;
|
||
/**
|
||
* 选中时显示的自定义操作栏渲染函数
|
||
* 返回 HTML 字符串或 HTMLElement
|
||
*/
|
||
renderActions?: (node: TreeNodeConfig) => HTMLElement | string;
|
||
}
|
||
|
||
/**
|
||
* 漫游控制管理器
|
||
* 提供第一人称漫游、路径漫游等功能的控制界面
|
||
*/
|
||
declare class WalkControlManager extends BaseManager {
|
||
/** 漫游控制面板实例 */
|
||
panel: WalkControlPanel | null;
|
||
/** 路径漫游对话框管理器 */
|
||
private pathManager;
|
||
constructor();
|
||
/** 初始化管理器 */
|
||
init(): void;
|
||
/** 显示漫游控制面板 */
|
||
show(): void;
|
||
/** 隐藏漫游控制面板 */
|
||
hide(): void;
|
||
/** 销毁管理器 */
|
||
destroy(): void;
|
||
}
|
||
|
||
/**
|
||
* 漫游控制模式
|
||
*/
|
||
declare type WalkControlMode = 'none' | 'path' | 'walk';
|
||
|
||
declare class WalkControlPanel implements IBimComponent {
|
||
element: HTMLElement;
|
||
private options;
|
||
private state;
|
||
private planViewBtn;
|
||
private pathModeBtn;
|
||
private walkModeBtn;
|
||
private settingsContainer;
|
||
private speedControl;
|
||
private speedDecreaseBtn;
|
||
private speedIncreaseBtn;
|
||
private speedDisplay;
|
||
private gravityCheckbox;
|
||
private gravityLabel;
|
||
private collisionCheckbox;
|
||
private collisionLabel;
|
||
private characterModelSelect;
|
||
private characterModelLabel;
|
||
private walkModeSelect;
|
||
private walkModeLabel;
|
||
private exitBtn;
|
||
private unsubscribeLocale;
|
||
private unsubscribeTheme;
|
||
constructor(options?: WalkControlPanelOptions);
|
||
init(): void;
|
||
setPlanViewActive(active: boolean): void;
|
||
setPathModeActive(active: boolean): void;
|
||
getState(): WalkControlState;
|
||
private createPanel;
|
||
private createLeftButtons;
|
||
private createSettingsContainer;
|
||
private createSpeedControl;
|
||
private createIconButton;
|
||
private createExitButton;
|
||
private setMode;
|
||
private updateButtonStates;
|
||
private updateSettingsView;
|
||
private updateSpeedDisplay;
|
||
private updateSpeedButtonStates;
|
||
private getIconSVG;
|
||
setLocales(): void;
|
||
setTheme(theme: ThemeConfig): void;
|
||
destroy(): void;
|
||
}
|
||
|
||
/**
|
||
* 漫游控制面板配置选项
|
||
*/
|
||
declare interface WalkControlPanelOptions {
|
||
/** 平面图切换回调 */
|
||
onPlanViewToggle?: (isActive: boolean) => void;
|
||
/** 路径漫游模式切换回调 */
|
||
onPathModeToggle?: (isActive: boolean) => void;
|
||
/** 漫游模式切换回调 */
|
||
onWalkModeToggle?: (isActive: boolean) => void;
|
||
/** 速度变化回调 */
|
||
onSpeedChange?: (speed: number) => void;
|
||
/** 重力切换回调 */
|
||
onGravityToggle?: (enabled: boolean) => void;
|
||
/** 碰撞切换回调 */
|
||
onCollisionToggle?: (enabled: boolean) => void;
|
||
/** 角色模型变化回调 */
|
||
onCharacterModelChange?: (model: CharacterModel) => void;
|
||
/** 行走模式变化回调 */
|
||
onWalkModeChange?: (mode: WalkMode) => void;
|
||
/** 退出回调 */
|
||
onExit?: () => void;
|
||
/** 默认速度 (0-100) */
|
||
defaultSpeed?: number;
|
||
/** 默认重力状态 */
|
||
defaultGravity?: boolean;
|
||
/** 默认碰撞状态 */
|
||
defaultCollision?: boolean;
|
||
/** 默认角色模型 */
|
||
defaultCharacterModel?: CharacterModel;
|
||
/** 默认行走模式 */
|
||
defaultWalkMode?: WalkMode;
|
||
}
|
||
|
||
/**
|
||
* 漫游控制状态
|
||
*/
|
||
declare interface WalkControlState {
|
||
/** 当前模式 */
|
||
mode: WalkControlMode;
|
||
/** 平面图是否激活 */
|
||
isPlanViewActive: boolean;
|
||
/** 移动速度 (0-100) */
|
||
speed: number;
|
||
/** 重力是否启用 */
|
||
gravity: boolean;
|
||
/** 碰撞是否启用 */
|
||
collision: boolean;
|
||
/** 当前角色模型 */
|
||
characterModel: CharacterModel;
|
||
/** 当前行走模式 */
|
||
walkMode: WalkMode;
|
||
}
|
||
|
||
/**
|
||
* 行走模式类型
|
||
*/
|
||
declare type WalkMode = 'walk' | 'run';
|
||
|
||
/**
|
||
* 漫游路径对话框管理器
|
||
* 继承自 BaseDialogManager，提供漫游路径配置的对话框管理功能
|
||
*/
|
||
declare class WalkPathDialogManager extends BaseDialogManager {
|
||
/** 漫游路径面板实例 */
|
||
private panel;
|
||
/** 对话框唯一标识 */
|
||
protected get dialogId(): string;
|
||
/** 对话框标题（国际化 key） */
|
||
protected get dialogTitle(): string;
|
||
/** 对话框宽度 */
|
||
protected get dialogWidth(): number;
|
||
/** 对话框高度 */
|
||
protected get dialogHeight(): number;
|
||
/** 初始化 */
|
||
init(): void;
|
||
/**
|
||
* 获取对话框位置
|
||
* 定位在容器右侧居中
|
||
*/
|
||
protected getDialogPosition(): {
|
||
x: number;
|
||
y: number;
|
||
};
|
||
/** 创建对话框内容 */
|
||
protected createContent(): HTMLElement;
|
||
/** 对话框关闭时的回调 */
|
||
protected onDialogClose(): void;
|
||
/** 销毁前的清理 */
|
||
protected onBeforeDestroy(): void;
|
||
}
|
||
|
||
/**
|
||
* 漫游平面图对话框管理器
|
||
* 继承自 BaseDialogManager，提供漫游平面图的对话框管理功能
|
||
*/
|
||
declare class WalkPlanViewDialogManager extends BaseDialogManager {
|
||
/** 漫游平面图面板实例 */
|
||
private panel;
|
||
/** 对话框唯一标识 */
|
||
protected get dialogId(): string;
|
||
/** 对话框标题（国际化 key） */
|
||
protected get dialogTitle(): string;
|
||
/** 对话框宽度 */
|
||
protected get dialogWidth(): number;
|
||
/** 对话框高度 */
|
||
protected get dialogHeight(): number;
|
||
/** 初始化 */
|
||
init(): void;
|
||
/**
|
||
* 获取对话框位置
|
||
* 定位在容器左下角
|
||
*/
|
||
protected getDialogPosition(): {
|
||
x: number;
|
||
y: number;
|
||
};
|
||
/** 创建对话框内容 */
|
||
protected createContent(): HTMLElement;
|
||
/** 对话框关闭时的回调 */
|
||
protected onDialogClose(): void;
|
||
/** 销毁前的清理 */
|
||
protected onBeforeDestroy(): void;
|
||
}
|
||
|
||
export { }
|