game_cocos_2c/assets/scripts/modules/lobby/ui/CheckInView/CheckInView.ts

import { _decorator, Button, Color, EditBox, find, instantiate, Label, Layout, Node, RichText, Sprite, SpriteFrame, tween, UIOpacity, UITransform } from 'cc';
import { UIView } from '@scripts/framework/ui/UIView';
import { AppKernel } from '@scripts/app/AppKernel';
import { UIViewID } from '@scripts/define/UIDefine';
import { UICloseReason } from '@scripts/framework/ui/UILayer';
import { formatCurrency } from '@scripts/utils/Helper';
import { addBtnClick } from '@scripts/utils/UIHelper';
import { setSpriteFrame } from '@scripts/utils/ResHelper';

const { ccclass, property } = _decorator;

@ccclass('CheckInView')
export class CheckInView extends UIView {
  readonly viewId = UIViewID.CheckInView;

  @property(Node)
  private btn_close: Node;

  @property(Node)
  private btn_viewClub: Node;

  @property(Sprite)
  private vip_icon: Sprite;

  @property(Sprite)
  private vip_title: Sprite;

  @property(Label)
  private vip_boost: Label;

  @property(Node)
  private vip_days: Node;

  @property(Node)
  private days: Node;

  @property(Node)
  private prop_template: Node;


  private _checkInData: any;

  protected async onBeforeOpen(_params: unknown): Promise<boolean> {
    const checkInStore = AppKernel.stores.checkInStore;
    const res = await checkInStore.reqCheckInInfo();
    return res;
  }

  protected onCreate(): void | Promise<void> {
    AppKernel.events.on('checkIn:update', this.updateCheckInView, this);
    addBtnClick(this.btn_close, this.onBtnCloseClick, this);
    addBtnClick(this.btn_viewClub, this.onBtnViewClubClick, this);
    this.days.children.forEach((day, index) => {
      addBtnClick(day, () => this.onDayClick(index), this);
    })
  }

  protected onBeforeClose(_reason: UICloseReason): boolean | Promise<boolean> {
    AppKernel.events.off('checkIn:update', this.updateCheckInView, this);
    return true;
  }

  private updateCheckInView() {
    this._checkInData = AppKernel.stores.checkInStore.checkInData;

    const { vip, days } = this._checkInData;

    this.updateDays(days);
    this.updateVipInfo(vip);

  }

  private updateDays(daysData = []) {
    daysData?.forEach((dayData, index) => {
      const { status, final_reward, vip_boost } = dayData;
      const day = this.days.children[index];
      if (!day) return;

      const bg_normal = day.getChildByName('bg_normal');
      const bg_current = day.getChildByName('bg_current');
      const lock = day.getChildByName('lock');
      const title = day.getChildByName('day');
      const rewards = day.getChildByName('rewards');
      const rewards_layout = rewards.getComponent(Layout);
      const light = day.getChildByName('light');
      const mask = day.getChildByName('mask');
      const signedIn = day.getChildByName('signedIn');

      const isClaimable = status == "claimable";
      const isClaimed = status == "claimed";
      const isLocked = status == "locked";
      const isLastDay = index == 6;

      if (isLastDay) {// 最后一天
        lock.active = isLocked ? true : false;
        light.active = isClaimable ? true : false;
        mask.active = isClaimed ? true : false;
        signedIn.active = isClaimed ? true : false;
        rewards.active = true;
        title.active = true;
      } else {
        bg_normal.active = isClaimable ? false : true;
        bg_current.active = isClaimable ? true : false;
        lock.active = isLocked ? true : false;
        title.active = true;
        rewards.active = true;
        light.active = isClaimable ? true : false;
        mask.active = isClaimed ? true : false;
        signedIn.active = isClaimed ? true : false;
      }

      this.stopLightBlink(light);
      if (isClaimable) this.startLightBlink(light);

      const rewardsNums = Object.keys(final_reward).length;
      for (const [key, val] of Object.entries(final_reward)) {
        let find_key = key;
        const temp = find(`${find_key}_${isLastDay ? "l" : "s"}`, this.prop_template);
        if (!temp) continue;

        const exist_reward = rewards.getChildByName(temp.name);
        const reward = !!exist_reward ? exist_reward : instantiate(temp);
        if (!!!exist_reward) {
          reward.parent = rewards;
          reward.active = true;
        }

        const num = reward.getChildByName('num');
        num.getComponent(Label).string = `${(Number(val) / 100).toFixed(2)}`;


        if (!isLastDay) rewards_layout.spacingX = rewardsNums > 2 ? 5 : 40;
      }

      const isTodayBoost = vip_boost?.enabled && vip_boost?.has_boost;
      this.vip_days.children[index].active = isTodayBoost;

    })

  }

  private updateVipInfo(vip) {
    const { vip_level, daily_bonus_boost_percent } = vip;
    setSpriteFrame(this.vip_icon, "textures/signIn/vipIcon/" + vip_level);
    setSpriteFrame(this.vip_title, "textures/signIn/vipTitle/" + vip_level);

    this.vip_boost.string = `+${daily_bonus_boost_percent - 100}% BOOST`;
  }

  private onBtnCloseClick() {
    AppKernel.ui.close(UIViewID.CheckInView);
  }

  startLightBlink(lightNode: Node) {
    const uiOpacity = lightNode.getComponent(UIOpacity) || lightNode.addComponent(UIOpacity);
    // 先重置初始透明度
    uiOpacity.opacity = 255;

    tween(uiOpacity)
      .to(0.6, { opacity: 0 })
      .to(0.6, { opacity: 255 })
      .union()
      .repeatForever() // 无限循环闪烁
      .start();
  }

  // 停止闪烁
  stopLightBlink(lightNode: Node) {
    const uiOpacity = lightNode.getComponent(UIOpacity);
    if (!uiOpacity) return;
    tween(uiOpacity).stop();
    uiOpacity.opacity = 255; // 恢复不透明
  }

  async onDayClick(index: number) {
    const { final_reward: reward, status } = this._checkInData.days[index];
    console.log('onDayClick', index, 'reward', reward, 'status', status);
    if (!reward || status != "claimable") return;

    const checkInStore = AppKernel.stores.checkInStore;
    const res = await checkInStore.reqCheckIn(index + 1);
    if (res) AppKernel.ui.open(UIViewID.RewardView, { reward });
  }

  private onBtnViewClubClick() {

  }

}