import { _decorator, Component, Label, Node, Sprite, SpriteFrame } from 'cc';
import { base_ui } from '../../fw/base_ui';
import { bag_list_item_data } from '../../data';
import { tools } from '../../tools';
const { ccclass, property } = _decorator;

@ccclass('bag_list_page_item')
export class bag_list_page_item extends base_ui {
    @property(Node) icon_bg:Node = null
    @property(Node) img_icon:Node = null
    @property(Node) lab_count:Node = null
    @property(Node) lab_name:Node = null

    @property(SpriteFrame) sf_icon_bg_selected:SpriteFrame = null
    @property(SpriteFrame) sf_icon_bg_unSelected:SpriteFrame = null

    private m_data:bag_list_item_data = null
    private m_click_cb = null
    start() {
        this.onButtonListen(this.node, ()=>{
            if(this.m_click_cb) {
                this.m_click_cb(this)
            }
        })
    }

    initView(data:bag_list_item_data, click_cb) {
        this.m_click_cb = click_cb
        this.setData(data)
    }

    public setData(data:bag_list_item_data) {
        this.m_data = data
        tools.loadRemoteImg(this.m_data.icon, (r)=>{
            this.img_icon.getComponent(Sprite).spriteFrame = r.sf
        })
        this.lab_name.getComponent(Label).string = data.name
        this.lab_count.getComponent(Label).string = data.quantity + '' 
    }

    public setSelectedStatus() {
        this.icon_bg.getComponent(Sprite).spriteFrame = this.sf_icon_bg_selected
    }

    public setUnselectedStatus() {
        this.icon_bg.getComponent(Sprite).spriteFrame = this.sf_icon_bg_unSelected
    }

    public getData():bag_list_item_data {
        return this.m_data
    }
}

