diff --git a/css/footer/style.css b/css/footer/style.css index 663c894..e0ce20b 100644 --- a/css/footer/style.css +++ b/css/footer/style.css @@ -1 +1,132 @@ -footer{background:#EDEFF5;padding:45px 0;box-sizing:border-box}@media all and (max-width:1600px) and (min-width:1280px){footer{padding:25px 0}}@media all and (max-width:768px){footer{margin-top:40px;pading:25px 0}}footer .container{display:flex;justify-content:space-between;align-items:flex-start;background:transparent;padding-bottom:0}@media all and (max-width:1279px){footer .container{padding:0;flex-wrap:wrap}}footer .column{width:270px;box-sizing:border-box}@media all and (max-width:1279px){footer .column{width:33.333%}footer .column:last-child{width:100%;display:flex;flex-wrap:wrap}footer .column:last-child>div,footer .column:last-child>p{width:33.333%;margin-top:35px;padding-right:30px;box-sizing:border-box;margin-bottom:0 !important}}@media all and (max-width:768px){footer .column{width:100%;margin-bottom:16px}footer .column:last-child>div,footer .column:last-child>p{width:100%;margin-top:15px;padding-right:0}}footer .column:not(:last-child){padding-right:15px}footer .column li:not(:last-child){margin-bottom:13px}@media all and (max-width:768px){footer .column li:not(:last-child){margin-bottom:8px}}footer .column li a{color:#000}footer .column p{color:#8E94A7;line-height:32px}footer .column a[href^="tel"]{display:inline-block;font-size:16px;line-height:32px;color:#000;padding-left:40px;background:url("/assets/images/icons/icon-phone.svg") no-repeat left center}@media all and (max-width:1600px){footer .column a[href^="tel"]{font-size:13px;background-size:24px;padding-left:37px}}footer .column a[href^="mailto"]{display:inline-block;font-size:16px;line-height:24px;color:#000;padding-left:40px;background:url("/assets/images/icons/icon-mail.svg") no-repeat left center}@media all and (max-width:1600px){footer .column a[href^="mailto"]{font-size:13px;background-size:24px;padding-left:37px}}footer .column div:nth-child(1),footer .column div:nth-child(2),footer .column div.socials{margin-bottom:40px}@media all and (max-width:1600px) and (min-width:1280px){footer .column div:nth-child(1),footer .column div:nth-child(2),footer .column div.socials{margin-bottom:20px}}footer .column div a{line-height:32px}@media all and (max-width:1279px){footer .column div a{line-height:1.45}}/*# sourceMappingURL=./style.css.map */ \ No newline at end of file +footer { + background: #EDEFF5; + padding: 45px 0; + box-sizing: border-box; +} +@media all and (max-width: 1600px) and (min-width: 1280px) { + footer { + padding: 25px 0; + } +} +@media all and (max-width: 768px) { + footer { + margin-top: 40px; + pading: 25px 0; + } +} +footer .container { + display: flex; + justify-content: space-between; + align-items: flex-start; + background: transparent; + padding-bottom: 0; + padding-top: 30px !important; +} +@media all and (max-width: 1279px) { + footer .container { + padding: 0; + flex-wrap: wrap; + } +} +footer .column { + width: 270px; + box-sizing: border-box; +} +@media all and (max-width: 1279px) { + footer .column { + width: 33.333%; + } + footer .column:last-child { + width: 100%; + display: flex; + flex-wrap: wrap; + } + footer .column:last-child > div, + footer .column:last-child > p { + width: 33.333%; + margin-top: 35px; + padding-right: 30px; + box-sizing: border-box; + margin-bottom: 0 !important; + } +} +@media all and (max-width: 768px) { + footer .column { + width: 100%; + margin-bottom: 16px; + } + footer .column:last-child > div, + footer .column:last-child > p { + width: 100%; + margin-top: 15px; + padding-right: 0; + } +} +footer .column:not(:last-child) { + padding-right: 15px; +} +footer .column li:not(:last-child) { + margin-bottom: 13px; +} +@media all and (max-width: 768px) { + footer .column li:not(:last-child) { + margin-bottom: 8px; + } +} +footer .column li a { + color: #000; +} +footer .column p { + color: #8E94A7; + line-height: 32px; +} +footer .column a[href^="tel"] { + display: inline-block; + font-size: 16px; + line-height: 32px; + color: #000; + padding-left: 40px; + background: url("/assets/images/icons/icon-phone.svg") no-repeat left center; +} +@media all and (max-width: 1600px) { + footer .column a[href^="tel"] { + font-size: 13px; + background-size: 24px; + padding-left: 37px; + } +} +footer .column a[href^="mailto"] { + display: inline-block; + font-size: 16px; + line-height: 24px; + color: #000; + padding-left: 40px; + background: url("/assets/images/icons/icon-mail.svg") no-repeat left center; +} +@media all and (max-width: 1600px) { + footer .column a[href^="mailto"] { + font-size: 13px; + background-size: 24px; + padding-left: 37px; + } +} +footer .column div:nth-child(1), +footer .column div:nth-child(2), +footer .column div.socials { + margin-bottom: 40px; +} +@media all and (max-width: 1600px) and (min-width: 1280px) { + footer .column div:nth-child(1), + footer .column div:nth-child(2), + footer .column div.socials { + margin-bottom: 20px; + } +} +footer .column div a { + line-height: 32px; +} +@media all and (max-width: 1279px) { + footer .column div a { + line-height: 1.45; + } +} diff --git a/css/footer/style.less b/css/footer/style.less index 0753847..78c6063 100644 --- a/css/footer/style.less +++ b/css/footer/style.less @@ -23,6 +23,8 @@ footer { padding: 0; flex-wrap: wrap; } + + padding-top: 30px !important; } .column { diff --git a/css/main/style.css b/css/main/style.css index 5d99983..890924e 100644 --- a/css/main/style.css +++ b/css/main/style.css @@ -2676,12 +2676,12 @@ main #order .container { min-width: 13%; } .contract_table .table_row .table_cell:nth-child(3) { - width: 16%; - min-width: 16%; + width: 15%; + min-width: 15%; } .contract_table .table_row .table_cell:nth-child(4) { - width: 14%; - min-width: 14%; + width: 15%; + min-width: 15%; white-space: nowrap; } .contract_table .table_row .table_cell:nth-child(5) { @@ -3550,11 +3550,13 @@ main .dropdown_blocks_list .dropdown_block .block_body .fines_detail ul li { position: relative; bottom: 0; z-index: 2; + margin-bottom: -40px; } } @media all and (max-width: 768px) { .helpBox_wrapper { width: calc(100% - 32px); + margin-bottom: -80px; } } .helpBox_wrapper .helpBox { @@ -3576,6 +3578,14 @@ main .dropdown_blocks_list .dropdown_block .block_body .fines_detail ul li { top: calc(100vh - 240px); } } +.helpBox_wrapper .helpBox.hidden { + display: none; +} +@media all and (max-width: 960px) { + .helpBox_wrapper .helpBox.hidden { + display: flex; + } +} .helpBox_wrapper .helpBox .avatar { width: 62px; min-width: 62px; @@ -3639,6 +3649,65 @@ main .dropdown_blocks_list .dropdown_block .block_body .fines_detail ul li { margin-bottom: 16px; } } +.helpBox_wrapper .helpBox .button { + position: absolute; + top: 5px; + right: 5px; + width: 44px; + height: 44px; + background: url("/assets/images/icons/close-blue.svg") no-repeat center; +} +@media all and (max-width: 960px) { + .helpBox_wrapper .helpBox .button { + display: none; + } +} +.helpBox_wrapper .helpBox_small { + max-width: 100px; + background: #FFFFFF; + box-shadow: 0px 4px 32px rgba(0, 0, 0, 0.16); + border-top-right-radius: 17px; + border-bottom-right-radius: 17px; + border-top-left-radius: 17px; + border-bottom-left-radius: 17px; + padding: 20px 20px; + display: flex; + justify-content: space-between; + margin: 0; + position: sticky; + margin-top: auto; + pointer-events: all; + top: calc(100vh - 150px); +} +@media all and (max-width: 1420px) { + .helpBox_wrapper .helpBox_small { + margin-left: -80px; + border-top-left-radius: 0px; + border-bottom-left-radius: 0px; + } +} +@media all and (max-width: 960px) { + .helpBox_wrapper .helpBox_small { + display: none; + } +} +.helpBox_wrapper .helpBox_small.hidden { + display: none; +} +.helpBox_wrapper .helpBox_small .avatar { + width: 62px; + min-width: 62px; + height: 62px; + display: flex; + align-items: center; + justify-content: center; +} +.helpBox_wrapper .helpBox_small .avatar img { + width: 100%; + height: 100%; + object-fit: cover; + border-radius: 31px; +} .feed { position: relative; padding-top: 0; diff --git a/css/main/style.less b/css/main/style.less index 655edba..a62b1fc 100644 --- a/css/main/style.less +++ b/css/main/style.less @@ -12,7 +12,7 @@ main { padding-top: 86px; } - + section { //padding: 80px 0; @@ -2914,13 +2914,13 @@ main { min-width: 13%; &:nth-child(3) { - width: 16%; - min-width: 16%; + width: 15%; + min-width: 15%; } &:nth-child(4) { - width: 14%; - min-width: 14%; + width: 15%; + min-width: 15%; white-space: nowrap; } @@ -3978,10 +3978,12 @@ main .dropdown_blocks_list .dropdown_block .block_body { position: relative; bottom: 0; z-index: 2; + margin-bottom: -40px; } @media all and (max-width: 768px) { width: calc(100% - 32px); + margin-bottom: -80px; } .helpBox { @@ -4002,6 +4004,14 @@ main .dropdown_blocks_list .dropdown_block .block_body { top: calc(100vh - 240px); } + &.hidden { + display: none; + + @media all and (max-width: 960px) { + display: flex; + } + } + .avatar { width: 62px; min-width: 62px; @@ -4077,10 +4087,75 @@ main .dropdown_blocks_list .dropdown_block .block_body { } } } + } + + .button { + position: absolute; + top: 5px; + right: 5px; + width: 44px; + height: 44px; + background: url("/assets/images/icons/close-blue.svg") no-repeat center; + + @media all and (max-width: 960px) { + display: none; + } + } + } + + .helpBox_small { + max-width: 100px; + background: #FFFFFF; + box-shadow: 0px 4px 32px rgba(0, 0, 0, 0.16); + border-top-right-radius: 17px; + border-bottom-right-radius: 17px; + border-top-left-radius: 17px; + border-bottom-left-radius: 17px; + + padding: 20px 20px; + display: flex; + justify-content: space-between; + margin: 0; + position: sticky; + margin-top: auto; + pointer-events: all; + top: calc(100vh - 150px); + + @media all and (max-width: 1420px) { + margin-left: -80px; + border-top-left-radius: 0px; + border-bottom-left-radius: 0px; + } + + @media all and (max-width: 960px) { + display: none; + } + + &.hidden { + display: none; + } + + .avatar { + width: 62px; + min-width: 62px; + height: 62px; + display: flex; + align-items: center; + justify-content: center; + + img { + width: 100%; + height: 100%; + object-fit: cover; + border-radius: 31px; + } + } } } + + .feed { position: relative; padding-top: 0; diff --git a/pages/components/DatePicker/index.js b/pages/components/DatePicker/index.js index f6f5b0f..f1856d8 100644 --- a/pages/components/DatePicker/index.js +++ b/pages/components/DatePicker/index.js @@ -1,6 +1,7 @@ import React from "react"; import DatePicker from "react-widgets/DatePicker"; import "react-widgets/styles.css"; +import moment from "moment"; const messages = { moveToday: "Сегодня", @@ -43,28 +44,34 @@ export default class DateInput extends React.Component render() { - const { id, placeholder, value, min, max, disabled } = this.props; + const { id, placeholder, value, min, max, disabled, plain } = this.props; const { readonly } = this.state; if(disabled) { return (
- - }} - /> -
{ event.stopPropagation(); event.preventDefault(); } }/> + { plain ? ( + moment(value).format("DD.MM.YYYY") + ) : ( + <> + + }} + /> +
{ event.stopPropagation(); event.preventDefault(); } }/> + + ) }
) } diff --git a/pages/components/Manager/index.js b/pages/components/Manager/index.js index 2218127..9ff5433 100644 --- a/pages/components/Manager/index.js +++ b/pages/components/Manager/index.js @@ -13,6 +13,7 @@ class Manager extends React.Component company: {}, photo: undefined, loading: true, + full: false, }; } @@ -41,13 +42,18 @@ class Manager extends React.Component } } + _handle_onFull = () => + { + this.setState({ full: this.state.full ? false : true }); + } + render() { - const { company, loading, photo, } = this.state; + const { company, loading, photo, full, } = this.state; return (
-
+
{ loading ? ( @@ -63,12 +69,22 @@ class Manager extends React.Component { company.manager_email } { company.manager_mobilephone !== undefined && company.manager_mobilephone !== null && company.manager_mobilephone !== "" && ( { company.manager_mobilephone } - ) } + ) } { company.manager_telegram !== undefined && company.manager_telegram !== null && company.manager_telegram !== "" && ( { `@${ company.manager_telegram.replace("@", "")}` } - ) } + ) }
+
+
+
+
+ { loading ? ( + + ) : ( + { + ) } +
) diff --git a/pages/contract/change/components/CalculationsList/index.js b/pages/contract/change/components/CalculationsList/index.js index 9a71666..a6f63bf 100644 --- a/pages/contract/change/components/CalculationsList/index.js +++ b/pages/contract/change/components/CalculationsList/index.js @@ -1,5 +1,6 @@ import React from "react"; import Slider from "react-slick"; +import numeral from "numeral"; function NextArrow(props) { @@ -72,10 +73,10 @@ export default class CalculationsList extends React.Component

{ calculation.date_offset_type_comment !== null && (<>{ `${ calculation.date_offset_type_comment.label }: ${ calculation.date_offset_type_comment.value }` }
) } { calculation.number_paydate_comment !== null && (<>{ `${ calculation.number_paydate_comment.label }: ${ calculation.number_paydate_comment.value }` }
) } - { calculation.insurance_price_result_comment !== null && (<>{ `${ calculation.insurance_price_result_comment.label }: ${ calculation.insurance_price_result_comment.value } ` }
) } + { calculation.insurance_price_result_comment !== null && (<>{ `${ calculation.insurance_price_result_comment.label }: ${ numeral(calculation.insurance_price_result_comment.value).format(' ., ') } ` } ₽
) } { calculation.fix_last_payment_available_comment !== null && (<>{ `${ calculation.fix_last_payment_available_comment.label }: ${ calculation.fix_last_payment_available_comment.value ? "да" : "нет" }` }
) } { calculation.period_new_comment !== null && (<>{ `${ calculation.period_new_comment.label }: ${ calculation.period_new_comment.value }` }
) } - { calculation.sum_comment !== null && (<>{ `${ calculation.sum_comment.label }: ${ calculation.sum_comment.value }` }
) } + { calculation.sum_comment !== null && (<>{ `${ calculation.sum_comment.label }: ${ numeral(calculation.sum_comment.value).format(' ., ') }` } ₽
) }

this._handle_onCalculation(calculation.addcontract_number) }>Подробнее
diff --git a/pages/contract/change/components/Comparison/index.js b/pages/contract/change/components/Comparison/index.js index 2fbd2de..e8d0117 100644 --- a/pages/contract/change/components/Comparison/index.js +++ b/pages/contract/change/components/Comparison/index.js @@ -125,7 +125,7 @@ export default class Comparison extends React.Component ) } { calculation !== undefined && calculation !== null && calculation.insurance_price_result_comment !== null && (
-

{ calculation.insurance_price_result_comment.label }: { calculation.insurance_price_result_comment.value }

+

{ calculation.insurance_price_result_comment.label }: { numeral(calculation.insurance_price_result_comment.value).format(' ., ') } ₽

) } { calculation !== undefined && calculation !== null && calculation.number_paydate_comment !== null && ( diff --git a/pages/contract/change/components/Options/index.js b/pages/contract/change/components/Options/index.js index 8909fa6..ce2182c 100644 --- a/pages/contract/change/components/Options/index.js +++ b/pages/contract/change/components/Options/index.js @@ -50,7 +50,7 @@ class PaymentDate extends React.Component const { value, min, max } = this.state; return ( -
+
) @@ -171,15 +172,23 @@ class DateOffestType extends React.Component const { value } = this.state; return ( -
+
- this._handle_onChange(100000001) }/> - + { !option.disable || (option.disable && value === 100000001) && ( + <> + this._handle_onChange(100000001) }/> + + + ) }
- this._handle_onChange(100000000) }/> - + { !option.disable || (option.disable && value === 100000000) && ( + <> + this._handle_onChange(100000000) }/> + + + ) }
) @@ -393,11 +402,17 @@ class InsurancePriceSelector extends React.Component return (
- -
- - от { numeral(min).format(' ., ') } ₽ - до { numeral(max).format(' ., ') } ₽ + +
+ { option.disable ? ( + <>{ numeral(value).format(' ., ') } ₽ + ) : ( + <> + + от { numeral(min).format(' ., ') } ₽ + до { numeral(max).format(' ., ') } ₽ + + ) }
{ option.information !== undefined && option.information !== null && (
@@ -465,7 +480,7 @@ class InsuranceDateFromSelector extends React.Component const { value, min, max } = this.state; return ( -
+
) diff --git a/pages/contract/index.js b/pages/contract/index.js index 8bfd222..0f795ab 100644 --- a/pages/contract/index.js +++ b/pages/contract/index.js @@ -161,11 +161,6 @@ class ContractSchedulePage extends React.Component let { date, car } = contracts_info[ number ] !== undefined ? contracts_info[ number ] : {}; - console.log(".".repeat(50)); - console.log("this.state", this.state); - console.log("this.props", this.props); - console.log(".".repeat(50)); - console.log("RENDER", "payments"); console.log(payments); diff --git a/pages/support/appeals.js b/pages/support/appeals.js index c96f759..3c03ca9 100644 --- a/pages/support/appeals.js +++ b/pages/support/appeals.js @@ -28,6 +28,7 @@ class SupportAppealsPage extends React.Component { super(props); this.state = { + active: true, appeals: null, loading: false, }; @@ -67,10 +68,28 @@ class SupportAppealsPage extends React.Component { } + _activeAppealsCount = () => + { + const { appeals } = this.state; + let count = 0; + + if(appeals.list !== undefined && appeals.list !== null) + { + for(let i in appeals.list) { if(appeals.list[i].status === "active") { count++; } } + } + + return count; + } + + _handle_onActive = () => + { + this.setState({ active: this.state.active ? false : true }); + } + render() { const { number } = this.props; - const { loading, appeals } = this.state; + const { loading, active, appeals } = this.state; const status = { active: { title: "Активное", color: "#04A8A4" }, @@ -78,6 +97,7 @@ class SupportAppealsPage extends React.Component cancelled: { title: "Отменено", color: "#A8026B", } }; + const active_count = this._activeAppealsCount(); console.log(appeals); return ( @@ -92,55 +112,75 @@ class SupportAppealsPage extends React.Component

Мои обращения

- +
+
+
+ + +
+
{ appeals !== undefined && appeals !== null && appeals.list !== undefined && appeals.list !== null && ( <> { appeals.list.length > 0 ? ( <> - { appeals.list.map((appeal, index) => - ( -
-
-

Номер обращения: { appeal.number } от { moment(appeal.created_date, "YYYY-MM-DD").format("DD.MM.YYYY") }

-

Отвественный сотрудник ОРК: { appeal.owner }

- { appeal.contracts.length > 0 && ( -

Договор{ appeal.contracts.length > 1 && "ы" }: { appeal.contracts.map((contract, contract_index) => (№ { contract }{ contract_index < appeal.contracts.length - 1 && ", " })) }

- ) } -
{ status[appeal.status].title }
-
-
-
-

Тема запроса

-

{ appeal.subject }

-
-
-

Ответ ОРК

-

{ appeal.answer === "" ? "Без ответа" : appeal.answer }

- { appeal.documents.length > 0 && ( -
- { appeal.documents.map((document, document_index) => - ( -
-

- { document.doc_name } - Скачать документ -

-
- )) } -
- ) } -
-
+ { active && active_count === 0 ? ( +
+

У Вас нет активных обращений.
Показать все обращения

- )) } + ) : ( + <> + { appeals.list.map((appeal, index) => + { + if(active) { if(appeal.status !== "active") { return null; } } + + return ( +
+
+

Номер обращения: { appeal.number } от { moment(appeal.created_date, "YYYY-MM-DD").format("DD.MM.YYYY") }

+

Отвественный сотрудник ОРК: { appeal.owner }

+ { appeal.contracts.length > 0 && ( +

Договор{ appeal.contracts.length > 1 && "ы" }: { appeal.contracts.map((contract, contract_index) => (№ { contract }{ contract_index < appeal.contracts.length - 1 && ", " })) }

+ ) } +
{ status[appeal.status].title }
+
+
+
+

Тема запроса

+

{ appeal.subject }

+
+
+

Ответ ОРК

+

{ appeal.answer === "" ? "Без ответа" : appeal.answer }

+ { appeal.documents.length > 0 && ( +
+ { appeal.documents.map((document, document_index) => + ( +
+

+ { document.doc_name } + Скачать документ +

+
+ )) } +
+ ) } +
+
+
+ ) + }) } + + ) } ) : ( -

У Вас пока нет обращений.

+
+

У Вас пока нет обращений.

+
) } )} diff --git a/reducers/contractsInfoReducer.js b/reducers/contractsInfoReducer.js index 08e36a9..221f8ae 100644 --- a/reducers/contractsInfoReducer.js +++ b/reducers/contractsInfoReducer.js @@ -17,15 +17,6 @@ const contractsInfoReducer = (state = initialState.contracts_info, action) => case actionTypes.CONTRACTS_INFO: { - console.log("actionTypes.CONTRACTS_INFO"); - console.log("state", state); - console.log("action.data", action.data); - console.log("-".repeat(100)); - console.log({ - ...state, ...action.data, - }); - console.log("=".repeat(100)); - return { ...state, ...action.data, }; @@ -33,10 +24,6 @@ const contractsInfoReducer = (state = initialState.contracts_info, action) => case actionTypes.CONTRACTS_INFO_RESET: { - console.log("actionTypes.CONTRACTS_INFO_RESET"); - console.log("state", state); - console.log("action.data", action.data); - return {}; }