feat: 暂提

2025-08-01 14:50:34 +08:00 · 2025-08-01 14:50:34 +08:00 · 1f7a101fc5
commit 1f7a101fc5
parent be3c8e0c75
8 changed files with 57 additions and 38 deletions
--- a/app/(tabs)/_layout.tsx
+++ b/app/(tabs)/_layout.tsx
@ -165,8 +165,10 @@ export default function TabLayout() {
  }, [token]); // 添加token作为依赖

  useEffect(() => {
-    prefetchChats().catch(console.error);
-  }, []);
+    if (token) {
+      prefetchChats().catch(console.error);
+    }
+  }, [token]);

  return (
    <Tabs
--- a/app/(tabs)/login.tsx
+++ b/app/(tabs)/login.tsx
@ -2,7 +2,7 @@ import Handers from '@/assets/icons/svg/handers.svg';
 import LoginIP1 from '@/assets/icons/svg/loginIp1.svg';
 import LoginIP2 from '@/assets/icons/svg/loginIp2.svg';
 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 { ThemedText } from '@/components/ThemedText';
 import { ThemedView } from '@/components/ThemedView';
@ -10,6 +10,7 @@ import { useLocalSearchParams, useRouter } from 'expo-router';
 import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Keyboard, KeyboardAvoidingView, LayoutChangeEvent, Platform, ScrollView, StatusBar, TouchableOpacity, View, ViewStyle, useWindowDimensions } from 'react-native';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';

 const LoginScreen = () => {
    const router = useRouter();
@ -20,6 +21,7 @@ const LoginScreen = () => {
    const { height: windowHeight } = useWindowDimensions();
    const [showPassword, setShowPassword] = useState(false);
    const [keyboardOffset, setKeyboardOffset] = useState(0);
+    const insets = useSafeAreaInsets();
    // 判断是否有白边
    const statusBarHeight = StatusBar?.currentHeight ?? 0;

@ -60,7 +62,7 @@ const LoginScreen = () => {
        >
            <ScrollView
                contentContainerStyle={{
-                    flexGrow: 1,
+                    flexGrow: 1
                }}
                keyboardShouldPersistTaps="handled"
                bounces={false}
@ -93,7 +95,7 @@ const LoginScreen = () => {
                        </View>
                    </View>
                    <ThemedView
-                        className="w-full bg-white pt-12 px-6 relative z-20 shadow-lg pb-5"
+                        className="w-full bg-white pt-4 px-6 relative z-20 shadow-lg pb-5"
                        style={{
                            borderTopLeftRadius: 24,
                            borderTopRightRadius: 24,
@ -101,7 +103,8 @@ const LoginScreen = () => {
                            shadowOffset: { width: 0, height: 2 },
                            shadowOpacity: 0.1,
                            shadowRadius: 8,
-                            elevation: 5
+                            elevation: 5,
+                            paddingBottom: insets.bottom
                        } as ViewStyle}
                        onLayout={handleLayout}
                    >
@ -131,12 +134,15 @@ const LoginScreen = () => {
                                    />
                                ),
                                login: (
-                                    <Login
-                                        {...commonProps}
-                                        setShowPassword={setShowPassword}
-                                        showPassword={showPassword}
-                                    />
-                                    // <PhoneLogin />
+                                    // <Login
+                                    //     {...commonProps}
+                                    //     setShowPassword={setShowPassword}
+                                    //     showPassword={showPassword}
+                                    // />
+                                    <PhoneLogin  {...commonProps} />
+                                ),
+                                code: (
+                                    <PhoneLogin  {...commonProps} />
                                )
                            };

--- a/components/login/code.tsx
+++ b/components/login/code.tsx
@ -7,14 +7,12 @@ import { useTranslation } from "react-i18next";
 import { ActivityIndicator, Animated, TextInput as RNTextInput, TextInput, TouchableOpacity, View } from "react-native";
 import { useAuth } from "../../contexts/auth-context";
 import { ThemedText } from "../ThemedText";
-import { Steps } from "./phoneLogin";

-interface LoginProps {
-    setSteps: (steps: Steps) => void;
+interface CodeProps {
    phone: string;
 }

-const Code = ({ setSteps, phone }: LoginProps) => {
+const Code = ({ phone }: CodeProps) => {
    const { t } = useTranslation();
    const { login } = useAuth();
    const [isLoading, setIsLoading] = useState(false);
@ -71,7 +69,6 @@ const Code = ({ setSteps, phone }: LoginProps) => {
            })

        } catch (error) {
-            // console.error(t("auth.telLogin.sendCodeError", { ns: 'login' }), error);
        }
    }

@ -97,13 +94,11 @@ const Code = ({ setSteps, phone }: LoginProps) => {
                login(res, res.access_token || '')
                router.replace('/user-message')
            }).catch((error) => {
-                // console.log(error);
                setError(t("auth.telLogin.codeVaild", { ns: 'login' }));
            })
            setIsLoading(false);
        } catch (error) {
            setIsLoading(false);
-            // console.error(t("auth.telLogin.codeVaild", { ns: 'login' }), error);
        }
    }
    // 60s倒计时
@ -116,7 +111,7 @@ const Code = ({ setSteps, phone }: LoginProps) => {
    }, [countdown]);

    return (
-        <View className="flex-1 bg-white p-6">
+        <View className="flex-1 bg-white px-6">
            <View className="flex-1 justify-center">
                <View className="items-center mb-8">
                    <ThemedText className="text-2xl font-semibold mb-2 text-gray-900">
@ -152,7 +147,7 @@ const Code = ({ setSteps, phone }: LoginProps) => {
                            style={{ width: 40, height: 40 }}
                            className="bg-[#FFF8DE] rounded-xl text-textTertiary text-3xl text-center"
                            keyboardType="number-pad"
-                            maxLength={6} // Allow pasting longer codes
+                            maxLength={6}
                            value={digit}
                            onChangeText={text => handleCodeChange(text, index)}
                            onKeyPress={({ nativeEvent }) => focusPrevious(index, nativeEvent.key)}
@ -202,17 +197,6 @@ const Code = ({ setSteps, phone }: LoginProps) => {
                    </TouchableOpacity>
                </View>
            </View>
-
-            <View className="py-4">
-                <TouchableOpacity
-                    className="py-3 items-center"
-                    onPress={() => setSteps('phone')}
-                >
-                    <ThemedText className="!text-buttonFill font-medium">
-                        {t("auth.telLogin.goBack", { ns: 'login' })}
-                    </ThemedText>
-                </TouchableOpacity>
-            </View>
        </View>
    )
 }
--- a/components/login/phone.tsx
+++ b/components/login/phone.tsx
@ -9,9 +9,10 @@ interface LoginProps {
    setSteps: (steps: Steps) => void;
    setPhone: (phone: string) => void;
    phone: string;
+    updateUrlParam: (status: string, value: string) => void;
 }

-const Phone = ({ setSteps, setPhone, phone }: LoginProps) => {
+const Phone = ({ setSteps, setPhone, phone, updateUrlParam }: LoginProps) => {
    const { t } = useTranslation();
    const [isLoading, setIsLoading] = useState(false);
    const [error, setError] = useState<string>('');
@ -30,6 +31,7 @@ const Phone = ({ setSteps, setPhone, phone }: LoginProps) => {
                body: JSON.stringify({ phone: phone }),
            })
            setSteps('code')
+            updateUrlParam("status", "code");
            setIsLoading(false);
        } catch (error) {
            setPhone("")
--- a/components/login/phoneLogin.tsx
+++ b/components/login/phoneLogin.tsx
@ -5,13 +5,17 @@ import Phone from "./phone";

 export type Steps = "phone" | "code";

-const PhoneLogin = () => {
+interface LoginProps {
+    updateUrlParam: (status: string, value: string) => void;
+}
+
+const PhoneLogin = ({ updateUrlParam }: LoginProps) => {
    const [steps, setSteps] = useState<Steps>("phone");
    const [phone, setPhone] = useState('');

    return <View>
        {
-            steps === "phone" ? <Phone setSteps={setSteps} setPhone={setPhone} phone={phone} /> : <Code setSteps={setSteps} phone={phone} />
+            steps === "phone" ? <Phone setSteps={setSteps} setPhone={setPhone} phone={phone} updateUrlParam={updateUrlParam} /> : <Code phone={phone} />
        }
    </View>
 }
--- a/i18n/locales/zh/login.json
+++ b/i18n/locales/zh/login.json
@ -23,7 +23,7 @@
      "allDone": "完成！"
    },
    "telLogin": {
-      "title": "验证身份",
+      "title": "请输入手机号",
      "secondTitle": "我们已发送验证码至：",
      "sendCode": "发送验证码",
      "continue": "继续",
--- a/package-lock.json
+++ b/package-lock.json
@ -14,6 +14,7 @@
        "@react-navigation/elements": "^2.3.8",
        "@react-navigation/native": "^7.1.6",
        "@reduxjs/toolkit": "^2.8.2",
+        "@twotalltotems/react-native-otp-input": "^1.3.11",
        "@types/p-limit": "^2.2.0",
        "@types/react-redux": "^7.1.34",
        "expo": "53.0.19",
@ -3793,6 +3794,16 @@
        }
      }
    },
