car/assets/script/ui/bag/bag.ts

import { _decorator, Component, instantiate, Node, PageView, Prefab } from 'cc';
import { uiManager } from '../../manager/uiManager';
import { http } from '../../http';
import { config } from '../../config';
import { bag_list_item_data, bag_type_item_data } from '../../data';
import { bag_type_item } from './bag_type_item';
import { bag_list_page } from './bag_list_page';
import { GameManager } from '../../GameManager';
const { ccclass, property } = _decorator;

@ccclass('bag')
export class bag extends Component {
    @property(Node) btn_back:Node = null
    @property(Node) type_content:Node = null
    @property(Prefab) type_item:Prefab = null

    @property(Node) list_pageView:Node = null
    @property(Prefab) list_page_prefab:Prefab = null

    @property(Node) img_empty:Node = null
    
    private cur_type_item:bag_type_item = null
    private data_list:bag_list_item_data[] = []
    start() {
        uiManager.Instance().onButtonListen(this.btn_back, ()=>{
            this.close()
        })

        this.requestTypeList()
    }
    
    close() {
        this.node.removeFromParent()
    }

    private requestTypeList() {
        http.post(config.API.bag_type_list,null, (err,d)=>{
            if(!err){
                let nd = JSON.parse(d)
                if(nd.code === config.status.SUCCESS){
                    // console.log("bag_type_list", nd.content)
                    this.loadTypeView(nd.content)
                }
            }
        },'GET')
    }

    private loadTypeView(data_list:bag_type_item_data[]) {
        for (let index = 0; index < data_list.length; index++) {
            const element = data_list[index];
            let item = instantiate(this.type_item)
            item.parent = this.type_content
            let type_item = item.getComponent(bag_type_item)
            type_item.initView(element,this.onClickTypeItem.bind(this))
            if(index==0) {
                type_item.setSelected()
                this.cur_type_item = type_item
                this.requestContentList()
            } else {
                type_item.setUnselected()
            }
        }
    }

    private onClickTypeItem(item:bag_type_item) {
        if(item.getData().id==this.cur_type_item.getData().id) {
            return
        }

        item.setSelected()
        this.cur_type_item.setUnselected()
        this.cur_type_item = item

        this.requestContentList()
    }

    private requestContentList() {
        let id = this.cur_type_item.getData().id
        GameManager.requestBagList(id, (d_list)=>{
            this.data_list = d_list
            this.loadListView()
            if(this.data_list.length>0) {
                this.img_empty.active = false
            } else {
                this.img_empty.active = true
            }
        },true)
    }

    private loadListView() {
        this.list_pageView.getComponent(PageView).removeAllPages()

        let group_list = []
        let slice_size:number = 20
        for (let i = 0; i < this.data_list.length; i += slice_size) {
            let group = this.data_list.slice(i, i + slice_size)
            group_list.push(group)
        }

        for (let index = 0; index < group_list.length; index++) {
            const element = group_list[index];
            let page = instantiate(this.list_page_prefab)
            page.getComponent(bag_list_page).initView(element)
            this.list_pageView.getComponent(PageView).addPage(page)
        }
    }
}