|
|
|
@ -16,7 +16,8 @@ interface TopPanelState
|
|
|
|
|
{
|
|
|
|
|
isLogin: boolean,//是否登录
|
|
|
|
|
isOpen: boolean,//是否打开资源面板
|
|
|
|
|
toLogin: boolean //前往登录
|
|
|
|
|
toLogin: boolean, //前往登录
|
|
|
|
|
isCollapse: boolean;
|
|
|
|
|
}
|
|
|
|
|
//顶部标题栏.
|
|
|
|
|
//TODO:Ajax请求,获得登录状态
|
|
|
|
@ -29,7 +30,8 @@ export class TopPanel extends React.Component<{}, {}>
|
|
|
|
|
this.state = {
|
|
|
|
|
isLogin: true,
|
|
|
|
|
isOpen: false,
|
|
|
|
|
toLogin: false
|
|
|
|
|
toLogin: false,
|
|
|
|
|
isCollapse: false
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
handleClick = () =>
|
|
|
|
@ -44,32 +46,56 @@ export class TopPanel extends React.Component<{}, {}>
|
|
|
|
|
{
|
|
|
|
|
return (
|
|
|
|
|
<nav className="pt-navbar pt-dark .modifier" >
|
|
|
|
|
<div className="pt-navbar-group pt-align-left" >
|
|
|
|
|
<div className="pt-navbar-heading logo" > CAD </ div >
|
|
|
|
|
<div className="pt-navbar-group pt-align-left logo" >
|
|
|
|
|
<div className="pt-navbar-heading" > CAD </ div >
|
|
|
|
|
<input
|
|
|
|
|
className="pt-input"
|
|
|
|
|
placeholder=" 搜索文件..."
|
|
|
|
|
type=" text"
|
|
|
|
|
style={{
|
|
|
|
|
width: window.innerWidth / 3
|
|
|
|
|
width: "50%"
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div className="pt-navbar-group pt-align-right" >
|
|
|
|
|
< button className="pt-button pt-minimal pt-icon-home" > 主页 </ button >
|
|
|
|
|
<div className="pt-navbar-group pt-align-right menu" >
|
|
|
|
|
<button
|
|
|
|
|
className="pt-button pt-icon-menu "
|
|
|
|
|
onClick={() =>
|
|
|
|
|
{
|
|
|
|
|
this.setState({ isCollapse: !this.state.isCollapse })
|
|
|
|
|
}}
|
|
|
|
|
></button>
|
|
|
|
|
</div>
|
|
|
|
|
{
|
|
|
|
|
this.state.isLogin ?
|
|
|
|
|
<div>
|
|
|
|
|
<div
|
|
|
|
|
className="pt-navbar-group pt-align-right info"
|
|
|
|
|
|
|
|
|
|
style={{
|
|
|
|
|
height: this.state.isCollapse ? "auto" : 0
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
< button className="pt-button pt-minimal pt-icon-home" >
|
|
|
|
|
<span className="hidden">
|
|
|
|
|
主页
|
|
|
|
|
</span>
|
|
|
|
|
</ button >
|
|
|
|
|
<button
|
|
|
|
|
className="pt-button pt-minimal pt-icon-document"
|
|
|
|
|
onClick={this.handleClick}
|
|
|
|
|
> 文件 </ button >
|
|
|
|
|
<span className="pt-navbar-divider" > </span>
|
|
|
|
|
>
|
|
|
|
|
<span className="hidden">
|
|
|
|
|
文件
|
|
|
|
|
</span>
|
|
|
|
|
</ button >
|
|
|
|
|
<span className="pt-navbar-divider hidden" > </span>
|
|
|
|
|
< button className="pt-button pt-minimal pt-icon-user" />
|
|
|
|
|
<span></span>
|
|
|
|
|
< button className="pt-button pt-minimal pt-icon-notifications" />
|
|
|
|
|
< button className="pt-button pt-minimal pt-icon-cog" onClick={this.handleClick} />
|
|
|
|
|
</div> :
|
|
|
|
|
<div>
|
|
|
|
|
<div className="pt-navbar-group pt-align-right info" >
|
|
|
|
|
< button className="pt-button pt-minimal pt-icon-home" > 主页 </ button >
|
|
|
|
|
<span className="pt-navbar-divider" > </span>
|
|
|
|
|
<button
|
|
|
|
|
className="pt-button pt-minimal"
|
|
|
|
@ -81,13 +107,6 @@ export class TopPanel extends React.Component<{}, {}>
|
|
|
|
|
<button className="pt-button pt-minimal">免费注册</button>
|
|
|
|
|
</div>
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
<Collapse isOpen={false}>
|
|
|
|
|
<pre>
|
|
|
|
|
EXIT
|
|
|
|
|
</pre>
|
|
|
|
|
</Collapse>
|
|
|
|
|
</div>
|
|
|
|
|
<Login
|
|
|
|
|
toggleDialog={this.handleCancel}
|
|
|
|
|
toLogin={this.state.toLogin}
|
|
|
|
|