97 行
3.1 KiB
JavaScript
97 行
3.1 KiB
JavaScript
import { useEffect, useContext, Fragment } from 'react';
|
|
|
|
import './userControl.css';
|
|
import { images } from '../../resources.json';
|
|
import { UserContext } from '../../helper/Context';
|
|
import Spinner from '../Spinner/Spinner';
|
|
import { get } from '../../helper/axios';
|
|
import { apis } from '../../helper/apis';
|
|
import { alert } from '../../helper/alert';
|
|
import History from '../../helper/history';
|
|
import AvatarUnit from '../AvatarUnit/AvatarUnit';
|
|
|
|
const exitContent = ['登录', '退出', '退出审核'];
|
|
// page level: 0: everyone, 1: login needed, 2: admin only
|
|
export default function UserControl({ pageAuthLevel, buttonOnly }) {
|
|
const { userData, setUserData } = useContext(UserContext);
|
|
useEffect(() => {
|
|
if (userData.role === -1) return;
|
|
if (userData.role === 0 && localStorage.getItem('jwt')) {
|
|
// 没有用户信息，但是有登录信息
|
|
setUserData({ role: -1, name: '加载中' });
|
|
get(apis.getProfile).then(({ data, status, networkStatus }) => {
|
|
if (networkStatus !== 200) return;
|
|
if (!status) return alert('获取用户信息失败：' + data + '，请稍候刷新再试');
|
|
setUserData({
|
|
name: data.realName,
|
|
role: data.role,
|
|
avatar: data.avatar,
|
|
});
|
|
});
|
|
return;
|
|
}
|
|
|
|
if (userData.role < pageAuthLevel) {
|
|
// 用户权限不足，依照页面权限跳转
|
|
if (userData.role === 1) {
|
|
History.force('/');
|
|
alert('您没有权限访问该页面，退出登录后可以使用有权限的账号登录');
|
|
return;
|
|
}
|
|
History.force('/login');
|
|
}
|
|
|
|
}, [pageAuthLevel, setUserData, userData]);
|
|
|
|
return (
|
|
<UserContext.Consumer>
|
|
{({ userData, setUserData }) => (
|
|
<div className="user">
|
|
{buttonOnly || (
|
|
<Fragment>
|
|
{
|
|
userData.role === -1
|
|
? (
|
|
<Spinner isGray />
|
|
)
|
|
: userData.role > 0 && (
|
|
<AvatarUnit
|
|
avatar={userData.avatar || images.avatar}
|
|
onChangeAvatar={url => setUserData({ ...userData, avatar: url })}
|
|
showTip={!userData.avatar}
|
|
/>
|
|
)
|
|
}
|
|
{
|
|
userData.role !== 0 && (
|
|
<div className="user-name">{userData.name}</div>
|
|
)
|
|
}
|
|
</Fragment>
|
|
)}
|
|
{
|
|
userData.role === pageAuthLevel
|
|
? (
|
|
<button
|
|
className="btn btn-hollow btn-straight"
|
|
onClick={() => {
|
|
localStorage.setItem('jwt', '');
|
|
setUserData({ role: 0, name: '' });
|
|
History.force('/login');
|
|
}}
|
|
>{exitContent[pageAuthLevel]}</button>
|
|
)
|
|
: userData.role === 2 && (
|
|
<button
|
|
className="btn btn-hollow btn-straight"
|
|
onClick={() => {
|
|
History.push('/admin/review');
|
|
}}
|
|
>进入审核</button>
|
|
)
|
|
}
|
|
</div>
|
|
)}
|
|
</UserContext.Consumer>
|
|
);
|
|
} |