tiefen_space_app/screeens/EditUserProfile/EditUserName/index.jsx

147 lines
3.8 KiB
JavaScript

import { View, TextInput } from "react-native";
import React, { useState, useEffect } from "react";
import { useTailwind } from "tailwind-rn";
import { useSafeAreaInsets } from "react-native-safe-area-context";
import { Button } from "@rneui/themed";
import Toast from "react-native-toast-message";
import baseRequest from "../../../utils/baseRequest";
import { get, save } from "../../../utils/storeInfo";
import { generateSignature } from "../../../utils/crypto";
export default function EditUserName({ navigation }) {
const tailwind = useTailwind();
const insets = useSafeAreaInsets();
const [oldName, setOldName] = useState();
const [name, setName] = useState();
useEffect(() => {
const getName = async () => {
const account = await get("account");
setName(account.name);
setOldName(account.name);
};
getName();
}, []);
const handleSubmit = async () => {
if (!name) {
Toast.show({
type: "error",
text1: "昵称不得为空",
topOffset: 60,
});
return;
} else if (name.length > 10) {
Toast.show({
type: "error",
text1: "昵称不得超过10个字",
topOffset: 60,
});
return;
} else if (name === oldName) {
navigation.goBack();
return;
}
//获取环境变量
const apiUrl = process.env.EXPO_PUBLIC_API_URL;
const base = await baseRequest();
const account = await get("account");
const signature = await generateSignature({
...base,
name: name,
mid: account.mid,
});
try {
const response = await fetch(
`${apiUrl}/api/account/update?signature=${signature}`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
...base,
name: name,
mid: account.mid,
}),
}
);
const data = await response.json();
if (data.ret === -1) {
Toast.show({
type: "error",
text1: data.msg,
topOffset: 60,
});
return;
}
//向服务器请求新的账号信息并保存到本地
const signature2 = await generateSignature({
...base,
mid: account.mid,
});
const accountResponse = await fetch(
`${apiUrl}/api/account/list_by_mid?signature=${signature2}`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
...base,
mid: account.mid,
}),
}
);
const accountData = await accountResponse.json();
if (accountData.ret === -1) {
Toast.show({
type: "error",
text1: accountData.msg,
topOffset: 60,
});
return;
}
await save("account", accountData.data.account);
} catch (error) {
console.error(error);
}
navigation.goBack();
};
return (
<View
style={{
paddingBottom: insets.bottom,
paddingLeft: insets.left,
paddingRight: insets.right,
...tailwind("flex-1"),
}}
>
<View style={tailwind("p-4")}>
<TextInput
placeholder="请输入新昵称"
placeholderTextColor="#FFFFFF80"
underlineColorAndroid="transparent"
maxLength={8}
onChangeText={(value) => setName(value)}
value={name}
style={tailwind(
"flex rounded-full bg-[#FFFFFF1A] text-white h-12 px-4"
)}
/>
<Button
color="#FF669E"
radius="999"
size="md"
containerStyle={tailwind("mt-16")}
onPress={handleSubmit}
>
确认
</Button>
</View>
</View>
);
}