fixes for contracts and additional documents downloading, remove mockup data

actions/contractActions.js

@@ -192,7 +192,53 @@ export const getContractAgreement = ({ dispatch, number, }) =>
 		})
 		.then((response) => 
 		{
-			dispatch({ type: actionTypes.CONTRACT_AGREEMENT, data: { agreement: response.data } });
+			const unsigned = {
+				count: 0, 
+				documents: {
+					contracts: [], 
+					redemptions: [], 
+					agreements: [], 
+					assignments: [], 
+				}, 
+			};
+
+			const signed = {
+				count: 0, 
+				documents: {
+					contracts: [], 
+					redemptions: [], 
+					agreements: [], 
+					assignments: [], 
+				}, 
+			};
+
+			console.log("ACTION", "getContractAgreement", "-".repeat(30));
+			console.log("ACTION", "getContractAgreement", "response.data", response.data);
+			console.log("ACTION", "getContractAgreement", "-".repeat(30));
+
+			for(let i in response.data)
+			{
+				for(let d in response.data[i].documents)
+				{
+					if(response.data[i].documents[d].signed)
+					{
+						signed.documents[response.data[i].type].push( response.data[i].documents[d] );
+						signed.count++;
+					}
+					else
+					{
+						unsigned.documents[response.data[i].type].push( response.data[i].documents[d] );
+						unsigned.count++;
+					}
+				}
+			}
+
+			console.log("ACTION", "getContractAgreement", "-".repeat(30));
+			console.log("ACTION", "getContractAgreement", "unsigned", unsigned);
+			console.log("ACTION", "getContractAgreement", "signed", signed);
+			console.log("ACTION", "getContractAgreement", "-".repeat(30));
+
+			dispatch({ type: actionTypes.CONTRACT_AGREEMENT, data: { agreement: { unsigned, signed } } });
 
 			resolve();
 		})

css/main/style.less

@@ -2908,9 +2908,15 @@ main {
                 min-width: 16%;
             }
 
+			&:nth-child(4) {
+                width: 14%;
+                min-width: 14%;
+				white-space: nowrap;
+            }
+
             &:nth-child(5) {
                 word-break: break-all;
-                width: 19%;
+                width: 18%;
             }
 
             p {

pages/500.js

@@ -28,7 +28,7 @@ class Offline extends React.Component
 					<title>ЛК Эволюция автолизинга</title>
 					<meta name="description" content="ЛК Эволюция автолизинга" />
 				</Head>
-				<Header {...this.props} />
+				<Header { ...this.props } />
 				<main>
 					<section>
 						<div className="clear"></div>
@@ -51,7 +51,7 @@ class Offline extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ false }/>
 			</React.Fragment>
 		);
 	}

pages/acts.js

@@ -123,7 +123,7 @@ export default function ActsPage()
 					</div>
 				</section>
 			</main>
-			<Footer/>
+			<Footer authenticated={ true }/>
 		</React.Fragment>
 	)
 }

pages/additional.js

@@ -156,7 +156,7 @@ export default function AdditionalPage() {
 					</div>
 				</section>
 			</main>
-			<Footer />
+			<Footer authenticated={ true }/>
 		</React.Fragment>
 	)
 }

pages/api/contract/insurance.js

@@ -61,6 +61,43 @@ export default async function handler(req, res)
 					.then((crm_response) => { result.nsib = crm_response.data; resolve(); })
 					.catch((error) => { console.error(error); resolve(); });
 				}), 
+				new Promise((resolve) => {
+					axios.get(`${ process.env.CRM_API_HOST }/lk/Contract/GetFinGap`, {
+						params: { ...client_jwt_decoded, contract_number: req.body.number }, 
+						headers: { "Authorization": `Bearer ${ crm_jwt }`, }, 
+					})
+					.then((crm_response) => { 
+						result.fingap = crm_response.data;
+						/*result.fingap = [
+							{
+								paid: true,
+								period_type: "current", 
+								invoice_url: null,
+								company: "АО \"ГСК \"ЮГОРИЯ\"", 
+								site: null,
+								phone: null,
+								number: "ТестФингап",
+								url: null,
+								period: "14.07.2021 - 13.07.2022", 
+								amount: 1200000.00
+							}, 
+							{
+								paid: false, 
+								period_type: "prolong", 
+								invoice_url: "353082cc-f38f-4da6-bcd4-3a6048eceb10", 
+								company: "АО \"ГСК \"ЮГОРИЯ\"", 
+								site: null, 
+								phone: null, 
+								number: "ТестФингап", 
+								url: null, 
+								period: "14.07.2022 - 13.07.2023", 
+								amount: null 
+							}
+						];*/
+						resolve(); 
+					})
+					.catch((error) => { console.error(error); resolve(); });
+				}), 
 			])
 			.then(() => 
 			{

pages/closing-acts.js

@@ -140,7 +140,7 @@ export default function ClosingActsPage()
 					</div>
 				</section>
 			</main>
-			<Footer/>
+			<Footer authenticated={ true }/>
 		</React.Fragment>
 	)
 }

