rougelike-demo/client/assets/scripts/App/Login/UILogin.ts

import { _decorator, Button, EditBox } from 'cc';
import { NetManager } from '../../Framework/Net/NetManager';
import { UIBase } from '../../Framework/UI/UIBase';
import { AppStatusManager } from '../AppStatus/AppStatusManager';
import { LoginMessagePair } from '../Msg/Pair/LoginMessagePair';

const { ccclass } = _decorator;

/**
 * 登录界面
 * 职责:
 * - 显示登录UI
 * - 处理账号输入
 * - 处理登录按钮点击
 * - 发送登录请求
 * - 登录成功后切换到游戏状态
 */
@ccclass('UILogin')
export class UILogin extends UIBase {
    /** 账号输入框 */
    private _inputAccount: EditBox | null = null;

    /** 登录按钮 */
    private _btnLogin: Button | null = null;

    /** 是否正在登录中 */
    private _isLogging: boolean = false;

    /**
     * 获取UI资源路径
     */
    onGetUrl(): string {
        return 'res://UI/Login/UILogin';
    }

    /**
     * UI初始化
     */
    async onStart(params?: any): Promise<void> {
        console.log('[UILogin] 登录界面初始化', params);

        // 使用GetChild查找子节点
        this._inputAccount = this.GetChild('mid/input_account', EditBox);
        this._btnLogin = this.GetChild('mid/btn_login', Button);

        // 使用SetClick绑定点击事件
        this.SetClick(this._btnLogin, this.onLoginClick, this);
    }

    /**
     * 登录按钮点击
     */
    private async onLoginClick(): Promise<void> {
        if (this._isLogging) {
            console.log('[UILogin] 正在登录中,请稍候...');
            return;
        }

        // 获取账号
        const account = this._inputAccount?.string?.trim() || '';

        if (!account) {
            console.warn('[UILogin] 请输入账号');
            // TODO: 显示提示UI
            return;
        }

        console.log(`[UILogin] 开始登录,账号: ${account}`);

        // 开始登录
        this._isLogging = true;

        try {
            await this.login(account);
        } catch (error) {
            console.error('[UILogin] 登录失败:', error);
            // TODO: 显示错误提示UI
        } finally {
            this._isLogging = false;
        }
    }

    /**
     * 执行登录
     * @param account 账号
     */
    private async login(account: string): Promise<void> {
        const netManager = NetManager.getInstance();

        // 使用类型化的登录协议
        const result = await netManager.callMsg(new LoginMessagePair(), {
            playerId: account
        },);

        if (result && result.success) {
            console.log('[UILogin] 登录成功:', result);

            // 登录成功,切换到游戏状态
            const appStatusManager = AppStatusManager.getInstance();
            appStatusManager.changeState('Game', result);

            // 隐藏登录界面
            this.hide();
        } else {
            console.error('[UILogin] 登录失败:', result?.message || '返回结果为空');
            // TODO: 显示错误提示UI
        }
    }

    /**
     * UI清理
     */
    onEnd(): void {
        console.log('[UILogin] 登录界面清理');
    }
}