/** * 工具栏管理器 * 负责管理底部工具栏的创建、按钮配置和显示控制 */ import type { ButtonGroupColors, ButtonConfig } from '../components/button-group/index.type'; import { Toolbar } from '../components/button-group/toolbar'; import type { ThemeConfig } from '../themes/types'; import { BaseManager } from '../core/base-manager'; /** * 工具栏管理器 * 提供工具栏按钮的添加、显示/隐藏、主题更新等功能 */ export class ToolbarManager extends BaseManager { /** 工具栏实例 */ private toolbar: Toolbar | null = null; /** 工具栏容器元素 */ private toolbarContainer: HTMLElement | null = null; /** 主容器元素 */ private container: HTMLElement; constructor(container: HTMLElement) { super(); this.container = container; this.init(); } /** 初始化工具栏 */ private init() { this.toolbarContainer = document.createElement('div'); this.toolbarContainer.id = 'opt-btn-groups'; this.toolbarContainer.className = 'bim-engine-opt-btn-container is-bottom-toolbar'; this.container.appendChild(this.toolbarContainer); this.toolbar = new Toolbar({ container: this.toolbarContainer, type: 'glass-pill', showLabel: true, direction: 'row', position: 'bottom-right', align: 'vertical', expand: 'up' }); this.toolbar.init(); } /** * 更新工具栏主题 * @param theme 主题配置 */ public updateTheme(theme: ThemeConfig) { this.toolbar?.setTheme(theme); } /** 刷新工具栏渲染 */ public refresh() { this.toolbar?.render(); } /** 销毁工具栏 */ public destroy() { this.toolbar?.destroy(); this.toolbar = null; super.destroy(); } /** * 添加按钮组 * @param groupId 组 ID * @param beforeGroupId 插入到指定组之前 */ public addGroup(groupId: string, beforeGroupId?: string) { this.toolbar?.addGroup(groupId, beforeGroupId); this.toolbar?.render(); } /** * 添加按钮 * @param config 按钮配置 */ public addButton(config: ButtonConfig) { this.toolbar?.addButton(config); this.toolbar?.render(); } /** * 设置按钮可见性 * @param id 按钮 ID * @param v 是否可见 */ public setButtonVisibility(id: string, v: boolean) { this.toolbar?.updateButtonVisibility(id, v); } /** * 设置是否显示标签 * @param show 是否显示 */ public setShowLabel(show: boolean) { this.toolbar?.setShowLabel(show); } /** * 设置按钮激活状态 * @param id 按钮 ID * @param active 是否激活 */ public setBtnActive(id: string, active?: boolean) { this.toolbar?.setBtnActive(id, active); } /** * 设置工具栏可见性 * @param visible 是否可见 */ public setVisible(visible: boolean) { if (this.toolbarContainer) { this.toolbarContainer.style.visibility = visible ? 'visible' : 'hidden'; } } /** * 设置背景颜色 * @param color 颜色值 */ public setBackgroundColor(color: string) { this.toolbar?.setBackgroundColor(color); } /** * 设置按钮组颜色 * @param colors 颜色配置 */ public setColors(colors: ButtonGroupColors) { this.toolbar?.setColors(colors); } /** 隐藏工具栏 */ public hide(): void { if (this.toolbarContainer) { this.toolbarContainer.style.display = 'none'; } } /** 显示工具栏 */ public show(): void { if (this.toolbarContainer) { this.toolbarContainer.style.display = ''; } } /** * 获取工具栏容器 * @returns 容器元素 */ public getContainer(): HTMLElement | null { return this.toolbarContainer; } public setType(type: 'default' | 'glass-pill'): void { this.toolbar?.setType(type); } public getType(): 'default' | 'glass-pill' { return this.toolbar?.getType() || 'default'; } }