bim_engine/.recycle/2026-01-28/src/managers/property-panel-manager.ts

/**
 * 属性面板管理器
 * 负责管理构件属性面板的显示和内容
 */
import { BaseManager } from '../core/base-manager';
import { BimCollapse } from '../components/collapse/index';
import { BimDescription } from '../components/description/index';
import { BimTab } from '../components/tab/index';

/**
 * 属性面板管理器
 * 显示选中构件的属性信息和材质信息
 */
export class PropertyPanelManager extends BaseManager {
    /** 对话框 ID */
    private dialogId = 'property-panel-dialog';
    /** 对话框实例 */
    private dialog: any = null;

    constructor() {
        super();
    }

    /** 初始化，监听打开事件 */
    public init(): void {
        document.addEventListener('bim-demo:open-property-panel', () => {
            this.show();
        });
    }

    /** 显示属性面板 */
    public show() {
        if (!this.registry.dialog) {
            console.warn('Dialog manager is not initialized');
            return;
        }

        if (this.isOpen()) {
            return;
        }

        const width = 360;
        const x = document.body.clientWidth - width - 40;

        this.dialog = this.registry.dialog.create({
            id: this.dialogId,
            title: 'panel.property.title',
            content: '',
            width: `${width}px`,
            height: '500px',
            position: { x, y: 20 },
            showMask: false,
            resizable: true,
            onClose: () => {
                this.hide();
            }
        } as any);

        const contentContainer = document.createElement('div');
        contentContainer.style.height = '100%';
        contentContainer.style.display = 'flex';
        contentContainer.style.flexDirection = 'column';

        this.dialog.setContent(contentContainer);

        const tab = new BimTab({
            container: contentContainer,
            tabs: [
                {
                    id: 'props',
                    title: 'panel.property.tab.props',
                    content: this.createPropsTabContent()
                },
                {
                    id: 'material',
                    title: 'panel.property.tab.material',
                    content: this.createMaterialTabContent()
                }
            ]
        });
        tab.init();
    }

    /** 创建属性标签页内容 */
    private createPropsTabContent(): HTMLElement {
        const container = document.createElement('div');
        container.style.height = '100%';
        container.style.overflowY = 'auto';

        new BimCollapse({
            container: container,
            accordion: true,
            activeIds: ['base', 'location'],
            items: [
                {
                    id: 'base',
                    title: 'panel.property.base',
                    content: this.createBaseInfoContent(),
                },
                {
                    id: 'advanced',
                    title: 'panel.property.advanced',
                    content: this.createAdvancedInfoContent(),
                    disabled: false
                }
            ]
        });

        return container;
    }

    /** 创建材质标签页内容 */
    private createMaterialTabContent(): HTMLElement {
        const container = document.createElement('div');
        container.style.height = '100%';
        container.style.overflowY = 'auto';

        new BimCollapse({
            container: container,
            accordion: true,
            activeIds: ['material'],
            items: [
                {
                    id: 'material',
                    title: 'panel.property.material',
                    content: this.createMaterialContent(),
                }
            ]
        });

        return container;
    }

    /** 创建基本信息内容 */
    private createBaseInfoContent(): HTMLElement {
        const container = document.createElement('div');

        new BimDescription({
            container: container,
            labelWidth: '80px',
            bordered: true,
            items: [
                { label: 'Guid', value: '<span style="color:#666">1f8d-4a2e-9c</span>' },
                { label: 'Name', value: '<b>Basic Wall: Generic - 200mm</b>' },
                { label: 'Type', value: 'Basic Wall' },
                { label: 'Level', value: 'Trane - Centrifugal Water Chiller - CVHF 2 Stage direct drive TAG(BP-RHS-1100RT) 0202104531 1' }
            ]
        });

        return container;
    }

    /** 创建高级信息内容 */
    private createAdvancedInfoContent(): HTMLElement {
        const container = document.createElement('div');

        new BimDescription({
            container: container,
            labelWidth: '100px',
            bordered: true,
            items: [
                { label: 'Area', value: '32.5 m²' },
                { label: 'Volume', value: '6.5 m³' },
                { label: 'Length', value: '5000 mm' },
                { label: 'Phase', value: 'New Construction' }
            ]
        });

        return container;
    }

    /** 创建材质内容 */
    private createMaterialContent(): HTMLElement {
        const container = document.createElement('div');

        const preview = document.createElement('div');
        preview.style.display = 'flex';
        preview.style.alignItems = 'center';
        preview.style.marginBottom = '4px';
        preview.innerHTML = `
            <div style="width:24px;height:24px;background:#9ca3af;margin-right:8px;border:1px solid #6b7280;border-radius:2px;"></div>
            <span>Concrete - Cast-in-Place Gray</span>
        `;

        const descContainer = document.createElement('div');

        new BimDescription({
            container: descContainer,
            items: [
                { label: 'Preview', value: preview },
                { label: 'Class', value: 'Concrete' },
                { label: 'Density', value: '2400 kg/m³' },
                { label: 'Thermal', value: '0.6 W/(m·K)' }
            ]
        });

        container.appendChild(descContainer);
        return container;
    }

    /**
     * 检查面板是否打开
     * @returns 是否打开
     */
    public isOpen(): boolean {
        return this.dialog !== null;
    }

    /** 隐藏面板 */
    public hide(): void {
        if (this.dialog) {
            this.dialog.destroy();
            this.dialog = null;
        }
    }

    /** 销毁管理器 */
    public destroy(): void {
        this.hide();
        super.destroy();
    }
}