fix：bug

src/commons/routes/index.jsx

@@ -4,10 +4,13 @@ import Init from '../../renderer/console/initialization';
 
 import Home from '../../renderer/console/home';
 
+import User from '../../renderer/console/userDetails';
+
 var indexRoutes = [
     { exact: false, path: '/', name: 'Page', component: <Login /> }, //登录页面
     { exact: false, path: '/init', name: 'Page2', component: <Init /> }, //初始化
     { exact: false, path: '/home', name: 'Page0', component: <Home /> }, //主页面
+    { exact: false, path: '/details', name: 'Page4', component: <User /> }, //账号详情
 ];
 
 export default indexRoutes;

src/commons/utils/ajaxOption.js

 import API from './api_manager';
+import { getCurrentZone } from './publicMethod';
 
 // 获取用户基础信息
 export const userInfo = () => {
@@ -9,3 +10,23 @@ export const userInfo = () => {
         actions: true,
     };
 };
+
+// 退出登录
+export const logout = () => {
+    return {
+        url: API.API_USER_LOGOUT,
+        type: 'delete',
+        param: {},
+        actions: true,
+    };
+};
+
+//获取余额
+export const getAccountBalance = () => {
+    return {
+        url: API.API_DASHBOARD_ACCOUNT + `?zone=${getCurrentZone()}`,
+        type: 'get',
+        param: {},
+        actions: true,
+    };
+};

src/commons/utils/api_address.js

-//const BACKEND_API_URI_PREFIX = 'https://www.cloudam.cn';
+const BACKEND_API_URI_PREFIX = 'https://www.cloudam.cn';
 //const BACKEND_API_URI_PREFIX = 'http://47.57.4.97'
-const BACKEND_API_URI_PREFIX = 'http://47.75.104.171';
+//const BACKEND_API_URI_PREFIX = 'http://47.75.104.171';
 
 export { BACKEND_API_URI_PREFIX };

src/commons/utils/api_manager.js

@@ -2,5 +2,7 @@ import { BACKEND_API_URI_PREFIX } from './api_address';
 const API = {
     API_USER_LOGIN: `${BACKEND_API_URI_PREFIX}/uaa/oauth/token`, //登录
     API_USER_CURRENT: `${BACKEND_API_URI_PREFIX}/accounts/current`, //获取账号信息
+    API_USER_LOGOUT: `${BACKEND_API_URI_PREFIX}/uaa/users/token`, //退出登录
+    API_DASHBOARD_ACCOUNT: `${BACKEND_API_URI_PREFIX}/accounts/dashboard/account`, //获取余额
 };
 export default API;

src/commons/utils/publicMethod.js

@@ -6,3 +6,32 @@ export const getUserInfo = () => {
         JSON.parse(localStorage.getItem(Constants.USER_INFO_TOKEN_KEY))
     );
 };
+
+export const getCurrentZone = () => {
+    let localUtc = new Date().getTimezoneOffset() / 60;
+    let Rounding = parseInt(localUtc);
+    let Remainder = new Date().getTimezoneOffset() % 60;
+    let Remainder2 = Math.abs(Remainder);
+    let Remainder3 = '00';
+    let timezone = '%2B08:00';
+    if ([0, '0'].includes(Remainder2)) {
+        Remainder3 = '00';
+    } else {
+        Remainder3 = Remainder2;
+    }
+    if (Rounding > 0) {
+        if (Rounding >= 10) {
+            timezone = '-1' * Rounding + ':' + Remainder3;
+        } else {
+            timezone = '-0' + Rounding + ':' + Remainder3;
+        }
+    } else {
+        let localTime = Math.abs(Rounding);
+        if (localTime < 10) {
+            timezone = '%2B0' + localTime + ':' + Remainder3;
+        } else {
+            timezone = '%2B' + localTime + ':' + Remainder3;
+        }
+    }
+    return timezone;
+};

src/renderer/components/head.jsx

@@ -14,8 +14,9 @@ import Radio from '@mui/material/Radio';
 import RadioGroup from '@mui/material/RadioGroup';
 import FolderOpenIcon from '@mui/icons-material/FolderOpen';
 import MenuItem from '@mui/material/MenuItem';
+import KeyboardArrowLeftIcon from '@mui/icons-material/KeyboardArrowLeft';
+import Tooltip from '@mui/material/Tooltip';
 import avatar from '../../commons/assets/img/avatar.svg';
-
 import fileIcon from '../../commons/assets/img/fileIcon.svg';
 import appIcon from '../../commons/assets/img/appIcon.svg';
 import commandIcon from '../../commons/assets/img/commandIcon.svg';
