v4.6-3 (#471)

projects/app/src/pages/account/components/Info.tsx

@@ -1,5 +1,14 @@
-import React, { useCallback, useRef, useState } from 'react';
-import { Box, Flex, Button, useDisclosure, useTheme, Divider, Select } from '@chakra-ui/react';
+import React, { useCallback, useRef } from 'react';
+import {
+  Box,
+  Flex,
+  Button,
+  useDisclosure,
+  useTheme,
+  Divider,
+  Select,
+  Input
+} from '@chakra-ui/react';
 import { useForm } from 'react-hook-form';
 import { UserUpdateParams } from '@/types/user';
 import { useToast } from '@/web/common/hooks/useToast';
@@ -16,10 +25,11 @@ import Loading from '@/components/Loading';
 import Avatar from '@/components/Avatar';
 import MyIcon from '@/components/Icon';
 import MyTooltip from '@/components/MyTooltip';
-import { getLangStore, LangEnum, langMap, setLangStore } from '@/web/common/utils/i18n';
+import { langMap, setLngStore } from '@/web/common/utils/i18n';
 import { useRouter } from 'next/router';
 import MySelect from '@/components/Select';
 import { formatPrice } from '@fastgpt/global/support/wallet/bill/tools';
+import { putUpdateMemberName } from '@/web/support/user/team/api';
 
 const TeamMenu = dynamic(() => import('@/components/support/user/team/TeamMenu'));
 const PayModal = dynamic(() => import('./PayModal'), {
@@ -63,8 +73,6 @@ const UserInfo = () => {
     multiple: false
   });
 
-  const [language, setLanguage] = useState<`${LangEnum}`>(getLangStore());
-
   const onclickSave = useCallback(
     async (data: UserType) => {
       await updateUserInfo({
@@ -153,6 +161,27 @@ const UserInfo = () => {
         ml={[0, 10]}
         mt={[6, 0]}
       >
+        {feConfigs.isPlus && (
+          <Flex mb={4} alignItems={'center'} w={['85%', '300px']}>
+            <Box flex={'0 0 80px'}>{t('user.Member Name')}:&nbsp;</Box>
+            <Input
+              flex={1}
+              defaultValue={userInfo?.team?.memberName || 'Member'}
+              title={t('user.Edit name')}
+              borderColor={'transparent'}
+              pl={'10px'}
+              transform={'translateX(-11px)'}
+              maxLength={20}
+              onBlur={(e) => {
+                const val = e.target.value;
+                if (val === userInfo?.team?.memberName) return;
+                try {
+                  putUpdateMemberName(val);
+                } catch (error) {}
+              }}
+            />
+          </Flex>
+        )}
         <Flex alignItems={'center'} w={['85%', '300px']}>
           <Box flex={'0 0 80px'}>{t('user.Account')}:&nbsp;</Box>
           <Box flex={1}>{userInfo?.username}</Box>
@@ -167,17 +196,15 @@ const UserInfo = () => {
           <Box flex={'0 0 80px'}>{t('user.Language')}:&nbsp;</Box>
           <Box flex={'1 0 0'}>
             <MySelect
-              value={language}
+              value={i18n.language}
               list={Object.entries(langMap).map(([key, lang]) => ({
                 label: lang.label,
                 value: key
               }))}
               onchange={(val: any) => {
                 const lang = val;
-                setLangStore(lang);
-                setLanguage(lang);
-                i18n?.changeLanguage?.(lang);
-                router.reload();
+                setLngStore(lang);
+                router.replace(router.basePath, router.asPath, { locale: lang });
               }}
             />
           </Box>