+    "node_modules/@react-native-community/clipboard": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/@react-native-community/clipboard/-/clipboard-1.5.1.tgz",
+      "integrity": "sha512-AHAmrkLEH5UtPaDiRqoULERHh3oNv7Dgs0bTC0hO5Z2GdNokAMPT5w8ci8aMcRemcwbtdHjxChgtjbeA38GBdA==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": ">=16.0",
+        "react-native": ">=0.57.0"
+      }
+    },
    "node_modules/@react-native-masked-view/masked-view": {
      "version": "0.3.2",
      "resolved": "https://registry.npmjs.org/@react-native-masked-view/masked-view/-/masked-view-0.3.2.tgz",
@ -4645,6 +4656,15 @@
      "devOptional": true,
      "license": "MIT"
    },
+    "node_modules/@twotalltotems/react-native-otp-input": {
+      "version": "1.3.11",
+      "resolved": "https://registry.npmjs.org/@twotalltotems/react-native-otp-input/-/react-native-otp-input-1.3.11.tgz",
+      "integrity": "sha512-xSsEMa8llYHITKgx1FGwU3uK56Kk6+abgkJpo57pLnUpYC2CZpvhkvRKhFa7Ui6BhdRuh0Ob1O7q234d3CksRg==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-native-community/clipboard": "^1.2.2"
+      }
+    },
    "node_modules/@tybys/wasm-util": {
      "version": "0.9.0",
      "resolved": "https://registry.npmjs.org/@tybys/wasm-util/-/wasm-util-0.9.0.tgz",
--- a/package.json
+++ b/package.json
@ -15,10 +15,12 @@
  },
  "dependencies": {
    "@expo/vector-icons": "^14.1.0",
+    "@react-native-masked-view/masked-view": "0.3.2",
    "@react-navigation/bottom-tabs": "^7.3.10",
    "@react-navigation/elements": "^2.3.8",
    "@react-navigation/native": "^7.1.6",
    "@reduxjs/toolkit": "^2.8.2",
+    "@twotalltotems/react-native-otp-input": "^1.3.11",
    "@types/p-limit": "^2.2.0",
    "@types/react-redux": "^7.1.34",
    "expo": "53.0.19",
@ -81,8 +83,7 @@
    "react-native-view-shot": "4.0.3",
    "react-native-web": "~0.20.0",
    "react-native-webview": "13.13.5",
-    "react-redux": "^9.2.0",
-    "@react-native-masked-view/masked-view": "0.3.2"
+    "react-redux": "^9.2.0"
  },
  "devDependencies": {
    "@babel/core": "^7.25.2",