YD_Event.miniApp/subpackages/mine/login/login.wxml

<view class="login-page">
  <!-- 顶部蓝色头部 -->
  <view class="header">
    <image class="header-bg" src="https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com/static/event_miniapp/bg.png" mode="aspectFill" />
    <view class="header-mask"></view>
    <!-- 导航栏 -->
    <!-- <view class="nav-bar" style="padding-top: {{statusBarHeight}}px;">
      <view class="nav-back" bindtap="onBack">
        <text class="nav-back-arrow">‹</text>
      </view>
      <text class="nav-title">登录</text>
      <view class="nav-placeholder"></view>
    </view> -->
    <mp-navigation-bar
      title="登录"
      background-color="transparent"
      color="#fff"
      bind:click-left="onBack"
      left-arrow
    ></mp-navigation-bar>
    <!-- 欢迎文字 + logo -->
    <view class="header-content">
      <text class="welcome-text">欢迎使用跃享跳</text>
      <image class="logo-img" src="https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com/static/event_miniapp/logo.png" mode="aspectFit" />
    </view>
  </view>

  <!-- 白色内容区 -->
  <view class="content-card">
    <!-- Tab 切换 -->
    <view class="tab-bar">
    <view class="tab-item {{loginMode === 'password' ? 'active' : ''}}" bindtap="onSwitchMode" data-mode="password">
      <text class="tab-text">账号登录</text>
      <view class="tab-line" wx:if="{{loginMode === 'password'}}"></view>
    </view>
    <view class="tab-item {{loginMode === 'code' ? 'active' : ''}}" bindtap="onSwitchMode" data-mode="code">
      <text class="tab-text">手机号登录</text>
      <view class="tab-line" wx:if="{{loginMode === 'code'}}"></view>
    </view>
  </view>

  <!-- 手机号密码登录模式 -->
  <block wx:if="{{loginMode === 'password'}}">
    <view class="field">
      <text class="field-label">手机号</text>
      <view class="field-input-box">
        <input
          class="field-input"
          type="number"
          maxlength="11"
          placeholder="请输入手机号"
          placeholder-class="placeholder"
          value="{{mobile}}"
          bindinput="onMobileInput"
        />
      </view>
    </view>
    <view class="field">
      <text class="field-label">密码</text>
      <view class="field-input-box">
        <input
          class="field-input"
          password="{{!showPassword}}"
          placeholder="请输入密码"
          placeholder-class="placeholder"
          value="{{password}}"
          bindinput="onPasswordInput"
        />
        <view class="eye-btn" bindtap="onTogglePassword">
          <image class="eye-icon" src="/assets/icon-eye{{showPassword ? '-open' : '-close'}}.png" mode="aspectFit" wx:if="{{false}}" />
          <text class="eye-text">{{showPassword ? '🙈' : '👁'}}</text>
        </view>
      </view>
    </view>
  </block>

  <!-- 短信登录模式 -->
  <block wx:if="{{loginMode === 'code'}}">
    <view class="field">
      <text class="field-label">手机号</text>
      <view class="field-input-box">
        <input
          class="field-input"
          type="number"
          maxlength="11"
          placeholder="请输入手机号"
          placeholder-class="placeholder"
          value="{{mobile}}"
          bindinput="onMobileInput"
        />
      </view>
    </view>
    <view class="field">
      <text class="field-label">验证码</text>
      <view class="field-input-box">
        <input
          class="field-input"
          type="number"
          maxlength="6"
          placeholder="请输入验证码"
          placeholder-class="placeholder"
          value="{{verificationCode}}"
          bindinput="onCodeInput"
        />
        <text class="send-code-link {{codeBtnDisabled ? 'disabled' : ''}}" bindtap="onSendCode">{{codeText}}</text>
      </view>
    </view>
  </block>

  <!-- 协议 + 忘记密码 -->
  <view class="agreement-row">
    <view class="agreement-left" bindtap="onToggleAgreement">
      <view class="check-box {{agreed ? 'checked' : ''}}">
        <mp-icon  class="check-icon" icon="done" color="#ffffff" wx:if="{{agreed}}" size="14"></mp-icon>
        <!-- <text class="check-icon" wx:if="{{agreed}}">✓</text> -->
      </view>
      <text class="agreement-text">我同意</text>
      <text class="agreement-link" catchtap="goToPrivacy"> 用户协议 </text>
      <text class="agreement-text">与</text>
      <text class="agreement-link" catchtap="goToPrivacy"> 隐私政策 </text>
    </view>
    <text class="forget-link" bindtap="onForgetPassword">忘记密码?</text>
  </view>

  <!-- 按钮区域 -->
  <view class="btn-area">
    <button class="btn-login" bindtap="onLoginTap" loading="{{logging}}">登录</button>
    <navigator class="btn-register" url="/subpackages/mine/register/register" hover-class="btn-register-hover">注册</navigator>
  </view>
  </view><!-- /content-card -->
</view>