Markdown2Html/src/component/MenuLeft/LogIn.js
liushuang f61200f54e init
2024-08-05 23:45:58 +08:00

61 lines
1.6 KiB
JavaScript

import React from "react";
import {Tooltip, Button} from "antd";
import {observer, inject} from "mobx-react";
import axios from "axios";
import {CLIENT_ID, CLIENT_SECRET, PROXY, ACCESS_TOKEN, ENTER_DELAY, LEAVE_DELAY} from "../../utils/constant";
import {queryParse, axiosJSON, axiosGithub} from "../../utils/helper";
import SvgIcon from "../../icon";
@inject("userInfo")
@observer
class LogIn extends React.Component {
constructor(props) {
super(props);
this.code = queryParse().code;
if (this.code) {
this.loginBack();
}
const TOKEN = localStorage.getItem(ACCESS_TOKEN);
if (TOKEN) {
axios.defaults.headers.common.Authorization = `token ${TOKEN}`;
this.getUserInfo();
}
}
login = () => {
window.location.href = `https://github.com/login/oauth/authorize?client_id=${CLIENT_ID}&scope=public_repo`;
};
loginBack = async () => {
const res = await axiosJSON.post(PROXY, {
code: this.code,
client_id: CLIENT_ID,
client_secret: CLIENT_SECRET,
});
localStorage.setItem(ACCESS_TOKEN, res.data.access_token);
window.location.href = "/";
};
getUserInfo = async () => {
try {
const res = await axiosGithub.get(`/user`);
this.props.userInfo.setUserInfo(res.data);
} catch (error) {
console.log(error);
}
};
render() {
return (
<Tooltip placement="bottom" mouseEnterDelay={ENTER_DELAY} mouseLeaveDelay={LEAVE_DELAY} title="登录">
<Button shape="circle" className="nice-btn-login" onClick={this.login}>
<SvgIcon name="github" className="nice-btn-login-icon" />
</Button>
</Tooltip>
);
}
}
export default LogIn;