import { _decorator, Component, Node, Label, Sprite, Button, resources, SpriteFrame } from 'cc';
const { ccclass, property } = _decorator;

/**
 * 通行证数据接口
 */
interface PassCardData {
    name: string;      // 人物姓名
    room: string;      // 房间号
    id: string;        // 身份ID
    reason: string;    // 原因
    characterId: number; // 角色ID，用于加载头像
}

@ccclass('PassCardManager')
export class PassCardManager extends Component {
    @property({
        type: Node,
        tooltip: '通行证面板节点'
    })
    passCardPanel: Node = null;

    @property({
        type: Label,
        tooltip: '姓名标签'
    })
    nameLabel: Label = null;

    @property({
        type: Label,
        tooltip: '房间号标签'
    })
    roomLabel: Label = null;

    @property({
        type: Label,
        tooltip: '身份ID标签'
    })
    idLabel: Label = null;

    @property({
        type: Label,
        tooltip: '原因标签'
    })
    reasonLabel: Label = null;

    @property({
        type: Sprite,
        tooltip: '头像显示组件'
    })
    avatarSprite: Sprite = null;

    @property({
        type: Button,
        tooltip: '关闭按钮'
    })
    closeButton: Button = null;

    // 当前通行证数据
    private currentPassData: PassCardData = null;

    start() {
        // 初始隐藏通行证面板
        if (this.passCardPanel) {
            this.passCardPanel.active = false;
        }

        // 注册关闭按钮点击事件
        if (this.closeButton) {
            // 先移除可能已存在的事件监听（防止重复注册）
            this.closeButton.node.off(Button.EventType.CLICK, this.onCloseButtonClick, this);
            // 重新注册点击事件
            this.closeButton.node.on(Button.EventType.CLICK, this.onCloseButtonClick, this);
            console.log('关闭按钮事件已注册');
        } else {
            console.error('关闭按钮未设置');
        }
    }

    /**
     * 关闭按钮点击事件处理
     */
    private onCloseButtonClick(): void {
        console.log('关闭按钮被点击');
        this.hidePassCard();
    }

    /**
     * 显示通行证
     * @param passData 通行证数据
     */
    public showPassCard(passData: PassCardData): void {
        console.log('PassCardManager.showPassCard 被调用:', passData);
        
        if (!this.passCardPanel) {
            console.error('通行证面板未设置');
            return;
        }

        // 保存当前数据
        this.currentPassData = passData;

        // 更新UI显示
        this.updatePassCardUI();

        // 显示面板
        this.passCardPanel.active = true;
        console.log('通行证面板已显示');
    }

    /**
     * 隐藏通行证
     */
    public hidePassCard(): void {
        console.log('hidePassCard 被调用');
        
        if (this.passCardPanel) {
            this.passCardPanel.active = false;
            console.log('通行证面板已隐藏');
        } else {
            console.error('通行证面板未设置，无法隐藏');
        }
    }

    /**
     * 更新通行证UI
     */
    private updatePassCardUI(): void {
        console.log('更新通行证UI');
        
        if (!this.currentPassData) {
            console.error('没有通行证数据');
            return;
        }

        // 更新文本内容
        if (this.nameLabel) {
            this.nameLabel.string = this.currentPassData.name || '';
            console.log('设置姓名:', this.currentPassData.name);
        } else {
            console.error('姓名标签未设置');
        }

        if (this.roomLabel) {
            this.roomLabel.string = this.currentPassData.room || '';
            console.log('设置房间号:', this.currentPassData.room);
        } else {
            console.error('房间号标签未设置');
        }

        if (this.idLabel) {
            this.idLabel.string = this.currentPassData.id || '';
            console.log('设置ID:', this.currentPassData.id);
        } else {
            console.error('ID标签未设置');
        }

        if (this.reasonLabel) {
            this.reasonLabel.string = this.currentPassData.reason || '';
            console.log('设置原因:', this.currentPassData.reason);
        } else {
            console.error('原因标签未设置');
        }

        // 加载并显示头像
        this.loadAvatar(this.currentPassData.characterId);
    }

    /**
     * 加载角色头像
     * @param characterId 角色ID
     */
    private loadAvatar(characterId: number): void {
        console.log('加载头像:', characterId);
        
        if (!this.avatarSprite) {
            console.error('头像Sprite组件未设置');
            return;
        }
        
        if (characterId <= 0) {
            console.error('无效的角色ID:', characterId);
            return;
        }

        // 构建头像资源路径，加上spriteFrame后缀以直接获取SpriteFrame子资源
        const avatarPath = `avatars/${characterId}/avatar_${characterId}_5/spriteFrame`;
        console.log('尝试加载头像路径:', avatarPath);
        
        // 加载头像资源
        resources.load(avatarPath, SpriteFrame, (err, spriteFrame) => {
            if (err) {
                console.error(`加载头像失败: ${avatarPath}`, err);
                // 如果加载失败，尝试其他路径
                this.loadFallbackAvatar(characterId);
            } else {
                // 设置头像
                this.avatarSprite.spriteFrame = spriteFrame;
                console.log('头像加载成功: ' + avatarPath);
            }
        });
    }

    /**
     * 尝试加载备用头像
     * @param characterId 角色ID
     */
    private loadFallbackAvatar(characterId: number): void {
        console.log('尝试加载备用头像:', characterId);
        
        // 尝试加载备用路径
        const fallbackPath = `avatars/${characterId}/avatar_${characterId}_1/spriteFrame`;
        
        resources.load(fallbackPath, SpriteFrame, (err, spriteFrame) => {
            if (err) {
                console.error(`加载备用头像失败: ${fallbackPath}`);
            } else {
                this.avatarSprite.spriteFrame = spriteFrame;
                console.log('备用头像加载成功: ' + fallbackPath);
            }
        });
    }

    onDestroy() {
        // 清理事件监听
        if (this.closeButton) {
            this.closeButton.node.off(Button.EventType.CLICK, this.onCloseButtonClick, this);
        }
    }
}