обращения

This commit is contained in:
Denis 2022-07-13 21:33:39 +03:00
parent 8bbebb4baa
commit 94a742b2e4
15 changed files with 1277 additions and 16 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -469,7 +469,7 @@
// Поиск договора в лк
.contract_search {
margin-bottom: 55px;
margin-bottom: 40px;
@media all and (max-width: 1600px) and (min-width: 1280px) {
margin-bottom: 30px;
@ -994,4 +994,58 @@
}
}
}
}
.new_appeal {
form {
.form_field {
margin-bottom: 14px;
}
textarea {
height: 208px;
}
}
}
.dropzone {
height: 208px;
position: relative;
border: 1px dashed #1C01A9;
border-radius: 4px;
background: rgba(28, 1, 169, 0.1);
text-align: center;
display: flex;
align-items: center;
justify-content: center;
margin-top: 30px;
.files {
width: 100%;
padding: 16px;
&:empty {
display: none;
}
}
[type="file"] {
cursor: pointer;
position: absolute;
opacity: 0;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
div {
max-width: 404px;
text-align: center;
p {
color: #828282;
margin-bottom: 20px;
}
}
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -194,6 +194,14 @@ main {
}
}
}
.back {
padding-left: 28px;
background:url("../../public/assets/images/icons/page-back.svg") no-repeat left center;
color: var(--blue);
font-weight: 700;
margin-right: 25px;
}
}
// Главный слайдер
@ -3831,7 +3839,7 @@ main .dropdown_blocks_list .dropdown_block .block_body {
.helpBox {
max-width: 730px;
margin: 80px 0 0 0;
margin: 80px 0;
background: #FFFFFF;
box-shadow: 0px 4px 32px rgba(0, 0, 0, 0.16);
border-radius: 17px;
@ -4808,4 +4816,228 @@ main .dropdown_blocks_list .dropdown_block .block_body {
}
}
}
}
.fine {
.fine_block {
margin-bottom: 40px;
max-width: 600px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
&:last-child {
margin-bottom: 0;
}
.fine_col {
width: calc(50% - 23px);
max-width: 240px;
@media all and (max-width: 768px) {
width: 100%;
max-width: 100%;
}
p {
display: flex;
justify-content: space-between;
span {
font-weight: 700;
color: #000;
}
}
&:first-child {
p {
color: var(--text_not_active);
}
@media all and (max-width: 768px) {
margin-bottom: 35px;
}
}
&:nth-child(2) {
p {
padding-bottom: 8px;
margin-bottom: 8px;
border-bottom: 1px solid var(--inactive);
&:last-child {
border: 0;
}
}
}
}
}
}
.faq-list {
.faq_item {
margin-bottom: 20px;
display: flex;
flex-wrap: wrap;
.item_title {
font-weight: 700;
max-width: 235px;
width: 235px;
margin-right: 20px;
padding-top: 20px;
}
.dropdown_blocks_list {
width: calc(100% - 255px);
.dropdown_block {
&:last-child {
border-bottom: 1px solid #EDEFF5;
}
.block_header {
padding-top: 0;
p {
font-weight: 400;
}
}
}
}
}
}
.appeal_list {
.appeal_item {
margin-bottom: 20px;
padding: 16px;
border: 1px solid rgba(0, 16, 61, 0.12);
p {
margin-bottom: 8px;
&:last-child {
margin-bottom: 0;
}
}
.item_header {
margin-bottom: 25px;
position: relative;
.status {
position: absolute;
top: 0;
right: 0;
color: #fff;
font-weight: 700;
font-size: 15px;
line-height: 20px;
padding: 4px 10px;
background: #04A8A4;
border-radius: 4px;
}
}
.item_body {
.item_text {
margin: 0 -16px;
padding: 0 16px;
&:not(:last-child) {
padding-bottom: 16px;
margin-bottom: 16px;
border-bottom: 1px solid rgba(0, 16, 61, 0.12);;
}
.dosc_list {
display: flex;
gap: 0 20px;
flex-wrap: wrap;
margin-top: 16px;
.row {
width: calc(33.333% - 20px);
}
}
.doc_name {
max-width: 100%;
span {
width: 100%;
}
}
}
}
}
}
.new_appeal {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
.column {
&:first-child {
width: 440px;
margin-right: 30px;
}
&:nth-child(2) {
width: calc(100% - 470px);
max-width: 660px;
}
.column_text_block {
margin-bottom: 40px;
p {
margin-bottom: 8px;
}
.dosc_list {
display: flex;
flex-wrap: wrap;
.row {
width: 50%;
.doc_name {
max-width: 100%;
}
}
}
}
.appeal_list {
.appeal_item {
padding: 8px;
margin-bottom: 8px;
border: 0;
border-bottom: 1px solid #EDEFF5;
.block_header {
padding: 0;
height: auto;
p {
font-weight: 400;
}
}
&.open {
background: #EDEFF5;
border-radius: 4px;
button {
&.rotate {
transform: rotate(-90deg);
}
}
}
}
}
}
}

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
{"version":3,"sources":["var.less"],"names":[],"mappings":"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"}
{"version":3,"sources":["var.less"],"names":[],"mappings":"AAAA,MACE,cAAA,CACA,wBAAA,CACA,cAAA,CACA,+BAAA,CACA,iBAAA,CACA,kCAAA,CACA,aAAA,CACA,kBAAA,CACA,eAAA,CACA,0BAgBF,KACE,cAAA,CACA,gBAAA,CACA,aAAA,CACA,YAAa,uBAAb,CACA,gBAEA,gBAAmC,uBAAwB,kBAA3D,KACE,cAAA,CACA,kBAGF,gBAAkC,iBAAlC,KACE,cAAA,CACA,kBAIJ,UACE,gBAGF,WACE,gBAAA,CACA,gBAAA,CACA,UAAA,CACA,gBAAA,CACA,WAAA,CACA,kBAEA,UAAC,OACC,QAAS,EAAT,CACA,aAAA,CACA,iBAAA,CACA,KAAA,CACA,MAAA,CACA,UAAA,CACA,QAAA,CACA,WAYF,gBAAmC,uBAAwB,kBAA3D,WACE,gBAAA,CACA,kBAGF,gBAAmC,kBAAnC,WACE,kBAGF,gBAAkC,iBAAlC,WACE,gBAAA,CACA,kBAGF,gBAAmC,kBAAnC,WACE,MAAO,kBAAP,CACA,eAGF,gBAAkC,iBAAlC,WACE,aAAA,CACA,MAAO,mBAIX,iBACE,YAAA,CACA,8BAFF,gBAIE,OACE,YAEA,gBAAkC,iBAAlC,gBAHF,OAII,YARN,gBAYE,SACE,MAAO,mBAEP,gBAHF,QAGG,YACC,WAhBN,gBAYE,QAOE,cACE,iBAAA,CACA,YAAA,CACA,cAAA,CACA,6BAAA,CACA,gCAxBN,gBAYE,QAOE,aAOE,KACE,MAAO,iBAGT,gBAAkC,iBAAlC,gBAlBJ,QAOE,cAYI,UADF,gBAlBJ,QAOE,aAcI,KACE,YAKN,gBAAkC,iBAAlC,gBA3BF,SA4BI,WADF,gBA3BF,QA8BI,cACE,gBAKN,gBAAC,MACC,OACE,WAAA,CACA,uBAAwB,eAAxB,CACA,oBAEA,gBAAmC,uBAAwB,kBAA3D,gBANH,MACC,OAMI,WAAA,CACA,qBAGF,gBAAkC,iBAAlC,gBAXH,MACC,OAWI,qBAZN,gBAAC,MAgBC,SACE,MAAO,kBAAP,CACA,oBAEA,gBApBH,MAgBC,QAIG,MACC,WAGF,gBAAmC,uBAAwB,kBAA3D,gBAxBH,MAgBC,SASI,MAAO,kBAAP,CACA,qBAGF,gBAAkC,iBAAlC,gBA7BH,MAgBC,SAcI,qBAIJ,gBAAmC,kBAAnC,gBAlCD,OAmCG,cADF,gBAlCD,MAqCG,OAHF,gBAlCD,MAqCU,SACL,YAQR,eACE,cAAA,CACA,gBAAA,CACA,eAAA,CACA,aAAA,CACA,mBAEA,cAAC,WACC,gBAGF,gBAAmC,uBAAwB,kBAA3D,eACE,cAAA,CACA,kBAGF,gBAAmC,kBAAnC,eACE,cAAA,CACA,kBAGF,gBAAkC,iBAAlC,eACE,cAAA,CACA,kBAGF,gBAAkC,iBAAlC,eACE,oBAIJ,GACE,cAAA,CACA,iBAGF,GACE,cAAA,CACA,gBAAA,CACA,gBAAA,CACA,mBAEA,gBAAmC,uBAAwB,kBAA3D,GACE,cAAA,CACA,kBAGF,EAAC,OACC,cAAA,CACA,gBAAA,CACA,MAAO,sBAAP,CACA,YAAA,CACA,gBAEA,gBAAkC,iBAAlC,EAPD,OAQG,cAAA,CACA,kBAIJ,EAAC,aACC,aAIJ,GACE,cAAA,CACA,gBAAA,CACA,gBAAA,CACA,mBAEA,EAAC,aACC,aAIJ,GACE,cAAA,CACA,gBAAA,CACA,gBAAA,CACA,mBAEA,EAAC,aACC,aAIJ,WACE,cAAA,CACA,iBAEA,UAAC,YACC,cAGF,gBAAkC,iBAAlC,WACE,cAAA,CACA,kBAIJ,EACA,OACE,gBAIA,CAAC,SACC,MAAO,YAIX,EACE,oBAAA,CACA,MAAO,YAGT,IACE,sBAGF,OACE,aAAA,CACA,WAGF,gBAAkC,iBAChC,GACE,cAAA,CACA,iBAGF,GACE,cAAA,CACA,kBAIJ,SACE,iBAAA,CACA,eAAgB,2DAElB,mBACE,iBAAA,CACA,eAAgB,iEAElB,WACE,iBAAA,CACA,eAAgB,yDAElB,YACE,iBAAA,CACA,eAAgB,0DAGlB,OACE,iBAAA,CACA,eAAgB,2DAEhB,MAAC,cACC,eAAgB,2DAAhB,CACA,kBAEA,MAJD,aAIE,QACC,QAAS,iBAAT,CACA,UAAA,CACA,eAAA,CACA,iBAAA,CACA,QAAA,CACA,SAAA,CACA,UAAA,CACA,KAAA,CACA,aAAA,CACA,UAAA,CACA,YAAA,CACA,oBAAA,CACA,sBAAA,CACA,kBAAA,CACA,yBAGF,gBAAmC,uBAAwB,kBAA3D,MAtBD,cAuBG,iBAAA,CACA,qBAEA,MA1BH,aA0BI,QACC,UAAA,CACA,eAIJ,gBAAkC,iBAAlC,MAhCD,cAiCG,iBAAA,CACA,oBAAA,CACA,0BAEA,MArCH,aAqCI,QACC,aAAA,CACA,UAAA,CACA,WAAA,CACA,MAAA,CACA,SAKN,gBAAmC,uBAAwB,kBAA3D,OACE,iBAAA,CACA,sBAGF,gBAAkC,iBAAlC,OACE,iBAAA,CACA,oBAAA,CACA,2BAMH,UAAC,cAEA,eAAgB,2DAAhB,CACA,kBAEA,UALA,aAKC,QACA,QAAS,iBAAT,CACA,UAAA,CACA,eAAA,CACA,iBAAA,CACA,SAAA,CACA,SAAA,CACA,UAAA,CACA,KAAA,CACA,cAAA,CACA,UAAA,CACA,YAAA,CACA,oBAAA,CACA,sBAAA,CACA,kBAAA,CACA,yBAGD,gBAAmC,uBAAwB,kBAA3D,UAvBA,cAwBC,iBAAA,CACA,qBAEA,UA3BD,aA2BE,QACA,UAAA,CACA,aAAA,CACA,UAIF,gBAAkC,iBAAlC,UAlCA,cAmCC,iBAAA,CACA,oBAAA,CACA,0BAEA,UAvCD,aAuCE,QACD,aAAA,CACA,UAAA,CACA,WAAA,CACA,MAAA,CACA,SAMH,OACE,iBAAA,CACA,eAAgB,0DAAhB,CACA,qBAEA,gBAAmC,uBAAwB,kBAA3D,OACE,iBAAA,CACA,sBAGF,gBAAkC,iBAAlC,OACE,iBAAA,CACA,oBAAA,CACA,2BAIJ,SACE,MAAO,aAGT,QACE,MAAO,WAGT,gBAAkC,iBAChC,oBACE,cAIJ,OACC,YAAA,CACA,0BAAA,CACC,mBAHF,MAKC,GACC,eAAA,CACE,cAAA,CACA,gBAAA,CACA,UAAA,CACF,mBAEA,gBAAmC,kBAAnC,MAPD,GAQE,cAAA,CACA,qBAID,gBAAmC,kBAAnC,OACE,mBADF,MAGE,GACE,cAAA,CACA,kBAKN,sBACC,gBAAA,CACA,0BAEA,gBAAkC,iBAAlC,sBACC,yBAAA,CACA,kBAGD,QAA2B,uBAAwB,kBAAnD,sBACC,yBAAA,CACA"}

