JisolGame/JisolGameCocos/assets/script/ui/Novice/NoviceSelectPetView.ts

import { _decorator,Node } from 'cc';
import { sp } from 'cc';
import { UIPetAnim } from '../../consts/GData';
import { Sprite } from 'cc';
import { Color } from 'cc';
import { GUI } from '../UIConfig';
import PlayerPetData from '../../data/PlayerPetData';
import { JNGLayerBase } from '../../components/JNComponent';
import { app, TD } from '../../App';
import { TbGGlobalEnum } from '../../config/TbGGlobalEnum';
const { ccclass, property } = _decorator;


@ccclass('NoviceSelectPetView')
export class NoviceSelectPetView extends JNGLayerBase {

    //选择宠物的节点
    @property([Node])
    selects:Node[] = [];

    //可选择宠物的列表
    petIds:number[];
    //选择index
    index:number = 0;

    async onJNLoad(data?: any) {

        super.onJNLoad();

        //加载配置表 (找到可选择的宠物Id)
        let info = TD.TbGGlobal.get(TbGGlobalEnum.SELECT_PET_ID);
        this.petIds = JSON.parse(info.args);

        //显示宠物
        this.selects.forEach((item,index) => {
            //获取Spine组件
            let spine = item.getComponentInChildren(sp.Skeleton);
            //设置显示的角色
            spine.skeletonData = app.battleRes.getRoleSpine(this.petIds[index]);
            //全部角色播放等待动画
            spine.setAnimation(0,UIPetAnim.std,true);
        })

        this.onUpdateView();

    }

    //更新UI
    onUpdateView(){

        this.selects.forEach(item => {
            item.getComponent(Sprite).color = new Color("8D8D8D");
        })
        
        //被选择赋黑
        this.selects[this.index].getComponent(Sprite).color = new Color("#000000");

    }

    //点击选择
    onClickSelect(e,data){

        let index = parseInt(data);
        
        this.index = index;

        //更新UI
        this.onUpdateView();

    }

    //点击确定
    async onClickOk(){

        //向服务器确认选择
        console.log(await PlayerPetData.getIns().SelectNovicePet(this.petIds[this.index]));
        app.layer.Open(GUI.Tips,{text:"选择宠物成功 欢迎来到宠物世界..."});
        //关闭页面
        app.layer.CloseNode(this.node);

    }

}