diff --git a/src/App.css b/src/App.css
deleted file mode 100644
index 74b5e05..0000000
--- a/src/App.css
+++ /dev/null
@@ -1,38 +0,0 @@
-.App {
-  text-align: center;
-}
-
-.App-logo {
-  height: 40vmin;
-  pointer-events: none;
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .App-logo {
-    animation: App-logo-spin infinite 20s linear;
-  }
-}
-
-.App-header {
-  background-color: #282c34;
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: calc(10px + 2vmin);
-  color: white;
-}
-
-.App-link {
-  color: #61dafb;
-}
-
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
diff --git a/src/App.js b/src/App.js
index eeb7b96..e73470d 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,11 +1,44 @@
-import './App.css';
-import { Routes, Route, Navigate } from 'react-router-dom'
+import { useEffect } from 'react';
+import { Routes, Route, Navigate, useNavigate } from 'react-router-dom'
+import { useSelector, useDispatch } from 'react-redux'
+import { setUdid, setAccessToken, setUserInfo, setSelectInfo } from "./business/userSlice.js"
 import { useCookies } from 'react-cookie';
 import LoginPage from './LoginPage';
 import MainPage from './MainPage';
+import yzs from "./business/request.js";
 
 function App() {
-  const [cookies] = useCookies(['accessToken']);
+  const dispatch = useDispatch();
+  const navigate = useNavigate();
+  const [cookies, setCookie, removeCookie] = useCookies(['accessToken']);
+  const udid = useSelector(state => state.user.udid)
+
+  const getIp = async () => {
+    const response = await fetch("https://ipapi.co/json/")
+    const data = await response.json()
+    dispatch(setUdid(data.ip));
+  }
+
+  // Run `getIP` function above just once when the page is rendered
+  useEffect(() => {
+    getIp()
+  }, [])
+
+  if (cookies.accessToken) {
+    dispatch(setAccessToken(cookies.accessToken));
+    yzs.get_user_info(udid, cookies.accessToken).then(info => {
+      dispatch(setUserInfo(info));
+      yzs.user_select(udid, cookies.accessToken).then(info => {
+        dispatch(setSelectInfo(info));
+      });
+    }).catch(error => {
+      console.log(error)
+      if (error.returnCode === "uc_0106") {
+        removeCookie("accessToken");
+        navigate("/login");
+      }
+    });
+  }
   return (
     <div className="App">
       <Routes>
diff --git a/src/AppBar.js b/src/AppBar.js
index fb01792..3ddeae6 100644
--- a/src/AppBar.js
+++ b/src/AppBar.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import { useSelector, useDispatch } from 'react-redux'
 import AppBar from '@mui/material/AppBar';
 import Avatar from '@mui/material/Avatar';
 import Box from '@mui/material/Box';
@@ -7,14 +8,18 @@ import Menu from '@mui/material/Menu';
 import MenuItem from '@mui/material/MenuItem';
 import IconButton from '@mui/material/IconButton';
 import Toolbar from '@mui/material/Toolbar';
-import Tooltip from '@mui/material/Tooltip';
 import Typography from '@mui/material/Typography';
-
-import AdbIcon from '@mui/icons-material/Adb';
-
-const settings = ['Profile', 'Account', 'Dashboard', 'Logout'];
+import logo from './assets/logo.png';
+import styles from './AppBar.module.css';
+import { Stack, CssBaseline } from '@mui/material';
+import { useCookies } from 'react-cookie';
+import { useNavigate } from "react-router-dom";
 
 export default function () {
+    const avatarUrl = useSelector(state => state.user.avatarUrl);
+    const nickName = useSelector(state => state.user.nickName);
+    const [cookies, setCookie, removeCookie] = useCookies(['accessToken']);
+    const navigate = useNavigate();
     const [anchorElUser, setAnchorElUser] = React.useState(null);
     const handleOpenUserMenu = (event) => {
         setAnchorElUser(event.currentTarget);
@@ -23,18 +28,29 @@ export default function () {
         setAnchorElUser(null);
     };
 
+    const onLogout = () => {
+        removeCookie("accessToken");
+        handleCloseUserMenu();
+        navigate("/login");
+    }
 
-    return <AppBar sx={{ zIndex: (theme) => theme.zIndex.drawer + 1 }} position="sticky">
-        <Container maxWidth="xl">
-            <Toolbar disableGutters>
-                <AdbIcon sx={{ display: { xs: 'none', md: 'flex' }, mr: 1 }} />
-                <Typography sx={{ flexGrow: 4 }}></Typography>
-                <Box sx={{ flexGrow: 1 }}>
-                    <Tooltip title="Open settings">
-                        <IconButton onClick={handleOpenUserMenu} sx={{ p: 0 }}>
-                            <Avatar alt="Remy Sharp" src="/static/images/avatar/2.jpg" />
-                        </IconButton>
-                    </Tooltip>
+
+    return <AppBar sx={{ zIndex: (theme) => theme.zIndex.drawer + 1 }} position="sticky" color='black'>
+        <CssBaseline />
+        <Container maxWidth={false} >
+            <Toolbar disableGutters variant="dense">
+                <Stack direction="row" sx={{ flexGrow: 1 }}>
+                    <img className={styles.titleIcon} src={logo} />
+                    <Typography variant='h6' sx={{ color: "#FFFFFF" }}>纽曼AI语记</Typography>
+                </Stack>
+                <Box sx={{
+                    display: "flex",
+                    alignItems: "center",
+                }} >
+                    <IconButton onClick={handleOpenUserMenu} sx={{ p: 0 }}>
+                        <Avatar alt={nickName} src={avatarUrl} />
+                    </IconButton>
+                    <Typography sx={{ color: "#FFFFFF", paddingLeft: 2 }}>{nickName}</Typography>
                     <Menu
                         sx={{ mt: '45px' }}
                         id="menu-appbar"
@@ -51,11 +67,10 @@ export default function () {
                         open={Boolean(anchorElUser)}
                         onClose={handleCloseUserMenu}
                     >
-                        {settings.map((setting) => (
-                            <MenuItem key={setting} onClick={handleCloseUserMenu}>
-                                <Typography textAlign="center">{setting}</Typography>
-                            </MenuItem>
-                        ))}
+                        <MenuItem onClick={onLogout}>
+                            <Typography textAlign="center">退出</Typography>
+                        </MenuItem>
+
                     </Menu>
                 </Box>
             </Toolbar>
diff --git a/src/AppBar.module.css b/src/AppBar.module.css
new file mode 100644
index 0000000..6b451ae
--- /dev/null
+++ b/src/AppBar.module.css
@@ -0,0 +1,5 @@
+.titleIcon {
+    width: 28px;
+    height: 30px;
+    margin-right: 24px;
+}
\ No newline at end of file
diff --git a/src/LoginPage.js b/src/LoginPage.js
index 7dac157..26d25a8 100644
--- a/src/LoginPage.js
+++ b/src/LoginPage.js
@@ -1,11 +1,11 @@
 import React, { useState, useEffect } from 'react';
+import { useNavigate } from "react-router-dom";
 import Button from '@mui/material/Button';
 import yzs from "./business/request.js";
 import styles from './LoginPage.module.css';
 import { useSelector, useDispatch } from 'react-redux'
 import { setUdid, setFlushToken, setAccessToken, setUserInfo } from "./business/userSlice.js"
-import { setList } from "./business/recorderSlice.js"
-import logo from './assets/logo.png'; // Tell webpack this JS file uses this image
+import logo from './assets/logo.png';
 import { Container, Tab, Box } from '@mui/material';
 import TabPanel from '@mui/lab/TabPanel';
 import { TabList } from '@mui/lab';
@@ -32,6 +32,7 @@ const theme = createTheme({
 });
 
 export default function () {
+    const navigate = useNavigate();
     const [cookies, setCookie] = useCookies(['accessToken']);
     const [value, setValue] = useState("1");
     const account = useSelector(state => state.user.account)
@@ -48,18 +49,6 @@ export default function () {
 
     const dispatch = useDispatch()
 
-    const getIp = async () => {
-        // Connect ipapi.co with fetch()
-        const response = await fetch("https://ipapi.co/json/")
-        const data = await response.json()
-        // Set the IP address to the constant `ip`
-        dispatch(setUdid(data.ip));
-    }
-
-    // Run `getIP` function above just once when the page is rendered
-    useEffect(() => {
-        getIp()
-    }, [])
 
 
     const debug_test = () => {
@@ -77,11 +66,8 @@ export default function () {
                 setCookie("accessToken", token)
                 yzs.get_user_info(udid, token).then(info => {
                     dispatch(setUserInfo(info));
-                    let passportId = info.passportId;
                     yzs.user_select(udid, token).then(info => {
-                        yzs.get_record_list(token, passportId).then(list => {
-                            dispatch(setList(list.result));
-                        });
+                        navigate("/");
                     })
 
                 });
diff --git a/src/MainPage.js b/src/MainPage.js
index 1d88019..385c552 100644
--- a/src/MainPage.js
+++ b/src/MainPage.js
@@ -1,26 +1,60 @@
+import { useEffect } from 'react';
+import { useSelector, useDispatch } from 'react-redux'
 import AppBar from './AppBar';
 import RecordList from './RecordList';
 import PlayerBar from './PlayerBar';
 import styles from './MainPage.module.css';
+import yzs from "./business/request.js";
+import { setList } from "./business/recorderSlice.js"
 import { CssBaseline, Box, Container, Typography } from '@mui/material';
 import RecordLyrics from './RecordLyrics';
+import { createTheme, ThemeProvider } from '@mui/material/styles';
+
+const theme = createTheme({
+    status: {
+        danger: '#e53e3e',
+    },
+    palette: {
+        primary: {
+            main: '#FF595A',
+            darker: '#FF595A',
+        },
+        neutral: {
+            main: '#64748B',
+            contrastText: '#fff',
+        },
+        black: {
+            main: "#222222",
+        }
+    },
+});
+
+
 
 export default function () {
+    const dispatch = useDispatch()
+    const accessToken = useSelector(state => state.user.accessToken);
+    const passportId = useSelector(state => state.user.passportId);
+    useEffect(() => {
+        yzs.get_record_list(accessToken, passportId).then(list => {
+            dispatch(setList(list.result));
+        });
+    }, [accessToken, passportId]);
     return <div>
-        <CssBaseline />
-        <AppBar />
-        <RecordList />
-        <Box
-            component="main"
-            sx={{
-                width: `calc(100% - 240px)`, ml: `240px`
-            }}
-        >
-            <Typography>2022-12-13 14:39_同传翻译</Typography>
-            <PlayerBar />
-            <RecordLyrics />
-        </Box>
-
-
+        <ThemeProvider theme={theme}>
+            <CssBaseline />
+            <AppBar />
+            <RecordList />
+            <Box
+                component="main"
+                sx={{
+                    width: `calc(100% - 240px)`, ml: `240px`
+                }}
+            >
+                <Typography>2022-12-13 14:39_同传翻译</Typography>
+                <PlayerBar />
+                <RecordLyrics />
+            </Box>
+        </ThemeProvider>
     </div >
 }
\ No newline at end of file
diff --git a/src/RecordList.js b/src/RecordList.js
index d868552..147ce92 100644
--- a/src/RecordList.js
+++ b/src/RecordList.js
@@ -1,46 +1,32 @@
 import React from 'react';
+import { useSelector, useDispatch } from 'react-redux'
 import Box from '@mui/material/Box';
 import Drawer from '@mui/material/Drawer';
 import List from '@mui/material/List';
 import ListItem from '@mui/material/ListItem';
 import ListItemButton from '@mui/material/ListItemButton';
-import ListItemIcon from '@mui/material/ListItemIcon';
 import ListItemText from '@mui/material/ListItemText';
 import Toolbar from '@mui/material/Toolbar';
-import { CssBaseline } from '@mui/material';
+import { setCurrentIndex, setCurrentLyric } from "./business/recorderSlice.js"
+import yzs from "./business/request.js";
 
 const drawerWidth = 240;
 
-
-const recordList = [
-    {
-        title: "2022-12-14 14:39_同传翻译",
-        time: "2022-12-14 14:39",
-        content: "当面对重重困难，你感觉举步维艰的时候，回想你以前是如何坚持到底战胜困难的最后时刻的。这样，你就会发现你有能力克服每个障碍。"
-    },
-    {
-        title: "2022-12-14 14:39_同传翻译",
-        time: "2022-12-14 14:39",
-        content: "当面对重重困难，你感觉举步维艰的时候，回想你以前是如何坚持到底战胜困难的最后时刻的。这样，你就会发现你有能力克服每个障碍。"
-    },
-    {
-        title: "2022-12-14 14:39_同传翻译",
-        time: "2022-12-14 14:39",
-        content: "当面对重重困难，你感觉举步维艰的时候，回想你以前是如何坚持到底战胜困难的最后时刻的。这样，你就会发现你有能力克服每个障碍。"
-    },
-    {
-        title: "2022-12-14 14:39_同传翻译",
-        time: "2022-12-14 14:39",
-        content: "当面对重重困难，你感觉举步维艰的时候，回想你以前是如何坚持到底战胜困难的最后时刻的。这样，你就会发现你有能力克服每个障碍。"
-    },
-    {
-        title: "2022-12-14 14:39_同传翻译",
-        time: "2022-12-14 14:39",
-        content: "当面对重重困难，你感觉举步维艰的时候，回想你以前是如何坚持到底战胜困难的最后时刻的。这样，你就会发现你有能力克服每个障碍。"
-    },
-];
-
 export default function () {
+    const dispatch = useDispatch();
+    const accessToken = useSelector(state => state.user.accessToken);
+    const currentIndex = useSelector(state => state.recorder.currentIndex);
+    const recordList = useSelector(state => state.recorder.list);
+    const onSelected = (event, index) => {
+        console.log("onSelected", index, recordList.at(index).transResultUrl)
+        yzs.download(accessToken, recordList.at(index).transResultUrl).then(
+            blob => blob.text()
+        ).then(text => {
+            console.log(text);
+            dispatch(setCurrentLyric(JSON.parse(text)));
+        });
+        dispatch(setCurrentIndex(index));
+    }
     return <Drawer
         variant="permanent"
         sx={{
@@ -52,13 +38,13 @@ export default function () {
         <Toolbar />
         <Box sx={{ overflow: 'auto' }}>
             <List>
-                {recordList.map((item, index) => (
+                {recordList === undefined ? <React.Fragment /> : recordList.map((item, index) => (
                     <ListItem key={index} disablePadding>
-                        <ListItemButton>
-                            <ListItemText primary={item.title} secondary={
+                        <ListItemButton selected={currentIndex === index} onClick={(event) => onSelected(event, index)}>
+                            <ListItemText primary={item.editName} secondary={
                                 <React.Fragment>
-                                    <div>{item.content}</div>
-                                    <div>更新于 {item.time}</div>
+                                    <div>{item.content.slice(0, 50) + '......'}</div>
+                                    <div>更新于 {new Date(item.createTime).toLocaleString()}</div>
                                 </React.Fragment>
                             } />
                         </ListItemButton>
diff --git a/src/RecordLyrics.js b/src/RecordLyrics.js
index 197a45e..4a0dff2 100644
--- a/src/RecordLyrics.js
+++ b/src/RecordLyrics.js
@@ -1,64 +1,16 @@
 import { Typography } from "@mui/material";
 import styles from './RecordLyrics.module.css';
+import { useSelector, useDispatch } from 'react-redux'
 
-const lyrics = [
-    {
-        original: "当你身陷困境的时候（你有时会），回想你生命中快乐和幸福的时刻。回想它是如何使你快乐，你便有了走出困境的勇气。",
-        translation: "When times become difficult (and you know they sometimes will), remember a moment in your life that was filled with joy and happiness. Remember how it made you feel, and you will have the strength you need to get through any trial.",
-    },
-    {
-        original: "当面对重重困难，你感觉举步维艰的时候，回想你以前是如何坚持到底战胜困难的最后时刻的。这样，你就会发现你有能力克服每个障碍。",
-        translation: "When life throws you one more obstacle than you think you can handle, remember something you achieved through perseverance and by struggling to the end. In doing so, you'll find you have the ability to overcome each obstacle brought your way.",
-    },
-    {
-        original: "当你觉得精疲力尽的时候，暂时离开，让自己稍作休息。",
-        translation: "When you find yourself drained and depleted of energy, remember to find a place of sanctuary and rest.",
-    },
-    {
-        original: "当你身陷困境的时候（你有时会），回想你生命中快乐和幸福的时刻。回想它是如何使你快乐，你便有了走出困境的勇气。",
-        translation: "When times become difficult (and you know they sometimes will), remember a moment in your life that was filled with joy and happiness. Remember how it made you feel, and you will have the strength you need to get through any trial.",
-    },
-    {
-        original: "当面对重重困难，你感觉举步维艰的时候，回想你以前是如何坚持到底战胜困难的最后时刻的。这样，你就会发现你有能力克服每个障碍。",
-        translation: "When life throws you one more obstacle than you think you can handle, remember something you achieved through perseverance and by struggling to the end. In doing so, you'll find you have the ability to overcome each obstacle brought your way.",
-    },
-    {
-        original: "当你觉得精疲力尽的时候，暂时离开，让自己稍作休息。",
-        translation: "When you find yourself drained and depleted of energy, remember to find a place of sanctuary and rest.",
-    },
-
-    {
-        original: "当你身陷困境的时候（你有时会），回想你生命中快乐和幸福的时刻。回想它是如何使你快乐，你便有了走出困境的勇气。",
-        translation: "When times become difficult (and you know they sometimes will), remember a moment in your life that was filled with joy and happiness. Remember how it made you feel, and you will have the strength you need to get through any trial.",
-    },
-    {
-        original: "当面对重重困难，你感觉举步维艰的时候，回想你以前是如何坚持到底战胜困难的最后时刻的。这样，你就会发现你有能力克服每个障碍。",
-        translation: "When life throws you one more obstacle than you think you can handle, remember something you achieved through perseverance and by struggling to the end. In doing so, you'll find you have the ability to overcome each obstacle brought your way.",
-    },
-    {
-        original: "当你觉得精疲力尽的时候，暂时离开，让自己稍作休息。",
-        translation: "When you find yourself drained and depleted of energy, remember to find a place of sanctuary and rest.",
-    },
-    {
-        original: "当你身陷困境的时候（你有时会），回想你生命中快乐和幸福的时刻。回想它是如何使你快乐，你便有了走出困境的勇气。",
-        translation: "When times become difficult (and you know they sometimes will), remember a moment in your life that was filled with joy and happiness. Remember how it made you feel, and you will have the strength you need to get through any trial.",
-    },
-    {
-        original: "当面对重重困难，你感觉举步维艰的时候，回想你以前是如何坚持到底战胜困难的最后时刻的。这样，你就会发现你有能力克服每个障碍。",
-        translation: "When life throws you one more obstacle than you think you can handle, remember something you achieved through perseverance and by struggling to the end. In doing so, you'll find you have the ability to overcome each obstacle brought your way.",
-    },
-    {
-        original: "当你觉得精疲力尽的时候，暂时离开，让自己稍作休息。",
-        translation: "When you find yourself drained and depleted of energy, remember to find a place of sanctuary and rest.",
-    },
-];
 
 
 export default function () {
+    const currentLyric = useSelector(state => state.recorder.currentLyric);
+
     return <div className={styles.lyricsBrowser}>
-        {lyrics.map((lyric, index) => {
+        {currentLyric.map((lyric, index) => {
             return <div className={styles.lyricItem}>
-                <Typography align="left">{lyric.original}</Typography>
+                <Typography align="left">{lyric.text}</Typography>
                 <Typography align="left">{lyric.translation}</Typography>
             </div>
         })}
diff --git a/src/business/recorderSlice.js b/src/business/recorderSlice.js
index e500fd2..054db87 100644
--- a/src/business/recorderSlice.js
+++ b/src/business/recorderSlice.js
@@ -1,18 +1,26 @@
 import { createSlice } from '@reduxjs/toolkit'
 
 export const recorderSlice = createSlice({
-    name: 'user',
+    name: 'recorder',
     initialState: {
         list: [],
+        currentIndex: 0,
+        currentLyric: [],
     },
     reducers: {
         setList: (state, action) => {
             state.list = action.payload;
+        },
+        setCurrentIndex: (state, action) => {
+            state.currentIndex = action.payload;
+        },
+        setCurrentLyric: (state, action) => {
+            state.currentLyric = action.payload;
         }
     }
 })
 
 // Action creators are generated for each case reducer function
-export const { setList } = recorderSlice.actions
+export const { setCurrentIndex, setList, setCurrentLyric } = recorderSlice.actions
 
 export default recorderSlice.reducer
\ No newline at end of file
diff --git a/src/business/request.js b/src/business/request.js
index 0c97a14..b42b556 100644
--- a/src/business/request.js
+++ b/src/business/request.js
@@ -1,3 +1,5 @@
+import { json } from 'react-router-dom';
+
 const appKey = "k5hfiei5eevouvjohkapjaudpk2gakpaxha22fiy";
 const appSecret = "e65ffb25148b08207088148d5bce114d";
 
@@ -83,9 +85,8 @@ const yzs = {
             },
         }).then(response => response.json()).then((json) => {
             console.log(json);
+            if (json.returnCode != "uc_0000") throw json;
             return json.result;
-        }).catch(error => {
-            console.log(error);
         });
     },
     user_select: function (ip, accessToken) {
@@ -104,12 +105,9 @@ const yzs = {
                 'timestamp': timestamp,
                 'signature': sig,
             },
-        }).then(response => {
-            console.log(response);
-            response.text()
-        }).then((json) => {
+        }).then(response => response.json()).then((json) => {
             console.log(json)
-            return json;
+            return json.result;
         });
     },
 
@@ -117,7 +115,7 @@ const yzs = {
         let sha256 = require('sha256');
         let timestamp = new Date().getTime();
         let sig = appKey + timestamp.toString() + appSecret;
-        sig = sha256(sig).toUpperCase();;
+        sig = sha256(sig).toUpperCase();
 
 
         let url = `/api/app/app-voice-recorder/rest/v1/trans/info/list?accessToken=${encodeURIComponent(accessToken)}&passportId=${passportId}`;
@@ -129,12 +127,33 @@ const yzs = {
                 'timestamp': timestamp,
                 'signature': sig,
             },
-        }).then(response => response.json()
-        ).then((json) => {
+        }).then(response => response.json()).then((json) => {
             console.log(json)
             return json;
         });
     },
+    download: function (accessToken, url) {
+        let sha256 = require('sha256');
+        let timestamp = new Date().getTime();
+        let sig = appKey + timestamp.toString() + appSecret;
+        sig = sha256(sig).toUpperCase();
+
+        let body = {
+            url: url,
+            accessToken: accessToken,
+        };
+
+        return fetch("/api/app/app-voice-recorder/rest/v1/trans/info/download", {
+            method: "POST",
+            headers: {
+                'appKey': appKey,
+                'timestamp': timestamp,
+                'signature': sig,
+                'Content-Type': 'application/json; charset=utf-8',
+            },
+            body: JSON.stringify(body),
+        }).then(response => response.blob());
+    },
 
     login: function (udid, account, password) {
         let md5 = require('md5');
diff --git a/src/business/userSlice.js b/src/business/userSlice.js
index 8d57ec6..ec87eef 100644
--- a/src/business/userSlice.js
+++ b/src/business/userSlice.js
@@ -9,6 +9,8 @@ export const userSlice = createSlice({
         passportId: 0,
         createTime: "",
         userName: "",
+        nickName: "",
+        avatarUrl: "",
         agreeAgreement: true,
         account: "13682423271",
         password: "yzs123456",
@@ -19,19 +21,19 @@ export const userSlice = createSlice({
             state.udid = action.payload;
         },
         setFlushToken: (state, token) => {
-            // Redux Toolkit allows us to write "mutating" logic in reducers. It
-            // doesn't actually mutate the state because it uses the Immer library,
-            // which detects changes to a "draft state" and produces a brand new
-            // immutable state based off those changes
             state.flushToken = token.payload;
         },
         setAccessToken: (state, token) => {
             state.accessToken = token.payload;
         },
-        setUserInfo: (state, info) => {
-            state.passportId = info.payload.passportId
-            state.createTime = info.payload.createTime
-            state.userName = info.payload.userName
+        setUserInfo: (state, action) => {
+            state.passportId = action.payload.passportId
+            state.createTime = action.payload.createTime
+            state.userName = action.payload.userName
+        },
+        setSelectInfo: (state, action) => {
+            state.nickName = action.payload.nickName;
+            state.avatarUrl = action.payload.avatarUrl;
         },
         setAccount: (state, action) => {
             state.account = action.payload;
@@ -46,6 +48,6 @@ export const userSlice = createSlice({
 })
 
 // Action creators are generated for each case reducer function
-export const { setUdid, setFlushToken, setAccessToken, setUserInfo, setAccount, setPassword, setVerificationCode } = userSlice.actions
+export const { setUdid, setFlushToken, setAccessToken, setUserInfo, setSelectInfo, setAccount, setPassword, setVerificationCode } = userSlice.actions
 
 export default userSlice.reducer
\ No newline at end of file
diff --git a/src/setupProxy.js b/src/setupProxy.js
index 4cbd576..3712d4e 100644
--- a/src/setupProxy.js
+++ b/src/setupProxy.js
@@ -24,4 +24,15 @@ module.exports = function (app) {
             },
         })
     );
+    app.use(
+        '/api/app/app-voice-recorder/rest/v1/trans/info/download',
+        createProxyMiddleware({
+            target: 'http://ai-api.uat.hivoice.cn',
+            changeOrigin: true,
+            logger: console,
+            onProxyReq: (proxyReq, req, res) => {
+                proxyReq.setHeader('appKey', 'k5hfiei5eevouvjohkapjaudpk2gakpaxha22fiy');
+            },
+        })
+    );
 };
\ No newline at end of file