75 lines
2.1 KiB
JavaScript
75 lines
2.1 KiB
JavaScript
import React from "react";
|
|
import Link from "next/link";
|
|
|
|
export default class Header extends React.Component
|
|
{
|
|
constructor(props)
|
|
{
|
|
super(props);
|
|
this.state = {
|
|
menuOpened: false,
|
|
}
|
|
}
|
|
|
|
_handle_onToggleMenu = () =>
|
|
{
|
|
this.setState({
|
|
menuOpened: !this.state.menuOpened
|
|
});
|
|
};
|
|
|
|
_getActiveLink = (route) =>
|
|
{
|
|
if(route === "/") return "Договоры";
|
|
if(route.indexOf("/documents/") > -1) return "Взаиморасчеты и закрывающие документы";
|
|
if(route === "/settings") return "Настройки";
|
|
if(route.indexOf("/contract") === 0) return "Договоры";
|
|
|
|
return null;
|
|
}
|
|
|
|
render()
|
|
{
|
|
const { menuOpened } = this.state;
|
|
return (
|
|
<header>
|
|
<div className="container">
|
|
<a href="/" className="logo">
|
|
<img src="/assets/images/logo.svg" alt="" width="217px" height="32px" />
|
|
</a>
|
|
<div className="header_menu">
|
|
<nav>
|
|
<button className="nav_toggle" onClick={ this._handle_onToggleMenu }>
|
|
{ this.props.router && this._getActiveLink(this.props.router.route) }
|
|
</button>
|
|
<ul id="menu_list" className={ menuOpened ? "open" : "" }>
|
|
<li>
|
|
<Link href={`/`} shallow>
|
|
<a className={ this.props.router && (this.props.router.route === "/" || this.props.router.route.indexOf("/contract") === 0) ? "active" : "" }>Договоры</a>
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href={`/documents/calendar/`} shallow>
|
|
<a className={ this.props.router && this.props.router.route.indexOf("/documents/") === 0 ? "active" : "" }>Взаиморасчеты и закрывающие документы</a>
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/settings/" shallow>
|
|
<a className={ this.props.router && this.props.router.route === "/settings" ? "active" : "" }>Настройки</a>
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href={ process.env.NEXT_PUBLIC_MAIN_SITE }>
|
|
<a>Основной сайт</a>
|
|
</Link>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
<a href="tel:88003337575">8 800 333 75 75</a>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
)
|
|
}
|
|
}
|