View File

@ -48,7 +48,7 @@ body {
.container {
padding-top: 80px;
padding-bottom: 80px;
padding-bottom: 0;
width: 100%;
max-width: 1310px;
margin: auto;
@ -76,7 +76,7 @@ body {
@media all and (max-width: 1600px) and (min-width: 1280px) {
padding-top: 40px;
padding-bottom: 40px;
padding-bottom: 0;
}
@media all and (max-width: 1279px) {
@ -85,7 +85,7 @@ body {
@media all and (max-width: 960px) {
padding-top: 30px;
padding-bottom: 30px;
padding-bottom: 0;
}
@media all and (max-width: 1420px) {
@ -149,18 +149,35 @@ body {
&.about {
aside {
width: 305px;
width: 255px;
border-right: 1px solid var(--inactive);
padding-bottom: 80px;
@media all and (max-width: 1600px) and (min-width: 1280px) {
width: 265px;
width: 255px;
padding-bottom: 40px;
}
@media all and (max-width: 960px) {
padding-bottom: 30px;
}
}
article {
width: calc(100% - 335px);
width: calc(100% - 285px);
padding-bottom: 80px;
&.full {
width: 100%;
}
@media all and (max-width: 1600px) and (min-width: 1280px) {
width: calc(100% - 295px);
padding-bottom: 40px;
}
@media all and (max-width: 960px) {
padding-bottom: 30px;
}
}
@ -171,6 +188,8 @@ body {
width: 100%;
}
}
}
}
@ -516,4 +535,4 @@ div {
font-size: 12px !important;
line-height: 20px;
}
}
}

245
pages/appeal/events.js Normal file
View File

@ -0,0 +1,245 @@
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 moment from "moment";
import { SpinnerCircular } from "spinners-react";
import { reduxWrapper } from "../../store";
import Header from "../components/Header";
import Footer from "../components/Footer";
import Company from "../components/Company";
import InnerMenu from "../components/Appeals/InnerMenu";
import {
getContractInfo,
getContractAgreement,
getContractRules,
getFile,
} from "../../actions";
class ContractPage extends React.Component {
constructor(props) {
super(props);
this.state = {
date: null,
car: null,
contract_date: null,
agreement: null,
rules: null,
loading: false,
};
}
static getDerivedStateFromProps(nextProps, prevState) {
return {
date: nextProps.date,
car: nextProps.car,
contract_date: nextProps.contract_date,
agreement: nextProps.agreement,
rules: nextProps.rules,
};
}
componentDidMount() {}
render() {
const { loading, date, car, contract_date, agreement, rules } = this.state;
const { number } = this.props;
console.log("rules", rules);
const types = {
contracts: "Договор",
redemptions: "Выкупные документы",
agreements: "Дополнительное соглашение",
assignments: "Договор цессии",
};
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" style={{ flexDirection: "column" }}>
<h1 className="section_title">Договор {number}</h1>
<h5 style={{ fontSize: "14px" }}>
{date !== undefined && date !== null && date !== null && (
<> от {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 номера"
}`
: ""}
</h5>
</div>
<Company />
</div>
<div className="aside_container about">
<InnerMenu number={number} {...this.props} />
<article>
<div className="appeal_list">
<div className="appeal_item">
<div className="item_header">
<p>
Номер обращения: <b>123 от 13.04.2022</b>
</p>
<p>
Отвественный ОРК: <b>Иванов И.И.</b>
</p>
<p>
Договор: <b>2021_1655, 2021_1655</b>
</p>
<div className="status">Активное</div>
</div>
<div className="item_body">
<div className="item_text">
<p>
<b>Тема запроса</b>
</p>
<p>
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент
</p>
</div>
<div className="item_text">
<p>
<b>Текст ответа ОРК</b>
</p>
<p>
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент
</p>
</div>
</div>
</div>
<div className="appeal_item">
<div className="item_header">
<p>
Номер обращения: <b>123 от 13.04.2022</b>
</p>
<p>
Отвественный ОРК: <b>Иванов И.И.</b>
</p>
<p>
Договор: <b>2021_1655, 2021_1655</b>
</p>
</div>
<div className="item_body">
<div className="item_text">
<p>
<b>Тема запроса</b>
</p>
<p>
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент
</p>
</div>
<div className="item_text">
<p>
<b>Текст ответа ОРК</b>
</p>
<p>
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент Текстовый контент
Текстовый контент Текстовый контент Текстовый
контент Текстовый контент
</p>
<div className="dosc_list medium-icon">
<div className="row">
<p className="doc_name i-pdf extension">
2021_1655 от 20.04.2021
<span>2021_1655 от 20.04.2021</span>
</p>
</div>
<div className="row">
<p className="doc_name i-pdf extension">
2021_1655 от 20.04.2021
<span>2021_1655 от 20.04.2021</span>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</article>
</div>
</div>
</section>
</main>
<Footer />
</React.Fragment>
);
}
}
function mapStateToProps(state, ownProps) {
return {
contract_date: state.contract.date,
date: state.contract.date,
car: state.contract.car,
agreement: state.contract.agreement,
rules: state.contract.rules,
};
}
export const getServerSideProps = reduxWrapper.getServerSideProps(
(store) =>
async ({ req, res, query }) => {
return {
props: {
//number: query.number,
number: null,
},
};
}
);
export default withRouter(connect(mapStateToProps)(ContractPage));

258
pages/appeal/index.js Normal file
View File

@ -0,0 +1,258 @@
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 moment from "moment";
import { SpinnerCircular } from "spinners-react";
import { reduxWrapper } from "../../store";
import Header from "../components/Header";
import Footer from "../components/Footer";
import Company from "../components/Company";
import InnerMenu from "../components/Appeals/InnerMenu";
import {
getContractInfo,
getContractAgreement,
getContractRules,
getFile,
} from "../../actions";
class ContractPage extends React.Component {
constructor(props) {
super(props);
this.state = {
date: null,
car: null,
contract_date: null,
agreement: null,
rules: null,
loading: false,
search: "",
};
}
static getDerivedStateFromProps(nextProps, prevState) {
return {
date: nextProps.date,
car: nextProps.car,
contract_date: nextProps.contract_date,
agreement: nextProps.agreement,
rules: nextProps.rules,
};
}
componentDidMount() {
if (!this.state.loading && this.props.number !== undefined) {
this.setState({ loading: true }, () => {
getContractInfo({
dispatch: this.props.dispatch,
number: this.props.number,
})
.then((info) => {
console.log("info", info);
getContractRules({
dispatch: this.props.dispatch,
date: moment(info.date, "YYYY-MM-DD").format("DD.MM.YYYY"),
})
.then(() => {})
.catch(() => {});
})
.catch(() => {});
getContractAgreement({
dispatch: this.props.dispatch,
number: this.props.number,
})
.then(() => {
this.setState({ loading: false });
})
.catch(() => {});
});
}
}
render() {
const { loading, date, car, contract_date, agreement, rules, search } =
this.state;
const { number } = this.props;
console.log("rules", rules);
const types = {
contracts: "Договор",
redemptions: "Выкупные документы",
agreements: "Дополнительное соглашение",
assignments: "Договор цессии",
};
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" style={{ flexDirection: "column" }}>
<h1 className="section_title">Обращение</h1>
<h5 style={{ fontSize: "14px" }}>
{date !== undefined && date !== null && date !== null && (
<> от {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 номера"
}`
: ""}
</h5>
</div>
<Company />
</div>
<div className="aside_container about">
<InnerMenu number={number} {...this.props} />
<article>
<div className="contract_search">
<form
onSubmit={(event) => {
event.preventDefault();
}}
>
<div className="form_field full">
<input
type="search"
value={search}
placeholder="Поиск"
onChange={(event) => {
this._handle_onChange_search(event.target.value);
}}
/>
</div>
<button
className="button"
disabled={search !== "" ? false : true}
onClick={this._handle_onSearch}
>
Поиск
</button>
</form>
</div>
<div className="list faq-list">
<div className="faq_item">
<p className="item_title">Изменение графика платежей</p>
<div className="dropdown_blocks_list">
<div className="dropdown_block">
<div className="block_header">
<p>
Как изменить график платежей по договору лизинга?
</p>
<button></button>
</div>
<div className="block_body">
<p>Lorem</p>
</div>
</div>
</div>
</div>
<div className="faq_item">
<p className="item_title">Переуступка прав</p>
<div className="dropdown_blocks_list">
<div className="dropdown_block">
<div className="block_header">
<p>Как получить консультацию по Цессии?</p>
<button></button>
</div>
<div className="block_body">
<p>Lorem</p>
</div>
</div>
<div className="dropdown_block">
<div className="block_header">
<p>
Оформление переуступки прав и обязательств по
договору лизинга
</p>
<button></button>
</div>
<div className="block_body">
<p>Lorem</p>
</div>
</div>
</div>
</div>
<div className="faq_item">
<p className="item_title">
Досрочное прекращение срока действия договора лизинга
</p>
<div className="dropdown_blocks_list">
<div className="dropdown_block">
<div className="block_header">
<p>
Процедура досрочного прекращения срока действия
договора лизинга
</p>
<button></button>
</div>
<div className="block_body">
<p>Lorem</p>
</div>
</div>
</div>
</div>
</div>
</article>
</div>
</div>
</section>
</main>
<Footer />
</React.Fragment>
);
}
}
function mapStateToProps(state, ownProps) {
return {
contract_date: state.contract.date,
date: state.contract.date,
car: state.contract.car,
agreement: state.contract.agreement,
rules: state.contract.rules,
};
}
export const getServerSideProps = reduxWrapper.getServerSideProps(
(store) =>
async ({ req, res, query }) => {
return {
props: {
//number: query.number,
number: null,
},
};
}
);
export default withRouter(connect(mapStateToProps)(ContractPage));

220
pages/appeal/new.js Normal file
View File

@ -0,0 +1,220 @@
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 moment from "moment";
import { SpinnerCircular } from "spinners-react";
import { reduxWrapper } from "../../store";
import Header from "../components/Header";
import Footer from "../components/Footer";
import Company from "../components/Company";
import InnerMenu from "../components/Appeals/InnerMenu";
import {
getContractInfo,
getContractAgreement,
getContractRules,
getFile,
} from "../../actions";
class ContractPage extends React.Component {
constructor(props) {
super(props);
this.state = {
date: null,
car: null,
contract_date: null,
agreement: null,
rules: null,
loading: false,
};
}
static getDerivedStateFromProps(nextProps, prevState) {
return {
date: nextProps.date,
car: nextProps.car,
contract_date: nextProps.contract_date,
agreement: nextProps.agreement,
rules: nextProps.rules,
};
}
componentDidMount() {}
render() {
const { loading, date, car, contract_date, agreement, rules } = this.state;
const { number } = this.props;
console.log("rules", rules);
const types = {
contracts: "Договор",
redemptions: "Выкупные документы",
agreements: "Дополнительное соглашение",
assignments: "Договор цессии",
};
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" style={{ flexDirection: "column" }}>
<h1 className="section_title">Новое обращение</h1>
</div>
<Company />
</div>
<div className="aside_container about">
<article className="full">
<div className="new_appeal">
<div className="column">
<div className="dropdown_blocks_list appeal_list">
<div className="appeal_item dropdown_block">
<div className="block_header">
<p>
Процедура досрочного прекращения срока действия
договора лизинга
</p>
<button className="rotate"></button>
</div>
</div>
<div className="appeal_item dropdown_block">
<div className="block_header">
<p>
Как изменить график платежей по договору лизинга?
</p>
<button className="rotate"></button>
</div>
</div>
<div className="appeal_item dropdown_block">
<div className="block_header">
<p>Как получить консультацию по Цессии?</p>
<button className="rotate"></button>
</div>
</div>
<div className="appeal_item dropdown_block open">
<div className="block_header">
<p>
Оформление переуступки прав и обязательств по
договору лизинга
</p>
<button className="rotate"></button>
</div>
</div>
</div>
</div>
<div className="column">
<div className="column_text_block">
<p>
<b>Процедура</b>
</p>
<p>
К каждой теме свободное html поле для миниинструкции
(со ссылками на <a>формы документов</a> и{" "}
<a>документы</a>). Привязка к теме обращения в CRM
</p>
</div>
<div className="column_text_block">
<p>
<b>Документы</b>
</p>
<div className="dosc_list medium-icon">
<div className="row">
<p className="doc_name i-pdf extension">
2021_1655 от 20.04.2021
<span>2021_1655 от 20.04.2021</span>
</p>
</div>
<div className="row">
<p className="doc_name i-pdf extension">
2021_1655 от 20.04.2021
<span>2021_1655 от 20.04.2021</span>
</p>
</div>
</div>
</div>
<form>
<div className="form_field">
<select>
<option default selected disabled>
Выберите договоры
</option>
<option>Договор 1</option>
</select>
</div>
<div className="form_field">
<input
type="text"
name="name"
placeholder="Ваше ФИО"
/>
</div>
<div className="form_field">
<input type="tel" name="name" placeholder="Телефон" />
</div>
<div className="form_field">
<input type="email" name="name" placeholder="Email" />
</div>
<div className="form_field">
<textarea placeholder="Введите текст запроса"></textarea>
</div>
<div className="file_upload dropzone">
<div className="files"></div>
<div>
<p>Перенесите файлы на экран для быстрой загрузки или выберите файл с компьетра </p>
<label htmlFor="" className="button button-blue">Загрузить файл</label>
</div>
<input type="file" accept="" />
</div>
</form>
</div>
</div>
</article>
</div>
</div>
</section>
</main>
<Footer />
</React.Fragment>
);
}
}
function mapStateToProps(state, ownProps) {
return {
contract_date: state.contract.date,
date: state.contract.date,
car: state.contract.car,
agreement: state.contract.agreement,
rules: state.contract.rules,
};
}
export const getServerSideProps = reduxWrapper.getServerSideProps(
(store) =>
async ({ req, res, query }) => {
return {
props: {
//number: query.number,
number: null,
},
};
}
);
export default withRouter(connect(mapStateToProps)(ContractPage));

View File

@ -0,0 +1,56 @@
import React from "react";
import Link from "next/link";
export default class InnerMenu extends React.Component
{
constructor(props)
{
super(props);
this.menuRef = React.createRef();
}
componentDidMount()
{
let l = 0;
let m = 0;
const menu = ["events","faq"];
for(let i in menu)
{
if(this.props.router.asPath.indexOf(menu[i]) > -1)
{
m = i;
}
}
for(let i = 0; i < m; i++)
{
l = l + this.menuRef.current.children[i].getBoundingClientRect().width;
}
this.menuRef.current.scrollLeft = l - 50;
}
render()
{
const { number } = this.props;
return (
<aside>
<ul className="aside_nav" ref={ this.menuRef }>
<li>
<Link href={`/appeal/${ number }/faq`} shallow>
<a className={ this.props.router && this.props.router.asPath.indexOf("faq") > -1 ? "active" : "" }>FAQ</a>
</Link>
</li>
<li>
<Link href={`/appeal/${ number }/events`} shallow>
<a className={ this.props.router && this.props.router.asPath.indexOf("events") > -1 ? "active" : "" }>События по договору <span>3</span></a>
</Link>
</li>
</ul>
<button className="button button-blue">Новое обращение</button>
</aside>
)
}
}

173
pages/contract/fine.js Normal file
View File

@ -0,0 +1,173 @@
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 moment from "moment";
import { SpinnerCircular } from "spinners-react";
import Link from "next/link";
import { reduxWrapper } from "../../store";
import Header from "../components/Header";
import Footer from "../components/Footer";
import Company from "../components/Company";
import InnerMenu from "./components/InnerMenu";
import DateInput from "./../components/DatePicker";
import Feed from "./../components/Feed";
import FeedUsers from "./../components/Feed/users";
import {
getContractInfo,
getContractAgreement,
getContractRules,
getFile,
} from "../../actions";
class ContractPage extends React.Component {
constructor(props) {
super(props);
this.state = {
date: null,
car: null,
contract_date: null,
agreement: null,
rules: null,
loading: false,
};
}
static getDerivedStateFromProps(nextProps, prevState) {
return {
date: nextProps.date,
car: nextProps.car,
contract_date: nextProps.contract_date,
agreement: nextProps.agreement,
rules: nextProps.rules,
};
}
componentDidMount() {
if (!this.state.loading && this.props.number !== undefined) {
this.setState({ loading: true }, () => {
getContractInfo({
dispatch: this.props.dispatch,
number: this.props.number,
})
.then((info) => {
console.log("info", info);
getContractRules({
dispatch: this.props.dispatch,
date: moment(info.date, "YYYY-MM-DD").format("DD.MM.YYYY"),
})
.then(() => {})
.catch(() => {});
})
.catch(() => {});
getContractAgreement({
dispatch: this.props.dispatch,
number: this.props.number,
})
.then(() => {
this.setState({ loading: false });
})
.catch(() => {});
});
}
}
render() {
const { loading, date, car, contract_date, agreement, rules } = this.state;
const { number } = this.props;
console.log("rules", rules);
const types = {
contracts: "Договор",
redemptions: "Выкупные документы",
agreements: "Дополнительное соглашение",
assignments: "Договор цессии",
};
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" style={{ alignItems: "center", flexWrap: "wrap" }}>
<button className="back">Назад</button>
<h1 className="section_title">Расчет планируемых пени</h1>
</div>
</div>
<div className="aside_container about">
<article className="fine">
<div className="fine_block">
<div className="fine_col">
<p>
<span>Пени на дату</span>
10.04.2022
</p>
</div>
<div className="fine_col">
<p>
Февраль
<span>28,11 </span>
</p>
<p>
Февраль
<span>1520,20 </span>
</p>
<p>
Февраль
<span>28,11 </span>
</p>
<p>
<span>ИТОГО:</span>
<span>2322,46 </span>
</p>
</div>
</div>
</article>
</div>
</div>
</section>
</main>
<Footer />
</React.Fragment>
);
}
}
function mapStateToProps(state, ownProps) {
return {
contract_date: state.contract.date,
date: state.contract.date,
car: state.contract.car,
agreement: state.contract.agreement,
rules: state.contract.rules,
};
}
export const getServerSideProps = reduxWrapper.getServerSideProps(
(store) =>
async ({ req, res, query }) => {
return {
props: {
//number: query.number,
number: null,
},
};
}
);
export default withRouter(connect(mapStateToProps)(ContractPage));

View File

@ -0,0 +1,4 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5 9.5L2 6.5L5 3.5" stroke="#1C01A9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M14 12.5C14 10.9087 13.3679 9.38258 12.2426 8.25736C11.1174 7.13214 9.5913 6.5 8 6.5H2" stroke="#1C01A9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

After

Width:  |  Height:  |  Size: 395 B