pages/components/DownloadPdfButton/index.js

@@ -40,13 +40,14 @@ export default class DownloadPdfButton extends React.Component
 
 	render() 
 	{
+		const { id, filename, url, bitrix, title } = this.props;
 		const { downloading } = this.state;
 
 		return (
-			<a style={{ cursor: "pointer" }} className="button button-blue" onClick={ () => { this._handle_onDownloadFile() }}>
+			<a style={ { cursor: "pointer", opacity: (bitrix && url === null) || (!bitrix && id === null) ? 0.5 : 1.0 }} className="button button-blue" onClick={ () => { (bitrix && url === null) || (!bitrix && id === null) ? {} : this._handle_onDownloadFile() }}>
 				{ downloading ? (
 					<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" />
-				) : "Скачать" }
+				) : title !== undefined ? title : "Скачать" }
 			</a>
 		)
 	}

pages/components/Events/NotificationMessage/index.js

@@ -13,6 +13,11 @@ export default class NotificationMessage extends React.Component
 		};
 	}
 
+	_handle_onLink = (url) => 
+	{
+		window.location = url;
+	}
+
 	render() 
 	{
 		const { event } = this.props;
@@ -29,9 +34,7 @@ export default class NotificationMessage extends React.Component
 						{ event.important && (<p className="type">Важное</p>) }
 						<p className="date">{ event.event_date }</p>
 						<p className="action">
-							<Link href={`/contract/${ event.contract_number }/services#insurance`}>
+							<a className="interactive" onClick={ () => this._handle_onLink(`/contract/${ event.contract_number }/services#insurance`) }>Подробнее</a>
-								<a>Подробнее</a>
-							</Link>
 						</p>
 					</li>
 				)
@@ -47,9 +50,7 @@ export default class NotificationMessage extends React.Component
 						{ event.important && (<p className="type">Важное</p>) }
 						<p className="date">{ event.event_date }</p>
 						<p className="action">
-							<Link href={`/contract/${ event.contract_number }/services#insurance`}>
+							<a className="interactive" onClick={ () => this._handle_onLink(`/contract/${ event.contract_number }/services#insurance`) }>Подробнее</a>
-								<a>Подробнее</a>
-							</Link>
 						</p>
 					</li>
 				)
@@ -65,9 +66,7 @@ export default class NotificationMessage extends React.Component
 						{ event.important && (<p className="type">Важное</p>) }
 						<p className="date">{ event.event_date }</p>
 						<p className="action">
-							<Link href={`/contract/${ event.contract_number }/services#insurance`}>
+							<a className="interactive" onClick={ () => this._handle_onLink(`/contract/${ event.contract_number }/services#insurance`) }>Подробнее</a>
-								<a>Подробнее</a>
-							</Link>
 						</p>
 					</li>
 				)
@@ -115,7 +114,7 @@ export default class NotificationMessage extends React.Component
 						{ event.important && (<p className="type">Важное</p>) }
 						<p className="date">{ event.event_date }</p>
 						<p className="action">
-							<Link href={`/contract/${ event.contract_number }`}>
+							<Link href={`/contract/${ event.contract_number }/agreement`}>
 								<a>Посмотреть дополнительное соглашение</a>
 							</Link>
 						</p>
@@ -135,12 +134,12 @@ export default class NotificationMessage extends React.Component
 						{ event.important && (<p className="type">Важное</p>) }
 						<p className="date">{ event.event_date }</p>
 						<p className="action">
-							<Link href="/support/faq">
+							<Link href="/support/faq#68249d3b3ef51d25ff5f9433e8a7d60a">
 								<a>Посмотрите порядок возврата СТС</a>
 							</Link>
 							&nbsp; или &nbsp;
-							<Link href="/support/request">
+							<Link href="/support/request#68249d3b3ef51d25ff5f9433e8a7d60a">
-								<a>Загрузите скан СТС <span style={{ color: "red" }}>(какой раздел FAQ ?)</span></a>
+								<a>Загрузите скан СТС</a>
 							</Link>
 						</p>
 					</li>

pages/components/Footer/index.js

@@ -2,6 +2,7 @@ import React from "react";
 import Link from "next/link";
 import axios from 'axios';
 import { getPrograms } from "../../../actions";
