102 lines
2.9 KiB
Plaintext
102 lines
2.9 KiB
Plaintext
<!--pages/login/phone-login.wxml-->
|
||
<view class="container">
|
||
<!-- 登录表单 -->
|
||
<view class="login-form">
|
||
<text class="page-title">登录万花筒</text>
|
||
|
||
<view class="input-row">
|
||
<text class="label">手机号</text>
|
||
<picker mode="selector" range="{{countryCodes}}" value="{{countryCodeIndex}}" bindchange="onCountryCodeChange">
|
||
<view class="prefix">{{countryCodes[countryCodeIndex]}}</view>
|
||
</picker>
|
||
<input
|
||
type="number"
|
||
placeholder="输入手机号"
|
||
maxlength="11"
|
||
bindinput="onPhoneInput"
|
||
value="{{phone}}"
|
||
/>
|
||
</view>
|
||
|
||
<!-- 验证码登录 -->
|
||
<view class="input-row" wx:if="{{loginType === 'code'}}">
|
||
<text class="label">验证码</text>
|
||
<input
|
||
type="number"
|
||
placeholder="请输入验证码"
|
||
maxlength="6"
|
||
bindinput="onCodeInput"
|
||
value="{{code}}"
|
||
/>
|
||
<button
|
||
class="get-code {{countdown > 0 ? 'disabled' : ''}}"
|
||
bindtap="getVerifyCode"
|
||
>
|
||
{{codeButtonText}}
|
||
</button>
|
||
</view>
|
||
|
||
<!-- 密码登录 -->
|
||
<view class="input-row" wx:if="{{loginType === 'password'}}">
|
||
<text class="label">密码</text>
|
||
<input
|
||
type="password"
|
||
placeholder="请输入密码"
|
||
bindinput="onPasswordInput"
|
||
value="{{password}}"
|
||
/>
|
||
</view>
|
||
|
||
<!-- 切换登录方式 -->
|
||
<view class="switch-login-type" bindtap="switchLoginType">
|
||
<text wx:if="{{loginType === 'code'}}">密码登录</text>
|
||
<text wx:else>验证码登录</text>
|
||
</view>
|
||
|
||
<!-- 协议提示 -->
|
||
<view class="agreement-section">
|
||
<checkbox-group bindchange="onAgreeChange">
|
||
<label class="agreement-label">
|
||
<checkbox value="agree" checked="{{agreed}}" color="#07c160" />
|
||
<view class="agreement-text">
|
||
<text class="normal-text">我已阅读并同意</text>
|
||
<text class="link-text" catchtap="goToUserAgreement">《用户协议》</text>
|
||
<text class="normal-text">和</text>
|
||
<text class="link-text" catchtap="goToPrivacyPolicy">《隐私政策》</text>
|
||
</view>
|
||
</label>
|
||
</checkbox-group>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 登录按钮（独立在login-form外） -->
|
||
<view class="button-wrapper">
|
||
<button
|
||
class="green-btn"
|
||
bindtap="handleLogin"
|
||
>
|
||
登录
|
||
</button>
|
||
</view>
|
||
|
||
<!-- 底部指示器 -->
|
||
<view class="bottom-indicator"></view>
|
||
</view>
|
||
|
||
<!-- Toast提示 -->
|
||
<view class="toast-overlay" wx:if="{{showSuccess}}">
|
||
<view class="toast">
|
||
<view class="toast-icon">
|
||
<view class="success-checkmark"></view>
|
||
</view>
|
||
<text class="toast-text">登录成功</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="toast-overlay" wx:if="{{showLoading}}">
|
||
<view class="toast">
|
||
<view class="toast-loading"></view>
|
||
<text class="toast-text">获取验证中</text>
|
||
</view>
|
||
</view>
|