const { ccclass, property } = cc._decorator;

@ccclass
export default class MessageContent extends cc.Component {

    @property(cc.Prefab)
    itemPrefab: cc.Prefab = null;

    private contentData: any[] = [];
    private itemNodes: cc.Node[] = [];
    private callback: any = null;
    start() {
    }

    setContentData(data: any[], callback) {
        this.contentData = data;
        this.updateContent();

        this.callback = callback;
    }

    updateContent() {
        // 清除现有的项目
        this.clearItems();

        // 为每个数据项创建一个节点
        for (let i = 0; i < this.contentData.length; i++) {
            const itemNode = cc.instantiate(this.itemPrefab);
            this.node.addChild(itemNode);

            // 设置位置
            const yPos = -30 - i * 60; // 每个项目的高度为60
            itemNode.setPosition(0, yPos);

            // 获取并设置标签内容
            const label = itemNode.getComponent(cc.Label);
            if (label) {
                label.string = this.contentData[i].context.toString(); // 根据实际数据结构调整
            }
            // 添加点击事件
            itemNode.on(cc.Node.EventType.TOUCH_END, () => {
                this.onItemClick(i, this.contentData[i]);
            });


            this.itemNodes.push(itemNode);
        }
    }

    onItemClick(index: number, data: any) {
        console.log(`点击了第 ${index} 个项目，数据为：`, data);

        if (this.callback) {
            this.callback(index, data);
        }
        // 发送自定义事件到父节点（Message组件）
        // this.node.emit('item-clicked', index, data);
    }

    clearItems() {
        for (let i = 0; i < this.itemNodes.length; i++) {
            this.itemNodes[i].off(cc.Node.EventType.TOUCH_END);
            this.itemNodes[i].destroy();
        }
        this.itemNodes = [];
    }
}