470 lines
17 KiB
React
470 lines
17 KiB
React
|
import React, {
|
||
|
|
useState,
|
||
|
|
useEffect,
|
||
|
|
useReducer,
|
||
|
|
useMemo,
|
||
|
|
createContext,
|
||
|
|
useCallback,
|
||
|
|
} from "react";
|
||
|
|
import { View } from "react-native";
|
||
|
|
import * as SplashScreen from "expo-splash-screen";
|
||
|
|
import HomeTab from "./screeens/HomeTab";
|
||
|
|
import Login from "./screeens/Login";
|
||
|
|
import StreamerProfile from "./screeens/StreamerProfile";
|
||
|
|
import UserProfile from "./screeens/UserProfile";
|
||
|
|
import { createNativeStackNavigator } from "@react-navigation/native-stack";
|
||
|
|
import { NavigationContainer, DefaultTheme } from "@react-navigation/native";
|
||
|
|
import { SafeAreaProvider } from "react-native-safe-area-context";
|
||
|
|
import { TailwindProvider } from "tailwind-rn";
|
||
|
|
import utilities from "./tailwind.json";
|
||
|
|
import ForgetPassword from "./screeens/Login/ForgetPassword";
|
||
|
|
import SetPassword from "./screeens/Login/SetPassword";
|
||
|
|
import Toast from "react-native-toast-message";
|
||
|
|
import loginReducer from "./utils/loginReducer";
|
||
|
|
import MessageDetail from "./screeens/Messages/MessageDetail";
|
||
|
|
import EditUserProfile from "./screeens/EditUserProfile";
|
||
|
|
import Wallet from "./screeens/Wallet";
|
||
|
|
import UnlockedWechat from "./screeens/UnlockedWechat";
|
||
|
|
import EditStreamerProfile from "./screeens/EditStreamerProfile";
|
||
|
|
import Relationship from "./screeens/Relationship";
|
||
|
|
import StreamerVerification from "./screeens/StreamerVerification";
|
||
|
|
import EditPlatformOrder from "./screeens/EditPlatformOrder";
|
||
|
|
import StreamerInviteUser from "./screeens/StreamerInviteUser";
|
||
|
|
import Setting from "./screeens/Setting";
|
||
|
|
import WechatWaitingToAdd from "./screeens/WechatWaitingToAdd";
|
||
|
|
import Search from "./screeens/Search";
|
||
|
|
import WebWithHeader from "./screeens/WebWithHeader";
|
||
|
|
import UpdateModal from "./components/UpdateModal";
|
||
|
|
import { Icon } from "@rneui/themed";
|
||
|
|
import { StatusBar } from "expo-status-bar";
|
||
|
|
import { save, get, remove, storeAppInfo } from "./utils/storeInfo";
|
||
|
|
import baseRequest from "./utils/baseRequest";
|
||
|
|
import { generateSignature } from "./utils/crypto";
|
||
|
|
|
||
|
|
const RootStack = createNativeStackNavigator();
|
||
|
|
|
||
|
|
export const AuthContext = createContext("");
|
||
|
|
|
||
|
|
SplashScreen.preventAutoHideAsync();
|
||
|
|
|
||
|
|
export default function App() {
|
||
|
|
//app主题
|
||
|
|
const MyTheme = {
|
||
|
|
...DefaultTheme,
|
||
|
|
colors: {
|
||
|
|
...DefaultTheme.colors,
|
||
|
|
background: "#07050A",
|
||
|
|
},
|
||
|
|
};
|
||
|
|
|
||
|
|
//获取环境变量
|
||
|
|
const apiUrl = process.env.EXPO_PUBLIC_API_URL;
|
||
|
|
//登录逻辑
|
||
|
|
const [state, dispatch] = useReducer(loginReducer, {
|
||
|
|
isSignin: false,
|
||
|
|
userToken: null,
|
||
|
|
});
|
||
|
|
const authContext = useMemo(
|
||
|
|
() => ({
|
||
|
|
signIn: async (data, mobilePhone, regionCode) => {
|
||
|
|
await save("token", data.data.token);
|
||
|
|
await save("account", data.data.account);
|
||
|
|
await save("mobile_phone", mobilePhone);
|
||
|
|
await save("region_code", regionCode);
|
||
|
|
dispatch({ type: "SIGN_IN", token: data.data.token });
|
||
|
|
},
|
||
|
|
signOut: async () => {
|
||
|
|
const base = await baseRequest();
|
||
|
|
const account = await get("account");
|
||
|
|
const signature = await generateSignature({
|
||
|
|
mid: account?.mid,
|
||
|
|
...base,
|
||
|
|
});
|
||
|
|
try {
|
||
|
|
await fetch(`${apiUrl}/api/login/logout?signature=${signature}`, {
|
||
|
|
method: "POST",
|
||
|
|
headers: {
|
||
|
|
"Content-Type": "application/json",
|
||
|
|
},
|
||
|
|
body: JSON.stringify({
|
||
|
|
mid: account?.mid,
|
||
|
|
...base,
|
||
|
|
}),
|
||
|
|
});
|
||
|
|
await remove("token");
|
||
|
|
await remove("account");
|
||
|
|
} catch (error) {
|
||
|
|
console.error(error);
|
||
|
|
} finally {
|
||
|
|
dispatch({ type: "SIGN_OUT" });
|
||
|
|
}
|
||
|
|
},
|
||
|
|
}),
|
||
|
|
[]
|
||
|
|
);
|
||
|
|
//控制开屏图片出现
|
||
|
|
const [appIsReady, setAppIsReady] = useState(false);
|
||
|
|
//控制更新弹窗出现
|
||
|
|
const [isUpdateModalVisible, setIsUpdateModalVisible] = useState(false);
|
||
|
|
//保存最新版本信息
|
||
|
|
const [versionData, setVersionData] = useState({});
|
||
|
|
useEffect(() => {
|
||
|
|
async function prepare() {
|
||
|
|
await storeAppInfo();
|
||
|
|
try {
|
||
|
|
const token = await get("token");
|
||
|
|
const account = await get("account");
|
||
|
|
const base = await baseRequest();
|
||
|
|
const signature = await generateSignature({
|
||
|
|
...base,
|
||
|
|
});
|
||
|
|
if (token && account) {
|
||
|
|
const response = await fetch(
|
||
|
|
`${apiUrl}/api/login/validate?signature=${signature}`,
|
||
|
|
{
|
||
|
|
method: "POST",
|
||
|
|
headers: {
|
||
|
|
"Content-Type": "application/json",
|
||
|
|
},
|
||
|
|
body: JSON.stringify({
|
||
|
|
...base,
|
||
|
|
}),
|
||
|
|
}
|
||
|
|
);
|
||
|
|
const data = await response.json();
|
||
|
|
if (data.ret === 1) {
|
||
|
|
dispatch({ type: "SIGN_IN", token: token });
|
||
|
|
}
|
||
|
|
}
|
||
|
|
//检查更新
|
||
|
|
const checkUpdataResponse = await fetch(
|
||
|
|
`${apiUrl}/api/version/is_there_a_new_version_available?signature=${signature}`,
|
||
|
|
{
|
||
|
|
method: "POST",
|
||
|
|
headers: {
|
||
|
|
"Content-Type": "application/json",
|
||
|
|
},
|
||
|
|
body: JSON.stringify({
|
||
|
|
...base,
|
||
|
|
}),
|
||
|
|
}
|
||
|
|
);
|
||
|
|
const checkUpdataData = await checkUpdataResponse.json();
|
||
|
|
if (checkUpdataData.ret === -1) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
if (checkUpdataData.data.result) {
|
||
|
|
setIsUpdateModalVisible(true);
|
||
|
|
setVersionData(checkUpdataData.data);
|
||
|
|
}
|
||
|
|
} catch (e) {
|
||
|
|
console.warn(e);
|
||
|
|
} finally {
|
||
|
|
setAppIsReady(true);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
prepare();
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
const onLayoutRootView = useCallback(async () => {
|
||
|
|
if (appIsReady) {
|
||
|
|
await SplashScreen.hideAsync();
|
||
|
|
}
|
||
|
|
}, [appIsReady]);
|
||
|
|
|
||
|
|
if (!appIsReady) {
|
||
|
|
return null;
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<TailwindProvider utilities={utilities}>
|
||
|
|
<AuthContext.Provider value={authContext}>
|
||
|
|
<SafeAreaProvider>
|
||
|
|
<StatusBar style="light" translucent />
|
||
|
|
<View style={{ flex: 1, backgroundColor: "#07050A" }}>
|
||
|
|
<NavigationContainer onReady={onLayoutRootView} theme={MyTheme}>
|
||
|
|
<RootStack.Navigator>
|
||
|
|
{state.isSignin ? (
|
||
|
|
<>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="HomeTab"
|
||
|
|
component={HomeTab}
|
||
|
|
options={{
|
||
|
|
headerShown: false,
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="StreamerProfile"
|
||
|
|
component={StreamerProfile}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
headerRight: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="ellipsis-vertical"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
headerTransparent: true,
|
||
|
|
title: "",
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="UserProfile"
|
||
|
|
component={UserProfile}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
headerTransparent: true,
|
||
|
|
title: "",
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="WechatWaitingToAdd"
|
||
|
|
component={WechatWaitingToAdd}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
title: "待添加微信",
|
||
|
|
headerTitleStyle: { color: "white" },
|
||
|
|
headerStyle: { backgroundColor: "#07050A" },
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="MessageDetail"
|
||
|
|
component={MessageDetail}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
title: "",
|
||
|
|
headerTitleStyle: { color: "white" },
|
||
|
|
headerStyle: { backgroundColor: "#07050A" },
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="EditUserProfile"
|
||
|
|
component={EditUserProfile}
|
||
|
|
options={{ headerShown: false }}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="Wallet"
|
||
|
|
component={Wallet}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
headerTransparent: true,
|
||
|
|
title: "我的钱包",
|
||
|
|
headerTitleStyle: { color: "white" },
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="Setting"
|
||
|
|
component={Setting}
|
||
|
|
options={{ headerShown: false }}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="Relationship"
|
||
|
|
component={Relationship}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
title: "关系",
|
||
|
|
headerTitleStyle: { color: "white" },
|
||
|
|
headerStyle: { backgroundColor: "#07050A" },
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="StreamerVerification"
|
||
|
|
component={StreamerVerification}
|
||
|
|
options={{ headerShown: false }}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="UnlockedWechat"
|
||
|
|
component={UnlockedWechat}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
title: "已解锁微信",
|
||
|
|
headerTitleStyle: { color: "white" },
|
||
|
|
headerStyle: { backgroundColor: "#07050A" },
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="EditStreamerProfile"
|
||
|
|
component={EditStreamerProfile}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
title: "编辑主页",
|
||
|
|
headerTitleStyle: { color: "white" },
|
||
|
|
headerStyle: { backgroundColor: "#07050A" },
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="EditPlatformOrder"
|
||
|
|
component={EditPlatformOrder}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
title: "编辑平台",
|
||
|
|
headerTitleStyle: { color: "white" },
|
||
|
|
headerStyle: { backgroundColor: "#07050A" },
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="StreamerInviteUser"
|
||
|
|
component={StreamerInviteUser}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
title: "邀请分成",
|
||
|
|
headerTitleStyle: { color: "white" },
|
||
|
|
headerStyle: { backgroundColor: "#07050A" },
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="Search"
|
||
|
|
component={Search}
|
||
|
|
options={{ headerShown: false }}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="WebWithHeader"
|
||
|
|
component={WebWithHeader}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
headerTitleStyle: { color: "white" },
|
||
|
|
headerStyle: { backgroundColor: "#07050A" },
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
</>
|
||
|
|
) : (
|
||
|
|
<>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="Login"
|
||
|
|
component={Login}
|
||
|
|
options={{ headerShown: false }}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="ForgetPassword"
|
||
|
|
component={ForgetPassword}
|
||
|
|
options={{ headerShown: false }}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="SetPassword"
|
||
|
|
component={SetPassword}
|
||
|
|
options={{ headerShown: false }}
|
||
|
|
/>
|
||
|
|
<RootStack.Screen
|
||
|
|
name="WebWithHeader"
|
||
|
|
component={WebWithHeader}
|
||
|
|
options={({ navigation }) => ({
|
||
|
|
headerLeft: () => (
|
||
|
|
<Icon
|
||
|
|
type="ionicon"
|
||
|
|
name="chevron-back"
|
||
|
|
size={32}
|
||
|
|
color="white"
|
||
|
|
onPress={() => navigation.goBack()}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
headerTitleStyle: { color: "white" },
|
||
|
|
headerStyle: { backgroundColor: "#07050A" },
|
||
|
|
})}
|
||
|
|
/>
|
||
|
|
</>
|
||
|
|
)}
|
||
|
|
</RootStack.Navigator>
|
||
|
|
</NavigationContainer>
|
||
|
|
</View>
|
||
|
|
<Toast />
|
||
|
|
<UpdateModal
|
||
|
|
visible={isUpdateModalVisible}
|
||
|
|
setVisible={setIsUpdateModalVisible}
|
||
|
|
data={versionData}
|
||
|
|
/>
|
||
|
|
</SafeAreaProvider>
|
||
|
|
</AuthContext.Provider>
|
||
|
|
</TailwindProvider>
|
||
|
|
);
|
||
|
|
}
|