+import Manager from "../Manager";
 
 export default class Footer extends React.Component 
 {
@@ -21,9 +22,13 @@ export default class Footer extends React.Component
 	render()
 	{
 		const { programs } = this.state;
+		const { authenticated } = this.props;
 
 		return (
-			<footer>
+			<footer style={{ position: "relative" }}>
+				{ authenticated && (
+					<Manager style={{ position: "absolute", left: "60px", top: "-210px", minWidth: "730px", zIndex: 10, }} />
+				) }
 				<div className="container">
 					<ul className="column">
 						<li><b>Программы</b></li>

pages/components/Header/NotificationsList/index.js

@@ -15,12 +15,11 @@ export default class NotificationsList extends React.Component
 	render() 
 	{
 		const { events } = this.props;
-		console.log("NotificationsList", "events", events);
 
 		return (
 			<>
 				<ul className="list">
-					{ events !== undefined && events !== null && events.slice(0, 5).map((event, index) => <NotificationMessage event={ event } key={ index }/>) }
+					{ events !== undefined && events !== null && events.slice(0, 5).map((event, index) => <NotificationMessage event={ event } key={ index } { ...this.props }/>) }
 				</ul>
 				<Link href="/events">
 					<a className="all">Все события</a>

pages/components/Header/index.js

@@ -219,7 +219,7 @@ class Header extends React.Component
 									{ events_loaded && (
 										<>
 											{ events.length > 0 ? (
-												<NotificationsList events={ events }/>
+												<NotificationsList events={ events } { ...this.props }/>
 											) : (
 												<p style={{ paddingBottom: "30px" }}>Нет действующих событий для показа</p>
 											) }

pages/components/Manager/index.js

@@ -1,22 +1,31 @@
 import React from "react";
+import { connect } from "react-redux";
 import { SpinnerCircular } from 'spinners-react';
 
 import { getImage } from '../../../actions';
 
-export default class Manager extends React.Component 
+class Manager extends React.Component 
 {
 	constructor(props)
 	{
 		super(props);
 		this.state = {
+			company: {}, 
 			photo: undefined, 
 			loading: true, 
 		};
 	}
 
+	static getDerivedStateFromProps(nextProps, prevState)
+	{
+		return {
+			company: nextProps.company, 
+		};
+	}
+
 	componentDidMount()
 	{
-		const { company } = this.props;
+		const { company } = this.state;
 
 		if(company.manager_photo !== undefined && company.manager_photo !== null && company.manager_photo !== "")
 		{
@@ -34,11 +43,10 @@ export default class Manager extends React.Component
 
 	render()
 	{
-		const { loading, photo, } = this.state;
+		const { company, loading, photo, } = this.state;
-		const { company, } = this.props;
 
 		return (
-			<div className="helpBox">
+			<div className="helpBox" { ...this.props }>
 				<div className="avatar" style={{ alignItems: "center", justifyContent: "center", display: "flex", }}>
 					{ loading ? (
 						<SpinnerCircular size={24} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
@@ -63,4 +71,13 @@ export default class Manager extends React.Component
 			</div>
 		)
 	}
-}
+}
+
+function mapStateToProps(state, ownProps)
+{
+	return {
+		company: state.company, 
+	}
+}
+
+export default connect(mapStateToProps)(Manager);

pages/contract/__change.js

@@ -296,7 +296,7 @@ class ChangeGraphicPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/contract/agreement.js

@@ -31,7 +31,8 @@ class ContractPage extends React.Component
 			date: null,
 			car: null,
 			contract_date: null,
-			agreement: null,
+			unsigned: null,
+			signed: null,
 			rules: null,
 			loading: false,
 		};
@@ -40,11 +41,12 @@ class ContractPage extends React.Component
 	static getDerivedStateFromProps(nextProps, prevState) 
 	{
 		return {
-			date: nextProps.date,
+			date: nextProps.date, 
-			car: nextProps.car,
+			car: nextProps.car, 
-			contract_date: nextProps.contract_date,
+			contract_date: nextProps.contract_date, 
-			agreement: nextProps.agreement,
+			unsigned: nextProps.unsigned, 
-			rules: nextProps.rules,
+			signed: nextProps.signed, 
+			rules: nextProps.rules, 
 		};
 	}
 
@@ -82,12 +84,44 @@ class ContractPage extends React.Component
 		}
 	}
 
+	_renderDocuments = (documents, type) => 
+	{
+		const types = {
+			contracts: "Договор",
+			redemptions: "Выкупные документы",
+			agreements: "Дополнительное соглашение",
+			assignments: "Договор цессии",
+		};
+
+		return documents[ type ].map((file, file_index) => 
+		{
+			console.log("file", file);
+			return (
+				<div className="row" key={ file_index }>
+					<p className="doc_name i-pdf extension" data-format={ file.extension }>
+						{ types[ type ] }
+						<span style={{ width: "100%" }}>
+							{ file.number } от{" "}{ moment(file.date).format("DD.MM.YYYY") }
+						</span>
+						{ file.type !== undefined && (<span>{ file.type }</span>) }
+					</p>
+					<DownloadPdfButton id={ file.url } filename={`evoleasing_${ types[ type ] }_${ file.type }_${ file.number }_${ file.date }.${ file.extension }`} />
+					{/*}
+						<a className="button button-blue">Подписать по ЭДО</a>
+					{*/}
+				</div>
+			);
+		});
+	}
+
 	render() 
 	{
 		const { number } = this.props;
-		const { loading, date, car, contract_date, agreement, rules } = this.state;
+		const { loading, date, car, contract_date, unsigned, signed, rules } = this.state;
 
 		console.log("rules", rules);
+		console.log("unsigned", unsigned);
+		console.log("signed", signed);
 
 		const types = {
 			contracts: "Договор",
@@ -102,118 +136,57 @@ class ContractPage extends React.Component
 					<title>ЛК Эволюция автолизинга</title>
 					<meta name="description" content="ЛК Эволюция автолизинга" />
 				</Head>
-				<Header {...this.props} />
+				<Header { ...this.props } />
 				<main>
 					<section>
 						<div className="clear"></div>
 						<div className="container">
 							<div className="title_wrapper">
 								<div className="left" style={{ flexDirection: "column" }}>
-									<h1 className="section_title">Договор №{number}</h1>
+									<h1 className="section_title">Договор №{ number }</h1>
 									<h5 style={{ fontSize: "14px" }}>
-										{ date !== undefined && date !== null && date !== null && (
+										{ date !== undefined && date !== null && date !== null && (<> от {moment(date).format("DD.MM.YYYY")}</>) }
-											<> от {moment(date).format("DD.MM.YYYY")}</>
+										{ car !== undefined && car !== null ? ` - ${car.brand.name} ${car.model.name} | ${ car.reg_number !== null ? car.reg_number : "без рег. номера" } | ${ car.vin_number !== null ? car.vin_number : "без VIN номера" }` : "" }
-										) }
-										{ car !== undefined && car !== null
-										? ` - ${car.brand.name} ${car.model.name} | ${
-											car.reg_number !== null
-												? car.reg_number
-												: "без рег. номера"
-											} | ${
-											car.vin_number !== null
-												? car.vin_number
-												: "без VIN номера"
-											}`
-										: "" }
 									</h5>
 								</div>
 								<Company { ...this.props }/>
 							</div>
 							<div className="aside_container about">
-								<InnerMenu number={number} {...this.props} />
+								<InnerMenu number={ number } { ...this.props } />
 								<article>
 									{ loading ? (
-										<div
+										<div className="table_row table_header" style={ { minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center", } }>
-											className="table_row table_header"
+											<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-											style={ {
-												minHeight: 300,
-												display: "flex",
-												justifyContent: "center",
-												alignItems: "center",
-											} }
-										>
-											<SpinnerCircular
-												size={90}
-												thickness={51}
-												speed={100}
-												color="rgba(28, 1, 169, 1)"
-												secondaryColor="rgba(236, 239, 244, 1)"
-											/>
 										</div>
 									) : (
 										<div className="dosc_list medium-icon">
-											<p className="list_title">К подписанию</p>
+											{ unsigned !== undefined && unsigned !== null && unsigned.documents !== undefined && unsigned.documents !== null && unsigned.count > 0 && (
-											<div className="row">
+												<>
-												<p className="doc_name i-pdf extension">
+													<p className="list_title">К подписанию</p>
-													Договор
+													{ this._renderDocuments(unsigned.documents, "contracts") }
-													<span style={{ width: "100%" }}>
+													{ this._renderDocuments(unsigned.documents, "agreements") }
-														2021_1655 от 20.04.2021
+													{ this._renderDocuments(unsigned.documents, "assignments") }
-													</span>
+													{ this._renderDocuments(unsigned.documents, "redemptions") }
-												</p>
+												</>
-												<div className="btn_group">
+											) }
-													<a className="button button-blue">
+											{ signed !== undefined && signed !== null && signed.documents !== undefined && signed.documents !== null && signed.count > 0 && (
-														Скачать
+												<>
-													</a>
+													<p className="list_title">Действующие</p>
-													<a className="button button-blue">
+													{ this._renderDocuments(signed.documents, "contracts") }
-														Подписать по ЭДО
+													{ this._renderDocuments(signed.documents, "agreements") }
-													</a>
+													{ this._renderDocuments(signed.documents, "assignments") }
-												</div>
+													{ this._renderDocuments(signed.documents, "redemptions") }
-											</div>
+												</>
-											<p className="list_title">Действующие</p>
+											) }
-											{ agreement !== undefined && agreement !== null && agreement.map((document, index) => (
-												<React.Fragment key={index}>
-													{ document.documents !== undefined &&
-													document.documents !== null &&
-													document.documents.map((file, file_index) => 
-													{
-														console.log("file", file);
-														return (
-															<div className="row" key={file_index}>
-																<p
-																	className="doc_name i-pdf extension"
-																	data-format={ file.extension }
-																>
-																	{ types[ document.type ] }
-																	<span style={{ width: "100%" }}>
-																		{ file.number } от{" "}
-																		{ moment(file.date).format("DD.MM.YYYY") }
-																	</span>
-																	{ file.type !== undefined && (
-																		<span>{file.type}</span>
-																	) }
-																</p>
-																<DownloadPdfButton
-																	id={file.url}
-																	filename={`evoleasing_${document.type}_${file.number}_${file.date}.${file.extension}`}
-																/>
-															</div>
-														);
-													}) }
-												</React.Fragment>
-											)) }
 											{ rules !== undefined && rules !== null && rules.map((document, index) => (
-												<div className="row" key={index}>
+												<div className="row" key={ index} >
 													<p className="doc_name i-pdf">
 														{ document.name }
 														<span style={{ width: "100%" }}>
-															Дата вступления в силу: {document.active_from}
+															Дата вступления в силу: { document.active_from }
 														</span>
 													</p>
-													<DownloadPdfButton
+													<DownloadPdfButton url={ `${ process.env.NEXT_PUBLIC_MAIN_SITE }${ document.url }` } filename={ `${ document.filename }.pdf` } bitrix={ true } />
-														url={`${process.env.NEXT_PUBLIC_MAIN_SITE}${document.url}`}
-														filename={`${document.filename}.pdf`}
-														bitrix={true}
-													/>
 												</div>
 											)) }
 										</div>
@@ -223,7 +196,7 @@ class ContractPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}
@@ -235,7 +208,8 @@ function mapStateToProps(state, ownProps)
 		contract_date: state.contract.date,
 		date: state.contract.date,
 		car: state.contract.car,
-		agreement: state.contract.agreement,
+		unsigned: state.contract.agreement.unsigned,
+		signed: state.contract.agreement.signed,
 		rules: state.contract.rules,
 	};
 }

pages/contract/change/components/Comparison/index.js

@@ -140,7 +140,7 @@ export default class Comparison extends React.Component
 					) }
 					{ calculation !== undefined && calculation !== null && calculation.sum_comment !== null && (
 						<div className="form_field">
-							<p><span>{ calculation.sum_comment.label }:</span> { calculation.sum_comment.value }</p>
+							<p><span>{ calculation.sum_comment.label }</span> { numeral(calculation.sum_comment.value).format(' ., ') }&nbsp;₽</p>
 						</div>
 					) }
 					{/*}

pages/contract/change/index.js

@@ -395,7 +395,7 @@ class ChangeGraphicPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/contract/compare.js

@@ -441,7 +441,7 @@ class ChangeGraphicComparePage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/contract/documents.js

@@ -567,7 +567,7 @@ class ContractDocumentsPage extends React.Component
 						</section>
 					</main>
 				) }
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/contract/events.js

@@ -137,7 +137,7 @@ class ContractPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/contract/fines.js

@@ -569,7 +569,7 @@ class ContractDocumentsPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/contract/gibdd.js

@@ -223,7 +223,7 @@ class ContractServicesPage extends React.Component {
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/contract/index.js

@@ -331,7 +331,7 @@ class ContractSchedulePage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer/>
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/contract/materials.js

@@ -119,7 +119,7 @@ class ContractPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer/>
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/contract/penalties.js

@@ -185,7 +185,7 @@ class ContractPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/contract/services.js

@@ -14,7 +14,8 @@ import Footer from '../components/Footer';
 import Company from "../components/Company";
 import InnerMenu from "./components/InnerMenu";
 
-import { getContractInfo, getContractHelpCard, getContractInsurance, getContractRegistration, getContractTelematic } from './../../actions';
+import { getContractInfo, getContractHelpCard, getContractInsurance, getContractRegistration, getContractTelematic, } from './../../actions';
+import DownloadPdfButton from "../components/DownloadPdfButton";
 
 class ContractServicesPage extends React.Component 
 {
@@ -84,6 +85,27 @@ class ContractServicesPage extends React.Component
 						o.push("insurance");
 						this.setState({ opened: o });
 					}
+
+					if(document.location.hash.indexOf("ratcard") > -1)
+					{
+						const o = [ ...this.state.opened ];
+						o.push("ratcard");
+						this.setState({ opened: o });
+					}
+
+					if(document.location.hash.indexOf("telematic") > -1)
+					{
+						const o = [ ...this.state.opened ];
+						o.push("telematic");
+						this.setState({ opened: o });
+					}
+
+					if(document.location.hash.indexOf("registration") > -1)
+					{
+						const o = [ ...this.state.opened ];
+						o.push("registration");
+						this.setState({ opened: o });
+					}
 				});
 			}
 		}
@@ -104,6 +126,16 @@ class ContractServicesPage extends React.Component
 		this.setState({ opened: opened });
 	}
 
+	_handle_onContract = (url) => 
+	{
+
+	}
+
+	_handle_onInvoice = (url) => 
+	{
+
+	}
+
 	render()
 	{
 		const { opened, loading, date, car, contract_date, helpcard, insurance, registration, telematic, } = this.state;
@@ -198,13 +230,14 @@ class ContractServicesPage extends React.Component
 													<button className="block_toggle"></button>
 												</div>
 												<div className="block_body full">
+													{/*}
 													<div className="company filled">
 														<p className="title">КАСКО</p>
 														<ul>
 															<li>Страховая компания: <b>Согласие</b></li>
 															<li>Сайт: <b>www.sogl.ru</b></li>
 															<li>Телефон: <b>34234324324324</b></li>
-															<li>Номер полиса: <b style={{color: "#1C01A9"}}>34234324324324</b></li>
+															<li>Номер полиса: <b style={{ color: "#1C01A9" }}>34234324324324</b></li>
 															<li>Период действия: <b>01/01/2020 - 01/01/2025</b></li>
 															<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>3 400 000,00 ₽&nbsp;₽</b></li>
 															<li className="alert">Обращаем Ваше внимание, что пролонгация полиса ОСАГО на второй и последующие периоды осуществляется Лизингополучателем самостоятельно</li>
@@ -213,56 +246,104 @@ class ContractServicesPage extends React.Component
 															<button className="button button-blue">Скачать счет на оплату</button>
 														</div>
 													</div>
-
+													{*/}
 													{ insurance !== undefined && insurance !== null ? (
 														<>
 															{ insurance.kasko !== undefined && insurance.kasko !== null && insurance.kasko !== "" && insurance.kasko.map !== undefined && insurance.kasko.map((entry, index) => (
 																<React.Fragment key={ index }>
-																	<div className= { `company ${ entry.period_type === "prolong" && "filled" }` }>
+																	<div className={ `company ${ entry.period_type === "prolong" && "filled" }` }>
 																		<p className="title">КАСКО</p>
 																		<ul>
 																			{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
 																			{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
 																			{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
-																			{ entry.number && (<li>Номер полиса: <b>{ entry.number }</b></li>) }
+																			{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
 																			{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
 																			{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
 																			{ entry.period_type === "prolong" && (
 																				<li className="alert">Обращаем Ваше внимание, что пролонгация полиса КАСКО на второй и последующие периоды осуществляется Лизингополучателем самостоятельно</li>
 																			) }
 																		</ul>
+																		{ entry.period_type === "prolong" && entry.invoice_url !== null && (
+																			<div className="action">
+																				<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
+																			</div>
+																		) }
 																	</div>
 																	{ entry.description && (<p>{ entry.description }</p>) }
 																</React.Fragment>
 															)) }
 															{ insurance.osago !== undefined && insurance.osago !== null && insurance.osago !== "" && insurance.osago.map !== undefined && insurance.osago.map((entry, index) => (
 																<React.Fragment key={ index }>
-																	<div className="company">
+																	<div className={ `company ${ entry.period_type === "prolong" && "filled" }` }>
 																		<p className="title">ОСАГО</p>
 																		<ul>
 																			{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
 																			{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
 																			{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
-																			{ entry.number && (<li>Номер полиса: <b>{ entry.number }</b></li>) }
+																			{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
 																			{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
 																			{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
 																		</ul>
+																		{ entry.period_type === "prolong" && entry.invoice_url !== null && (
+																			<div className="action">
+																				<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
+																				{/*}
+																				<button className="button button-blue" onClick={ () => this._handle_onInvoice(entry.invoice_url) }>Скачать счет на оплату</button>
+																				{*/}
+																			</div>
+																		) }
 																	</div>
 																	{ entry.description && (<p>{ entry.description }</p>) }
 																</React.Fragment>
 															)) }
 															{ insurance.nsib !== undefined && insurance.nsib !== null && insurance.nsib !== "" && insurance.nsib.map !== undefined && insurance.nsib.map((entry, index) => (
 																<React.Fragment key={ index }>
-																	<div className="company">
+																	<div className={ `company ${ entry.period_type === "prolong" && "filled" }` }>
 																		<p className="title">НСИБ</p>
 																		<ul>
 																			{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
 																			{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
 																			{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
-																			{ entry.number && (<li>Номер полиса: <b>{ entry.number }</b></li>) }
+																			{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
 																			{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
 																			{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
 																		</ul>
+																		{ entry.period_type === "prolong" && entry.invoice_url !== null && (
+																			<div className="action">
+																				<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
+																				{/*}
+																				<button className="button button-blue" onClick={ () => this._handle_onInvoice(entry.invoice_url) }>Скачать счет на оплату</button>
+																				{*/}
+																			</div>
+																		) }
+																	</div>
+																	{ entry.description && (<p>{ entry.description }</p>) }
+																</React.Fragment>
+															)) }
+															{ insurance.fingap !== undefined && insurance.fingap !== null && insurance.fingap !== "" && insurance.fingap.map !== undefined && insurance.fingap.map((entry, index) => (
+																<React.Fragment key={ index }>
+																	<div className= { `company ${ entry.period_type === "prolong" && "filled" }` }>
+																		<p className="title">FinGAP</p>
+																		<ul>
+																			{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
+																			{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
+																			{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
+																			{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
+																			{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
+																			{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
+																			{ entry.period_type === "prolong" && (
+																				<li className="alert">Обращаем Ваше внимание, что пролонгация полиса FinGAP на второй и последующие периоды осуществляется Лизингополучателем самостоятельно</li>
+																			) }
+																		</ul>
+																		{ entry.period_type === "prolong" && entry.invoice_url !== null && (
+																			<div className="action">
+																				<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
+																				{/*}
+																				<button className="button button-blue" onClick={ () => this._handle_onInvoice(entry.invoice_url) }>Скачать счет на оплату</button>
+																				{*/}
+																			</div>
+																		) }
 																	</div>
 																	{ entry.description && (<p>{ entry.description }</p>) }
 																</React.Fragment>
@@ -349,7 +430,7 @@ class ContractServicesPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer/>
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/documents/calendar.js

@@ -316,7 +316,7 @@ class CalendarPage extends React.Component
 					</section>
 					<CalendarCellModal open={ this.state.modalOpened } selected_payment={ selected_payment } close={ () => this.toggleModal() }/>
 				</main>
-				<Footer/>
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		)
 	}

pages/documents/finals.js

@@ -136,7 +136,7 @@ class FinalsPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer/>
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		)
 	}

pages/documents/reconciliations.js

@@ -292,7 +292,7 @@ class ReconciliationsPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer/>
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		)
 	}

pages/events.js

@@ -115,7 +115,7 @@ class EventsPage extends React.Component
 														{ filtered.length > 0 ? (
 															<ul className="list events-list">
 																{ filtered.map((event, index) => (
-																	<NotificationMessage event={ event } key={ index }/>
+																	<NotificationMessage event={ event } key={ index } { ...this.props }/>
 																)) }
 															</ul>
 														) : (
@@ -127,7 +127,7 @@ class EventsPage extends React.Component
 														{ events.length > 0 ? (
 															<ul className="list events-list">
 																{ events.map((event, index) => (
-																	<NotificationMessage event={ event } key={ index }/>
+																	<NotificationMessage event={ event } key={ index } { ...this.props }/>
 																)) }
 															</ul>
 														) : (
@@ -186,7 +186,7 @@ class EventsPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/index.js

@@ -147,6 +147,11 @@ class IndexPage extends React.Component
 		});
 	}
 
+	_handle_onService = (url) => 
+	{
+		this.props.router.push(url);
+	}
+
 	render()
 	{
 		const { company, loading, page, pages, search, date_from, date_from_type, date_to, date_to_type, contracts, sort_number, sort_date, sort_status, all } = this.state;
@@ -257,14 +262,14 @@ class IndexPage extends React.Component
 															</div>
 															<div className="table_cell">
 																<div className="service_list">
-																	{ contract.telematics_exists && <i title="Телематика" data-additional-service="1"></i> }
+																	{ contract.telematics_exists && <i title="Телематика" data-additional-service="1" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#telematic`) } }></i> }
-																	{ contract.rat_exists && <i title="РАТ" data-additional-service="2"></i> }
+																	{ contract.rat_exists && <i title="РАТ" data-additional-service="2" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#ratcard`) } }></i> }
-																	{ contract.gibddreg_exists && <i title="Регистрация в ГИБДД" data-additional-service="3"></i> }
+																	{ contract.gibddreg_exists && <i title="Регистрация в ГИБДД" data-additional-service="3" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#registration`) } }></i> }
-																	{ contract.fuelcard_exists && <i title="Топливные карты" data-additional-service="4"></i> }
+																	{ contract.fuelcard_exists && <i title="Топливные карты" data-additional-service="4" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#fuelcards`) } }></i> }
-																	{ contract.kasko_exists && <i title="КАСКО" data-additional-service="5"></i> }
+																	{ contract.kasko_exists && <i title="КАСКО" data-additional-service="5" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
-																	{ contract.osago_exists && <i title="ОСАГО" data-additional-service="6"></i> }
+																	{ contract.osago_exists && <i title="ОСАГО" data-additional-service="6" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
-																	{ contract.nsib_exists && <i title="НСИБ" data-additional-service="7"></i> }
+																	{ contract.nsib_exists && <i title="НСИБ" data-additional-service="7" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
-																	{ contract.fingap_exists && <i title="FinGAP" data-additional-service="8"></i> }
+																	{ contract.fingap_exists && <i title="FinGAP" data-additional-service="8" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
 																</div>
 															</div>
 														</div>
@@ -287,12 +292,14 @@ class IndexPage extends React.Component
 								{ !all && (
 									<Pagination page={ page } pages={ pages } onPage={ this._handle_onPage } onAll={ this._handle_onAll } all={ all } showAll={ true }/>
 								) }
-								<Manager company={ company }/>
+								{/*}
+								<Manager/>
+								{*/}
 							</div>
 						</div>
 					</section>
 				</main>
-				<Footer/>
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		)
 	}

pages/login.js

@@ -306,7 +306,7 @@ class LoginPage extends React.Component
 					</section>
 					<FormRequest/>
 				</main>
-				<Footer/>
+				<Footer authenticated={ false }/>
 			</React.Fragment>
 		);
 	}
@@ -322,7 +322,7 @@ function mapStateToProps(state, ownProps)
 export const getServerSideProps = reduxWrapper.getServerSideProps(store => 
 	async ({ req, res, query }) => 
 	{
-		console.log("JWT TOKEN WITH CRM KEY", jwt.sign({ "acc_number": "ACC759", }, process.env.JWT_SECRET_CRM, { noTimestamp: false }));
+		console.log("JWT TOKEN WITH CRM KEY", jwt.sign({ acc_number: "ACC759", email: "" }, process.env.JWT_SECRET_CRM, { noTimestamp: false }));
 		/*
 		if(query.token !== undefined && query.token !== null)
 		{

pages/recovery.js

@@ -282,7 +282,7 @@ export default class RecoveryPage extends React.Component
 					</section>
 					<FormRequest/>
 				</main>
-				<Footer />
+				<Footer authenticated={ false }/>
 			</React.Fragment>
 		)
 	}

pages/settings/admin.js

@@ -305,7 +305,7 @@ class AdminPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer/>
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		)
 	}

pages/settings/password.js

@@ -188,7 +188,7 @@ class IndexPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer/>
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		)
 	}

pages/settings/phone.js

@@ -238,7 +238,7 @@ class IndexPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer/>
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		)
 	}

pages/support/appeals.js

@@ -203,7 +203,7 @@ class SupportAppealsPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/support/detail.js

@@ -113,7 +113,7 @@ class ContractPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/support/index.js

@@ -31,6 +31,8 @@ class ContractPage extends React.Component
 			loading: false, 
 			query: "", 
 		};
+
+		this.question_refs = [];
 	}
 
 	static getDerivedStateFromProps(nextProps, prevState) 
@@ -52,7 +54,34 @@ class ContractPage extends React.Component
 				getSupportThemes({ dispatch: this.props.dispatch })
 				.then(() => 
 				{
-					this.setState({ loading: false });
+					let question_selected = undefined;
+					let found = false;
+
+					for(let t in this.state.themes)
+					{
+						for(let q in this.state.themes[t].questions)
+						{
+							if(this.props.router.asPath.indexOf(this.state.themes[t].questions[q].id) > -1)
+							{
+								this.question_refs[this.state.themes[t].questions[q].id] = React.createRef();
+								question_selected = this.state.themes[t].questions[q].id;
+								found = true;
+							}
+						}
+					}
+
+					this.setState({ loading: false, question_selected: question_selected }, () => 
+					{
+						if(question_selected !== undefined)
+						{
+							setTimeout(() => {
+								this.question_refs[question_selected].current.scrollIntoView({
+									behavior: 'smooth',
+									block: 'center',
+								});
+							}, 100);
+						}
+					});
 				})
 				.catch(() => {});
 			});
@@ -134,7 +163,7 @@ class ContractPage extends React.Component
 														<div className="dropdown_blocks_list">
 															{ theme.questions.map((question) => 
 															(
-																<div className={ `dropdown_block ${ parseInt(question.id, 10) === parseInt(question_selected, 10) && "open" }` } key={ `question_${ question.id }` } onClick={ () => this._handle_onQuestion(question.id) }>
+																<div ref={ this.question_refs[question.id] } className={ `dropdown_block ${ question.id === question_selected && "open" }` } key={ `question_${ question.id }` } onClick={ () => this._handle_onQuestion(question.id) }>
 																	<div className={ `block_header` }>
 																		<p>{ question.title }</p>
 																		<button></button>
@@ -189,7 +218,7 @@ class ContractPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/support/request.js

@@ -147,7 +147,28 @@ class SupportRequestPage extends React.Component
 				])
 				.then(() => 
 				{
-					this.setState({ loading: false });
+					let opened_theme, opened_question;
+					let found = false;
+
+					opened_theme = 0;
+					for(let t in this.state.themes)
+					{
+						opened_question = 0;
+						for(let q in this.state.themes[t].questions)
+						{
+							if(this.props.router.asPath.indexOf(this.state.themes[t].questions[q].id) > -1)
+							{
+								found = true;
+								break;
+							}
+							opened_question++;
+						}
+
+						if(found) { break; }
+						opened_theme++;
+					}
+
+					this.setState({ loading: false, opened_theme: found ? opened_theme : 0, opened_question: found ? opened_question : 0 });
 				})
 				.catch(() => {});
 			});
@@ -413,7 +434,7 @@ class SupportRequestPage extends React.Component
 						</div>
 					</section>
 				</main>
-				<Footer />
+				<Footer authenticated={ true }/>
 			</React.Fragment>
 		);
 	}

pages/transaction.js

@@ -147,7 +147,7 @@ export default function TransactionPage()
 					</div>
 				</section>
 			</main>
-			<Footer/>
+			<Footer authenticated={ true }/>
 		</React.Fragment>
 	)
 }

reducers/initialState.js

@@ -38,7 +38,10 @@ export const defaultState = {
 		helpcard: null, 
 		registration: null, 
 		telematic: null, 
-		agreement: null, 
+		agreement: {
+			unsigned: null, 
+			signed: null, 
+		}, 
 		documents: null, 
 		rules: null, 
 		materials: null,