@@ -35,6 +36,21 @@ const useStyles = makeStyles()((theme) => {
         leftBox: {
             display: 'flex',
             alignItems: 'end',
+            height: '38px',
+            cursor: 'pointer',
+        },
+        name: {
+            fontSize: '14px',
+            fontWeight: '500',
+            whiteSpace: 'nowrap',
+            overflow: 'hidden',
+            textOverflow: 'ellipsis',
+            width: '110px',
+        },
+        leftBox2: {
+            display: 'flex',
+            alignItems: 'center',
+            height: '38px',
         },
         rightBox: {
             display: 'flex',
@@ -44,18 +60,20 @@ const useStyles = makeStyles()((theme) => {
 });
 
 const list = [
-    { id: '1', value: fileIcon },
-    { id: '2', value: appIcon },
-    { id: '3', value: commandIcon },
-    { id: '4', value: homeIcon },
-    { id: '5', value: siteIcon },
+    { id: '1', value: fileIcon, lable: '云文件' },
+    { id: '2', value: appIcon, lable: '云应用' },
+    { id: '3', value: commandIcon, lable: '云终端' },
+    { id: '4', value: homeIcon, lable: '控制台' },
+    { id: '5', value: siteIcon, lable: '设置' },
 ];
 
 export default (props) => {
+    console.log('props: ', props);
     const { classes } = useStyles();
     const { render, navigate } = public();
 
-    console.log(getUserInfo(), 'wwwwwwwww');
+    const [level, setLevel] = useState(props.level);
+    const [hover, setHover] = useState(false);
 
     const iconClick = (e) => {
         console.log('e: ', e);
@@ -63,29 +81,72 @@ export default (props) => {
 
     return (
         <Grid className={classes.headBody}>
-            <Grid className={classes.leftBox}>
-                <img src={avatar} alt="" />
-                <Grid sx={{ marginLeft: '8px' }}>
-                    <Grid sx={{ fontSize: '14px', color: '#1E2633' }}>
-                        {getUserInfo().name}
+            {!level ? (
+                <Grid
+                    className={classes.leftBox}
+                    onClick={() => {
+                        setLevel(true);
+                        navigate('/details');
+                    }}
+                    onMouseEnter={() => {
+                        setHover(true);
+                    }}
+                    onMouseLeave={() => {
+                        setHover(false);
+                    }}
+                >
+                    <img src={avatar} alt="" />
+                    <Grid sx={{ marginLeft: '8px' }}>
+                        <Grid
+                            className={classes.name}
+                            sx={{ color: hover ? '#1370FF' : '#1E2633' }}
+                        >
+                            {/* {getUserInfo().name} */}
+                            yaojierui100@gamil.com
+                        </Grid>
+                        <Grid sx={{ fontSize: '12px', color: '#B7B9BD' }}>
+                            已用200TB
+                        </Grid>
                     </Grid>
-                    <Grid sx={{ fontSize: '12px', color: '#B7B9BD' }}>
-                        已用200TB
+                </Grid>
+            ) : (
+                <Grid className={classes.leftBox2}>
+                    <KeyboardArrowLeftIcon
+                        onClick={() => {
+                            setLevel(false);
+                            navigate('/home');
+                        }}
+                        style={{ cursor: 'pointer' }}
+                    />
+                    <Grid
+                        sx={{
+                            fontSize: '14px',
+                            color: '#1E2633',
+                            marginLeft: '5px',
+                            fontWeight: '600',
+                        }}
+                    >
+                        账号详情
                     </Grid>
                 </Grid>
-            </Grid>
+            )}
 
             <Grid className={classes.rightBox}>
-                {list.map((e) => {
+                {list.map((e, key) => {
                     return (
-                        <img
-                            src={e.value}
-                            alt={e.id}
-                            style={{ marginLeft: '14px', cursor: 'pointer' }}
-                            onClick={() => {
-                                iconClick(e.id);
-                            }}
-                        />
+                        <Tooltip title={e.lable} arrow key={key}>
+                            <img
+                                src={e.value}
+                                alt={e.id}
+                                style={{
+                                    marginLeft: '14px',
+                                    cursor: 'pointer',
+                                }}
+                                onClick={() => {
+                                    iconClick(e.id);
+                                }}
+                            />
+                        </Tooltip>
                     );
                 })}
             </Grid>

src/renderer/console/home.jsx

@@ -20,7 +20,8 @@ export default (props) => {
 
     return (
         <Grid className={classes.initBody}>
-            <Head />
+            <Head level={false} />
+            <Grid>11111111111111111</Grid>
         </Grid>
     );
 };

src/renderer/console/login.jsx

@@ -17,7 +17,6 @@ import logo from '../../commons/assets/img/logo.svg';
 import FormControlLabel from '@mui/material/FormControlLabel';
 import Checkbox from '@mui/material/Checkbox';
 import { makeStyles } from 'tss-react/mui';
-import Button from '@mui/material/Button';
 
 const { ipcRenderer } = require('electron');
 const electron = window.require('electron');