xmcp
7 years ago
16 changed files with 354 additions and 95 deletions
@ -1,2 +1,3 @@ |
|||||||
/api_proxy/* http://www.pkuhelper.com:10301/services/pkuhole/:splat 200 |
/api_proxy/* http://www.pkuhelper.com/services/pkuhole/:splat 200 |
||||||
/audio_proxy/* http://www.pkuhelper.com:10301/services/pkuhole/audios/:splat 200 |
/audio_proxy/* http://www.pkuhelper.com/services/pkuhole/audios/:splat 200 |
||||||
|
/login_proxy/* http://www.pkuhelper.com/services/login/:splat 200 |
||||||
@ -0,0 +1,49 @@ |
|||||||
|
@font-face { |
||||||
|
font-family: 'icomoon'; |
||||||
|
src: |
||||||
|
url('icomoon.ttf?4yzqd4') format('truetype'), |
||||||
|
url('icomoon.woff?4yzqd4') format('woff'), |
||||||
|
url('icomoon.svg?4yzqd4#icomoon') format('svg'); |
||||||
|
font-weight: normal; |
||||||
|
font-style: normal; |
||||||
|
} |
||||||
|
|
||||||
|
.icon { |
||||||
|
/* use !important to prevent issues with browser extensions that change fonts */ |
||||||
|
/*noinspection CssNoGenericFontName*/ |
||||||
|
font-family: 'icomoon' !important; |
||||||
|
speak: none; |
||||||
|
font-style: normal; |
||||||
|
font-weight: normal; |
||||||
|
font-variant: normal; |
||||||
|
text-transform: none; |
||||||
|
|
||||||
|
/* Better Font Rendering =========== */ |
||||||
|
-webkit-font-smoothing: antialiased; |
||||||
|
-moz-osx-font-smoothing: grayscale; |
||||||
|
} |
||||||
|
|
||||||
|
.icon-reply:before { |
||||||
|
content: "\e96b"; |
||||||
|
} |
||||||
|
.icon-login-ok:before { |
||||||
|
content: "\e975"; |
||||||
|
} |
||||||
|
.icon-login:before { |
||||||
|
content: "\e98d"; |
||||||
|
} |
||||||
|
.icon-attention:before { |
||||||
|
content: "\e9d3"; |
||||||
|
} |
||||||
|
.icon-star:before { |
||||||
|
content: "\e9d7"; |
||||||
|
} |
||||||
|
.icon-star-ok:before { |
||||||
|
content: "\e9d9"; |
||||||
|
} |
||||||
|
.icon-help:before { |
||||||
|
content: "\ea09"; |
||||||
|
} |
||||||
|
.icon-refresh:before { |
||||||
|
content: "\ea2e"; |
||||||
|
} |
||||||
Binary file not shown.
Binary file not shown.
@ -0,0 +1,8 @@ |
|||||||
|
.login-form form p { |
||||||
|
margin: 1em 0; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
|
||||||
|
.login-form button { |
||||||
|
min-width: 100px; |
||||||
|
} |
||||||
@ -0,0 +1,92 @@ |
|||||||
|
import React, {Component, PureComponent} from 'react'; |
||||||
|
|
||||||
|
import './UserAction.css'; |
||||||
|
|
||||||
|
const LOGIN_BASE=window.location.protocol==='https:' ? '/login_proxy' : 'http://www.pkuhelper.com/services/login'; |
||||||
|
|
||||||
|
export const TokenCtx=React.createContext({ |
||||||
|
value: null, |
||||||
|
set_value: ()=>{}, |
||||||
|
}); |
||||||
|
|
||||||
|
export class LoginForm extends Component { |
||||||
|
constructor(props) { |
||||||
|
super(props); |
||||||
|
this.state={ |
||||||
|
loading_status: 'done', |
||||||
|
}; |
||||||
|
|
||||||
|
this.username_ref=React.createRef(); |
||||||
|
this.password_ref=React.createRef(); |
||||||
|
} |
||||||
|
|
||||||
|
do_login(event,set_token) { |
||||||
|
event.preventDefault(); |
||||||
|
this.setState({ |
||||||
|
loading_status: 'loading', |
||||||
|
}); |
||||||
|
let data=new URLSearchParams(); |
||||||
|
data.append('uid', this.username_ref.current.value); |
||||||
|
data.append('password', this.password_ref.current.value); |
||||||
|
fetch(LOGIN_BASE+'/login.php?platform=hole_xmcp_ml', { |
||||||
|
method: 'POST', |
||||||
|
body: data, |
||||||
|
}) |
||||||
|
.then((res)=>res.json()) |
||||||
|
.then((json)=>{ |
||||||
|
if(json.code!==0) |
||||||
|
throw new Error(json); |
||||||
|
|
||||||
|
set_token(json.token); |
||||||
|
alert(`成功以 ${json.name} 的身份登录`); |
||||||
|
this.setState({ |
||||||
|
loading_status: 'done', |
||||||
|
}); |
||||||
|
}) |
||||||
|
.catch((e)=>{ |
||||||
|
alert('登录失败'); |
||||||
|
this.setState({ |
||||||
|
loading_status: 'done', |
||||||
|
}); |
||||||
|
console.trace(e); |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
render() { |
||||||
|
return ( |
||||||
|
<TokenCtx.Consumer>{(token)=> |
||||||
|
<div className="login-form"> |
||||||
|
<form onSubmit={(e)=>this.do_login(e,token.set_value)} className="box"> |
||||||
|
<p>Token: <code>{token.value||'(null)'}</code></p> |
||||||
|
<p> |
||||||
|
<label> |
||||||
|
学号： |
||||||
|
<input ref={this.username_ref} type="tel" /> |
||||||
|
</label> |
||||||
|
</p> |
||||||
|
<p> |
||||||
|
<label> |
||||||
|
密码： |
||||||
|
<input ref={this.password_ref} type="password" /> |
||||||
|
</label> |
||||||
|
</p> |
||||||
|
<p> |
||||||
|
{this.state.loading_status==='loading' ? |
||||||
|
<button disabled="disbled">正在登录……</button> : |
||||||
|
<button type="submit">登录</button> |
||||||
|
} |
||||||
|
<button type="button" onClick={()=>{token.set_value(null);}}>退出</button> |
||||||
|
</p> |
||||||
|
</form> |
||||||
|
<div className="box"> |
||||||
|
<ul> |
||||||
|
<li>我们不会记录您的密码和个人信息。</li> |
||||||
|
<li><b>请勿泄露 Token</b>，它代表您的登录状态，与您的账户唯一对应且泄露后无法重置。</li> |
||||||
|
<li>如果您不愿输入密码，可以直接修改 <code>localStorage['TOKEN']</code></li> |
||||||
|
</ul> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
}</TokenCtx.Consumer> |
||||||
|
) |
||||||
|
} |
||||||
|
} |
||||||
Loading…
Reference in new issue