import { UIViewID } from '@scripts/define/UIDefine';
import { UIView } from '@scripts/framework/ui/UIView';
import { addBtnClick, addTogClick } from '@scripts/utils/UIHelper';
import { _decorator, Label, Node, Toggle } from 'cc';
import { RedeemMain } from './Main/RedeemMain';
import { RedeemHistory } from './History/RedeemHistory';
import { AppKernel } from '@scripts/app/AppKernel';
import { formatCurrency } from '@scripts/utils/Helper';
const { ccclass, property } = _decorator;

enum ViewType {
    None,
    Redeem,
    History,
}

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

    @property(Node)
    btnBack: Node;

    @property(Label)
    lblNotRedeem: Label;

    @property(Label)
    lblRedeem: Label;

    @property(Node)
    btnTips: Node;

    @property(Node)
    tipsNode: Node;

    @property(Node)
    tipsClose: Node;

    @property(Toggle)
    togRedeem: Toggle;

    @property(Toggle)
    togHistory: Toggle;

    @property(Node)
    redPoint: Node;

    @property(RedeemMain)
    mainView: RedeemMain;

    @property(RedeemHistory)
    historyView: RedeemHistory;

    private m_ViewType: ViewType = ViewType.None;


    protected onCreate(): void | Promise<void> {
        addBtnClick(this.btnBack, this.closeSelf, this);
        addBtnClick(this.btnTips, this.onBtnTipsClick, this);
        addBtnClick(this.tipsClose, this.hideTipsNode, this);

        addTogClick(this.togRedeem, this.onTogRedeemClick, this);
        addTogClick(this.togHistory, this.onTogHistoryClick, this);

        this.mainView.init();
        this.historyView.init();
    }

    protected async onBeforeOpen(_params: unknown) {
        const withdraw = AppKernel.stores.withdrawStore;
        await withdraw.reqBaseInfo();
    }

    protected onOpen() {
        this.togRedeem.isChecked = true;
        this.updateView(ViewType.Redeem);
        this.updateTopNode();
    }

    private hideTipsNode() {
        this.tipsNode.active = false;
    }

    private onBtnTipsClick() {
        this.tipsNode.active = true;
    }

    private onTogRedeemClick() {
        if (this.m_ViewType != ViewType.Redeem) {
            this.updateView(ViewType.Redeem);
        }
    }

    private onTogHistoryClick() {
        if (this.m_ViewType != ViewType.History) {
            this.updateView(ViewType.History);
        }
    }

    private updateTopNode() {
        const withdraw = AppKernel.stores.withdrawStore;
        const baseInfo = withdraw.baseInfo;
        if (!baseInfo) return;

        const scTotal = AppKernel.stores.mainStore.scScore;
        const lockedNum = scTotal - withdraw.sumCanExchange;
        this.lblRedeem.string = formatCurrency(withdraw.sumCanExchange, 2);
        this.lblNotRedeem.string = formatCurrency(lockedNum, 2);
    }

    private updateView(viewType: ViewType) {
        this.m_ViewType = viewType;
        this.mainView.node.active = viewType === ViewType.Redeem;
        this.historyView.node.active = viewType === ViewType.History;

        switch (viewType) {
            case ViewType.Redeem:
                this.mainView.updateView();
                break;
            case ViewType.History:
                this.historyView.updateView();
                break;
        }
    }
}