update contract graphic change
This commit is contained in:
merelendor
parent
084699b05b
commit
ccec28d248
@ -473,7 +473,7 @@ export const getContractGraphicChangeOptions = ({ dispatch, number, variants })
|
||||
{
|
||||
console.log("ACTION", "getContractGraphicChangeOptions", "response.data", response.data);
|
||||
|
||||
dispatch({ type: actionTypes.CONTRACT_CHANGE, data: { options: response.data } });
|
||||
dispatch({ type: actionTypes.CONTRACT_CHANGE, data: { options: response.data.planpayments[0] } });
|
||||
resolve();
|
||||
})
|
||||
.catch((error) =>
|
||||
@ -485,22 +485,21 @@ export const getContractGraphicChangeOptions = ({ dispatch, number, variants })
|
||||
});
|
||||
}
|
||||
|
||||
export const getContractGraphicChangeCalculate = ({ dispatch, number, calculation }) =>
|
||||
export const getContractGraphicChangeCalculate = (calculation) =>
|
||||
{
|
||||
console.log("ACTION", "getContractGraphicChangeCurrent", { number });
|
||||
console.log("ACTION", "getContractGraphicChangeCurrent", calculation);
|
||||
|
||||
return new Promise((resolve, reject) =>
|
||||
{
|
||||
axios.post(`${ process.env.NEXT_PUBLIC_SELF_API_HOST }/api/contract/change/calculations`, { number },
|
||||
|
||||
axios.post(`${ process.env.NEXT_PUBLIC_SELF_API_HOST }/api/contract/change/graphic/calculate`, { calculation },
|
||||
{
|
||||
withCredentials: true,
|
||||
})
|
||||
.then(async (response) =>
|
||||
{
|
||||
console.log("ACTION", "getContractGraphicChangeCurrent", "response.data", response.data);
|
||||
|
||||
dispatch({ type: actionTypes.CONTRACT_CHANGE, data: { calculations: response.data.pre_calculations } });
|
||||
resolve();
|
||||
resolve(response.data);
|
||||
})
|
||||
.catch((error) =>
|
||||
{
|
||||
|
||||
@ -33,12 +33,11 @@ export const getEvents = ({ dispatch, type, contract }) =>
|
||||
})
|
||||
.then((response) =>
|
||||
{
|
||||
console.log("getEvents", "response", response.data);
|
||||
console.log("ACTION", "getEvents()", "response", response.data);
|
||||
const events = response.data;
|
||||
const filtered_events = [];
|
||||
|
||||
console.log("events");
|
||||
console.log(events);
|
||||
console.log("ACTION", "getEvents()", "events", events);
|
||||
|
||||
dispatch({ type: actionTypes.EVENTS, data: { list: events, loaded: true } });
|
||||
resolve();
|
||||
|
||||
@ -7,7 +7,7 @@ import jwt from 'jsonwebtoken';
|
||||
import { cors } from '../cors';
|
||||
import { inspect } from 'util';
|
||||
|
||||
export default async function CRMRequest(req, res, path, params)
|
||||
export default async function CRMRequestGet(req, res, path, params)
|
||||
{
|
||||
await cors(req, res);
|
||||
|
||||
@ -16,7 +16,7 @@ export default async function CRMRequest(req, res, path, params)
|
||||
const cookies = cookie.parse(req.headers?.cookie ? req.headers?.cookie : "");
|
||||
|
||||
console.log("-".repeat(50));
|
||||
console.log("CRMRequest", "req.body");
|
||||
console.log("CRMRequestGet", "req.body");
|
||||
console.log(req.body);
|
||||
|
||||
if(cookies.jwt !== undefined && cookies.jwt !== null)
|
||||
@ -25,7 +25,7 @@ export default async function CRMRequest(req, res, path, params)
|
||||
console.log(cookies.jwt);
|
||||
|
||||
var client_jwt_decoded = jwt.verify(cookies.jwt, process.env.JWT_SECRET_CLIENT);
|
||||
var crm_jwt = jwt.sign(client_jwt_decoded, process.env.JWT_SECRET_CRM, { noTimestamp: true });
|
||||
var crm_jwt = jwt.sign({ acc_number: client_jwt_decoded.acc_number }, process.env.JWT_SECRET_CRM, { noTimestamp: true });
|
||||
|
||||
console.log("client_jwt_decoded", client_jwt_decoded);
|
||||
console.log("crm_jwt", crm_jwt);
|
||||
@ -36,7 +36,7 @@ export default async function CRMRequest(req, res, path, params)
|
||||
try
|
||||
{
|
||||
await axios.get(path, {
|
||||
params: { ...client_jwt_decoded, ...params },
|
||||
params: { ...{ acc_number: client_jwt_decoded.acc_number }, ...params },
|
||||
headers: {
|
||||
"Authorization": `Bearer ${ crm_jwt }`,
|
||||
},
|
||||
68
lib/CRMRequestPost/index.js
Normal file
68
lib/CRMRequestPost/index.js
Normal file
@ -0,0 +1,68 @@
|
||||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import axios from 'axios';
|
||||
import { Cookies } from 'react-cookie';
|
||||
import cookie from 'cookie';
|
||||
import moment from 'moment';
|
||||
import jwt from 'jsonwebtoken';
|
||||
import { cors } from '../cors';
|
||||
import { inspect } from 'util';
|
||||
|
||||
export default async function CRMRequestPost(req, res, path, params)
|
||||
{
|
||||
await cors(req, res);
|
||||
|
||||
if(req.headers.cookie !== undefined)
|
||||
{
|
||||
const cookies = cookie.parse(req.headers?.cookie ? req.headers?.cookie : "");
|
||||
|
||||
console.log("-".repeat(50));
|
||||
console.log("CRMRequestPost", "req.body");
|
||||
console.log(req.body);
|
||||
|
||||
if(cookies.jwt !== undefined && cookies.jwt !== null)
|
||||
{
|
||||
console.log("cookies.jwt");
|
||||
console.log(cookies.jwt);
|
||||
|
||||
var client_jwt_decoded = jwt.verify(cookies.jwt, process.env.JWT_SECRET_CLIENT);
|
||||
var crm_jwt = jwt.sign({ acc_number: client_jwt_decoded.acc_number }, process.env.JWT_SECRET_CRM, { noTimestamp: true });
|
||||
|
||||
const payload = { ...{ acc_number: client_jwt_decoded.acc_number }, ...params };
|
||||
console.log("path", path);
|
||||
console.log("payload", payload);
|
||||
|
||||
try
|
||||
{
|
||||
await axios.post(path, payload,
|
||||
{
|
||||
headers: {
|
||||
//"Content-Type": "application/json",
|
||||
"Authorization": `Bearer ${ crm_jwt }`,
|
||||
},
|
||||
withCredentials: true,
|
||||
})
|
||||
.then((crm_response) =>
|
||||
{
|
||||
console.log("crm_response for", path);
|
||||
console.log(inspect(crm_response.data, true, null, true));
|
||||
|
||||
res.status(200).json(crm_response.data);
|
||||
})
|
||||
.catch((error) =>
|
||||
{
|
||||
console.error(error);
|
||||
res.status(500);
|
||||
});
|
||||
}
|
||||
catch(e)
|
||||
{
|
||||
console.error(e);
|
||||
res.status(500);
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
res.status(403);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,7 +1,7 @@
|
||||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import CRMRequest from '../../../../lib/CRMRequest';
|
||||
import CRMRequestGet from '../../../../lib/CRMRequestGet';
|
||||
|
||||
export default async function handler(req, res)
|
||||
{
|
||||
await CRMRequest(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetPreCalculations`, { contract_number: req.body.number });
|
||||
await CRMRequestGet(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetPreCalculations`, { contract_number: req.body.number });
|
||||
}
|
||||
@ -1,7 +1,9 @@
|
||||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import CRMRequest from '../../../../../lib/CRMRequest';
|
||||
import CRMRequestPost from '../../../../../lib/CRMRequestPost';
|
||||
|
||||
export default async function handler(req, res)
|
||||
{
|
||||
await CRMRequest(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/CreateCalculation`, { contract_number: req.body.number });
|
||||
console.log("WTF BODY");
|
||||
console.log(req.body);
|
||||
await CRMRequestPost(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/CreateCalculation`, req.body.calculation);
|
||||
}
|
||||
@ -1,7 +1,7 @@
|
||||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import CRMRequest from '../../../../../lib/CRMRequest';
|
||||
import CRMRequestGet from '../../../../../lib/CRMRequestGet';
|
||||
|
||||
export default async function handler(req, res)
|
||||
{
|
||||
await CRMRequest(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetPreCalculationGraph`, { addcontract_number: req.body.calculation });
|
||||
await CRMRequestGet(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetPreCalculationGraph`, { addcontract_number: req.body.calculation });
|
||||
}
|
||||
@ -1,7 +1,7 @@
|
||||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import CRMRequest from '../../../../../lib/CRMRequest';
|
||||
import CRMRequestGet from '../../../../../lib/CRMRequestGet';
|
||||
|
||||
export default async function handler(req, res)
|
||||
{
|
||||
await CRMRequest(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetCurrentGraph`, { contract_number: req.body.number });
|
||||
await CRMRequestGet(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetCurrentGraph`, { contract_number: req.body.number });
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import CRMRequest from '../../../../lib/CRMRequest';
|
||||
import CRMRequestGet from '../../../../lib/CRMRequestGet';
|
||||
|
||||
export default async function handler(req, res)
|
||||
{
|
||||
@ -8,5 +8,5 @@ export default async function handler(req, res)
|
||||
console.log(req.body.variants);
|
||||
console.log("-".repeat(50));
|
||||
|
||||
await CRMRequest(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetTypeOptions`, { ...{ contract_number: req.body.number }, ...req.body.variants });
|
||||
await CRMRequestGet(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetTypeOptions`, { ...{ contract_number: req.body.number }, ...req.body.variants });
|
||||
}
|
||||
@ -1,7 +1,7 @@
|
||||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import CRMRequest from '../../../../lib/CRMRequest';
|
||||
import CRMRequestGet from '../../../../lib/CRMRequestGet';
|
||||
|
||||
export default async function handler(req, res)
|
||||
{
|
||||
await CRMRequest(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetSignatories`, {});
|
||||
await CRMRequestGet(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetSignatories`, {});
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import CRMRequest from '../../../../lib/CRMRequest';
|
||||
import CRMRequestGet from '../../../../lib/CRMRequestGet';
|
||||
|
||||
export default async function handler(req, res)
|
||||
{
|
||||
@ -7,5 +7,5 @@ export default async function handler(req, res)
|
||||
console.log(req.body.variants);
|
||||
console.log("-".repeat(50));
|
||||
|
||||
await CRMRequest(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetAvaliableGraphChangeTypes`, { ...{ contract_number: req.body.number }, ...req.body.variants });
|
||||
await CRMRequestGet(req, res, `${ process.env.CRM_API_HOST }/lk/add-contract/GetAvaliableGraphChangeTypes`, { ...{ contract_number: req.body.number }, ...req.body.variants });
|
||||
}
|
||||
@ -42,7 +42,7 @@ class Company extends React.Component
|
||||
|
||||
return (
|
||||
<div className="right company-dropdown" onClick={ this._handleOnClick }>
|
||||
<p align="right" className={ companies !== null && companies.length > 1 && "arrow" }>{/* className="arrow" */}
|
||||
<p align="right" className={ companies !== null && companies.length > 1 ? "arrow" : "" }>{/* className="arrow" */}
|
||||
<b>{ company.title }</b><br/>
|
||||
{company.inn != null && <span>ИНН: { company.inn } </span>}
|
||||
{company.kpp != null && <span>КПП: { company.kpp }</span>}
|
||||
|
||||
@ -15,7 +15,7 @@ export default class NotificationsList extends React.Component
|
||||
render()
|
||||
{
|
||||
const { events } = this.props;
|
||||
console.log("events", events);
|
||||
console.log("NotificationsList", "events", events);
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
@ -143,7 +143,7 @@ class Header extends React.Component
|
||||
render()
|
||||
{
|
||||
const { observer, menuOpened, notificationsOpened, messagesOpened, events, events_loaded, appeals } = this.state;
|
||||
console.log("events", events);
|
||||
console.log("Header", "events", events);
|
||||
|
||||
return (
|
||||
<header>
|
||||
|
||||
@ -1,19 +1,480 @@
|
||||
import React from "react";
|
||||
import { getContractGraphicChangeOptions } from "../../../../../actions";
|
||||
import { SpinnerCircular } from "spinners-react";
|
||||
import moment from "moment";
|
||||
import pluralize from 'pluralize-ru';
|
||||
import numeral from "numeral";
|
||||
|
||||
import DateInput from "../../../../components/DatePicker";
|
||||
|
||||
import { getContractGraphicChangeOptions, getContractGraphicChangeCalculate } from "../../../../../actions";
|
||||
|
||||
class PaymentDate extends React.Component
|
||||
{
|
||||
constructor(props)
|
||||
{
|
||||
super(props);
|
||||
this.state = {
|
||||
value: null,
|
||||
min: null,
|
||||
max: null,
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount()
|
||||
{
|
||||
const { option, onOption } = this.props;
|
||||
|
||||
this.setState({
|
||||
value: moment(option.value).toDate(),
|
||||
min: moment(option.from).toDate(),
|
||||
max: moment(option.to).toDate(),
|
||||
}, () =>
|
||||
{
|
||||
onOption(this.state.value);
|
||||
});
|
||||
}
|
||||
|
||||
_handle_onChange = (value) =>
|
||||
{
|
||||
const { onOption } = this.props;
|
||||
|
||||
this.setState({ value }, () =>
|
||||
{
|
||||
onOption(value);
|
||||
});
|
||||
}
|
||||
|
||||
render()
|
||||
{
|
||||
const { value, min, max } = this.state;
|
||||
|
||||
return (
|
||||
<div className="form_field">
|
||||
<label>Дата платежа</label>
|
||||
<DateInput
|
||||
placeholder=""
|
||||
value={ value }
|
||||
min={ min }
|
||||
max={ max }
|
||||
id={"date_to"}
|
||||
onChange={ this._handle_onChange }
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class FixLastPayment extends React.Component
|
||||
{
|
||||
constructor(props)
|
||||
{
|
||||
super(props);
|
||||
this.state = {
|
||||
value: false,
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount()
|
||||
{
|
||||
const { option, onOption } = this.props;
|
||||
|
||||
this.setState({
|
||||
value: option.value,
|
||||
}, () =>
|
||||
{
|
||||
onOption(this.state.value);
|
||||
});
|
||||
}
|
||||
|
||||
_handle_onChange = () =>
|
||||
{
|
||||
const { onOption } = this.props;
|
||||
|
||||
this.setState({ value: this.state.value ? false : true }, () =>
|
||||
{
|
||||
onOption(this.state.value);
|
||||
});
|
||||
}
|
||||
|
||||
render()
|
||||
{
|
||||
const { value } = this.state;
|
||||
|
||||
return (
|
||||
<div className="form_field">
|
||||
<input type="checkbox" hidden id="fix_pay" name="fix_pay" checked={ value } onChange={ this._handle_onChange }/>
|
||||
<label htmlFor="fix_pay">
|
||||
Фиксировать послединий платеж
|
||||
</label>
|
||||
<div className="help_tooltip">
|
||||
<div className="help_icon">
|
||||
<svg width={ 24 } height={ 24 } fill="none" xmlns="http://www.w3.org/2000/svg" >
|
||||
<path d="M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18Z" stroke="#8E94A7" strokeWidth={ 2 } strokeLinecap="round" strokeLinejoin="round" />
|
||||
<path d="M11.25 11.25H12v5.25h.75" stroke="#8E94A7" strokeWidth={ 2 } strokeLinecap="round" strokeLinejoin="round" />
|
||||
<path d="M12 9a1.125 1.125 0 1 0 0-2.25A1.125 1.125 0 0 0 12 9Z" fill="#8E94A7" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className="help_content ">
|
||||
{" "}
|
||||
{/* opened */}
|
||||
<div>
|
||||
<p>Какой-то описательный текст</p>
|
||||
<p className="button">Закрыть</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class DateOffestType extends React.Component
|
||||
{
|
||||
constructor(props)
|
||||
{
|
||||
super(props);
|
||||
this.state = {
|
||||
value: null,
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount()
|
||||
{
|
||||
const { option, onOption } = this.props;
|
||||
|
||||
this.setState({
|
||||
value: parseInt(option.value, 10),
|
||||
}, () =>
|
||||
{
|
||||
onOption(this.state.value);
|
||||
});
|
||||
}
|
||||
|
||||
_handle_onChange = (value) =>
|
||||
{
|
||||
const { onOption } = this.props;
|
||||
|
||||
this.setState({ value: parseInt(value, 10) }, () =>
|
||||
{
|
||||
onOption(this.state.value);
|
||||
});
|
||||
}
|
||||
|
||||
render()
|
||||
{
|
||||
const { value } = this.state;
|
||||
|
||||
return (
|
||||
<div className="form_field">
|
||||
<label>Тип каникул</label>
|
||||
<div className="form_field">
|
||||
<input type="radio" hidden id="weeekend_type_1" name="weeekend_type" checked={ value === 100000001 ? true : false } onChange={ () => this._handle_onChange(100000001) }/>
|
||||
<label htmlFor="weeekend_type_1">С увеличением срока</label>
|
||||
</div>
|
||||
<div className="form_field">
|
||||
<input type="radio" hidden id="weeekend_type_2" name="weeekend_type" checked={ value === 100000000 ? true : false } onChange={ () => this._handle_onChange(100000000) }/>
|
||||
<label htmlFor="weeekend_type_2">Без изменения срока</label>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class PeriodSelector extends React.Component
|
||||
{
|
||||
constructor(props)
|
||||
{
|
||||
super(props);
|
||||
this.state = {
|
||||
value: null,
|
||||
periods: [],
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount()
|
||||
{
|
||||
const { option, onOption } = this.props;
|
||||
const periods = [];
|
||||
|
||||
if(option.min !== undefined && option.min !== null)
|
||||
{
|
||||
for(let i = parseInt(option.min, 10); i <= parseInt(option.max, 10); i++)
|
||||
{
|
||||
periods.push(i);
|
||||
}
|
||||
|
||||
this.setState({
|
||||
value: periods[0], periods
|
||||
}, () =>
|
||||
{
|
||||
onOption(this.state.value);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
_handle_onChange = (event) =>
|
||||
{
|
||||
const { onOption } = this.props;
|
||||
|
||||
this.setState({ value: parseInt(event.target.value, 10) }, () =>
|
||||
{
|
||||
onOption(this.state.value);
|
||||
});
|
||||
}
|
||||
|
||||
render()
|
||||
{
|
||||
const { value, periods } = this.state;
|
||||
|
||||
if(value !== null)
|
||||
{
|
||||
return (
|
||||
<div className="form_field">
|
||||
<label>Увеличить график на</label>
|
||||
<select value={ value } onChange={ this._handle_onChange }>
|
||||
{ periods.map((period, index) => (
|
||||
<option key={ index } value={ period }>{ index + 1 } { pluralize( index + 1, 'месяца', 'месяц', 'месяца', 'месяцев') } ({ period } { pluralize( period, 'платежа', 'платеж', 'платежа', 'платежей') })</option>
|
||||
)) }
|
||||
</select>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
class SumSelector extends React.Component
|
||||
{
|
||||
constructor(props)
|
||||
{
|
||||
super(props);
|
||||
this.state = {
|
||||
value: "",
|
||||
min: null,
|
||||
max: null,
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount()
|
||||
{
|
||||
const { option, onOption } = this.props;
|
||||
|
||||
this.setState({
|
||||
value: option.min,
|
||||
min: option.min,
|
||||
max: option.max,
|
||||
}, () =>
|
||||
{
|
||||
onOption(this.state.value, false);
|
||||
});
|
||||
}
|
||||
|
||||
_handle_onChange = (event) =>
|
||||
{
|
||||
const { onOption } = this.props;
|
||||
const { min, max } = this.state;
|
||||
|
||||
const value = parseFloat(event.target.value.replace('/[^\d]/m', ''));
|
||||
if(value >= min && value <= max && !isNaN(value))
|
||||
{
|
||||
this.setState({ value: value }, () =>
|
||||
{
|
||||
onOption(this.state.value, false);
|
||||
});
|
||||
}
|
||||
else
|
||||
{
|
||||
onOption(this.state.value, true);
|
||||
}
|
||||
}
|
||||
|
||||
render()
|
||||
{
|
||||
const { value, min, max } = this.state;
|
||||
|
||||
return (
|
||||
<div className="form_field">
|
||||
<label>Увеличить платеж на (ЧДП)</label>
|
||||
<input type="number" placeholder="Укажите сумму" defaultValue={ value } onChange={ this._handle_onChange }/>
|
||||
<div style={{ position: "absolute", left: 214, top: 46, fontSize: 12 }}>от { numeral(min).format(' ., ') } ₽</div>
|
||||
<div style={{ position: "absolute", left: 440, top: 46, fontSize: 12 }}>до { numeral(max).format(' ., ') } ₽</div>
|
||||
<div className="help_tooltip">
|
||||
<div className="help_icon">
|
||||
<svg width={ 24 } height={ 24 } fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18Z" stroke="#8E94A7" strokeWidth={ 2 } strokeLinecap="round" strokeLinejoin="round" />
|
||||
<path d="M11.25 11.25H12v5.25h.75" stroke="#8E94A7" strokeWidth={ 2 } strokeLinecap="round" strokeLinejoin="round" />
|
||||
<path d="M12 9a1.125 1.125 0 1 0 0-2.25A1.125 1.125 0 0 0 12 9Z" fill="#8E94A7" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className="help_content ">
|
||||
{" "}
|
||||
{/* opened */}
|
||||
<div>
|
||||
<p>Какой-то описательный текст</p>
|
||||
<p className="button">Закрыть</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class InsurancePriceSelector extends React.Component
|
||||
{
|
||||
constructor(props)
|
||||
{
|
||||
super(props);
|
||||
this.state = {
|
||||
value: "",
|
||||
min: null,
|
||||
max: null,
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount()
|
||||
{
|
||||
const { option, onOption } = this.props;
|
||||
|
||||
this.setState({
|
||||
value: option.min,
|
||||
min: option.min,
|
||||
max: option.max,
|
||||
}, () =>
|
||||
{
|
||||
onOption(this.state.value, false);
|
||||
});
|
||||
}
|
||||
|
||||
_handle_onChange = (event) =>
|
||||
{
|
||||
const { onOption } = this.props;
|
||||
const { min, max } = this.state;
|
||||
|
||||
const value = parseFloat(event.target.value.replace('/[^\d]/m', ''));
|
||||
if(value >= min && value <= max && !isNaN(value))
|
||||
{
|
||||
this.setState({ value: value }, () =>
|
||||
{
|
||||
onOption(this.state.value, false);
|
||||
});
|
||||
}
|
||||
else
|
||||
{
|
||||
onOption(this.state.value, true);
|
||||
}
|
||||
}
|
||||
|
||||
render()
|
||||
{
|
||||
const { value, min, max } = this.state;
|
||||
|
||||
return (
|
||||
<div className="form_field">
|
||||
<label>Сумма пролонгации</label>
|
||||
<input type="number" placeholder="Укажите сумму" defaultValue={ value } onChange={ this._handle_onChange }/>
|
||||
<div style={{ position: "absolute", left: 214, top: 46, fontSize: 12 }}>от { numeral(min).format(' ., ') } ₽</div>
|
||||
<div style={{ position: "absolute", left: 440, top: 46, fontSize: 12 }}>до { numeral(max).format(' ., ') } ₽</div>
|
||||
<div className="help_tooltip">
|
||||
<div className="help_icon">
|
||||
<svg width={ 24 } height={ 24 } fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18Z" stroke="#8E94A7" strokeWidth={ 2 } strokeLinecap="round" strokeLinejoin="round" />
|
||||
<path d="M11.25 11.25H12v5.25h.75" stroke="#8E94A7" strokeWidth={ 2 } strokeLinecap="round" strokeLinejoin="round" />
|
||||
<path d="M12 9a1.125 1.125 0 1 0 0-2.25A1.125 1.125 0 0 0 12 9Z" fill="#8E94A7" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className="help_content ">
|
||||
{" "}
|
||||
{/* opened */}
|
||||
<div>
|
||||
<p>Какой-то описательный текст</p>
|
||||
<p className="button">Закрыть</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class InsuranceDateFromSelector extends React.Component
|
||||
{
|
||||
constructor(props)
|
||||
{
|
||||
super(props);
|
||||
this.state = {
|
||||
value: null,
|
||||
min: null,
|
||||
max: null,
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount()
|
||||
{
|
||||
const { option, onOption } = this.props;
|
||||
|
||||
this.setState({
|
||||
value: moment(option.value !== null ? option.value : option.from).toDate(),
|
||||
min: moment(option.from).toDate(),
|
||||
max: moment(option.to).toDate(),
|
||||
}, () =>
|
||||
{
|
||||
onOption(this.state.value);
|
||||
});
|
||||
}
|
||||
|
||||
_handle_onChange = (value) =>
|
||||
{
|
||||
const { onOption } = this.props;
|
||||
|
||||
this.setState({ value }, () =>
|
||||
{
|
||||
onOption(value);
|
||||
});
|
||||
}
|
||||
|
||||
render()
|
||||
{
|
||||
const { value, min, max } = this.state;
|
||||
|
||||
return (
|
||||
<div className="form_field">
|
||||
<label>Дата начала пролонгации</label>
|
||||
<DateInput
|
||||
placeholder=""
|
||||
value={ value }
|
||||
min={ min }
|
||||
max={ max }
|
||||
id={"date_to"}
|
||||
onChange={ this._handle_onChange }
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default class Options extends React.Component
|
||||
{
|
||||
constructor(props)
|
||||
{
|
||||
super(props);
|
||||
this.state = {
|
||||
loading: true,
|
||||
sending: false,
|
||||
date: null,
|
||||
car: null,
|
||||
contract_date: null,
|
||||
agreement: null,
|
||||
rules: null,
|
||||
loading: true,
|
||||
number_paydate: null,
|
||||
period_new: null,
|
||||
fix_last_payment_available: false,
|
||||
date_offset_type: null,
|
||||
sum: null,
|
||||
insurance_price_result: null,
|
||||
datefrom: null,
|
||||
errors: {},
|
||||
};
|
||||
}
|
||||
|
||||
@ -30,12 +491,10 @@ export default class Options extends React.Component
|
||||
}
|
||||
}
|
||||
|
||||
console.log("varianst_for_options", varianst_for_options);
|
||||
|
||||
getContractGraphicChangeOptions({ dispatch, number, variants: varianst_for_options })
|
||||
.then(() =>
|
||||
{
|
||||
|
||||
this.setState({ loading: false });
|
||||
})
|
||||
.catch(() =>
|
||||
{
|
||||
@ -51,95 +510,163 @@ export default class Options extends React.Component
|
||||
|
||||
_handle_onCalculate = (event) =>
|
||||
{
|
||||
const { sending, number_paydate, period_new, fix_last_payment_available, date_offset_type, sum, insurance_price_result, datefrom, } = this.state;
|
||||
const { number, options, variants, onCalculate } = this.props;
|
||||
|
||||
event.preventDefault();
|
||||
this.props.onCalculate();
|
||||
console.log(this.props);
|
||||
|
||||
if(!sending)
|
||||
{
|
||||
const v = {};
|
||||
for(let i in variants.types) { v[ variants.types[i].name ] = variants.types[i].value; }
|
||||
const payload = {
|
||||
...{ contract_number: number },
|
||||
...v,
|
||||
...{
|
||||
number_paydate: number_paydate !== null ? moment(number_paydate).format() : null,
|
||||
period_new,
|
||||
fix_last_payment_available,
|
||||
date_offset_type,
|
||||
sum: sum === null ? 0 : sum,
|
||||
insurance_price_result: insurance_price_result === null ? 0 : insurance_price_result,
|
||||
datefrom: datefrom !== null ? moment(datefrom).format() : null,
|
||||
early_redemption_change: false,
|
||||
number_planpayment: options.number_planpayment.value,
|
||||
}
|
||||
};
|
||||
console.log(payload);
|
||||
|
||||
this.setState({ sending: true, }, () =>
|
||||
{
|
||||
getContractGraphicChangeCalculate(payload)
|
||||
.then((calculation) =>
|
||||
{
|
||||
console.log("calculationcalculationcalculationcalculationcalculation");
|
||||
console.log(calculation);
|
||||
|
||||
/*
|
||||
onCalculate()
|
||||
.then(() =>
|
||||
{
|
||||
|
||||
})
|
||||
.catch(() =>
|
||||
{
|
||||
this.setState({ sending: false, });
|
||||
});
|
||||
*/
|
||||
})
|
||||
.catch(() =>
|
||||
{
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
_handle_onPaymentDateChange = (date) =>
|
||||
{
|
||||
this.setState({ number_paydate: date });
|
||||
}
|
||||
|
||||
_handle_onFixLastPaymentChange = (value) =>
|
||||
{
|
||||
this.setState({ fix_last_payment_available: value });
|
||||
}
|
||||
|
||||
_handle_onDateOffsetTypeChange = (value) =>
|
||||
{
|
||||
this.setState({ date_offset_type: value });
|
||||
}
|
||||
|
||||
_handle_onPeriodChange = (value) =>
|
||||
{
|
||||
this.setState({ period_new: value });
|
||||
}
|
||||
|
||||
_handle_onSumChange = (value, error) =>
|
||||
{
|
||||
const { errors } = this.state;
|
||||
|
||||
if(error) { errors['sum'] = true; } else { delete errors['sum']; }
|
||||
|
||||
this.setState({ sum: value, errors });
|
||||
}
|
||||
|
||||
_handle_onInsurancePriceChange = (value, error) =>
|
||||
{
|
||||
const { errors } = this.state;
|
||||
|
||||
if(error) { errors['insurance_price_result'] = true; } else { delete errors['insurance_price_result']; }
|
||||
|
||||
this.setState({ insurance_price_result: value, errors });
|
||||
}
|
||||
|
||||
_handle_onInsuranceDateFromChange = (date) =>
|
||||
{
|
||||
this.setState({ datefrom: date });
|
||||
}
|
||||
|
||||
_checkAllowCalculate = () =>
|
||||
{
|
||||
const { errors } = this.state;
|
||||
|
||||
for(let i in errors)
|
||||
{
|
||||
if(errors[i])
|
||||
{
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
render()
|
||||
{
|
||||
const { loading, date, car, contract_date, agreement, rules } = this.state;
|
||||
const { variants } = this.props;
|
||||
|
||||
console.log("Change", "Options", "render()", "variants", variants);
|
||||
const { loading, sending, } = this.state;
|
||||
const { variants, options } = this.props;
|
||||
|
||||
return (
|
||||
<div className="block">
|
||||
<p className="title">Параметры опций изменений графика платежей</p>
|
||||
<form className="calc">
|
||||
<div className="form_field">
|
||||
<label>Дата платежа</label>
|
||||
<DateInput placeholder="" id={"date_to"} onChange={ (date) => this.setState({ date_to: date }) } />
|
||||
{ loading ? (
|
||||
<div style={{ position: "absolute", left: "50%", top: "50%" }}>
|
||||
<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" style={{ marginTop: "-45px", marginLeft: "-45px", }}/>
|
||||
</div>
|
||||
<div className="form_field">
|
||||
<input type="checkbox" hidden id="fix_pay" name="fix_pay" />
|
||||
<label htmlFor="fix_pay">
|
||||
Фиксировать послединий платеж
|
||||
</label>
|
||||
<div className="help_tooltip">
|
||||
<div className="help_icon">
|
||||
<svg width={ 24 } height={ 24 } fill="none" xmlns="http://www.w3.org/2000/svg" >
|
||||
<path d="M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18Z" stroke="#8E94A7" strokeWidth={ 2 } strokeLinecap="round" strokeLinejoin="round" />
|
||||
<path d="M11.25 11.25H12v5.25h.75" stroke="#8E94A7" strokeWidth={ 2 } strokeLinecap="round" strokeLinejoin="round" />
|
||||
<path d="M12 9a1.125 1.125 0 1 0 0-2.25A1.125 1.125 0 0 0 12 9Z" fill="#8E94A7" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className="help_content ">
|
||||
{" "}
|
||||
{/* opened */}
|
||||
<div>
|
||||
<p>Какой-то описательный текст</p>
|
||||
<p className="button">Закрыть</p>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<form className="calc">
|
||||
{ options !== undefined && options !== null && options.number_paydate !== undefined && options.number_paydate !== null && options.number_paydate.visible && (
|
||||
<PaymentDate option={ options.number_paydate } onOption={ this._handle_onPaymentDateChange } />
|
||||
) }
|
||||
{ options !== undefined && options !== null && options.fix_last_payment_available !== undefined && options.fix_last_payment_available !== null && options.fix_last_payment_available.visible && (
|
||||
<FixLastPayment option={ options.fix_last_payment_available } onOption={ this._handle_onFixLastPaymentChange } />
|
||||
) }
|
||||
{ options !== undefined && options !== null && options.date_offset_type !== undefined && options.date_offset_type !== null && options.date_offset_type.visible && (
|
||||
<DateOffestType option={ options.date_offset_type } onOption={ this._handle_onDateOffsetTypeChange } />
|
||||
) }
|
||||
{ options !== undefined && options !== null && options.period_new !== undefined && options.period_new !== null && options.period_new.visible && (
|
||||
<PeriodSelector option={ options.period_new } onOption={ this._handle_onPeriodChange } />
|
||||
) }
|
||||
{ options !== undefined && options !== null && options.sum !== undefined && options.sum !== null && options.sum.visible && (
|
||||
<SumSelector option={ options.sum } onOption={ this._handle_onSumChange } />
|
||||
) }
|
||||
{ options !== undefined && options !== null && options.insurance_price_result !== undefined && options.insurance_price_result !== null && options.insurance_price_result.visible && (
|
||||
<InsurancePriceSelector option={ options.insurance_price_result } onOption={ this._handle_onInsurancePriceChange } />
|
||||
) }
|
||||
{ options !== undefined && options !== null && options.datefrom !== undefined && options.datefrom !== null && options.datefrom.visible && (
|
||||
<InsuranceDateFromSelector option={ options.datefrom } onOption={ this._handle_onInsuranceDateFromChange } />
|
||||
) }
|
||||
<div className="btn_group">
|
||||
<button className="button button-gray" onClick={ this._handle_onBack }>Назад</button>
|
||||
<button className="button button-blue" onClick={ this._handle_onCalculate } disabled={ this._checkAllowCalculate() ? false : true } style={{ minWidth: 350 }}>
|
||||
{ sending ? (
|
||||
<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "0px" }}/>
|
||||
) : ( "Рассчитать график" ) }
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="form_field">
|
||||
<label>Тип каникул</label>
|
||||
<div className="form_field">
|
||||
<input type="radio" hidden id="weeekend_type_1" name="weeekend_type" />
|
||||
<label htmlFor="weeekend_type_1">
|
||||
Фиксировать послединий платеж
|
||||
</label>
|
||||
</div>
|
||||
<div className="form_field">
|
||||
<input type="radio" hidden id="weeekend_type_2" name="weeekend_type" />
|
||||
<label htmlFor="weeekend_type_2">
|
||||
Фиксировать послединий платеж
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="form_field">
|
||||
<label>Увеличить график на</label>
|
||||
<select>
|
||||
<option>1 месяц (37 платеж)</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="form_field">
|
||||
<label>Увеличить график на</label>
|
||||
<input type="number" placeholder="Укажите сумму" />
|
||||
<div className="help_tooltip">
|
||||
<div className="help_icon">
|
||||
<svg width={ 24 } height={ 24 } fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18Z" stroke="#8E94A7" strokeWidth={ 2 } strokeLinecap="round" strokeLinejoin="round" />
|
||||
<path d="M11.25 11.25H12v5.25h.75" stroke="#8E94A7" strokeWidth={ 2 } strokeLinecap="round" strokeLinejoin="round" />
|
||||
<path d="M12 9a1.125 1.125 0 1 0 0-2.25A1.125 1.125 0 0 0 12 9Z" fill="#8E94A7" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className="help_content ">
|
||||
{" "}
|
||||
{/* opened */}
|
||||
<div>
|
||||
<p>Какой-то описательный текст</p>
|
||||
<p className="button">Закрыть</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="btn_group">
|
||||
<button className="button button-gray" onClick={ this._handle_onBack }>Назад</button>
|
||||
<button className="button button-blue" onClick={ this._handle_onCalculate }>Рассчитать график</button>
|
||||
</div>
|
||||
</form>
|
||||
</form>
|
||||
) }
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -66,7 +66,7 @@ export default class VariantsList extends React.Component
|
||||
<div className="form_field" key={ index }>
|
||||
<input type="checkbox" hidden id={ `variant_${ index }` } name="variants" disabled={ disabled } checked={ selected.indexOf(variant.type) > -1 ? true : false } onChange={ () => { this._handle_onVariant(variant.type) } }/>
|
||||
<label htmlFor={ `variant_${ index }` } className="unselectable"
|
||||
style={ disabled ? { color: "#A8026B", textDecoration: "line-through", } : {} }>{ variant.title }</label>
|
||||
style={ disabled ? { color: "#A8026B", textDecoration: "line-through", } : {} }>{ variant.title }<br/><small>{ variant.type }</small></label>
|
||||
<div className="help_tooltip">
|
||||
<div className="help_icon">
|
||||
<svg width={ 24 } height={ 24 } fill="none" xmlns="http://www.w3.org/2000/svg" >
|
||||
|
||||
@ -93,9 +93,6 @@ class ChangeGraphicPage extends React.Component
|
||||
|
||||
componentDidMount()
|
||||
{
|
||||
|
||||
|
||||
console.log("ChangePage", "MOUNT", "document.location.hash", document.location.hash);
|
||||
if(document.location.hash !== undefined && document.location.hash !== null && document.location.hash !== "")
|
||||
{
|
||||
if (!this.state.loading && this.props.number !== undefined)
|
||||
@ -149,7 +146,6 @@ class ChangeGraphicPage extends React.Component
|
||||
|
||||
componentDidUpdate(prevProps, prevState)
|
||||
{
|
||||
//console.log("ChangePage", "CDM", "document.location.hash", document.location.hash);
|
||||
if(document.location.hash)
|
||||
{
|
||||
}
|
||||
@ -175,8 +171,6 @@ class ChangeGraphicPage extends React.Component
|
||||
|
||||
this.setState({ variants_selected: selected, variants_loading: true }, () =>
|
||||
{
|
||||
console.log(this.state.variants_selected);
|
||||
|
||||
const { variants_selected, variants_types } = this.state;
|
||||
const variants = {};
|
||||
|
||||
@ -192,9 +186,6 @@ class ChangeGraphicPage extends React.Component
|
||||
}
|
||||
}
|
||||
|
||||
console.log("variantsvariantsvariantsvariantsvariants???????????");
|
||||
console.log(variants);
|
||||
|
||||
getContractGraphicChangeVariants({ dispatch: this.props.dispatch, number: this.props.number, variants })
|
||||
.then(() =>
|
||||
{
|
||||
@ -240,8 +231,6 @@ class ChangeGraphicPage extends React.Component
|
||||
const { loading, mode_options, mode_comparison, mode_calculation, mode_final, date, car, contract_date, agreement, rules, signer, signatories, calculations, calculation_id, variants, variants_loading, variants_selected, variants_types, variants_unavailable, options, current, calculated, } = this.state;
|
||||
const { number } = this.props;
|
||||
|
||||
console.log("render", "signatories", signatories);
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Head>
|
||||
@ -303,6 +292,7 @@ class ChangeGraphicPage extends React.Component
|
||||
dispatch={ this.props.dispatch }
|
||||
number={ number }
|
||||
variants={ variants }
|
||||
variants_selected={ variants_selected }
|
||||
options={ options }
|
||||
onVariants={ this._handle_onVariants }
|
||||
onCalculate={ this._handle_onCalculate }
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user