true_casey/rnpay
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix ui

Browse Source
This commit is contained in:
TQCasey
2026-02-05 02:29:50 +08:00
parent 01e597ac93
commit bb215fd492
7 changed files with 89 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
components/OTPBindUI.tsx
View File

@@ -60,14 +60,20 @@ export const OTPBindUI: React.FC<OTPBindUIProps> = ({
{state.step === 'mobile' && (
<>
{state.errorMessage ? (
<Text style={styles.errorText}>{state.errorMessage}</Text>
) : null}
<TextInput
style={styles.input}
style={[styles.input, state.errorMessage ? styles.inputError : {}]}
placeholder="请输入手机号"
placeholderTextColor="#999"
keyboardType="phone-pad"
maxLength={mobileLength}
value={state.mobile}
onChangeText={actions.setMobile}
onChangeText={(text) => {
actions.setMobile(text);
if (state.errorMessage) actions.clearError();
}}
editable={!state.loading}
/>
<TouchableOpacity
@@ -87,14 +93,20 @@ export const OTPBindUI: React.FC<OTPBindUIProps> = ({
{state.step === 'otp' && (
<>
<Text style={styles.hint}>验证码已发送至 {state.mobile}</Text>
{state.errorMessage ? (
<Text style={styles.errorText}>{state.errorMessage}</Text>
) : null}
<TextInput
style={styles.input}
style={[styles.input, state.errorMessage ? styles.inputError : {}]}
placeholder={`请输入 ${otpLength} 位验证码`}
placeholderTextColor="#999"
keyboardType="number-pad"
maxLength={otpLength}
value={state.otp}
onChangeText={actions.setOtp}
onChangeText={(text) => {
actions.setOtp(text);
if (state.errorMessage) actions.clearError();
}}
editable={!state.loading}
/>
<TouchableOpacity
@@ -149,6 +161,15 @@ const styles = StyleSheet.create({
fontSize: 16,
marginBottom: 15,
},
inputError: {
borderColor: '#ff3b30',
},
errorText: {
color: '#ff3b30',
fontSize: 14,
marginBottom: 10,
textAlign: 'center',
},
button: {
backgroundColor: '#007AFF',
borderRadius: 5,