175 lines
7.8 KiB
JavaScript
175 lines
7.8 KiB
JavaScript
import React from "react";
|
||
import Head from 'next/head';
|
||
import Image from 'next/image';
|
||
import { connect } from "react-redux";
|
||
import { withRouter } from 'next/router';
|
||
import { reduxWrapper } from '../../store';
|
||
|
||
import Header from '../components/Header';
|
||
import Footer from '../components/Footer';
|
||
import Company from "../components/Company";
|
||
import InnerMenu from "./components/InnerMenu";
|
||
|
||
class ContractServicesPage extends React.Component
|
||
{
|
||
constructor(props)
|
||
{
|
||
super(props);
|
||
this.state = {
|
||
opened: [],
|
||
};
|
||
}
|
||
|
||
_handle_onCard = (card) =>
|
||
{
|
||
const opened = [ ...this.state.opened ];
|
||
if(opened.indexOf(card) === -1)
|
||
{
|
||
opened.push(card);
|
||
}
|
||
else
|
||
{
|
||
opened.splice(opened.indexOf(card), 1);
|
||
}
|
||
|
||
this.setState({ opened: opened });
|
||
}
|
||
|
||
render()
|
||
{
|
||
const { opened } = this.state;
|
||
const { number } = this.props;
|
||
|
||
return (
|
||
<React.Fragment>
|
||
<Head>
|
||
<title>ЛК Эволюция автолизинга</title>
|
||
<meta
|
||
name="description"
|
||
content="ЛК Эволюция автолизинга"
|
||
/>
|
||
</Head>
|
||
<Header { ...this.props }/>
|
||
<main>
|
||
<section>
|
||
<div className="clear"></div>
|
||
<div className="container">
|
||
<div className="title_wrapper">
|
||
<div className="left">
|
||
<h1 className="section_title">Договор №{ number.replace("_", "/") } от 10.01.2021</h1>
|
||
</div>
|
||
<Company/>
|
||
</div>
|
||
<div className="aside_container about">
|
||
<InnerMenu number={ number } { ...this.props }/>
|
||
<article>
|
||
<div className="dropdown_blocks_list filled zero-margin">
|
||
|
||
<div className={`dropdown_block ${ opened.indexOf("ratcard") > -1 ? 'open' : '' }`}>
|
||
<div className="block_header" onClick={ () => this._handle_onCard('ratcard') }>
|
||
<p className="with-icon">
|
||
<img src="/assets/images/lk/additional-1.svg" alt="Карта РАТ" width="32px" height="32px" />
|
||
Карта РАТ
|
||
</p>
|
||
<button className="block_toggle"></button>
|
||
</div>
|
||
<div className="block_body">
|
||
<div className="company">
|
||
<ul>
|
||
<li>Номер карты: <b>34234324324324</b></li>
|
||
<li>Сайт: <b>www.sog.ru</b></li>
|
||
</ul>
|
||
</div>
|
||
<p>Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div className={`dropdown_block ${ opened.indexOf("insurance") > -1 ? 'open' : '' }`}>
|
||
<div className="block_header" onClick={ () => this._handle_onCard('insurance') }>
|
||
<p className="with-icon">
|
||
<img src="/assets/images/lk/additional-2.svg" alt="Страхование" width="32px" height="32px" />
|
||
Страхование
|
||
</p>
|
||
<button className="block_toggle"></button>
|
||
</div>
|
||
<div className="block_body">
|
||
<div className="company">
|
||
<p className="title">Каско</p>
|
||
<ul>
|
||
<li>Страховая компания: <b>Согласие</b></li>
|
||
<li>Сайт: <b>www.sog.ru</b></li>
|
||
<li>Телефон: <b>+74951112233</b></li>
|
||
<li>Номер полиса: <b>34234324324324</b></li>
|
||
<li>Период действия: <b>01/01/2020 - 01/01/2025</b></li>
|
||
<li>Страховая сумма: <b>3 400 000,00 р.</b></li>
|
||
</ul>
|
||
</div>
|
||
<p>Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div className={`dropdown_block ${ opened.indexOf("registration") > -1 ? 'open' : '' }`}>
|
||
<div className="block_header" onClick={ () => this._handle_onCard('registration') }>
|
||
<p className="with-icon">
|
||
<img src="/assets/images/lk/additional-3.svg" alt="Регистрация" width="32px" height="32px" />
|
||
Регистрация
|
||
</p>
|
||
<button className="block_toggle"></button>
|
||
</div>
|
||
<div className="block_body">
|
||
<p>Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div className={`dropdown_block ${ opened.indexOf("telematic") > -1 ? 'open' : '' }`}>
|
||
<div className="block_header" onClick={ () => this._handle_onCard('telematic') }>
|
||
<p className="with-icon">
|
||
<img src="/assets/images/lk/additional-4.svg" alt="Телематика" width="32px" height="32px" />
|
||
Телематика
|
||
</p>
|
||
<button className="block_toggle"></button>
|
||
</div>
|
||
<div className="block_body">
|
||
<div className="company">
|
||
<ul>
|
||
<li>Сайт: <b>www.telematic.ru</b></li>
|
||
<li>Логин: <b>test</b></li>
|
||
<li>Пароль: <b>test</b></li>
|
||
</ul>
|
||
</div>
|
||
<p>Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент</p>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</article>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
<Footer/>
|
||
</React.Fragment>
|
||
);
|
||
}
|
||
}
|
||
|
||
function mapStateToProps(state, ownProps)
|
||
{
|
||
return {
|
||
company: state.company,
|
||
schedule: state.payments,
|
||
}
|
||
}
|
||
|
||
export const getServerSideProps = reduxWrapper.getServerSideProps(store =>
|
||
async ({ req, res, query }) =>
|
||
{
|
||
return {
|
||
props: {
|
||
number: query.number,
|
||
}
|
||
}
|
||
}
|
||
);
|
||
|
||
export default withRouter(connect(mapStateToProps)(ContractServicesPage)); |