feat: 邮箱登录
This commit is contained in:
parent
1f35ce1c4a
commit
11ceca9753
@ -3,6 +3,7 @@ import ForgetPwd from '@/components/login/forgetPwd';
|
||||
import Login from '@/components/login/login';
|
||||
import PhoneLogin from '@/components/login/phoneLogin';
|
||||
import SignUp from '@/components/login/signUp';
|
||||
import PrivacyModal from '@/components/owner/qualification/privacy';
|
||||
import { ThemedText } from '@/components/ThemedText';
|
||||
import { ThemedView } from '@/components/ThemedView';
|
||||
import { useLocalSearchParams, useRouter } from 'expo-router';
|
||||
@ -27,6 +28,9 @@ const LoginScreen = () => {
|
||||
// 判断是否有白边
|
||||
const statusBarHeight = StatusBar?.currentHeight ?? 0;
|
||||
|
||||
// 协议弹窗
|
||||
const [modalVisible, setModalVisible] = useState(false);
|
||||
const [modalType, setModalType] = useState<'ai' | 'terms' | 'privacy' | 'user' | 'membership'>('privacy');
|
||||
useEffect(() => {
|
||||
const keyboardWillShowListener = Keyboard.addListener(
|
||||
Platform.OS === 'ios' ? 'keyboardWillShow' : 'keyboardDidShow',
|
||||
@ -71,12 +75,15 @@ const LoginScreen = () => {
|
||||
bounces={false}
|
||||
>
|
||||
<ThemedView className="flex-1 bg-bgPrimary justify-end">
|
||||
<View style={{ width: "100%", alignItems: "center", marginTop: insets.top + 8 }}>
|
||||
<ThemedText style={{ fontSize: 20, fontWeight: 'bold', color: "#fff" }}>Awake your Memo</ThemedText>
|
||||
</View>
|
||||
<View className="flex-1">
|
||||
<View
|
||||
className="absolute left-1/2 z-10"
|
||||
style={{
|
||||
top: containerHeight > 0 ? windowHeight - containerHeight - 210 + statusBarHeight : 0,
|
||||
transform: [{ translateX: -200 }, { translateY: keyboardOffset > 0 ? -keyboardOffset + statusBarHeight : -keyboardOffset }]
|
||||
top: containerHeight > 0 ? windowHeight - containerHeight - 210 + statusBarHeight - insets.top - 28 : 0,
|
||||
transform: [{ translateX: -200 }, { translateY: keyboardOffset > 0 ? -keyboardOffset + statusBarHeight - insets.top - 28 : -keyboardOffset }]
|
||||
}}
|
||||
>
|
||||
{
|
||||
@ -90,8 +97,8 @@ const LoginScreen = () => {
|
||||
<View
|
||||
className="absolute left-1/2 z-[1000] -translate-x-[39.5px] -translate-y-[4px]"
|
||||
style={{
|
||||
top: containerHeight > 0 ? windowHeight - containerHeight - 1 + statusBarHeight : 0,
|
||||
transform: [{ translateX: -39.5 }, { translateY: keyboardOffset > 0 ? -4 - keyboardOffset + statusBarHeight : -4 - keyboardOffset }]
|
||||
top: containerHeight > 0 ? windowHeight - containerHeight - 1 + statusBarHeight - insets.top - 30 : 0,
|
||||
transform: [{ translateX: -39.5 }, { translateY: keyboardOffset > 0 ? -4 - keyboardOffset + statusBarHeight - insets.top - 30 : -4 - keyboardOffset }]
|
||||
}}
|
||||
>
|
||||
<Handers />
|
||||
@ -100,8 +107,8 @@ const LoginScreen = () => {
|
||||
<ThemedView
|
||||
className="w-full bg-white pt-4 px-6 relative z-20 shadow-lg pb-5"
|
||||
style={{
|
||||
borderTopLeftRadius: 24,
|
||||
borderTopRightRadius: 24,
|
||||
borderTopLeftRadius: 50,
|
||||
borderTopRightRadius: 50,
|
||||
shadowColor: '#000',
|
||||
shadowOffset: { width: 0, height: 2 },
|
||||
shadowOpacity: 0.1,
|
||||
@ -154,26 +161,29 @@ const LoginScreen = () => {
|
||||
return components[status as keyof typeof components] || components.login;
|
||||
})()}
|
||||
|
||||
{status == 'login' || !status &&
|
||||
<View className="flex-row justify-center mt-2">
|
||||
<ThemedText className="text-sm !text-textPrimary">
|
||||
{status === 'login' || !status ? t('auth.agree.logintext', { ns: 'login' }) : t('auth.agree.singupText', { ns: 'login' })}
|
||||
</ThemedText>
|
||||
<TouchableOpacity onPress={() => { }}>
|
||||
<ThemedText className="text-sm font-semibold ml-1 !text-textPrimary underline">
|
||||
{t('auth.agree.terms', { ns: 'login' })}
|
||||
<View style={{ width: "100%", alignItems: "center", marginTop: 16 }}>
|
||||
{status == 'login' || !status &&
|
||||
<View className="flex-row justify-center mt-2 flex-wrap w-[85%] items-center">
|
||||
<ThemedText style={{ fontSize: 11, color: "#FFB645" }}>
|
||||
{status === 'login' || !status ? t('auth.agree.logintext', { ns: 'login' }) : t('auth.agree.singupText', { ns: 'login' })}
|
||||
</ThemedText>
|
||||
</TouchableOpacity>
|
||||
<ThemedText className="text-sm !text-textPrimary">
|
||||
{t('auth.agree.join', { ns: 'login' })}
|
||||
</ThemedText>
|
||||
<TouchableOpacity onPress={() => { }}>
|
||||
<ThemedText className="!text-textPrimary underline text-sm font-semibold ml-1">
|
||||
{t('auth.agree.privacyPolicy', { ns: 'login' })}
|
||||
<TouchableOpacity onPress={() => { setModalVisible(true); setModalType('terms') }}>
|
||||
<ThemedText style={{ fontSize: 11, color: "#FFB645", textDecorationLine: 'underline' }}>
|
||||
{t('auth.agree.terms', { ns: 'login' })}
|
||||
</ThemedText>
|
||||
</TouchableOpacity>
|
||||
<ThemedText style={{ fontSize: 11, color: "#FFB645", flexWrap: 'wrap' }}>
|
||||
{t('auth.agree.join', { ns: 'login' })}
|
||||
</ThemedText>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
}
|
||||
<TouchableOpacity onPress={() => { setModalVisible(true); setModalType('privacy') }}>
|
||||
<ThemedText style={{ fontSize: 11, color: "#FFB645", textDecorationLine: 'underline' }}>
|
||||
{t('auth.agree.privacyPolicy', { ns: 'login' })}
|
||||
</ThemedText>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
}
|
||||
</View>
|
||||
<PrivacyModal modalVisible={modalVisible} setModalVisible={setModalVisible} type={modalType} />
|
||||
</ThemedView>
|
||||
</ThemedView>
|
||||
</ScrollView>
|
||||
|
||||
@ -138,6 +138,19 @@ const Login = ({ updateUrlParam, setError, setShowPassword, showPassword }: Logi
|
||||
)}
|
||||
</TouchableOpacity>
|
||||
|
||||
<View style={{ width: "100%", alignItems: "center", opacity: 0 }}>
|
||||
<View style={styles.loginTypeContainer}>
|
||||
<ThemedText>
|
||||
OR
|
||||
</ThemedText>
|
||||
<View style={{ flexDirection: 'row', justifyContent: "space-between", width: "100%" }}>
|
||||
<ThemedText style={styles.loginType} />
|
||||
<ThemedText style={styles.loginType} />
|
||||
<ThemedText style={styles.loginType} />
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.signupContainer}>
|
||||
<ThemedText style={styles.signupText}>
|
||||
{t('auth.login.signUpMessage', { ns: 'login' })}
|
||||
@ -156,12 +169,28 @@ const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
},
|
||||
loginTypeContainer: {
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
gap: 16,
|
||||
width: "70%"
|
||||
},
|
||||
loginType: {
|
||||
borderRadius: 12,
|
||||
width: 54,
|
||||
height: 54,
|
||||
textAlign: 'center',
|
||||
backgroundColor: '#FADBA1'
|
||||
},
|
||||
inputContainer: {
|
||||
marginBottom: 20,
|
||||
},
|
||||
inputLabel: {
|
||||
fontSize: 16,
|
||||
color: '#1F2937',
|
||||
color: '#AC7E35',
|
||||
fontWeight: '600',
|
||||
marginBottom: 8,
|
||||
marginLeft: 8,
|
||||
},
|
||||
@ -169,7 +198,7 @@ const styles = StyleSheet.create({
|
||||
borderRadius: 12,
|
||||
paddingHorizontal: 16,
|
||||
paddingVertical: 12,
|
||||
fontSize: 16,
|
||||
fontSize: 14,
|
||||
textAlignVertical: 'center',
|
||||
backgroundColor: '#FFF8DE'
|
||||
},
|
||||
@ -186,8 +215,8 @@ const styles = StyleSheet.create({
|
||||
marginBottom: 24,
|
||||
},
|
||||
forgotPasswordText: {
|
||||
color: '#1F2937',
|
||||
fontSize: 14,
|
||||
color: '#AC7E35',
|
||||
fontSize: 11,
|
||||
},
|
||||
loginButton: {
|
||||
width: '100%',
|
||||
@ -200,6 +229,7 @@ const styles = StyleSheet.create({
|
||||
loginButtonText: {
|
||||
color: '#FFFFFF',
|
||||
fontWeight: '600',
|
||||
fontSize: 18,
|
||||
},
|
||||
signupContainer: {
|
||||
flexDirection: 'row',
|
||||
@ -207,14 +237,15 @@ const styles = StyleSheet.create({
|
||||
marginTop: 8,
|
||||
},
|
||||
signupText: {
|
||||
color: '#1F2937',
|
||||
fontSize: 14,
|
||||
color: '#AC7E35',
|
||||
fontSize: 17,
|
||||
},
|
||||
signupLink: {
|
||||
color: '#E2793F',
|
||||
fontSize: 14,
|
||||
fontSize: 17,
|
||||
fontWeight: '600',
|
||||
marginLeft: 4,
|
||||
textDecorationLine: 'underline',
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
@ -353,8 +353,9 @@ const styles = StyleSheet.create({
|
||||
overflow: 'hidden',
|
||||
},
|
||||
inputLabel: {
|
||||
fontSize: 16,
|
||||
color: '#1F2937',
|
||||
fontSize: 14,
|
||||
color: '#AC7E35',
|
||||
fontWeight: '600',
|
||||
marginBottom: 8,
|
||||
marginLeft: 8,
|
||||
},
|
||||
|
||||
@ -73,7 +73,7 @@
|
||||
"logintext": "By logging in, you agree to our",
|
||||
"singupText": "By signing up, you agree to our",
|
||||
"terms": " Terms",
|
||||
"join": "&",
|
||||
"join": " and have read our",
|
||||
"privacyPolicy": " Privacy Policy."
|
||||
},
|
||||
"welcome": {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user