{% extends '@Portal/template.html.twig' %}{% block head %} <title>{{ seoMeta.title ?? 'seo.credit.title'|trans({}, 'portal_base') }}</title> <meta name="description" content="{{ seoMeta.description ?? 'seo.credit.description'|trans({}, 'portal_base') }}" /> <link rel="stylesheet" type="text/css" href="/dist/{{ MODE }}/portal/css/portalCreditCalc.css?{{ VERSION }}">{% endblock head %}{% block content %} {% include '@Core/Core/preloader_style.html.twig' %}<section class="breadcrumbs__new"> <div class="container"> <ol class="vidi_breadcrumbs__new" itemscope itemtype="https://schema.org/BreadcrumbList"> <li class="marker__none" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemprop="item" href="{{ path('portal_homepage') }}"> <span class="breadcrumbs__link" itemprop="name">VIDI.UA</span> </a> <meta itemprop="position" content="1"/> </li> <div class="arrow-bc"></div> <li itemprop="item" class="marker__none" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <span style="color: #ABABAB" class="breadcrumbs__link" itemprop="name">{{ 'service.service'|trans({}, 'portal_base') }}</span> <meta itemprop="position" content="2"/> </li> <div class="arrow-bc"></div> <li itemprop="item" class="marker__none" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <span style="color: #ABABAB" class="breadcrumbs__link" itemprop="name">{{ 'finance.credit.title'|trans({}, 'portal_base') }}</span> <meta itemprop="position" content="3"/> </li> </ol> </div></section><section class="section_calc_banner"> <div class="container"> <div class="calc_banner_wrapper"> <div class="calc_banner_box"> <h1 class="calc_banner_title">{{ seoMeta.h1 ?? 'finance.credit.credit_calc_banner_title'|trans({}, 'portal_base') }}</h1> <p class="calc_banner_sub_title">{{ 'finance.credit.credit_with'|trans({}, 'portal_base') }} <span>{{ 'base.name'|trans({}, 'portal_base') }}</span> </p> <p class="calc_banner_text">{{ 'finance.credit.credit_select_your_program'|trans({}, 'portal_base') }}</p> <button class="calc_banner_btn" id="show-call-me-form">{{ 'finance.credit.consult'|trans({}, 'portal_base') }}</button> </div> <img class="calc_banner_img-desc" src="{{ asset('bundles/portal/img/service/calc-banner-desc.png') }}" alt=""> <img class="calc_banner_img-mob" src="{{ asset('bundles/portal/img/service/calc-banner-mob.jpg') }}" alt=""> </div> </div></section><div id="creditCalc"><section class="section_calc_module-swap"> <div class="container"> <div class="calc_swap_wrapper"> <div class="calc_swap_head"> <p class="calc_swap_head_name">{{ 'finance.credit.credit_type_calc'|trans({}, 'portal_base') }}</p> <div class="calc_swap_head_box"> <div class="calc_swap_radio_wrapper" v-show="isLoadedMinMax"> <div class="calc_swap-radio"> <input id="radio-1" name="radio-top" type="radio" :checked="typeCreditCalc === 1"> <label for="radio-1" @click="setTypeCreditCalc(1)" class="calc_swap_radio-label">{{ 'finance.credit.credit_calc_auto_online'|trans({}, 'portal_base') }} </label> </div> <div class="calc_swap-radio"> <input id="radio-2" name="radio-top" type="radio" :checked="typeCreditCalc === 2"> <label for="radio-2" @click="setTypeCreditCalc(2)" class="calc_swap_radio-label">{{ 'finance.credit.credit_calc_auto_your_wallet'|trans({}, 'portal_base') }}</label> </div> </div> </div> </div> <template v-if="typeCreditCalc === 1"> <p class="calc_swap-title">{{ 'finance.credit.credit_calc_auto_online_new_car'|trans({}, 'portal_base') }}</p> <p class="calc_swap-sub-title">{{ 'finance.credit.credit_calc_auto_on_3_step'|trans({}, 'portal_base') }}</p> </template> <template v-if="typeCreditCalc === 2"> <p class="calc_swap-title">{{ 'finance.credit.credit_calc_auto_your_wallet'|trans({}, 'portal_base') }}</p> <p class="calc_swap-sub-title">{{ 'finance.credit.credit_calc_auto_on_3_step_select'|trans({}, 'portal_base') }}</p> </template> </div> </div></section> {# ============================MODULE========================== #} <section class="calc_module" > <div class="container" id="ti-new-widget"> <div class="calc_module_btn_head"> <div> <template v-if="step > 1"> <svg @click="backStep" class="module_btn_head_back" width="64" height="20" viewbox="0 0 64 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M10.0832 3.93333L4.46655 9.53333C4.39988 9.6 4.35255 9.67222 4.32455 9.75C4.29655 9.82778 4.28277 9.91111 4.28321 10C4.28321 10.0889 4.29699 10.1722 4.32455 10.25C4.3521 10.3278 4.39944 10.4 4.46655 10.4667L10.0832 16.0833C10.2388 16.2389 10.4332 16.3167 10.6665 16.3167C10.8999 16.3167 11.0999 16.2333 11.2665 16.0667C11.4332 15.9 11.5165 15.7056 11.5165 15.4833C11.5165 15.2611 11.4332 15.0667 11.2665 14.9L6.36655 10L11.2665 5.1C11.4221 4.94444 11.4999 4.75267 11.4999 4.52467C11.4999 4.29667 11.4165 4.09955 11.2499 3.93333C11.0832 3.76666 10.8888 3.68333 10.6665 3.68333C10.4443 3.68333 10.2499 3.76666 10.0832 3.93333Z" fill="inherit"/> <path d="M34.2512 14V9.562H28.8612V14H27.6712V4.2H28.8612V8.442H34.2512V4.2H35.4412V14H34.2512ZM38.2503 9.03L37.9563 8.134C38.5163 7.784 39.2723 7.56 40.0563 7.56C41.8483 7.56 42.4783 8.498 42.4783 10.136V14H41.4143V13.188C41.0363 13.664 40.4343 14.098 39.3983 14.098C38.2503 14.098 37.4663 13.37 37.4663 12.152C37.4663 10.864 38.4883 10.15 39.8463 10.15C40.3363 10.15 40.9943 10.248 41.4143 10.556C41.4143 9.38 41.2323 8.568 39.9863 8.568C39.2163 8.568 38.7542 8.764 38.2503 9.03ZM39.7903 13.09C40.6163 13.09 41.0923 12.656 41.4143 12.278V11.48C41.0222 11.2 40.5463 11.06 40.0003 11.06C39.3283 11.06 38.6562 11.368 38.6562 12.096C38.6562 12.698 39.0623 13.09 39.7903 13.09ZM46.4397 14.14C45.5157 14.14 44.2557 13.79 43.8357 13.286L44.4097 12.446C44.9417 12.88 45.7257 13.132 46.2717 13.132C47.2237 13.132 47.9237 12.726 47.9237 12.096C47.9237 11.578 47.4617 11.284 46.6917 11.284H45.6277V10.374H46.6217C47.2517 10.374 47.7137 9.982 47.7137 9.478C47.7137 8.904 47.1817 8.568 46.3697 8.568C45.5017 8.568 44.8997 8.932 44.4797 9.268L44.0457 8.4C44.5637 7.868 45.5437 7.56 46.5377 7.56C48.0777 7.56 48.9037 8.218 48.9037 9.254C48.9037 9.87 48.5957 10.458 47.7977 10.738V10.766C48.6797 10.864 49.1137 11.522 49.1137 12.25C49.1137 13.426 47.9937 14.14 46.4397 14.14ZM51.1565 9.03L50.8625 8.134C51.4225 7.784 52.1785 7.56 52.9625 7.56C54.7545 7.56 55.3845 8.498 55.3845 10.136V14H54.3205V13.188C53.9425 13.664 53.3405 14.098 52.3045 14.098C51.1565 14.098 50.3725 13.37 50.3725 12.152C50.3725 10.864 51.3945 10.15 52.7525 10.15C53.2425 10.15 53.9005 10.248 54.3205 10.556C54.3205 9.38 54.1385 8.568 52.8925 8.568C52.1225 8.568 51.6605 8.764 51.1565 9.03ZM52.6965 13.09C53.5225 13.09 53.9985 12.656 54.3205 12.278V11.48C53.9285 11.2 53.4525 11.06 52.9065 11.06C52.2345 11.06 51.5625 11.368 51.5625 12.096C51.5625 12.698 51.9685 13.09 52.6965 13.09ZM56.392 15.54V12.95H57.176C57.596 12.418 58.03 11.088 58.142 9.366L58.24 7.7H62.538V12.95H63.588V15.54H62.538V14H57.442V15.54H56.392ZM59.22 9.8C59.08 11.41 58.66 12.558 58.366 12.95H61.418V8.75H59.29L59.22 9.8Z" fill="inherit"/> </svg> </template> </div> <div class="module_btn_head_step"> <template v-if="step > 1 || typeCreditCalc === 2"> <svg class="module_btn_head-refresh" @click="pushReloadCreditCalc()" width="20" height="20" viewbox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_2128_9093)"> <path d="M14.029 19.7096C14.236 19.4058 14.1578 18.9921 13.8542 18.785L11.8645 17.428C13.507 17.0755 15.0162 16.2589 16.2312 15.0439C17.8961 13.379 18.813 11.1654 18.813 8.8108C18.813 6.45628 17.8961 4.24262 16.2312 2.57772C12.7942 -0.85924 7.20189 -0.859241 3.76502 2.57772C2.04654 4.2962 1.1873 6.5535 1.1873 8.8108C1.1873 11.0681 2.04654 13.3254 3.76502 15.0439C4.02485 15.3037 4.44613 15.3037 4.70596 15.0439C4.96579 14.7841 4.96579 14.3628 4.70596 14.103C1.78786 11.1848 1.78786 6.43685 4.70596 3.51875C7.62406 0.600651 12.3722 0.600652 15.2903 3.51875C16.7038 4.93234 17.4823 6.81174 17.4823 8.81089C17.4823 10.81 16.7038 12.6895 15.2902 14.103C14.1993 15.1941 12.8285 15.9052 11.3403 16.1735L12.9511 13.8118C13.1581 13.5082 13.0799 13.0943 12.7763 12.8873C12.4727 12.6802 12.0588 12.7585 11.8518 13.062L9.4489 16.585C9.44881 16.5852 9.44864 16.5854 9.44846 16.5856C9.41049 16.6413 9.38255 16.7007 9.36347 16.7618C9.36285 16.7637 9.36188 16.7655 9.36135 16.7673C9.35815 16.7777 9.35691 16.7883 9.35425 16.7987C9.34094 16.852 9.33278 16.9059 9.33278 16.9598C9.33278 17.1724 9.43444 17.3813 9.62322 17.5101L13.1044 19.8843C13.408 20.0914 13.8219 20.0131 14.029 19.7096Z" fill="inherit"/> </g> <defs> <clipPath id="clip0_2128_9093"> <rect width="20" height="20" fill="white" transform="translate(20) rotate(90)"/> </clipPath> </defs> </svg> </template> <span>{{ 'finance.credit.credit_step'|trans({}, 'portal_base') }}</span> <span v-html="step"></span> <span>{{ 'finance.credit.credit_of'|trans({}, 'portal_base') }} 3</span> </div> </div> {# MAIN STEP 0 #} <div class="calc_module_wrapper"> <div class="calc_module_block_left" v-show="(step === 1 && typeCreditCalc == 1)"> <p class="module_block_left_title">{{ 'finance.credit.credit_select_car_what_you_want'|trans({}, 'portal_base') }}</p> <div class="calc_swap_radio_wrapper calc_swap_radio-step-start"> <div class="calc_swap-radio"> <input id="new-car-1111" name="radio111" type="radio" :checked="!isUsed"> <label for="new-car-1111" class="calc_swap_radio-label" @click="setTypeVehicle('new')">{{ 'finance.credit.credit_new_cars'|trans({}, 'portal_base') }} </label> </div> <div class="calc_swap-radio"> <input id="new-car-2222" name="radio111" type="radio" :checked="isUsed"> <label for="new-car-2222" class="calc_swap_radio-label" @click="setTypeVehicle('used')">{{ 'finance.credit.credit_old_cars'|trans({}, 'portal_base') }}</label> </div> </div> <div class="calc_module_form_wrapper"> <select id="brand-select" class="calc_module_form_select" v-model="vehicle.brand_id" @change="setBrand" :class="{'error_input' : formErrors.brand }"> <option :disabled="vehicle.brand_id !== null" value="null">Марка</option> <option v-for="item in dataCreditCalcOne.brands" :value="item.id" v-html="item.title"></option> </select> <select id="model-select" class="calc_module_form_select" v-model="vehicle.model_id" @change="setModel" :class="{'error_input' : formErrors.model }"> <option :disabled="vehicle.model_id !== null" value="null">Модель</option> <option v-for="item in dataCreditCalcOne.models" :value="item.id" v-html="item.title"></option> </select> <select class="calc_module_form_select" v-if="isUsed" v-model="vehicle.year" @change="setYearForUsed" :class="{'error_input' : formErrors.year }" :disabled="vehicle.model_id === null"> <option :disabled="vehicle.year !== null" :value="null">{{ 'new_catalog.year'|trans({}, 'portal_base') }}</option> <option v-for="item in dataCreditCalcOne.years" :value="item.year" v-html="item.year + ' (' + translate_price_from + ' ' + formatToCurrency(item.min_price) + ')'"></option> </select> <select class="calc_module_form_select" v-else v-model="vehicle.vehicleItemId" @change="setEquipment" :class="{'error_input' : formErrors.equipment }" :disabled="vehicle.model_id === null"> <option :disabled="vehicle.vehicleItemId !== null" value="null">{{ 'finance.credit.credit_coplectation'|trans({}, 'portal_base') }}</option> <option v-for="item in dataCreditCalcOne.equipments" :value="item.vehicleItemId" v-html="item.title"></option> </select> <select class="calc_module_form_select" v-if="isUsed" v-model="vehicle.millage" @change="setMillageForUsed" :disabled="vehicle.year === null" :class="{'error_input' : formErrors.millage }"> <option :disabled="vehicle.millage !== null" value="null">{{ 'cars.used.mileage'|trans({}, 'portal_base') }}, км</option> <option v-for="item in dataCreditCalcOne.millages" :value="item.millage" v-html="item.millage.toLocaleString() + ' км (' + formatToCurrency(item.min_price) + ')'"></option> </select> <select class="calc_module_form_select" v-else v-model="vehicleItemId" @change="cancelAllError" :disabled="vehicle.equipment_id === null" :class="{'error_input' : formErrors.vehicleItemId }"> <option :disabled="vehicleItemId !== null" value="null">{{ 'finance.credit.credit_modification'|trans({}, 'portal_base') }}</option> <option v-for="item in dataCreditCalcOne.variations" :value="item.id" v-html="item.title + ' (' + formatToCurrency(item.min_price) + ')'"></option> </select> </div> <button class="calc_module_btn calc_module_btn-mob" @click="changeVehicleItem()">{{ 'finance.credit.next'|trans({}, 'portal_base') }}</button> </div> <div class="calc_module_block_left" v-if="step === 2 || (step == 1 && typeCreditCalc === 2) || (step === 3 && typeCreditCalc === 1)"> <p v-if="typeCreditCalc === 1" class="module_block_left_title module_block_left_title-last">{{ 'finance.credit.credit_your_conditions'|trans({}, 'portal_base') }}</p> <p v-else class="module_block_left_title module_block_left_title-last">{{ 'finance.credit.credit_your_conditions_flow_2'|trans({}, 'portal_base') }}</p> <div class="calc_swap_money"> <div class="calc_swap_money-item calc_swap_money-item-mob" :class="{'active' : tabPay === 1}" @click="setTabPay(1)"> <span>{{ 'finance.credit.credit_own_money_1'|trans({}, 'portal_base') }}</span> <span>{{ 'finance.credit.credit_own_money_2'|trans({}, 'portal_base') }}</span> </div> <div class="calc_swap_money-item calc_swap_money-item-mob" :class="{'active' : tabPay === 2}" @click="setTabPay(2)"> <span>{{ 'finance.credit.credit_own_car_first_payment_1'|trans({}, 'portal_base') }}</span> <span>{{ 'finance.credit.credit_own_car_first_payment_2'|trans({}, 'portal_base') }}</span> </div> </div> <div class="calc_module_form_wrapper-step-2" v-if="tabPay === 1"> <span v-if="messageError" v-html="messageError" :class="{ 'error_text_red': messageError }"></span> <div class="calc_module_form_wrapper" v-if="typeCreditCalc === 1"> <select v-if="creditCalc.arrPercent" v-model="creditCalc.percent" @change="changePercent()" :class="{'error_input' : formErrors.percent }" class="calc_module_form_select"> <option value="null" disabled>{{ 'finance.credit.down_payment_uah'|trans({}, 'portal_base') }}</option> <template v-for="item in creditCalc.arrPercent"> <option :value="item"> <span v-html="item"></span>% (<span v-html="formatToCurrency(getCreditPrice(item))"></span>)</option> </template> </select> <select v-model="creditCalc.term" @change="cancelAllError" :disabled="creditCalc.programToPercent === null" class="calc_module_form_select" :class="{'error_input' : formErrors.term }"> <option value="null" disabled>{{ 'finance.credit.term_months'|trans({}, 'portal_base') }}</option> <template v-for="program,key in (creditCalc.percent ? creditCalc.arrPrograms[creditCalc.percent] : creditCalc.programToPercent)"> <option :value="key"> <span v-html="key + ' ' + translate_month"></span> </option> </template> </select> </div> <div v-else class="calc_module_form_wrapper calc_module_cancel_wrap"> <div class="module_form_for_tooltip tooltip-container"> <formatted-input :min="minFirstPayment" v-model="ownMoney" @blur="checkNeedChangeFirstPayment" @keyup="cancelAllError();filterMonthsByPayment()" placeholder="{{ 'finance.credit.down_first_payment_uah'|trans({}, 'portal_base') }}" class="calc_module_form_select" :class="{ 'error_input': isError || formErrors.ownMoney || isAdviseUserToIncreaseSum || isAdviseUserToDecreaseSum }"></formatted-input> <div class="push_to_input" @click.prevent="openTooltipInput($event)"> <svg width="16" height="16" viewbox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_2132_12524)"> <path d="M8 0C3.5888 0 0 3.58885 0 8.00005C0 12.4112 3.5888 16 8 16C12.4112 16 16 12.4112 16 8.00005C16 3.58885 12.4112 0 8 0ZM8 14.5455C4.39079 14.5455 1.45455 11.6092 1.45455 8.00005C1.45455 4.39088 4.39079 1.45455 8 1.45455C11.6092 1.45455 14.5455 4.39088 14.5455 8.00005C14.5455 11.6092 11.6092 14.5455 8 14.5455Z" fill="#9C9C9C"/> <path d="M7.99978 3.39355C7.46518 3.39355 7.03027 3.82875 7.03027 4.36369C7.03027 4.89814 7.46518 5.33295 7.99978 5.33295C8.53437 5.33295 8.96928 4.89814 8.96928 4.36369C8.96928 3.82875 8.53437 3.39355 7.99978 3.39355Z" fill="#9C9C9C"/> <path d="M7.99973 6.78809C7.59809 6.78809 7.27246 7.11371 7.27246 7.51536V11.879C7.27246 12.2806 7.59809 12.6063 7.99973 12.6063C8.40138 12.6063 8.72701 12.2806 8.72701 11.879V7.51536C8.72701 7.11371 8.40138 6.78809 7.99973 6.78809Z" fill="#9C9C9C"/> </g> <defs> <clipPath id="clip0_2132_12524"> <rect width="16" height="16" fill="white"/> </clipPath> </defs> </svg> </div> <div class="form_select_tooltip"> <p class="form_select_tooltip_text" v-html="translate_min_first_payment + formatToCurrency(minFirstPayment)"></p> <button class="form_select_tooltip_close" @click.prevent="closeTooltipInput($event)"> <svg width="12" height="12" viewbox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M11 11L1 1M11 1L1 11" stroke="#333333" stroke-width="2" stroke-linecap="round"/> </svg> </button> </div> <p v-if="isAdviseUserToIncreaseSum" class="error_text_red">{{ 'finance.credit.credit_advise_change_sum'|trans({}, 'portal_base') }}</p> <p v-if="isAdviseUserToDecreaseSum" class="error_text_red">{{ 'finance.credit.credit_advise_decrease_sum'|trans({}, 'portal_base') }}</p> </div> <div class="module_form_for_tooltip tooltip-container"> <formatted-input :min="minPaymentPerMonth" @blur="checkNeedChangeMonthPayment" :suffix="uahPerMonthTranslate" v-model="ownMoneyPerMonth" @keyup="cancelAllError();filterMonthsByPayment()" placeholder="{{ 'finance.credit.monthly_payment_uah'|trans({}, 'portal_base') }}" class="calc_module_form_select" :class="{ 'error_input': isError || formErrors.ownMoneyPerMonth || isAdviseUserToIncreaseMonthSum || isAdviseUserToDecreaseMonthSum }"></formatted-input> <div class="form_select_tooltip"> <p class="form_select_tooltip_text" v-html="translate_min_month_payment + formatToCurrency(minPaymentPerMonth) + ' на ' + ownTermSelected + translate_month_term_credit"></p> <button class="form_select_tooltip_close" @click.prevent="closeTooltipInput($event)"> <svg width="12" height="12" viewbox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M11 11L1 1M11 1L1 11" stroke="#333333" stroke-width="2" stroke-linecap="round"/> </svg> </button> </div> <p v-if="isAdviseUserToIncreaseMonthSum" class="error_text_red">{{ 'finance.credit.credit_advise_change_month_sum'|trans({}, 'portal_base') }}</p> <p v-if="isAdviseUserToDecreaseMonthSum" class="error_text_red">{{ 'finance.credit.credit_advise_decrease_month_sum'|trans({}, 'portal_base') }}</p> </div> <select v-model="showedTerm" @change="cancelAllError" class="calc_module_form_select calc_module_form_select_flow_two" :class="{ 'error_input': isError | formErrors.ownTermSelected }"> <option :value="null" v-html="translate_term_months_short" :disabled="showedTerm !== null"></option> <option v-for="month in filterMonthsByPayment()" :value="month" v-html="month + ' ' + translate_month"></option> </select> </div>{# <div class="calc_module_form_wrapper calc_module_form_wrapper-step-2 calc_step_two_top">#}{# <p class="calc_module_form-text">{{ 'form.contacts'|trans({}, 'portal_base') }}</p>#}{# <input class="calc_module_form_input calc_module_form_input_gray" type="text" v-model="user.phone" @keyup="cancelAllError" :class="{'error_input' : formErrors.phone }" v-mask="'+38(###)###-##-##'" placeholder="+38(___)*">#}{# <input class="calc_module_form_input calc_module_form_input_gray" type="text" v-model="user.name" @keyup="cancelAllError" :class="{'error_input' : formErrors.name }" placeholder="{{ 'finance.credit.credit_name'|trans({}, 'portal_base') }}">#}{# </div>#} <div class="calc_module_form_wrapper calc_module_form_wrapper-step-2 calc_step_two_top"> <p class="calc_module_form-text">{{ 'form.contacts'|trans({}, 'portal_base') }}</p> <!-- Фейкове поле для заплутування автозаповнення --> <input type="text" name="fake-field" style="display:none" autocomplete="off"> <input class="calc_module_form_input calc_module_form_input_gray" type="text" name="no_auto_phone" v-model="user.phone" @keyup="cancelAllError" :class="{'error_input' : formErrors.phone }" v-mask="'+38(###)###-##-##'" placeholder="+38(___)*" autocomplete="off"> <input class="calc_module_form_input calc_module_form_input_gray" type="text" name="no_auto_name" v-model="user.name" @keyup="cancelAllError" :class="{'error_input' : formErrors.name }" placeholder="{{ 'finance.credit.credit_name'|trans({}, 'portal_base') }}" autocomplete="off"> </div> <div class="checkboxes_rating_check"> <label class="checkbox rating_check_b"> <input v-model="user.approveTerm" @change="cancelAllError" type="checkbox"/> <div class="checkbox_rating_check" :class="{'error_input' : formErrors.approveTerm }"></div> <div class="checkbox_rating_body">{{ 'finance.credit.credit_agree_to_collection'|trans({}, 'portal_base') }} <a href="{{ path('portal_privacy_policy') }}" target="_blank">{{ 'finance.credit.credit_know_more'|trans({}, 'portal_base') }}</a> </div> </label> </div> </div> <template v-if="tabPay === 2"> <div v-if="!status.isNotHaveNumberVehicle" class="calc_module_form_wrapper calc_module_form_wrapper-step-2 calc_module_form_for_mob"> <p class="calc_module_form-text">{{ 'finance.credit.credit_car_evaluation'|trans({}, 'portal_base') }} </p> <div class="search__number__form__wrapper"> <svg class="search__number-icon" width="35" height="58" viewbox="0 0 35 58" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M0 6C0 2.68629 2.68629 0 6 0H35V58H6C2.68629 58 0 55.3137 0 52V6Z" fill="#0057B8"/> <path d="M16.6357 36.6V41.496C16.6357 44.064 15.0997 45.108 13.3837 45.108C11.3677 45.108 9.90367 43.872 9.90367 41.412V36.6H10.9237V41.22C10.9237 43.044 11.8117 44.148 13.3837 44.148C14.7637 44.148 15.6157 43.2 15.6157 41.292V36.6H16.6357ZM17.9554 45L21.5674 36.552H22.4434L26.0554 45H24.9634L23.8834 42.456H20.0554L18.9874 45H17.9554ZM21.9754 37.908L20.4634 41.496H23.4874L21.9754 37.908Z" fill="white"/> <rect x="8" y="10" width="19" height="7" fill="#42ADDE"/> <rect x="8" y="17" width="19" height="7" fill="#FFD800"/> </svg> <form class="search__number__form" id="vehicleNumberForEstimate"> <input v-for="(input, index) in vehicleNumberEstimate" :key="index" ref="inputs" :inputmode="(index >= 2 && index <= 5) ? 'numeric' : ''" type="text" maxlength="1" v-model="vehicleNumberEstimate[index]" @keyup="numberVehicleEnter($event, index)" > </form> </div> <button class="calc_module_form-not_search" @click="noHaveVehicleNumber()">{{ 'finance.credit.credit_not_remember_auto_number'|trans({}, 'portal_base') }}</button> </div> <div v-show="status.isNotHaveNumberVehicle" class="calc_module_form_wrapper calc_module_form_wrapper-step-2 selected_car_head_wrapper transit_head_step"> <div v-if="tradeInData.estimated.priceBuy !== 0 || isNeedIncreaseFirstPayment" class="selected_car_head_wrapper"> <p v-if="typeCreditCalc == 1" class="calc_module_form-text">{{ 'finance.credit.credit_first_payment_auto_price'|trans({}, 'portal_base') }} <span v-if="isError" v-html="messageError" class="error_text_red"></span><span v-if="firstСontributionMore" class="error_text_red">{{ 'finance.credit.first_contribution_more'|trans({}, 'portal_base') }}</span></p> <div v-if="typeCreditCalc == 1" class="calc_module_form_wrapper"> <div @click="toggleIncreaseSumForFirstPayment($event)" style="position: relative;" class="calc_module_form_select module_form_select_mobile_position tooltip-container" :class="{ 'error_text_red': isError, 'error_input' : formErrors.percent}"> {% verbatim %} <span class="calc_module_form_select_text">{{ tradeInData.estimated.percentOfFirstPayment }}% ({{ formatToCurrency(tradeInData.estimated.priceBuy) }})</span> {% endverbatim %} <div class="push_to_input" @click.prevent="openTooltipInput($event)"> <svg width="16" height="16" viewbox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_2132_12524)"> <path d="M8 0C3.5888 0 0 3.58885 0 8.00005C0 12.4112 3.5888 16 8 16C12.4112 16 16 12.4112 16 8.00005C16 3.58885 12.4112 0 8 0ZM8 14.5455C4.39079 14.5455 1.45455 11.6092 1.45455 8.00005C1.45455 4.39088 4.39079 1.45455 8 1.45455C11.6092 1.45455 14.5455 4.39088 14.5455 8.00005C14.5455 11.6092 11.6092 14.5455 8 14.5455Z" fill="#9C9C9C"/> <path d="M7.99978 3.39355C7.46518 3.39355 7.03027 3.82875 7.03027 4.36369C7.03027 4.89814 7.46518 5.33295 7.99978 5.33295C8.53437 5.33295 8.96928 4.89814 8.96928 4.36369C8.96928 3.82875 8.53437 3.39355 7.99978 3.39355Z" fill="#9C9C9C"/> <path d="M7.99973 6.78809C7.59809 6.78809 7.27246 7.11371 7.27246 7.51536V11.879C7.27246 12.2806 7.59809 12.6063 7.99973 12.6063C8.40138 12.6063 8.72701 12.2806 8.72701 11.879V7.51536C8.72701 7.11371 8.40138 6.78809 7.99973 6.78809Z" fill="#9C9C9C"/> </g> <defs> <clipPath id="clip0_2132_12524"> <rect width="16" height="16" fill="white"/> </clipPath> </defs> </svg> </div> <div class="form_select_tooltip"> <p v-if="tradeInData.estimated.estimatedPrice === 0" class="form_select_tooltip_text" v-html="translate_min_first_payment_for_car + formatToCurrency(needIncreaseSum) + ' (20%). ' + translate_unfortunately_not_enough"></p> <p v-else-if="tradeInData.estimated.estimatedPricePercent < 20" class="form_select_tooltip_text" v-html="translate_min_first_payment_for_car + formatToCurrency(creditCalc.firstPrice) + ' (20%). ' + translate_price_of_your_car + formatToCurrency(tradeInData.estimated.estimatedPrice) + ' (' + tradeInData.estimated.estimatedPricePercent+ '%)'"></p> <p v-else-if="isIncreaseFirstPayment" class="form_select_tooltip_text">{{ 'finance.credit.pre_estimate_plus_money'|trans({}, 'portal_base') }}</p> <p v-else-if="firstСontributionMore" class="form_select_tooltip_text error_text_red" v-html="translate_max_first_payment + ' ' + formatToCurrency(maxFirstPayment) + '.' + ' ' + translate_change_sum"></p> <p v-else class="form_select_tooltip_text" v-html="translate_pre_estimate_count_1 + ' ' + tradeInData.estimated.countItems + ' ' + translate_pre_estimate_count_2 "></p> <button class="form_select_tooltip_close" @click.prevent="closeTooltipInput($event)"> <svg width="12" height="12" viewbox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M11 11L1 1M11 1L1 11" stroke="#333333" stroke-width="2" stroke-linecap="round"/> </svg> </button> </div> </div> <select v-model="creditCalc.term" class="calc_module_form_select" :class="{'error_input' : formErrors.term }" @change="cancelAllError"> <template> <option :value="null"><span v-html="translate_term_months"></span></option> </template> <template v-for="program,key in (tradeInData.estimated.percentOfFirstPayment >= 20 || tradeInData.estimated.percentOfFirstPayment <= 70 ? creditCalc.arrPrograms[tradeInData.estimated.percentOfFirstPaymentRounded] : creditCalc.programToPercent)"> <option :value="key"><span v-html="key + ' ' + translate_month"></span></option> </template> </select> <div class="calc_module_select-link-box calc_module_select-link-btn-mobile"> <button class="calc_module_form-link-btn calc_module_select-link-btn-mobile" @click="toggleIncreaseSumForFirstPayment"> {{ 'finance.credit.credit_increase_first_payment'|trans({}, 'portal_base') }} </button> <span class="error_text_red" v-if="isNeedIncreaseFirstPayment || minFirstPayment > tradeInData.estimated.priceBuy" v-html="'(' + translate_min + ' на ' + formatToCurrency(needIncreaseSum) + ')'" :class="{ 'error_text_red': messageError }"></span> </div> </div> <div v-else class="selected_car_head_wrapper"> <p class="calc_module_form-text">{{ 'finance.credit.credit_first_payment_auto_price'|trans({}, 'portal_base') }} <span v-if="isError" v-html="messageError" :class="{ 'error_text_red': messageError}"></span> <!--<span v-if="firstСontributionMore" class="error_text_red">{{ 'finance.credit.first_contribution_more'|trans({}, 'portal_base') }}</span>--></p> <div class="calc_module_form_wrapper calc_module_cancel_margin_bottom calc_module_form_wrapper-order"> <div class="module_form_for_tooltip_w_30 tooltip-container module_form_for_order-first"> <formatted-input v-model="tradeInData.estimated.priceBuy" @click.native="toggleIncreaseSumForFirstPayment" :class="{ 'error_text_red': isError && minFirstPayment < tradeInData.estimated.priceBuy, 'error_input' : formErrors.ownMoney }" placeholder="{{ 'finance.credit.down_first_payment_uah'|trans({}, 'portal_base') }}" class="calc_module_form_select calc_module_form_select_order_position form_select_order_first" @change="changeDisableCaclVehicleOnStepTwo" readonly></formatted-input> <div class="push_to_input" @click.prevent="openTooltipInput($event)"> <svg width="16" height="16" viewbox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_2132_12524)"> <path d="M8 0C3.5888 0 0 3.58885 0 8.00005C0 12.4112 3.5888 16 8 16C12.4112 16 16 12.4112 16 8.00005C16 3.58885 12.4112 0 8 0ZM8 14.5455C4.39079 14.5455 1.45455 11.6092 1.45455 8.00005C1.45455 4.39088 4.39079 1.45455 8 1.45455C11.6092 1.45455 14.5455 4.39088 14.5455 8.00005C14.5455 11.6092 11.6092 14.5455 8 14.5455Z" fill="#9C9C9C"/> <path d="M7.99978 3.39355C7.46518 3.39355 7.03027 3.82875 7.03027 4.36369C7.03027 4.89814 7.46518 5.33295 7.99978 5.33295C8.53437 5.33295 8.96928 4.89814 8.96928 4.36369C8.96928 3.82875 8.53437 3.39355 7.99978 3.39355Z" fill="#9C9C9C"/> <path d="M7.99973 6.78809C7.59809 6.78809 7.27246 7.11371 7.27246 7.51536V11.879C7.27246 12.2806 7.59809 12.6063 7.99973 12.6063C8.40138 12.6063 8.72701 12.2806 8.72701 11.879V7.51536C8.72701 7.11371 8.40138 6.78809 7.99973 6.78809Z" fill="#9C9C9C"/> </g> <defs> <clipPath id="clip0_2132_12524"> <rect width="16" height="16" fill="white"/> </clipPath> </defs> </svg> </div> <div class="form_select_tooltip"> <p v-if="step === 1 && typeCreditCalc === 2 && tradeInData.estimated.priceBuy === 0" class="form_select_tooltip_text" v-html="translate_min_first_payment + formatToCurrency(minFirstPayment) + '. ' + translate_unfortunately_not_enough"></p> <p v-else-if="step === 1 && typeCreditCalc === 2 && tradeInData.estimated.estimatedPrice < minFirstPayment" class="form_select_tooltip_text" v-html="translate_min_first_payment + formatToCurrency(minFirstPayment) + '. ' + translate_price_of_your_car + formatToCurrency(tradeInData.estimated.priceBuy)"></p> <p v-else-if="step === 1 && typeCreditCalc === 2 && tradeInData.estimated.estimatedPrice" class="form_select_tooltip_text" v-html="translate_pre_estimate_count_1 + ' ' + tradeInData.estimated.countItems + ' ' + translate_pre_estimate_count_2 "></p> <p v-else class="form_select_tooltip_text" v-html="translate_min_first_payment + formatToCurrency(minFirstPayment)"></p> <button class="form_select_tooltip_close" @click.prevent="closeTooltipInput($event)"> <svg width="12" height="12" viewbox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M11 11L1 1M11 1L1 11" stroke="#333333" stroke-width="2" stroke-linecap="round"/> </svg> </button> </div> </div> <div class="module_form_for_tooltip_w_30 tooltip-container"> <formatted-input :min="minPaymentPerMonth" :suffix="uahPerMonthTranslate" v-model="ownMoneyPerMonth" @change="changeDisableCaclVehicleOnStepTwo()" @keyup="cancelAllError();filterMonthsByPayment()" placeholder="{{ 'finance.credit.monthly_payment_uah'|trans({}, 'portal_base') }}" class="calc_module_form_select calc_module_form_select_order_position" :class="{ 'error_input' : formErrors.ownMoneyPerMonth }"></formatted-input> </div> <select v-model="showedTerm" @change="changeDisableCaclVehicleOnStepTwo()" @keyup="cancelAllError" class="calc_module_form_select calc_module_form_select_order_position calc_module_form_month calc_module_form_select_flow_two" :class="{'error_input' : formErrors.ownTermSelected }"> <template> <option :value="null" v-html="translate_term_months_short" :disabled="showedTerm !== null"></option> </template> <template v-for="month,key in filterMonthsByPayment()"> <option :value="month" v-html="month + ' ' + translate_month"></option> </template> </select> <div class="calc_module_select-link-box calc_module_select-link-btn-mobile calc_module_form_select_order_position_last"> <button class="calc_module_form-link-btn" @click="toggleIncreaseSumForFirstPayment"> {{ 'finance.credit.credit_increase_first_payment'|trans({}, 'portal_base') }} </button> <span v-if="isNeedIncreaseFirstPayment" v-html="'(' + translate_min + ' на ' + formatToCurrency(needIncreaseSum) + ')'" :class="{ 'error_text_red': messageError }"></span> </div> </div> </div> <div class="calc_module_form_wrapper calc_module_form_wrapper-step-2"> <p class="calc_module_form-text">{{ 'form.contacts'|trans({}, 'portal_base') }}</p> <input class="calc_module_form_input calc_module_form_input_gray" v-model="user.phone" @keyup="formErrors.phone = false" :class="{'error_input' : formErrors.phone }" type="text" v-mask="'+38(###)###-##-##'" placeholder="+38(___)*"> <input class="calc_module_form_input calc_module_form_input_gray" v-model="user.name" @keyup="formErrors.name = false" :class="{'error_input' : formErrors.name }" type="text" placeholder="{{ 'finance.credit.credit_name'|trans({}, 'portal_base') }}"> </div> <div class="checkboxes_rating_check"> <label class="checkbox rating_check_b"> <input type="checkbox" v-model="user.approveTerm" @change="cancelAllError"/> <div class="checkbox_rating_check" :class="{'error_input' : formErrors.approveTerm }"></div> <div class="checkbox_rating_body">{{ 'finance.credit.credit_agree_to_collection'|trans({}, 'portal_base') }} <a href="{{ path('portal_privacy_policy') }}" target="_blank">{{ 'finance.credit.credit_more_condition'|trans({}, 'portal_base') }}</a> </div> </label> </div> </div> <div v-show="tradeInData.estimated.priceBuy === 0 && !tradeInData.estimated.isWasRequest" class="calc_module_form_wrapper calc_module_gap_two"> <p class="calc_module_form-text calc_module_form-text-mb">{{ 'finance.credit.credit_car_estimate'|trans({}, 'portal_base') }}</p> <select id="brand-ria" class="calc_module_form_select" v-model="tradeInData.brand" @change="cancelAllError" :class="{'error_input' : formErrors.tradeIn.brand }"> </select> <select id="model-ria" class="calc_module_form_select" v-model="tradeInData.model" @change="cancelAllError" :class="{'error_input' : formErrors.tradeIn.model }"> </select> <select id="fuel" class="calc_module_form_select" v-model="tradeInData.fuel" data-live-search="true" @change="cancelAllError" :class="{'error_input' : formErrors.tradeIn.fuel }"> <option :value="null" disabled>{{ 'trade_in.fuel'|trans({}, 'dc_base') }}*</option> {% verbatim %} <option v-if="fuel.id < 7" :value="fuel.id" v-for="fuel in tradeInData.fuels">{{ fuel.title }}</option> {% endverbatim %} </select> <select id="mileage" class="calc_module_form_select" v-model="tradeInData.mileage" @change="cancelAllError" :class="{'error_input' : formErrors.tradeIn.mileage }"> <option :value="null" disabled>{{ 'trade_in.yardage'|trans({}, 'dc_base') }}* </option> {% verbatim %} <option :value="item.id" v-for="item in tradeInData.mileages">{{ item.title }}</option> {% endverbatim %} </select> <select class="calc_module_form_select" v-model="tradeInData.year" @change="cancelAllError" :class="{'error_input' : formErrors.tradeIn.year }"> <option :value="null" disabled> {{ 'form.year'|trans({}, 'dc_base') }}* </option> {% verbatim %} <option :value="year" v-for="year in tradeInData.years">{{ year }}</option> {% endverbatim %} </select> <select class="calc_module_form_select" v-model="tradeInData.transmission" @change="cancelAllError" :class="{'error_input' : formErrors.tradeIn.transmission }"> <option :value="null" disabled> {{ 'trade_in.trans'|trans({}, 'dc_base') }} </option> {% verbatim %} <option v-if="transmission.id < 3" :value="transmission.id" v-for="transmission in tradeInData.transmissions">{{ transmission.title }}</option> {% endverbatim %} </select> </div> </div> </template> <button v-if="tabPay === 2 && !status.isNotHaveNumberVehicle" class="calc_module_btn" @click="tradeInEstimate"> {{ 'leads.estimate'|trans({}, 'portal_base')|capitalize }} </button> <button v-else-if="tabPay === 2 && status.isNotHaveNumberVehicle && !tradeInData.estimated.isWasRequest" class="calc_module_btn" @click="tradeInEstimate"> {{ 'leads.estimate'|trans({}, 'portal_base')|capitalize }} </button> {# <button v-else-if="typeCreditCalc === 2" :disabled="step === 2 && isDisableCaclVehicleOnStepTwo" class="calc_module_btn" @click="toChooseVehicleByWallet();addClassAndScroll()">{{ 'finance.credit.select_vehicle'|trans({}, 'portal_base')|upper }}</button> #} <button v-else-if="typeCreditCalc === 2" :disabled="step === 2 && isDisableCaclVehicleOnStepTwo" class="calc_module_btn" @click="onButtonClick"> {{ 'finance.credit.select_vehicle' | trans({}, 'portal_base') | upper }} </button> {# <button v-else class="calc_module_btn" @click="creditStepSecond();addClassAndScroll()" :disabled="isDisabledCalcButton" >{{ 'finance.credit.credit_calc'|trans({}, 'portal_base') }}</button> #} <button v-else class="calc_module_btn" @click="onButtonClick2" :disabled="isDisabledCalcButton" >{{ 'finance.credit.credit_calc'|trans({}, 'portal_base') }}</button> </div> <div class="calc_module_block_left calc_module_block_left_position" v-if="step === 3 && typeCreditCalc === 2"> <p class="module_block_left_title module_block_left_title-last">Все про авто</p> <p class="module_block_left_title-tabs" v-html="getFullNameForVehicle() + ' ' + vehicleInfo.enginePower + ' ' + ks + ' ' + vehicleInfo.year"></p> <div class="add__comparison__like__box"> <button :class="{ active:!!vehicleInfo.comparedId }" :comparedId="vehicleInfo.comparedId" @click="toggleCompare" class="comparison__like add__comparison"></button> <button :class="{ active:!!vehicleInfo.featuredId }" :featuredId="vehicleInfo.featuredId" @click="toggleFavorite" class="comparison__like add__like"></button> </div> <div class="module_block-tabs"> <div class="tabbed"> <input type="radio" id="module-tab-1" name="css-tabs" checked> <input type="radio" id="module-tab-2" name="css-tabs"> <input type="radio" v-if="vehicleInfo.optionsByEquipment?.count > 0" id="module-tab-3" name="css-tabs" ref="fullOptions"> <ul class="tabs_change_step"> <li class="tabs_change_tab"> <label for="module-tab-1">{{ 'finance.credit.credit_main_info'|trans({}, 'portal_base') }}</label> </li> <li class="tabs_change_tab"> <label for="module-tab-2">{{ 'finance.credit.credit_tech_info'|trans({}, 'portal_base') }} </label> </li> <li class="tabs_change_tab" v-if="vehicleInfo.optionsByEquipment?.count > 0"> <label for="module-tab-3">{{ 'finance.credit.credit_features_info'|trans({}, 'portal_base') }}</label> </li> </ul> <div class="tab-content"> <div class="tabs_change_car_content_first_wrapper"> <img class="tabs_change_car_img" :src="vehicleInfo.image" alt=""> <div class="tabs_change_car_content_first_box"> <div class="tabs_content_first_head"> <p class="tabs_content_first_head-old-price" v-if="vehicleInfo?.hasActionPrice" v-html="formatToCurrency(vehicleInfo.fullPrice)"></p> <p class="tabs_content_first_head-middle-price" v-html="formatToCurrency(vehicleInfo.price)"></p> <span class="tabs_content_first_head-span">•</span> <p class="tabs_content_first_head-price" v-html="formatToCurrency(creditCalc.monthPayment) + ' /' + translate_month"></p> </div> <div class="tabs_content_first_char"> <div class="tabs_content_first_char_box"> <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_2262_3474)"> <path d="M22 11.2H21.2C20.8817 11.2 20.5765 11.3264 20.3515 11.5515C20.1264 11.7765 20 12.0817 20 12.4V12.8H19.2V10.8C19.2 10.4817 19.0736 10.1765 18.8485 9.95148C18.6235 9.72644 18.3183 9.60001 18 9.60001H16.8C16.6939 9.60001 16.5922 9.55786 16.5172 9.48285C16.4421 9.40784 16.4 9.30609 16.4 9.20001V8.40001C16.4 8.08175 16.2736 7.77652 16.0485 7.55148C15.8235 7.32643 15.5183 7.20001 15.2 7.20001H13.6V6.00001H15.6C15.9183 6.00001 16.2235 5.87358 16.4485 5.64853C16.6736 5.42349 16.8 5.11827 16.8 4.80001C16.8 4.48175 16.6736 4.17652 16.4485 3.95148C16.2235 3.72643 15.9183 3.60001 15.6 3.60001H7.6C7.28174 3.60001 6.97652 3.72643 6.75147 3.95148C6.52643 4.17652 6.4 4.48175 6.4 4.80001C6.4 5.11827 6.52643 5.42349 6.75147 5.64853C6.97652 5.87358 7.28174 6.00001 7.6 6.00001H9.6V7.20001H7.6C7.28174 7.20001 6.97652 7.32643 6.75147 7.55148C6.52643 7.77652 6.4 8.08175 6.4 8.40001C6.4 8.50609 6.35786 8.60784 6.28284 8.68285C6.20783 8.75786 6.10609 8.80001 6 8.80001H4.8C4.48174 8.80001 4.17652 8.92643 3.95147 9.15148C3.72643 9.37652 3.6 9.68175 3.6 10V11.6H2.4V10C2.4 9.68175 2.27357 9.37652 2.04853 9.15148C1.82348 8.92643 1.51826 8.80001 1.2 8.80001C0.88174 8.80001 0.576515 8.92643 0.351472 9.15148C0.126428 9.37652 0 9.68175 0 10L0 16.4C0 16.7183 0.126428 17.0235 0.351472 17.2485C0.576515 17.4736 0.88174 17.6 1.2 17.6C1.51826 17.6 1.82348 17.4736 2.04853 17.2485C2.27357 17.0235 2.4 16.7183 2.4 16.4V14.8H3.6V16.8C3.6 17.1183 3.72643 17.4235 3.95147 17.6485C4.17652 17.8736 4.48174 18 4.8 18H6.4688C6.57488 18 6.6766 18.0422 6.7516 18.1172L8.6828 20.0484C8.79391 20.1602 8.92612 20.2489 9.07175 20.3093C9.21739 20.3696 9.37356 20.4005 9.5312 20.4H18C18.3183 20.4 18.6235 20.2736 18.8485 20.0485C19.0736 19.8235 19.2 19.5183 19.2 19.2V17.6H20V18C20 18.3183 20.1264 18.6235 20.3515 18.8485C20.5765 19.0736 20.8817 19.2 21.2 19.2H22C22.5302 19.1994 23.0386 18.9885 23.4135 18.6135C23.7884 18.2386 23.9994 17.7302 24 17.2V13.2C23.9994 12.6698 23.7884 12.1614 23.4135 11.7865C23.0386 11.4116 22.5302 11.2006 22 11.2ZM7.2 4.80001C7.2 4.69392 7.24214 4.59218 7.31716 4.51716C7.39217 4.44215 7.49391 4.40001 7.6 4.40001H15.6C15.7061 4.40001 15.8078 4.44215 15.8828 4.51716C15.9579 4.59218 16 4.69392 16 4.80001C16 4.90609 15.9579 5.00783 15.8828 5.08285C15.8078 5.15786 15.7061 5.20001 15.6 5.20001H7.6C7.49391 5.20001 7.39217 5.15786 7.31716 5.08285C7.24214 5.00783 7.2 4.90609 7.2 4.80001ZM10.4 6.00001H12.8V7.20001H10.4V6.00001ZM1.6 16.4C1.6 16.5061 1.55786 16.6078 1.48284 16.6829C1.40783 16.7579 1.30609 16.8 1.2 16.8C1.09391 16.8 0.992172 16.7579 0.917157 16.6829C0.842143 16.6078 0.8 16.5061 0.8 16.4V10C0.8 9.89392 0.842143 9.79218 0.917157 9.71716C0.992172 9.64215 1.09391 9.60001 1.2 9.60001C1.30609 9.60001 1.40783 9.64215 1.48284 9.71716C1.55786 9.79218 1.6 9.89392 1.6 10V16.4ZM2.4 14V12.4H3.6V14H2.4ZM18.4 19.2C18.4 19.3061 18.3579 19.4078 18.2828 19.4829C18.2078 19.5579 18.1061 19.6 18 19.6H9.5312C9.42512 19.6 9.3234 19.5578 9.2484 19.4828L7.3172 17.5516C7.20603 17.4399 7.07382 17.3512 6.92819 17.2909C6.78257 17.2305 6.62643 17.1996 6.4688 17.2H4.8C4.69391 17.2 4.59217 17.1579 4.51716 17.0829C4.44214 17.0078 4.4 16.9061 4.4 16.8V10C4.4 9.89392 4.44214 9.79218 4.51716 9.71716C4.59217 9.64215 4.69391 9.60001 4.8 9.60001H6C6.31826 9.60001 6.62348 9.47358 6.84853 9.24854C7.07357 9.02349 7.2 8.71827 7.2 8.40001C7.2 8.29392 7.24214 8.19218 7.31716 8.11716C7.39217 8.04215 7.49391 8.00001 7.6 8.00001H15.2C15.3061 8.00001 15.4078 8.04215 15.4828 8.11716C15.5579 8.19218 15.6 8.29392 15.6 8.40001V9.20001C15.6 9.51827 15.7264 9.82349 15.9515 10.0485C16.1765 10.2736 16.4817 10.4 16.8 10.4H18C18.1061 10.4 18.2078 10.4421 18.2828 10.5172C18.3579 10.5922 18.4 10.6939 18.4 10.8V19.2ZM19.2 16.8V13.6H20V16.8H19.2ZM23.2 17.2C23.2 17.5183 23.0736 17.8235 22.8485 18.0485C22.6235 18.2736 22.3183 18.4 22 18.4H21.2C21.0939 18.4 20.9922 18.3579 20.9172 18.2829C20.8421 18.2078 20.8 18.1061 20.8 18V12.4C20.8 12.2939 20.8421 12.1922 20.9172 12.1172C20.9922 12.0421 21.0939 12 21.2 12H22C22.3183 12 22.6235 12.1264 22.8485 12.3515C23.0736 12.5765 23.2 12.8817 23.2 13.2V17.2Z" fill="#E40C25"/> </g> <defs> <clipPath id="clip0_2262_3474"> <rect width="24" height="24" fill="white"/> </clipPath> </defs> </svg> <p v-html="vehicleInfo.fuelTypeName + ', ' + vehicleInfo.engineVolume + ' л '"></p> </div> <div class="tabs_content_first_char_box"> <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M23.9928 4.63387C24.0429 4.05556 23.8315 3.49227 23.3864 3.00507C22.9914 2.57298 22.4792 2.3041 21.9444 2.25002C21.2289 2.17792 20.5164 2.41244 19.9836 2.89541C19.4829 3.34605 19.2065 3.94689 19.2065 4.59031C19.2065 5.33334 19.5009 6.00328 20.0077 6.43589V10.1481C20.0077 10.48 19.7386 10.749 19.4068 10.749H18.2181C17.8952 9.90178 17.3399 9.34248 16.5012 9.02103V6.504C17.3124 6.05886 17.6629 5.27678 17.4926 4.26834C17.3148 3.21687 16.5363 2.41272 15.5549 2.26551C14.9126 2.15928 14.2562 2.34259 13.7619 2.76623C13.2467 3.20785 12.9507 3.87329 12.9507 4.59031C12.9507 5.36442 13.4569 6.02633 13.9977 6.44293V9.02107C13.1465 9.34605 12.5692 9.91535 12.2453 10.749H10.5899C10.2601 10.7487 9.99289 10.4815 9.99261 10.1517V6.50405C10.8058 6.05844 11.1573 5.27532 10.987 4.26642C10.8092 3.21494 10.0302 2.41131 9.04877 2.26359C8.40614 2.15708 7.74934 2.34038 7.25473 2.76431C6.73195 3.22536 6.43612 3.89141 6.44457 4.58839C6.44457 5.36296 6.9498 6.02492 7.48906 6.44101V10.1462C7.48906 10.478 7.22004 10.747 6.88821 10.747H3.98416V6.41195C4.61857 5.79106 5.02761 4.70654 4.53144 3.57695C4.38123 3.23447 4.01021 2.82589 3.66773 2.6256C2.83654 2.13793 1.92476 2.10638 1.17023 2.53899C0.441239 2.96489 -0.00488839 3.74753 4.04212e-05 4.59181C4.04212e-05 5.38742 0.471704 6.04037 0.979418 6.44443V11.5376C0.980263 12.4843 1.74756 13.2517 2.69431 13.2525H6.8677C7.21037 13.253 7.48802 13.5307 7.48859 13.8734V17.497C6.66792 17.9451 6.31243 18.7297 6.48316 19.7411C6.66092 20.7926 7.44202 21.5938 8.42539 21.7389C8.54044 21.7557 8.65657 21.7642 8.77289 21.7645C9.3045 21.7673 9.81897 21.5767 10.2204 21.2282C10.7406 20.7683 11.0351 20.105 11.0276 19.4107C11.0276 18.6331 10.5268 17.9722 9.99209 17.558V13.8529C9.99209 13.521 10.2611 13.252 10.5929 13.252H12.2453C12.5692 14.0857 13.1465 14.654 13.9977 14.98V17.4965C13.1746 17.9471 12.8186 18.7312 12.9893 19.7427C13.1675 20.7942 13.9486 21.5953 14.9325 21.739C15.5774 21.841 16.2344 21.6532 16.728 21.2258C17.2472 20.7663 17.5414 20.104 17.5342 19.4107C17.5342 18.6321 17.0334 17.9717 16.5012 17.5581V14.9795C17.3399 14.658 17.8952 14.0987 18.2181 13.2515H19.8735C19.9468 13.2515 20.0063 13.3109 20.0066 13.3842V17.5902C19.4814 18.1064 19.0843 18.9686 19.2781 19.9064C19.4433 20.7076 20.0547 21.368 20.8739 21.6363C21.6249 21.8817 22.4015 21.7695 23.0104 21.3279C23.6213 20.8805 23.9814 20.1679 23.9792 19.4107C23.9783 18.6115 23.5121 17.9601 23.0104 17.5595V6.41735C23.3554 6.10242 23.9232 5.46604 23.9928 4.63387ZM22.9944 4.55276C22.9538 5.04193 22.5578 5.51463 22.2007 5.79402C22.0794 5.88893 22.0084 6.0345 22.0085 6.18856V17.8154C22.0086 17.9862 22.0958 18.1451 22.2398 18.237C22.5798 18.4548 22.9768 18.8929 22.9768 19.4111C22.9794 19.8472 22.7734 20.2582 22.4225 20.5172C22.072 20.7711 21.6304 20.8312 21.1853 20.6849C20.7137 20.5302 20.3496 20.1452 20.2585 19.704C20.1283 19.0752 20.4443 18.5024 20.8153 18.21C20.9367 18.115 21.0076 17.9695 21.0076 17.8154V13.3852C21.0067 12.759 20.4991 12.2516 19.8729 12.2511H17.8576C17.6332 12.251 17.436 12.4005 17.3754 12.6166C17.1416 13.4518 16.691 13.9064 15.8678 14.1358C15.6515 14.1962 15.5018 14.3933 15.5018 14.6179V17.8154C15.5019 17.9861 15.5889 18.145 15.7326 18.237C16.1027 18.4743 16.5338 18.924 16.5338 19.4111C16.541 19.8141 16.3729 20.2003 16.0732 20.4696C15.798 20.7045 15.4334 20.8066 15.0763 20.7485C14.533 20.6704 14.0819 20.1882 13.9782 19.5759C13.8661 18.9149 14.0829 18.5159 14.6817 18.282C14.8737 18.207 15.0001 18.022 15.0002 17.8158V14.6179C15.0001 14.3933 14.8505 14.1961 14.6342 14.1357C13.794 13.9014 13.3173 13.4347 13.0895 12.6171C13.0291 12.4007 12.8319 12.2511 12.6073 12.2511H10.593C9.7081 12.2511 8.99075 12.9684 8.99075 13.8533V17.8154C8.99079 17.9861 9.07782 18.145 9.22156 18.237C9.59258 18.4753 10.0262 18.9254 10.0262 19.4111C10.0334 19.8146 9.86516 20.2013 9.56502 20.4711C9.29032 20.7053 8.92634 20.8066 8.57011 20.748C8.02634 20.6689 7.57472 20.1862 7.46854 19.5743C7.3564 18.9139 7.57271 18.5153 8.16951 18.2815C8.3615 18.2065 8.48787 18.0214 8.48796 17.8153V13.8733C8.48688 12.9778 7.76117 12.2521 6.86568 12.251H2.69431C2.30048 12.2504 1.98137 11.9313 1.98081 11.5375V6.18555C1.97992 6.01577 1.89303 5.858 1.75 5.76647C1.40503 5.54514 0.998945 5.10502 0.998945 4.59233C0.993969 4.10607 1.24928 3.65426 1.66837 3.40768C2.10999 3.15481 2.63874 3.18438 3.16147 3.48978C3.31919 3.58239 3.54803 3.82977 3.6121 3.97999C3.96261 4.78113 3.54202 5.50313 3.1725 5.79205C3.05111 5.88696 2.98018 6.03248 2.98023 6.18659V11.113C2.98051 11.4652 3.26596 11.7506 3.61811 11.7509H6.88521C7.77009 11.7509 8.48744 11.0335 8.48744 10.1486V6.18555C8.48707 6.01624 8.40121 5.85856 8.25912 5.76647C7.88411 5.52613 7.4455 5.07399 7.4455 4.59233C7.43747 4.18695 7.60636 3.79814 7.90815 3.52733C8.09741 3.36412 8.42238 3.18485 8.89954 3.25597C9.4503 3.3391 9.89342 3.81325 10.0011 4.43513C10.1143 5.10305 9.90746 5.4866 9.31112 5.72145C9.11913 5.79646 8.99277 5.9815 8.99267 6.18762V10.1532C8.9946 11.0354 9.70927 11.75 10.5914 11.752H12.6078C12.8324 11.7519 13.0295 11.6023 13.09 11.386C13.3178 10.5698 13.7945 10.1017 14.6347 9.86733C14.851 9.80691 15.0007 9.60976 15.0007 9.38515V6.18565C14.9994 6.01558 14.9119 5.85772 14.7683 5.76656C14.3918 5.52524 13.9522 5.0731 13.9522 4.59242C13.9522 4.16733 14.1209 3.7788 14.4148 3.52592C14.6031 3.36318 14.927 3.18194 15.4042 3.25456C15.955 3.33816 16.3986 3.81283 16.5058 4.43522C16.6189 5.10267 16.4132 5.4867 15.8188 5.71952C15.6268 5.79454 15.5004 5.97958 15.5003 6.1857V9.38318C15.5004 9.60779 15.65 9.80494 15.8663 9.86535C16.6895 10.0947 17.1401 10.5488 17.3739 11.3845C17.4345 11.6007 17.6316 11.75 17.8561 11.75H19.4058C20.2907 11.75 21.008 11.0327 21.008 10.1478V6.18574C21.007 6.01586 20.9199 5.85805 20.7767 5.76665C20.4207 5.53833 20.2079 5.0992 20.2079 4.59252C20.2079 4.23854 20.3661 3.90056 20.6546 3.64116C20.9769 3.34788 21.4086 3.20518 21.8422 3.2486C22.1281 3.27812 22.4215 3.43636 22.6468 3.68322C22.9063 3.96642 23.0199 4.25083 22.9944 4.55276Z" fill="#E40C25"/> </svg> <p v-html="vehicleInfo.transmissionTypeName"></p> </div> <div class="tabs_content_first_char_box"> <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M18.75 8.625H21C21.6203 8.625 22.125 8.12025 22.125 7.5V1.5C22.125 0.87975 21.6203 0.375 21 0.375H18.75C18.1297 0.375 17.625 0.87975 17.625 1.5V2.625H16.5C16.2926 2.625 16.125 2.793 16.125 3V3.375H7.875V3C7.875 2.793 7.70738 2.625 7.5 2.625H6.375V1.5C6.375 0.87975 5.87025 0.375 5.25 0.375H3C2.37975 0.375 1.875 0.87975 1.875 1.5V7.5C1.875 8.12025 2.37975 8.625 3 8.625H5.25C5.87025 8.625 6.375 8.12025 6.375 7.5V6.375H7.5C7.70738 6.375 7.875 6.207 7.875 6V5.625H8.46975L10.875 8.03025V11.625H10.5C10.2926 11.625 10.125 11.793 10.125 12V14.625H9C8.79262 14.625 8.625 14.7926 8.625 15V18.375H7.875V18C7.875 17.7926 7.70738 17.625 7.5 17.625H6.375V16.5C6.375 15.8798 5.87025 15.375 5.25 15.375H3C2.37975 15.375 1.875 15.8798 1.875 16.5V22.5C1.875 23.1203 2.37975 23.625 3 23.625H5.25C5.87025 23.625 6.375 23.1203 6.375 22.5V21.375H7.5C7.70738 21.375 7.875 21.2074 7.875 21V20.625H16.125V21C16.125 21.2074 16.2926 21.375 16.5 21.375H17.625V22.5C17.625 23.1203 18.1297 23.625 18.75 23.625H21C21.6203 23.625 22.125 23.1203 22.125 22.5V16.5C22.125 15.8798 21.6203 15.375 21 15.375H18.75C18.1297 15.375 17.625 15.8798 17.625 16.5V17.625H16.5C16.2926 17.625 16.125 17.7926 16.125 18V18.375H15.375V15C15.375 14.7926 15.2074 14.625 15 14.625H13.875V12C13.875 11.793 13.7074 11.625 13.5 11.625H13.125V8.03025L15.5303 5.625H16.125V6C16.125 6.207 16.2926 6.375 16.5 6.375H17.625V7.5C17.625 8.12025 18.1297 8.625 18.75 8.625ZM5.25 7.875H3C2.793 7.875 2.625 7.70662 2.625 7.5V6.53025L3.10988 7.01513L3.64012 6.48487L2.625 5.46975V4.65525L3.10988 5.14012L3.64012 4.60988L2.625 3.59475V2.78025L3.10988 3.26512L3.64012 2.73488L2.625 1.71975V1.5C2.625 1.29338 2.793 1.125 3 1.125H5.25C5.457 1.125 5.625 1.29338 5.625 1.5V1.71975L4.60988 2.73488L5.14012 3.26512L5.625 2.78025V3.59475L4.60988 4.60988L5.14012 5.14012L5.625 4.65525V5.46975L4.60988 6.48487L5.14012 7.01513L5.625 6.53025V7.5C5.625 7.70662 5.457 7.875 5.25 7.875ZM7.125 5.625H6.375V3.375H7.125V5.625ZM5.25 22.875H3C2.793 22.875 2.625 22.707 2.625 22.5V21.5303L3.10988 22.0151L3.64012 21.4849L2.625 20.4697V19.6553L3.10988 20.1401L3.64012 19.6099L2.625 18.5947V17.7803L3.10988 18.2651L3.64012 17.7349L2.625 16.7197V16.5C2.625 16.293 2.793 16.125 3 16.125H5.25C5.457 16.125 5.625 16.293 5.625 16.5V16.7197L4.60988 17.7349L5.14012 18.2651L5.625 17.7803V18.5947L4.60988 19.6099L5.14012 20.1401L5.625 19.6553V20.4697L4.60988 21.4849L5.14012 22.0151L5.625 21.5303V22.5C5.625 22.707 5.457 22.875 5.25 22.875ZM7.125 20.625H6.375V18.375H7.125V20.625ZM18.75 16.125H21C21.207 16.125 21.375 16.293 21.375 16.5V16.7197L20.3599 17.7349L20.8901 18.2651L21.375 17.7803V18.5947L20.3599 19.6099L20.8901 20.1401L21.375 19.6553V20.4697L20.3599 21.4849L20.8901 22.0151L21.375 21.5303V22.5C21.375 22.707 21.207 22.875 21 22.875H18.75C18.543 22.875 18.375 22.707 18.375 22.5V21.5303L18.8599 22.0151L19.3901 21.4849L18.375 20.4697V19.6553L18.8599 20.1401L19.3901 19.6099L18.375 18.5947V17.7803L18.8599 18.2651L19.3901 17.7349L18.375 16.7197V16.5C18.375 16.293 18.543 16.125 18.75 16.125ZM16.875 18.375H17.625V20.625H16.875V18.375ZM9.53025 5.625H10.875V6.96975L9.53025 5.625ZM10.875 12.375H13.125V16.125H10.875V12.375ZM11.625 18.375V16.875H12.375V18.375H11.625ZM9.375 15.375H10.125V16.5C10.125 16.7074 10.2926 16.875 10.5 16.875H10.875V18.375H9.375V15.375ZM16.125 19.875H7.875V19.125H16.125V19.875ZM13.875 16.5V15.375H14.625V18.375H13.125V16.875H13.5C13.7074 16.875 13.875 16.7074 13.875 16.5ZM11.625 11.625V5.625H12.375V11.625H11.625ZM13.125 6.96975V5.625H14.4697L13.125 6.96975ZM7.875 4.875V4.125H16.125V4.875H7.875ZM18.75 1.125H21C21.207 1.125 21.375 1.29338 21.375 1.5V1.71975L20.3599 2.73488L20.8901 3.26512L21.375 2.78025V3.59475L20.3599 4.60988L20.8901 5.14012L21.375 4.65525V5.46975L20.3599 6.48487L20.8901 7.01513L21.375 6.53025V7.5C21.375 7.70662 21.207 7.875 21 7.875H18.75C18.543 7.875 18.375 7.70662 18.375 7.5V6.53025L18.8599 7.01513L19.3901 6.48487L18.375 5.46975V4.65525L18.8599 5.14012L19.3901 4.60988L18.375 3.59475V2.78025L18.8599 3.26512L19.3901 2.73488L18.375 1.71975V1.5C18.375 1.29338 18.543 1.125 18.75 1.125ZM16.875 5.625V3.375H17.625V5.625H16.875Z" fill="#E40C25"/> </svg> <p v-html="vehicleInfo.driveUnitTypeName"></p> </div> <div v-if="!isUsed" class="tabs_content_first_char_box"> <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M23.25 8.25H21C20.7926 8.25 20.625 8.41762 20.625 8.625V10.5H19.875V10.125C19.875 10.0252 19.8356 9.93 19.7651 9.85987L16.7651 6.85987C16.695 6.78937 16.5998 6.75 16.5 6.75H13.875V6H16.125C16.3324 6 16.5 5.83238 16.5 5.625V4.125C16.5 3.91763 16.3324 3.75 16.125 3.75H6.375C6.16762 3.75 6 3.91763 6 4.125V5.625C6 5.83238 6.16762 6 6.375 6H8.625V6.75H5.625C5.41762 6.75 5.25 6.91762 5.25 7.125V9.75H3.75C3.54262 9.75 3.375 9.91762 3.375 10.125V11.625H2.625V9.375C2.625 9.16762 2.45738 9 2.25 9H0.75C0.542625 9 0.375 9.16762 0.375 9.375V17.625C0.375 17.8324 0.542625 18 0.75 18H2.25C2.45738 18 2.625 17.8324 2.625 17.625V15.375H3.375V17.25C3.375 17.4574 3.54262 17.625 3.75 17.625H6.59475L9.10987 20.1401C9.18 20.2106 9.27525 20.25 9.375 20.25H19.5C19.7074 20.25 19.875 20.0824 19.875 19.875V17.25H20.625V19.125C20.625 19.3324 20.7926 19.5 21 19.5H23.25C23.4574 19.5 23.625 19.3324 23.625 19.125V8.625C23.625 8.41762 23.4574 8.25 23.25 8.25ZM1.875 17.25H1.125V9.75H1.875V11.625V12.375V14.625V15.375V17.25ZM2.625 14.625V12.375H3.375V14.625H2.625ZM6.75 4.5H15.75V5.25H6.75V4.5ZM9.375 6H13.125V6.75H9.375V6ZM19.125 19.5H9.53025L7.01513 16.9849C6.945 16.9144 6.84975 16.875 6.75 16.875H4.125V10.5H5.625C5.83238 10.5 6 10.3324 6 10.125V7.5H16.3447L19.125 10.2802V19.5ZM19.875 16.5V11.25H20.625V16.5H19.875ZM22.875 18.75H21.375V9H22.875V18.75Z" fill="#E40C25"/> <path d="M11.1048 15L10.5194 16.7565C10.4643 16.9215 10.5299 17.1026 10.678 17.1941C10.7392 17.2316 10.807 17.25 10.8753 17.25C10.972 17.25 11.0684 17.2125 11.1404 17.1401L14.5154 13.7651C14.6227 13.6579 14.6549 13.4966 14.5968 13.3564C14.539 13.2161 14.4018 13.125 14.2503 13.125H12.8155L14.5349 11.1187C14.6305 11.0077 14.6519 10.851 14.5908 10.7183C14.5297 10.5855 14.3969 10.5 14.2503 10.5H11.6253C11.4832 10.5 11.3534 10.5802 11.2897 10.7074L9.41466 14.4574C9.35653 14.5736 9.36253 14.7116 9.43116 14.8223C9.49978 14.9329 9.62016 15 9.75028 15H11.1048ZM11.857 11.25H13.435L11.7157 13.2562C11.62 13.3672 11.5987 13.524 11.6598 13.6567C11.7209 13.7895 11.8537 13.875 12.0003 13.875H13.345L11.7333 15.4868L11.9808 14.7439C12.0194 14.6295 11.9999 14.5035 11.9294 14.406C11.8589 14.3078 11.7457 14.25 11.6253 14.25H10.357L11.857 11.25Z" fill="#E40C25"/> <path d="M17.625 18H18.375V18.75H17.625V18Z" fill="#E40C25"/> <path d="M9.75 18H16.875V18.75H9.75V18Z" fill="#E40C25"/> </svg> <p v-html="enginePower + ' '+ vehicleInfo.enginePower + ' '+ ks"></p> </div> <div v-else class="tabs_content_first_char_box"> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M12.0019 3.10205C9.23347 3.10205 6.72307 4.22477 4.89955 6.03773C4.89163 6.04469 4.88156 6.04709 4.87411 6.05453C4.86668 6.06197 4.86428 6.07205 4.85732 6.07997C3.0446 7.90325 1.92188 10.4137 1.92188 13.1821C1.92188 15.6171 2.80147 17.9674 4.39963 19.8013C4.59403 20.0252 4.93099 20.0492 5.15539 19.8589L7.26187 18.0742C7.49299 17.8796 7.51819 17.5313 7.31803 17.305C6.31387 16.166 5.76139 14.7013 5.76139 13.1818C5.76139 9.74069 8.56051 6.94157 12.0016 6.94157C13.434 6.94157 14.8339 7.43933 15.942 8.34221C16.4932 8.79221 17.178 7.95677 16.624 7.50557C15.4636 6.55925 14.0308 5.99597 12.5416 5.88509V4.20917C17.2528 4.49093 21.0019 8.40173 21.0019 13.1821C21.0019 15.1748 20.3416 17.1056 19.1323 18.6742L17.8464 17.5899C18.8018 16.3244 19.3221 14.7795 19.3221 13.1821C19.3221 12.4719 19.2201 11.7687 19.019 11.0917C18.8131 10.4021 17.7823 10.7211 17.9839 11.3996C18.1548 11.9761 18.2419 12.5758 18.2419 13.1821C18.2419 14.7008 17.6899 16.1648 16.6872 17.3031C16.4882 17.528 16.5105 17.8762 16.744 18.073L18.8541 19.8526C19.0792 20.0432 19.4167 20.0165 19.6092 19.7943C21.2037 17.9619 22.0819 15.6135 22.0819 13.1821C22.0819 7.62389 17.56 3.10205 12.0019 3.10205ZM7.22827 7.64429L6.041 6.45725C7.50379 5.15909 9.38756 4.33325 11.4619 4.20917V5.88893C9.84979 6.00773 8.38315 6.64733 7.22827 7.64429ZM6.16027 17.5928L4.87627 18.6805C3.77395 17.2527 3.13244 15.524 3.0242 13.7221H4.70371C4.80739 15.1263 5.31163 16.4696 6.16027 17.5928ZM4.709 12.6421H3.02924C3.15332 10.5675 3.97916 8.68373 5.27732 7.22093L6.46459 8.40773C5.46739 9.56285 4.82756 11.0297 4.709 12.6421Z" fill="#E40C25"/> <path d="M13.2218 15.9306C13.7301 15.4215 17.9363 9.90609 18.4144 9.27897C18.784 8.79369 18.1843 8.16633 17.6853 8.50281C16.601 9.22497 11.1652 12.8552 10.6555 13.365C9.94818 14.0723 9.94818 15.2233 10.6555 15.9306C11.3613 16.6364 12.5128 16.6393 13.2218 15.9306ZM11.4189 14.1284C11.6551 13.8956 13.576 12.5725 15.5589 11.2309C14.0992 13.1279 12.6938 14.9307 12.4581 15.1669C11.771 15.8543 10.7315 14.8158 11.4189 14.1284Z" fill="#E40C25"/> <path d="M10.1415 18.852H13.8581C14.5729 18.852 14.5729 17.772 13.8581 17.772H10.1415C9.42679 17.772 9.42679 18.852 10.1415 18.852Z" fill="#E40C25"/> <path d="M16.544 19.8181H7.45401C6.73929 19.8181 6.73929 20.8981 7.45401 20.8981H16.544C17.2585 20.8981 17.2585 19.8181 16.544 19.8181Z" fill="#E40C25"/> </svg> <p v-html="vehicleInfo.mileage + ' км'"></p> </div> </div> <div class="tabs_content_features_wrapper"> <div class="tabs_content_features_box" v-for="option in vehicleOptions"> <svg width="14" height="10" viewbox="0 0 14 10" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M1 3.45168L4.84199 8.67752M13 1L5.15801 9" stroke="#4CB30F" stroke-width="2" stroke-linecap="round"/> </svg> <p class="tabs_content_features-tem" v-html="option"></p> </div> </div> <a class="tabs_content_features-tem-all" href="#" v-if="vehicleInfo.optionsByEquipment?.count > 0" @click.prevent="clickFullOptions">{{ 'card_car.show_all_features'|trans({}, 'portal_base') }} </a> </div> </div> </div> <div class="tab-content tab-content-scroll"> <div class="accordion_tabs_change"> <div class="tabs_change-item"> <div class="tabs_change_ac_title" :class="{ 'active': expandIndexTechConfig == -1 }" @click.prevent="toggleExpandTechConfig(-1)"> <p class="tabs_change_ac_head">{{ 'cars.TTX'|trans({}, 'portal_base') }}</p> </div> <div class="tabs_change_ac_content" :style="expandIndexTechConfig == -1 ? 'display:block' : 'display:none'"> <div class="specifications__accordion__content__box"> <p class="accordion__content__box-left-text">{{ 'cars.engine'|trans({}, 'portal_base') }}</p> <span class="accordion__content__box-point"></span> <p class="accordion__content__box-right-text" v-html="vehicleInfo.engineVolume + ' л, ' + vehicleInfo.enginePower + ' ' + ks"></p> </div> <div class="specifications__accordion__content__box"> <p class="accordion__content__box-left-text">Тип КПП</p> <span class="accordion__content__box-point"></span> <p class="accordion__content__box-right-text" v-html="vehicleInfo.transmissionTypeName"></p> </div> <div class="specifications__accordion__content__box"> <p class="accordion__content__box-left-text">Тип приводу</p> <span class="accordion__content__box-point"></span> <p class="accordion__content__box-right-text" v-html="vehicleInfo.driveUnitTypeName"></p> </div> <div class="specifications__accordion__content__box"> <p class="accordion__content__box-left-text">{{ 'base.home.selection.fuel_type'|trans({}, 'portal_base') }}</p> <span class="accordion__content__box-point"></span> <p class="accordion__content__box-right-text" v-html="vehicleInfo.fuelTypeName"></p> </div> </div> </div> <div class="tabs_change-item" v-for="([key, configuration], index) in Object.entries(vehicleInfo?.characteristicsWithGroup || {})"> <div v-if="configuration?.characteristics.length > 0" @click.prevent="toggleExpandTechConfig(index)"> <div class="tabs_change_ac_title" :class="{ 'active': expandIndexTechConfig == index }"> <p class="tabs_change_ac_head" v-html="configuration.title"></p> </div> <div class="tabs_change_ac_content" :style="expandIndexTechConfig == index ? 'display:block' : 'display:none'" v-for="characteristic in configuration?.characteristics" :key="characteristic.id" > <div class="specifications__accordion__content__box"> <p class="accordion__content__box-left-text" v-html="characteristic.title"></p> <span class="accordion__content__box-point"></span> <p class="accordion__content__box-right-text" v-html="characteristic.value"></p> </div> </div> </div> </div> </div> </div> <div class="tab-content tab-content-scroll"> <div class="accordion_tabs_change"> {% verbatim %} <div class="tabs_change-item" v-for="([key, equipment], index) in Object.entries(vehicleInfo?.fullOptionsByEquipment || {})" :key="key"> <div v-if="equipment?.options?.length > 0" @click.prevent="toggleExpandСonfiguration(index)"> <div class="tabs_change_ac_title" :class="{ 'active': expandIndexСonfiguration == index }"> <button class="accordion-button tabs_change_ac_head" v-html="equipment.title" type="button"></button> </div> <div class="tabs_change_ac_content" :style="expandIndexСonfiguration == index ? 'display:block' : 'display:none'"> <div class="tabs_advantages_wrapper"> <div class="tabs_advantages_box" v-for="option in equipment?.options" :key="option"> <svg width="14" height="10" viewbox="0 0 14 10" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M1 3.45168L4.84199 8.67752M13 1L5.15801 9" stroke="#4CB30F" stroke-width="2" stroke-linecap="round"/> </svg> <p class="tabs_advantages_item" v-html="option"></p> </div> </div> </div> </div> </div> {% endverbatim %} </div> </div> </div> </div> </div> {# typeCreditCal 1 && Step 1 #} <div class="calc_module_block_right" v-if="typeCreditCalc === 1 && step === 1"> <p class="module_block_right_title">{{ 'finance.credit.credit_our_proposal'|trans({}, 'portal_base') }}</p> <p class="module_block_right_sub-title">{{ 'finance.credit.credit_our_cond'|trans({}, 'portal_base') }}</p> <img class="module_block_right-shadow-car-img" src="{{ asset('bundles/portal/img/service/shadow-car.png') }}" alt=""> </div> {# typeCreditCal 1 && Step 2 #} <div class="calc_module_block_right" v-if="typeCreditCalc === 1 && step === 2 && isNotEnoughDataForEstimate"> <div class="selected_car_head_wrapper"> <div class="selected_car_head_cover"> <p class="module_block_right_title module_block_right_title-last">{{ 'finance.credit.credit_our_proposal'|trans({}, 'portal_base') }}</p> <p class="module_block_right_sub-title module_block_right_sub-title-margin"> <svg width="20" height="20" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg" class="modal_show_tooltip"><path fill-rule="evenodd" clip-rule="evenodd" d="M4.99953 0C6.38053 0 7.63041 0.559381 8.53504 1.46401C9.43968 2.36959 10 3.61947 10 4.99953C10 6.38053 9.43968 7.63041 8.53504 8.53504C7.63041 9.43968 6.38053 10 4.99953 10C3.61947 10 2.36959 9.43968 1.46401 8.53504C0.559381 7.63041 0 6.38053 0 4.99953C0 3.61947 0.559381 2.36864 1.46401 1.46401C2.36864 0.559381 3.61947 0 4.99953 0ZM7.98321 2.01585C7.22007 1.25271 6.16451 0.780115 4.99953 0.780115C3.83454 0.780115 2.77993 1.25271 2.01585 2.01585C1.25271 2.77993 0.780115 3.83454 0.780115 4.99953C0.780115 6.16451 1.25271 7.22007 2.01585 7.98321C2.77993 8.74634 3.83454 9.21894 4.99953 9.21894C6.16451 9.21894 7.22007 8.74634 7.98321 7.98321C8.74634 7.22007 9.21894 6.16451 9.21894 4.99953C9.21894 3.83454 8.74634 2.77993 7.98321 2.01585ZM4.95614 3.1714C4.74106 3.1714 4.56655 2.99689 4.56655 2.78181C4.56655 2.5658 4.74106 2.39128 4.95614 2.39128H5.04292C5.25894 2.39128 5.43345 2.5658 5.43345 2.78181C5.43345 2.99689 5.25894 3.1714 5.04292 3.1714H4.95614ZM4.60617 4.0732C4.60617 3.85813 4.78068 3.68361 4.9967 3.68361C5.21177 3.68361 5.38628 3.85813 5.38628 4.0732V7.21819C5.38628 7.43326 5.21177 7.60872 4.9967 7.60872C4.78068 7.60872 4.60617 7.43326 4.60617 7.21819V4.0732Z" fill="#E40C25"></path></svg> <span v-html="messageError"></span> </p> <div class="module_block_select_car_wrapper"> <div class="block_select_car_box"> <div class="block_select_car_box_content"> <div class="select_car_content_name_box"> <p class="module_block_right_sub-title" v-html="continue_first_least + formatToCurrency(needIncreaseSum)"></p> </div> </div> </div> </div> </div> </div> <div class="calc_module_btn_wrapper calc_module_btn_wrapper__width"> <button class="calc_module_btn calc_module_btn_select" @click="toggleIncreaseSumForFirstPayment">{{ 'finance.credit.credit_increase_first_payment_button'|trans({}, 'portal_base') }}</button> <button class="calc_module_btn calc_module_btn-white calc_module_btn_select" @click="showModalCallMe">{{ 'finance.credit.consult'|trans({}, 'portal_base') }}</button> </div> </div> <div class="calc_module_block_right" v-else-if="typeCreditCalc === 1 && step === 2"> <p class="module_block_right_title">{{ 'finance.credit.credit_our_proposal'|trans({}, 'portal_base') }}</p> <p class="module_block_right_sub-title">{{ 'finance.credit.credit_our_cond'|trans({}, 'portal_base') }}</p> <div class="module_block_select_car_wrapper"> <p class="module_block_select_title">{{ 'finance.credit.credit_select_auto'|trans({}, 'portal_base') }}</p> <div class="block_select_car_box"> <img class="module_block_right-select-car-img" :src="vehicleInfo.image" alt=""> <div class="block_select_car_box_content"> <div class="select_car_content_name_box"> <p class="block_select_car_content_name" v-html="getFullNameForVehicle()"></p> <p class="block_select_car_content_price"><span v-html="formatToCurrency(vehicleInfo.price)"></span></p> </div> <button class="block_select_car_change" @click="setStep(1);scrollToStep();">{{ 'finance.credit.credit_change'|trans({}, 'portal_base') }}</button> </div> </div> </div> </div> {# typeCreditCal 2 && Step 1 #} <div class="calc_module_block_right" v-if="typeCreditCalc === 2 && step === 1"> <p class="module_block_right_title module_block_right_title-last">{{ 'finance.credit.credit_calc_auto_your_wallet'|trans({}, 'portal_base') }}</p> <p class="module_block_right_sub-title">{{ 'finance.credit.credit_select_next_auto'|trans({}, 'portal_base') }}</p> <div class="module_block_select_car_wrapper"> <div class="car_credit_select_wrapper"> <div class="car_credit_select_box" v-for="blurBlock in 3"> <img src="{{ asset('bundles/portal/img/service/shadow-car.jpg') }}" alt=""> <div class="car_credit_select_info car_credit_select_box_blur"> <p class="car_credit_select_title">LAND ROVER DISCOVERY SPORT BASE</p> <p class="car_credit_select_tech">2.0 (163 к.с.) 2023</p> <div class="car_credit_select_price_wrapper"> <div class="car_credit_select_price_first"> <span class="price_first">1 233 340 грн</span> <p class="price_last">1 177 340 грн</p> </div> <p class="car_credit_select_price">82 458 {{ 'finance.credit.uah_month'|trans({}, 'portal_base') }}</p> <p class="car_credit_select_price">{{ 'finance.credit.select'|trans({}, 'portal_base') }}</p> </div> </div> </div> </div> </div> </div> {# typeCreditCal 2 && Step 2 #} <div class="calc_module_block_right" v-if="typeCreditCalc === 2 && step === 2"> <p class="module_block_right_title module_block_right_title-last">{{ 'base.home.selection.credit_leasing'|trans({}, 'portal_base') }}</p> <div class="module_block_select_car_wrapper"> <div class="calc_swap_money"> <div class="calc_swap_money-item" :class="{'active' : !isUsed}" @click="setTypeVehicle('new')"> <span>{{ 'base.new'|trans({}, 'portal_base') }}{% verbatim %} ({{vehiclesByWallet.notUsed.length}} авто){% endverbatim %}</span> </div> <div class="calc_swap_money-item" :class="{'active' : isUsed}" @click="setTypeVehicle('used')"> <span>{{ 'finance.credit.credit_old'|trans({}, 'portal_base') }}{% verbatim %} ({{vehiclesByWallet.used.length}} авто){% endverbatim %}</span> </div> </div> <div v-if="isUsed ? vehiclesByWallet.used.length > 0 : vehiclesByWallet.notUsed.length > 0" class="car_credit_select_wrapper"> <div class="car_credit_select_box car_credit_select_box_border" @click="selectVehicle(vehicle)" v-for="vehicle in (isUsed ? vehiclesByWallet.used : vehiclesByWallet.notUsed)"> <div class="image-car-container"> <img :src="vehicle.image" alt=""> <p v-if="vehicle?.has_in_stock" class="overlay-car-text">{{ 'finance.credit.in_salon'|trans({}, 'portal_base') }}</p> </div> <div class="car_credit_select_info"> <p class="car_credit_select_title" v-html="getFullNameForVehicle(vehicle.fullName, vehicle.equipmentTitle)"></p> <p class="car_credit_select_tech" v-html="vehicle.engineVolume + ' (' + vehicle.enginePower + ' ' + ks + ') ' + vehicle.year"></p> <div class="car_credit_select_price_wrapper"> <div class="car_credit_select_price_first"> <span class="price_first" v-if="vehicle?.hasActionPrice" v-html="formatToCurrency(vehicle.fullPrice)"></span> <p class="price_last" v-html="formatToCurrency(vehicle.price)"></p> </div> <p class="car_credit_select_price" v-html="formatToCurrency(vehicle.paymentPerMonth) + '/' + translate_month"></p> <div class="car_credit_select_price-btn">{{ 'finance.credit.select'|trans({}, 'portal_base') }}</div> </div> </div> </div> </div> <div v-else class="car_credit_select_wrapper"> <div class="selected_car_head_wrapper"> <div class="selected_car_head_cover"> <p class="module_block_right_sub-title module_block_right_sub-title-margin"> <svg width="20" height="20" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg" class="modal_show_tooltip"><path fill-rule="evenodd" clip-rule="evenodd" d="M4.99953 0C6.38053 0 7.63041 0.559381 8.53504 1.46401C9.43968 2.36959 10 3.61947 10 4.99953C10 6.38053 9.43968 7.63041 8.53504 8.53504C7.63041 9.43968 6.38053 10 4.99953 10C3.61947 10 2.36959 9.43968 1.46401 8.53504C0.559381 7.63041 0 6.38053 0 4.99953C0 3.61947 0.559381 2.36864 1.46401 1.46401C2.36864 0.559381 3.61947 0 4.99953 0ZM7.98321 2.01585C7.22007 1.25271 6.16451 0.780115 4.99953 0.780115C3.83454 0.780115 2.77993 1.25271 2.01585 2.01585C1.25271 2.77993 0.780115 3.83454 0.780115 4.99953C0.780115 6.16451 1.25271 7.22007 2.01585 7.98321C2.77993 8.74634 3.83454 9.21894 4.99953 9.21894C6.16451 9.21894 7.22007 8.74634 7.98321 7.98321C8.74634 7.22007 9.21894 6.16451 9.21894 4.99953C9.21894 3.83454 8.74634 2.77993 7.98321 2.01585ZM4.95614 3.1714C4.74106 3.1714 4.56655 2.99689 4.56655 2.78181C4.56655 2.5658 4.74106 2.39128 4.95614 2.39128H5.04292C5.25894 2.39128 5.43345 2.5658 5.43345 2.78181C5.43345 2.99689 5.25894 3.1714 5.04292 3.1714H4.95614ZM4.60617 4.0732C4.60617 3.85813 4.78068 3.68361 4.9967 3.68361C5.21177 3.68361 5.38628 3.85813 5.38628 4.0732V7.21819C5.38628 7.43326 5.21177 7.60872 4.9967 7.60872C4.78068 7.60872 4.60617 7.43326 4.60617 7.21819V4.0732Z" fill="#E40C25"></path></svg> <span style="width: 100%">{{ 'finance.credit.credit_not_find'|trans({}, 'portal_base') }}</span> </p> <div class="module_block_select_car_wrapper"> <div class="block_select_car_box"> <div class="block_select_car_box_content"> <div class="select_car_content_name_box"> <p class="module_block_right_sub-title">{{ 'finance.credit.credit_try_again'|trans({}, 'portal_base') }}</p> </div> </div> </div> </div> </div> </div> </div> </div> </div> {# typeCreditCal 1/2 && Step 3 #} <div class="calc_module_block_right" v-if="step === 3"> <p v-if="typeCreditCalc === 1" class="module_block_right_title module_block_right_title-last">{{ 'finance.credit.credit_our_proposal'|trans({}, 'portal_base') }}</p> <p v-else class="module_block_right_title module_block_right_title-last">{{ 'base.home.selection.credit_leasing'|trans({}, 'portal_base') }}</p> <div class="selected_car_head_wrapper"> <div class="selected_car_head_cover"> <div class="selected_car_head_box"> <div class="selected_car_head_box_head"> <div class="selected_car_box-title">{{ 'finance.credit.credit_select_auto'|trans({}, 'portal_base') }} <button class="block_select_car_change" @click.prevent="setStep(1);scrollToStep();">( {{ 'finance.credit.credit_change'|trans({}, 'portal_base')|lower }} )</button> :</div> </div> <div class="selected_car_head_box_info_wrapper"> <div class="selected_car_head_box_info"> <p class="head_box_info-name head_box_info-name-first" v-html="getFullNameForVehicle()"></p> <span class="head_box_info-price"><span class="error_text_red" v-html="formatToCurrency(vehicleInfo.price)"></span></span> </div> </div> </div> </div> <div class="selected_car_head_cover"> <div class="selected_car_head_box"> <div class="selected_car_head_box_head"> <p class="selected_car_box-title">{{ 'card_car.article.credit_calculation'|trans({}, 'portal_base') }} {{ 'card_car.article.from'|trans({}, 'portal_base') }} {% verbatim %}{{creditCalc.programElement?.bankName}}{% endverbatim %}*: </p> {% verbatim %} <span class="selected_car_box-price">{{ translate_under }} {{creditCalc.programElement?.percent}} %</span> {% endverbatim %} </div> <div class="selected_car_head_box_info_wrapper"> <div class="selected_car_head_box_info"> <p class="head_box_info-name">{{ 'card_car.article.monthly_payment'|trans({}, 'portal_base') }}</p> <span class="head_box_info-price" v-html="formatToCurrency(creditCalc.monthPayment)"></span> </div> <div class="selected_car_head_box_info"> <p class="head_box_info-name">{{ 'finance.credit.term_credit'|trans({}, 'portal_base') }}</p> {% verbatim %} <span class="head_box_info-price">{{ showedTerm }} {{ translate_month }}</span> {% endverbatim %} </div> </div> </div> </div> <div class="selected_car_head_cover"> <div class="selected_car_head_box"> <div class="selected_car_head_box_head selected_car_head_box_head_bottom"> <div class="selected_car_head_box_head_box"> <p class="selected_car_box-title">{{ 'finance.credit.credit_once_payment_1'|trans({}, 'portal_base') }}</p> <p class="selected_car_box-title">{{ 'finance.credit.credit_once_payment_2'|trans({}, 'portal_base') }}:</p> </div> <span class="selected_car_box-price" v-html="formatToCurrency(showTotalPrice)"></span> </div> <div class="selected_car_head_box_info_wrapper"> <div class="selected_car_head_box_info"> <p class="head_box_info-name" v-html="translate_first_payment +', ' + showFirstPercent + '%'"></p> <span class="head_box_info-price" v-html="formatToCurrency(showFirstPrice)"></span> </div> <div class="selected_car_head_box_info"> {# <p class="head_box_info-name" v-html="'КАСКО, ' + creditCalc.cascoPercentName +'%' '<strong>(франшиза)</strong>'"></p> #} <p class="head_box_info-name" v-html="'КАСКО, ' + creditCalc.cascoPercentName + '% <strong>(франшиза)</strong>'"></p> <span class="head_box_info-price" v-html="formatToCurrency(creditCalc.cascoPrice)"></span> </div> <div class="selected_car_head_box_info"> <p class="head_box_info-name">{{ 'card_car.article.time_commission'|trans({}, 'portal_base') }}</p> <span class="head_box_info-price" v-html="formatToCurrency(creditCalc.onceComission)"></span> </div> <div class="selected_car_head_box_info"> <p v-if="isUsed" class="head_box_info-name">{{ 'card_car.article.used_registration'|trans({}, 'portal_base')|raw }}</p> <p v-else class="head_box_info-name info-name-short">{{ 'card_car.article.first_registration_strong'|trans({}, 'portal_base')|raw }}</p> <span class="head_box_info-price" v-html="formatToCurrency(creditCalc.registrationMrev)"></span> </div> <div v-if="!isUsed" class="selected_car_head_box_info"> <p class="head_box_info-name">{{ 'card_car.article.notary_services'|trans({}, 'portal_base') }}</p> <span class="head_box_info-price">5 000 грн</span> </div> </div> </div> </div> <p class="selected_car_head_text">* {{ 'card_car.article.current_agreement'|trans({}, 'portal_base') }}</p> </div> <div class="calc_module_btn_wrapper calc_module_btn_wrapper__width"> <button @click.prevent="sendLead" class="calc_module_btn calc_module_btn_select">{{ 'finance.credit.consult'|trans({}, 'portal_base') }}</button> <button class="calc_module_btn calc_module_btn-white calc_module_btn_select credit_down_paym_btn" @click.prevent="downloadSchedulePayment"> <svg width="21" height="20" viewbox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M20.5 15.9192V7.44263C20.4991 6.61411 20.1695 5.8198 19.5837 5.23396C18.9978 4.64811 18.2035 4.31857 17.375 4.31763H13.9961C13.8303 4.31763 13.6714 4.38347 13.5542 4.50068C13.4369 4.6179 13.3711 4.77687 13.3711 4.94263C13.3711 5.10839 13.4369 5.26736 13.5542 5.38457C13.6714 5.50178 13.8303 5.56763 13.9961 5.56763H17.375C17.8721 5.56818 18.3487 5.76591 18.7002 6.11742C19.0517 6.46893 19.2494 6.94552 19.25 7.44263V15.9192C19.2494 16.4163 19.0517 16.8929 18.7002 17.2444C18.3487 17.5959 17.8721 17.7936 17.375 17.7942H3.625C3.12789 17.7936 2.6513 17.5959 2.29979 17.2444C1.94828 16.8929 1.75056 16.4163 1.75 15.9192V7.44263C1.75056 6.94552 1.94828 6.46893 2.29979 6.11742C2.6513 5.76591 3.12789 5.56818 3.625 5.56763H7.24008C7.40584 5.56763 7.56481 5.50178 7.68202 5.38457C7.79923 5.26736 7.86508 5.10839 7.86508 4.94263C7.86508 4.77687 7.79923 4.6179 7.68202 4.50068C7.56481 4.38347 7.40584 4.31763 7.24008 4.31763H3.625C2.79649 4.31857 2.00218 4.64811 1.41633 5.23396C0.830483 5.8198 0.500941 6.61411 0.5 7.44263V15.9192C0.500931 16.7477 0.830469 17.542 1.41632 18.1279C2.00217 18.7137 2.79648 19.0433 3.625 19.0442H17.375C18.2035 19.0433 18.9978 18.7137 19.5837 18.1279C20.1695 17.542 20.4991 16.7477 20.5 15.9192ZM13.9729 8.89071C14.098 8.9995 14.1747 9.1535 14.1862 9.31886C14.1977 9.48421 14.1431 9.64736 14.0343 9.77243L10.9716 13.2936C10.9129 13.361 10.8404 13.4151 10.7591 13.4522C10.6777 13.4892 10.5894 13.5084 10.5 13.5084C10.4106 13.5084 10.3223 13.4892 10.2409 13.4522C10.1596 13.4151 10.0871 13.361 10.0284 13.2936L6.96566 9.77235C6.85773 9.64717 6.80378 9.48432 6.81562 9.31945C6.82746 9.15458 6.90413 9.00112 7.02885 8.89264C7.15357 8.78416 7.31619 8.72951 7.4811 8.74065C7.64602 8.75178 7.79982 8.82779 7.90883 8.95204L9.875 11.2125V1.58099C9.875 1.41522 9.94085 1.25625 10.0581 1.13904C10.1753 1.02183 10.3342 0.955986 10.5 0.955986C10.6658 0.955986 10.8247 1.02183 10.9419 1.13904C11.0592 1.25625 11.125 1.41522 11.125 1.58099V11.2125L13.0912 8.95204C13.145 8.89011 13.2106 8.8394 13.284 8.80279C13.3575 8.76619 13.4375 8.74442 13.5193 8.73872C13.6012 8.73301 13.6834 8.74349 13.7612 8.76956C13.8391 8.79563 13.911 8.83677 13.9729 8.89063V8.89071Z" fill="#E40C25"/> </svg> <span> {{ 'finance.credit.credit_down_paym'|trans({}, 'portal_base') }} </span> </button> </div> </div> </div> <div class="modal fade modal__step__custom" id="increase-first-payment" tabindex="-1" role="dialog" aria-labelledby="increaseFirstPayLabel" aria-hidden="true"> <div class="modal-dialog modal__step__custom__dialog modal-dialog-centered" role="document"> <div class="11 modal-content modal__step__custom__content modal__step__custom-btn"> <div class="modal-header modal__step__custom__header"> <p class="modal-title modal__step__custom__title" id="increaseFirstPayLabel">{{ 'finance.credit.credit_increase_first_payment'|trans({}, 'portal_base')|capitalize }}</p> <button type="button" @click="toggleIncreaseSumForFirstPayment" class="close modal__step__custom__close" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body modal__step__custom__body"> <p class="modal__step__custom__text">{{ 'finance.credit.credit_increase_first_payment_want'|trans({}, 'portal_base') }}</p> <div class="modal__step__custom__input mb-5"> <formatted-input v-model="increaseSumForFirstPayment" :class="{'error_input' : formErrors.increaseSumForFirstPayment }" :min="needIncreaseSum" placeholder="{{ 'finance.credit.for_example'|trans({}, 'portal_base') }}, на 100 000 грн"></formatted-input> </div> </div> <div class="modal-footer modal__step__custom__footer mt-0 mb-4"> <button type="button" @click="increaseFirstPayment" :disabled="formErrors.increaseSumForFirstPayment" class="modal__step__custom__btn">{{ 'finance.credit.credit_change'|trans({}, 'portal_base') }}</button> </div> </div> </div> </div> <div class="modal fade modal__step__custom" id="application-created" tabindex="-1" role="dialog" aria-labelledby="applicationCreatedLabel" aria-hidden="true"> <div class="modal-dialog modal__step__custom__dialog modal-dialog-centered modal_dialog_two_header" role="document"> <div class="modal-content modal__step__custom__content modal__step__custom-btn modal_custom_two_header"> <div class="modal-header modal__step__custom__header"> <p class="modal-title modal__step__custom__title modal_custom_two_title" id="applicationCreatedLabel">{{ 'card_car.article.application_created'|trans({}, 'portal_base') }}</p> <button type="button" @click="toggleApplicationCreated" class="close modal__step__custom__close" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body modal__step__custom__body modal_custom_two_body"> <p class="modal__step__custom__text modal_step_custom_text_16">{{ 'card_car.article.contact_near_future'|trans({}, 'portal_base') }}</p> <p class="modal__step__custom__text modal_step_custom_text_16">{{ 'card_car.article.thank_you_choosing'|trans({}, 'portal_base') }}</p> </div> <div class="modal-footer modal__step__custom__footer modal_custom_two_btn mt-4 mb-4"> <a type="button" :href="homePage + vehicleInfo?.href" class="calc_module_btn calc_module_btn_select link-like-a-button">{{ 'card_car.article.go_to_select_vehicle'|trans({}, 'portal_base') }}</a> <a type="button" :href="homePage" class="calc_module_btn calc_module_btn-white calc_module_btn_select link-like-a-button">{{ 'card_car.article.go_to_main_page'|trans({}, 'portal_base') }}</a> </div> </div> </div> </div> </div> </section> {# ========================================END======================================================= #} {# =======================================MODULE===================================================== #} <section class="section_doc"> <div class="container"> <h2 class="doc_title">{{ 'finance.credit.credit_need_document'|trans({}, 'portal_base') }}</h2> <div class="doc_wrapper"> <div class="doc_box"> <p class="doc_name">{{ 'finance.credit.credit_fop'|trans({}, 'portal_base') }}</p> <ul class="doc_list"> <li class="doc_list_text">{{ 'finance.credit.credit_pass_id'|trans({}, 'portal_base') }}</li> <li class="doc_list_text">{{ 'finance.credit.credit_ipn'|trans({}, 'portal_base') }}</li> <li class="doc_list_text">{{ 'finance.credit.credit_pass_spouse'|trans({}, 'portal_base') }}</li> <li class="doc_list_text">{{ 'finance.credit.credit_copy_marriage'|trans({}, 'portal_base') }}</li> <li class="doc_list_text">{{ 'finance.credit.credit_cert_work'|trans({}, 'portal_base') }}</li> </ul> <button class="doc_btn" type="button" @click.prevent="loadListDocument(false)"> <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M22.5498 3.64041L19.2323 0.323063C19.024 0.11475 18.747 0 18.4523 0H4.485C3.8768 0 3.38194 0.494859 3.38194 1.10306V12.0242H2.60625C1.79082 12.0242 1.12744 12.6876 1.12744 13.503V20.2666C1.12744 21.082 1.79082 21.7455 2.60625 21.7455H14.2547C14.8629 21.7455 15.3578 21.2506 15.3578 20.6424V15.3818C15.3578 14.7736 14.8629 14.2787 14.2547 14.2787H2.60625C2.17852 14.2787 1.83057 13.9308 1.83057 13.503C1.83057 13.0753 2.17852 12.7274 2.60625 12.7274H3.38194V13.1274C3.38194 13.3216 3.53935 13.479 3.7335 13.479C3.92766 13.479 4.08507 13.3216 4.08507 13.1274V1.10306C4.08507 0.882516 4.2645 0.703125 4.485 0.703125H18.0364V4.10911C18.0364 4.51017 18.3627 4.83647 18.7637 4.83647H22.1697V22.8969C22.1697 23.1175 21.9903 23.2969 21.7698 23.2969H4.485C4.26446 23.2969 4.08507 23.1175 4.08507 22.8969C4.08507 22.7028 3.92766 22.5454 3.7335 22.5454C3.53935 22.5454 3.38194 22.7028 3.38194 22.8969C3.38194 23.5052 3.8768 24 4.485 24H21.7698C22.378 24 22.8728 23.5051 22.8728 22.8969V4.42041C22.8729 4.1258 22.7581 3.84877 22.5498 3.64041ZM2.60625 14.9819H14.2547C14.4752 14.9819 14.6546 15.1613 14.6546 15.3818V20.6424C14.6546 20.863 14.4752 21.0424 14.2547 21.0424H2.60625C2.17852 21.0424 1.83057 20.6944 1.83057 20.2666V14.7616C2.05618 14.9013 2.32196 14.9819 2.60625 14.9819ZM18.7395 4.10911V0.824672L22.0483 4.13334H18.7637C18.7504 4.13334 18.7395 4.12247 18.7395 4.10911Z" fill="#E40C25"/> <path d="M11.0894 19.8556C11.2835 19.8556 11.4409 19.6982 11.4409 19.5041V18.3353H12.2027C12.3968 18.3353 12.5542 18.1779 12.5542 17.9838C12.5542 17.7896 12.3968 17.6322 12.2027 17.6322H11.4409V16.8716H12.2988C12.4929 16.8716 12.6503 16.7142 12.6503 16.52C12.6503 16.3258 12.4929 16.1685 12.2988 16.1685H11.0894C10.8952 16.1685 10.7378 16.3258 10.7378 16.52V19.504C10.7378 19.6982 10.8952 19.8556 11.0894 19.8556Z" fill="#E40C25"/> <path d="M7.39445 19.7202C7.46031 19.7856 7.54937 19.8223 7.64214 19.8223H7.64345C7.66843 19.8222 8.25742 19.8199 8.49268 19.8158C9.36142 19.8006 9.99198 19.0421 9.99198 18.0122C9.99198 16.9295 9.37731 16.202 8.4624 16.202H7.63623C7.54286 16.202 7.45337 16.2392 7.38742 16.3052C7.32147 16.3713 7.28448 16.4609 7.28467 16.5542V16.5565V16.5566V19.4233C7.28467 19.4475 7.28711 19.471 7.29175 19.4938C7.29737 19.5791 7.33347 19.6597 7.39445 19.7202ZM8.4624 16.9052C9.07178 16.9052 9.28886 17.477 9.28886 18.0122C9.28886 18.7627 8.88283 19.1058 8.4804 19.1128C8.36856 19.1147 8.16901 19.1163 7.99248 19.1174C7.99136 18.7725 7.98901 17.2639 7.9884 16.9052H8.4624Z" fill="#E40C25"/> <path d="M4.47412 19.8667C4.66828 19.8667 4.82568 19.7093 4.82568 19.5151V18.5591C5.00025 18.5581 5.19871 18.5572 5.31112 18.5572C5.9819 18.5572 6.52762 18.019 6.52762 17.3574C6.52762 16.6957 5.9819 16.1575 5.31112 16.1575H4.47412C4.3807 16.1575 4.29112 16.1947 4.22512 16.2608C4.1594 16.3267 4.12261 16.416 4.12261 16.509L4.12256 19.5151C4.12256 19.7093 4.27996 19.8667 4.47412 19.8667ZM5.31112 16.8606C5.58942 16.8606 5.8245 17.0882 5.8245 17.3574C5.8245 17.6267 5.58942 17.8542 5.31112 17.8542C5.19946 17.8542 5.00348 17.855 4.82957 17.8559C4.82864 17.6764 4.82723 17.0486 4.82671 16.8607H5.31112V16.8606Z" fill="#E40C25"/> <path d="M11.0604 10.1935C10.1963 10.4662 9.30949 10.8437 8.83643 11.332C8.4461 11.7349 8.37537 12.2023 8.64232 12.6145C8.82349 12.8942 9.07254 13.0404 9.35257 13.0404C9.46006 13.0404 9.57213 13.0189 9.68665 12.9751C10.0998 12.8171 10.5459 12.3677 11.0506 11.6012C11.2136 11.3537 11.3785 11.0787 11.5427 10.7812C11.6025 10.7636 11.6634 10.7461 11.7258 10.7287C12.7179 10.4511 13.8404 10.2496 14.8255 10.1654C15.426 10.7461 16.0467 11.1986 16.5759 11.322C17.1581 11.4578 17.6196 11.1916 17.8102 10.6099C17.9257 10.2575 17.7927 9.92524 17.4545 9.7211C17.1068 9.51115 16.5026 9.40976 15.6589 9.41942C15.4793 9.42148 15.2896 9.42879 15.0923 9.44102C14.7133 9.05018 14.319 8.58307 13.9392 8.06721C13.6451 7.6676 13.3821 7.26771 13.1597 6.8876C13.1839 6.80431 13.2069 6.72213 13.2287 6.64142C13.469 5.75018 13.5547 5.06782 13.4834 4.61323C13.3804 3.95674 12.9567 3.86351 12.7794 3.85395C12.1754 3.82127 11.7686 4.12601 11.6912 4.66906C11.6297 5.10045 11.7747 5.69398 12.1223 6.4331C12.205 6.60879 12.2976 6.78987 12.3994 6.97479C12.3615 7.09648 12.3204 7.22309 12.2758 7.35485C11.9517 8.31363 11.5128 9.33527 11.0604 10.1935ZM9.37207 12.3354C9.34699 12.3386 9.30471 12.3439 9.23243 12.2322C9.1736 12.1414 9.17042 12.0729 9.22062 11.9793C9.33799 11.7605 9.73873 11.4535 10.5142 11.1363C9.97296 11.9757 9.56848 12.3109 9.37207 12.3354ZM17.1479 10.367C17.1474 10.3714 17.146 10.3791 17.1421 10.3909C17.0543 10.6589 16.9363 10.6841 16.7356 10.6373C16.4906 10.5802 16.1795 10.3992 15.8324 10.1222C16.7722 10.1297 17.1 10.299 17.1479 10.367ZM12.3872 4.76834C12.4016 4.66784 12.4176 4.55482 12.6851 4.55482C12.7019 4.55482 12.7198 4.55529 12.7386 4.55618C12.8187 4.65373 12.8599 5.08774 12.6746 5.94668C12.4564 5.44629 12.3499 5.0306 12.3872 4.76834ZM12.8768 7.76853C13.0311 8.00567 13.1971 8.24515 13.373 8.48412C13.6254 8.82696 13.9105 9.18288 14.212 9.52263C13.8632 9.56473 13.5034 9.61906 13.1434 9.6844C12.8998 9.7286 12.4752 9.81199 11.9781 9.93598C12.0884 9.70737 12.1971 9.47042 12.3034 9.22676C12.5149 8.74259 12.7093 8.24717 12.8768 7.76853Z" fill="#E40C25"/> </svg> <span>{{ 'finance.credit.credit_download_doc'|trans({}, 'portal_base') }}</span> </button> </div> <div class="doc_box"> <p class="doc_name">{{ 'finance.credit.credit_llc'|trans({}, 'portal_base') }}</p> <ul class="doc_list"> <li class="doc_list_text">{{ 'finance.credit.credit_cert_get_credit'|trans({}, 'portal_base') }}</li> <li class="doc_list_text">{{ 'finance.credit.credit_official_report'|trans({}, 'portal_base') }}*</li> </ul> <button class="doc_btn" type="button" @click.prevent="loadListDocument(true)"> <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M22.5498 3.64041L19.2323 0.323063C19.024 0.11475 18.747 0 18.4523 0H4.485C3.8768 0 3.38194 0.494859 3.38194 1.10306V12.0242H2.60625C1.79082 12.0242 1.12744 12.6876 1.12744 13.503V20.2666C1.12744 21.082 1.79082 21.7455 2.60625 21.7455H14.2547C14.8629 21.7455 15.3578 21.2506 15.3578 20.6424V15.3818C15.3578 14.7736 14.8629 14.2787 14.2547 14.2787H2.60625C2.17852 14.2787 1.83057 13.9308 1.83057 13.503C1.83057 13.0753 2.17852 12.7274 2.60625 12.7274H3.38194V13.1274C3.38194 13.3216 3.53935 13.479 3.7335 13.479C3.92766 13.479 4.08507 13.3216 4.08507 13.1274V1.10306C4.08507 0.882516 4.2645 0.703125 4.485 0.703125H18.0364V4.10911C18.0364 4.51017 18.3627 4.83647 18.7637 4.83647H22.1697V22.8969C22.1697 23.1175 21.9903 23.2969 21.7698 23.2969H4.485C4.26446 23.2969 4.08507 23.1175 4.08507 22.8969C4.08507 22.7028 3.92766 22.5454 3.7335 22.5454C3.53935 22.5454 3.38194 22.7028 3.38194 22.8969C3.38194 23.5052 3.8768 24 4.485 24H21.7698C22.378 24 22.8728 23.5051 22.8728 22.8969V4.42041C22.8729 4.1258 22.7581 3.84877 22.5498 3.64041ZM2.60625 14.9819H14.2547C14.4752 14.9819 14.6546 15.1613 14.6546 15.3818V20.6424C14.6546 20.863 14.4752 21.0424 14.2547 21.0424H2.60625C2.17852 21.0424 1.83057 20.6944 1.83057 20.2666V14.7616C2.05618 14.9013 2.32196 14.9819 2.60625 14.9819ZM18.7395 4.10911V0.824672L22.0483 4.13334H18.7637C18.7504 4.13334 18.7395 4.12247 18.7395 4.10911Z" fill="#E40C25"/> <path d="M11.0894 19.8556C11.2835 19.8556 11.4409 19.6982 11.4409 19.5041V18.3353H12.2027C12.3968 18.3353 12.5542 18.1779 12.5542 17.9838C12.5542 17.7896 12.3968 17.6322 12.2027 17.6322H11.4409V16.8716H12.2988C12.4929 16.8716 12.6503 16.7142 12.6503 16.52C12.6503 16.3258 12.4929 16.1685 12.2988 16.1685H11.0894C10.8952 16.1685 10.7378 16.3258 10.7378 16.52V19.504C10.7378 19.6982 10.8952 19.8556 11.0894 19.8556Z" fill="#E40C25"/> <path d="M7.39445 19.7202C7.46031 19.7856 7.54937 19.8223 7.64214 19.8223H7.64345C7.66843 19.8222 8.25742 19.8199 8.49268 19.8158C9.36142 19.8006 9.99198 19.0421 9.99198 18.0122C9.99198 16.9295 9.37731 16.202 8.4624 16.202H7.63623C7.54286 16.202 7.45337 16.2392 7.38742 16.3052C7.32147 16.3713 7.28448 16.4609 7.28467 16.5542V16.5565V16.5566V19.4233C7.28467 19.4475 7.28711 19.471 7.29175 19.4938C7.29737 19.5791 7.33347 19.6597 7.39445 19.7202ZM8.4624 16.9052C9.07178 16.9052 9.28886 17.477 9.28886 18.0122C9.28886 18.7627 8.88283 19.1058 8.4804 19.1128C8.36856 19.1147 8.16901 19.1163 7.99248 19.1174C7.99136 18.7725 7.98901 17.2639 7.9884 16.9052H8.4624Z" fill="#E40C25"/> <path d="M4.47412 19.8667C4.66828 19.8667 4.82568 19.7093 4.82568 19.5151V18.5591C5.00025 18.5581 5.19871 18.5572 5.31112 18.5572C5.9819 18.5572 6.52762 18.019 6.52762 17.3574C6.52762 16.6957 5.9819 16.1575 5.31112 16.1575H4.47412C4.3807 16.1575 4.29112 16.1947 4.22512 16.2608C4.1594 16.3267 4.12261 16.416 4.12261 16.509L4.12256 19.5151C4.12256 19.7093 4.27996 19.8667 4.47412 19.8667ZM5.31112 16.8606C5.58942 16.8606 5.8245 17.0882 5.8245 17.3574C5.8245 17.6267 5.58942 17.8542 5.31112 17.8542C5.19946 17.8542 5.00348 17.855 4.82957 17.8559C4.82864 17.6764 4.82723 17.0486 4.82671 16.8607H5.31112V16.8606Z" fill="#E40C25"/> <path d="M11.0604 10.1935C10.1963 10.4662 9.30949 10.8437 8.83643 11.332C8.4461 11.7349 8.37537 12.2023 8.64232 12.6145C8.82349 12.8942 9.07254 13.0404 9.35257 13.0404C9.46006 13.0404 9.57213 13.0189 9.68665 12.9751C10.0998 12.8171 10.5459 12.3677 11.0506 11.6012C11.2136 11.3537 11.3785 11.0787 11.5427 10.7812C11.6025 10.7636 11.6634 10.7461 11.7258 10.7287C12.7179 10.4511 13.8404 10.2496 14.8255 10.1654C15.426 10.7461 16.0467 11.1986 16.5759 11.322C17.1581 11.4578 17.6196 11.1916 17.8102 10.6099C17.9257 10.2575 17.7927 9.92524 17.4545 9.7211C17.1068 9.51115 16.5026 9.40976 15.6589 9.41942C15.4793 9.42148 15.2896 9.42879 15.0923 9.44102C14.7133 9.05018 14.319 8.58307 13.9392 8.06721C13.6451 7.6676 13.3821 7.26771 13.1597 6.8876C13.1839 6.80431 13.2069 6.72213 13.2287 6.64142C13.469 5.75018 13.5547 5.06782 13.4834 4.61323C13.3804 3.95674 12.9567 3.86351 12.7794 3.85395C12.1754 3.82127 11.7686 4.12601 11.6912 4.66906C11.6297 5.10045 11.7747 5.69398 12.1223 6.4331C12.205 6.60879 12.2976 6.78987 12.3994 6.97479C12.3615 7.09648 12.3204 7.22309 12.2758 7.35485C11.9517 8.31363 11.5128 9.33527 11.0604 10.1935ZM9.37207 12.3354C9.34699 12.3386 9.30471 12.3439 9.23243 12.2322C9.1736 12.1414 9.17042 12.0729 9.22062 11.9793C9.33799 11.7605 9.73873 11.4535 10.5142 11.1363C9.97296 11.9757 9.56848 12.3109 9.37207 12.3354ZM17.1479 10.367C17.1474 10.3714 17.146 10.3791 17.1421 10.3909C17.0543 10.6589 16.9363 10.6841 16.7356 10.6373C16.4906 10.5802 16.1795 10.3992 15.8324 10.1222C16.7722 10.1297 17.1 10.299 17.1479 10.367ZM12.3872 4.76834C12.4016 4.66784 12.4176 4.55482 12.6851 4.55482C12.7019 4.55482 12.7198 4.55529 12.7386 4.55618C12.8187 4.65373 12.8599 5.08774 12.6746 5.94668C12.4564 5.44629 12.3499 5.0306 12.3872 4.76834ZM12.8768 7.76853C13.0311 8.00567 13.1971 8.24515 13.373 8.48412C13.6254 8.82696 13.9105 9.18288 14.212 9.52263C13.8632 9.56473 13.5034 9.61906 13.1434 9.6844C12.8998 9.7286 12.4752 9.81199 11.9781 9.93598C12.0884 9.70737 12.1971 9.47042 12.3034 9.22676C12.5149 8.74259 12.7093 8.24717 12.8768 7.76853Z" fill="#E40C25"/> </svg> <span>{{ 'finance.credit.credit_download_doc'|trans({}, 'portal_base') }}</span> </button> </div> </div> </div> </section></div> <section class="cars_leasing"> <div class="container"> <div class="cars_leasing_wrapper"> <div class="cars_leasing_box"> <p class="cars_leasing_title">{{ 'finance.credit.credit_leasing'|trans({}, 'portal_base') }}</p> <p class="cars_leasing_text">{{ 'finance.credit.credit_calc_condition'|trans({}, 'portal_base') }}</p> </div> <a class="cars_leasing_btn" href="{{ path('portal_finance_leasing') }}">{{ 'leads.calculate'|trans({}, 'portal_base')|upper }}</a> </div> </div> </section> <section class="section_credit_seo_text"> <div class="container"> <h2 class="credit_seo_title">{{ 'finance.credit.credit_where_buy'|trans({}, 'portal_base') }}</h2> <p class="credit_seo_text">{{ 'finance.credit.credit_seo_p1'|trans({}, 'portal_base') }}</p> <p class="credit_seo_text">{{ 'finance.credit.credit_seo_p2'|trans({}, 'portal_base') }}</p> <p class="credit_seo_text">{{ 'finance.credit.credit_seo_p3'|trans({}, 'portal_base') }}</p> </div> </section> <section class="section_credit_seo_text"> <div class="container"> <h2 class="credit_seo_title">{{ 'finance.credit.credit_vehicles'|trans({}, 'portal_base') }}</h2> <div class="transport_finance_wrapper"> <a href="{{ path('portal_finance_credit_catalog',{state:'new' ,type:'car'}) }}" class="transport_finance_box"> <svg width="60" height="60" viewbox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <rect x="0.5" y="0.5" width="59" height="59" rx="29.5" stroke="#E40C25"/> <path d="M44 24.874C44.0018 24.5582 43.8905 24.2523 43.6862 24.0115C43.4819 23.7707 43.1981 23.611 42.8862 23.5613L41.3872 23.3098C41.2092 23.2799 41.0266 23.2913 40.8536 23.343C40.6807 23.3947 40.5218 23.4854 40.3894 23.6081L39.9756 22.1636C39.7362 21.3381 39.2358 20.6123 38.5494 20.0949C37.863 19.5776 37.0275 19.2965 36.168 19.2937H24.1958C23.3363 19.2965 22.5008 19.5776 21.8144 20.0949C21.128 20.6123 20.6276 21.3381 20.3882 22.1636L19.866 23.986C19.7519 23.7604 19.5691 23.577 19.3439 23.4621C19.1187 23.3472 18.8629 23.3069 18.6133 23.3469L17.1172 23.5984C16.8113 23.6484 16.5325 23.8035 16.3286 24.037C16.1248 24.2705 16.0087 24.5677 16.0005 24.8775C15.9922 25.1873 16.0922 25.4904 16.2833 25.7344C16.4744 25.9784 16.7446 26.1481 17.0474 26.2144L18.4948 26.5297L18.0078 27.2617C17.4762 28.0598 17.193 28.9974 17.1939 29.9563C17.1974 29.9757 17.1902 34.7543 17.1948 34.7719V39.1187C17.196 39.5403 17.3643 39.9442 17.6629 40.2419C17.9615 40.5395 18.366 40.7066 18.7876 40.7063H20.2715C20.6931 40.7065 21.0976 40.5395 21.3962 40.2419C21.6948 39.9442 21.8632 39.5403 21.8643 39.1187V37.9353H38.5V39.1187C38.5004 39.5396 38.6678 39.9431 38.9654 40.2408C39.263 40.5384 39.6665 40.7058 40.0874 40.7063H41.5767C41.9983 40.7066 42.4028 40.5395 42.7014 40.2419C43 39.9442 43.1683 39.5403 43.1694 39.1187C43.1688 36.8447 43.1705 32.239 43.1699 29.9563C43.2161 28.6479 42.5499 27.4544 41.8017 26.4283L42.9566 26.1763C43.253 26.111 43.5182 25.9462 43.708 25.7093C43.8979 25.4724 44.0009 25.1776 44 24.874ZM21.3491 22.439C21.5282 21.8219 21.9024 21.2794 22.4155 20.8927C22.9287 20.506 23.5533 20.2958 24.1958 20.2937H36.168C36.8105 20.2958 37.4351 20.506 37.9483 20.8927C38.4614 21.2794 38.8355 21.8219 39.0147 22.439L39.6143 24.5327C39.8344 24.7071 20.6873 24.5353 20.7267 24.5939C20.733 24.5727 21.3491 22.439 21.3491 22.439ZM17.2637 25.238C17.189 25.2207 17.1226 25.1781 17.0756 25.1175C17.0286 25.0569 17.004 24.9819 17.0058 24.9053C17.0076 24.8286 17.0359 24.7549 17.0857 24.6966C17.1355 24.6383 17.2039 24.599 17.2793 24.5852L18.7808 24.3328C18.8224 24.3265 18.865 24.3344 18.9016 24.3553C18.9383 24.3761 18.9669 24.4085 18.9829 24.4475L19.3346 25.2548C19.3152 25.3126 19.1222 25.5784 19.0895 25.6358L17.2637 25.238ZM42.1699 34.7503C42.1697 35.3293 41.9398 35.8846 41.5306 36.2943C41.1214 36.7039 40.5663 36.9345 39.9873 36.9353H20.3765C19.7971 36.9343 19.2418 36.7033 18.8326 36.2932C18.4233 35.883 18.1936 35.3272 18.1939 34.7478V34.2188H42.1699V34.7503ZM20.8643 39.1187C20.8634 39.2751 20.8005 39.4248 20.6893 39.535C20.5782 39.6452 20.428 39.7068 20.2715 39.7063H18.7876C18.6311 39.7068 18.4809 39.6452 18.3698 39.535C18.2586 39.4249 18.1957 39.2751 18.1948 39.1187V37.0637C18.5531 37.3891 18.9761 37.635 19.4362 37.7853C19.8963 37.9355 20.383 37.9866 20.8643 37.9353L20.8643 39.1187ZM41.5767 39.7063H40.0874C39.9317 39.7061 39.7823 39.6441 39.6722 39.5339C39.5621 39.4237 39.5002 39.2744 39.5 39.1187V37.9353C39.9813 37.9866 40.468 37.9355 40.9281 37.7851C41.3882 37.6348 41.8113 37.3888 42.1694 37.0632V39.1187C42.1685 39.2751 42.1056 39.4248 41.9945 39.535C41.8834 39.6452 41.7331 39.7068 41.5767 39.7063ZM42.1699 33.2188H18.1939V29.9563C18.193 29.1944 18.4181 28.4494 18.8408 27.8154C19.2053 27.2403 19.9708 26.1764 20.2876 25.5938H40.0765C40.1319 25.691 40.1781 25.793 40.2402 25.8865L41.523 27.8155C41.9456 28.4494 42.1708 29.1944 42.1699 29.9563V33.2188ZM42.7397 25.2L41.2074 25.5345C41.0595 25.3254 40.9288 25.1046 40.8165 24.8744C40.9409 24.6424 40.9992 24.2444 41.2212 24.2959L42.7246 24.5481C42.7992 24.5628 42.8665 24.6025 42.9155 24.6607C42.9645 24.7188 42.9921 24.792 42.9939 24.868C42.9956 24.944 42.9714 25.0183 42.9252 25.0787C42.879 25.139 42.8136 25.1818 42.7397 25.2Z" fill="#E40C25"/> <path d="M23.3498 28.8932C23.2296 28.699 23.0638 28.537 22.8668 28.4213C22.6699 28.3056 22.4477 28.2396 22.2195 28.2291L20.2502 28.1393C19.9795 28.1268 19.7144 28.2196 19.5105 28.3981C19.3065 28.5766 19.1795 28.827 19.156 29.0971L19.0691 30.0927C19.045 30.3629 19.1267 30.632 19.297 30.8433C19.4673 31.0545 19.7129 31.1915 19.9822 31.2252L24.1643 31.7584C24.258 31.7704 24.3532 31.7555 24.4388 31.7156C24.5244 31.6757 24.597 31.6124 24.6481 31.5329C24.6993 31.4535 24.7269 31.3612 24.7277 31.2668C24.7286 31.1723 24.7027 31.0795 24.6531 30.9992L23.3498 28.8932ZM20.1091 30.233C20.0962 30.2315 20.0845 30.225 20.0763 30.2149C20.0681 30.2049 20.0641 30.192 20.0652 30.1791L20.1521 29.1845C20.1532 29.1715 20.1592 29.1595 20.169 29.1509C20.1787 29.1423 20.1914 29.1378 20.2043 29.1383L22.1736 29.2282C22.2393 29.2311 22.3034 29.2501 22.3602 29.2835C22.4169 29.3168 22.4647 29.3635 22.4993 29.4196L23.2507 30.6337L20.1091 30.233Z" fill="#E40C25"/> <path d="M40.1143 28.0384L38.1456 28.1284C37.9173 28.1388 37.695 28.2046 37.498 28.3203C37.3009 28.436 37.135 28.598 37.0147 28.7923L35.7115 30.8982C35.6659 30.9742 35.6411 31.0609 35.6397 31.1494C35.6383 31.238 35.6602 31.3255 35.7034 31.4029C35.7465 31.4803 35.8093 31.5449 35.8854 31.5903C35.9615 31.6357 36.0482 31.6602 36.1368 31.6614C36.1579 31.6614 36.1789 31.6601 36.1998 31.6575L40.3824 31.1245C40.6518 31.0907 40.8975 30.9536 41.0678 30.7422C41.2381 30.5309 41.3197 30.2616 41.2955 29.9912L41.2086 28.9956C41.1844 28.7259 41.0571 28.476 40.8533 28.2977C40.6495 28.1194 40.3849 28.0265 40.1143 28.0384ZM40.2559 30.1324L37.1139 30.5328L37.8653 29.3186C37.8999 29.2626 37.9476 29.2159 38.0044 29.1826C38.0612 29.1492 38.1252 29.1303 38.191 29.1275L40.1602 29.0374C40.1728 29.038 40.1849 29.0428 40.1943 29.0511C40.2038 29.0594 40.2102 29.0706 40.2125 29.083L40.2994 30.0777C40.3006 30.0906 40.2968 30.1036 40.2887 30.1137C40.2806 30.1239 40.2688 30.1306 40.2559 30.1324Z" fill="#E40C25"/> <path d="M34.4638 28.5332C31.6954 29.1527 28.8246 29.1552 26.0551 28.5406C25.9675 28.516 25.8748 28.5158 25.7871 28.54C25.6994 28.5641 25.6199 28.6118 25.5573 28.6778C25.4946 28.7438 25.4512 28.8257 25.4316 28.9146C25.4121 29.0034 25.4171 29.096 25.4462 29.1822L26.311 31.7383C26.3402 31.8244 26.3922 31.9009 26.4615 31.9596C26.5308 32.0184 26.6149 32.0572 26.7045 32.0718C28.1851 32.4279 33.2933 32.1783 33.7792 32.0757C33.8758 32.0662 33.9675 32.0289 34.0431 31.9683C34.1188 31.9076 34.1752 31.8263 34.2055 31.7342L35.0444 29.178C35.0707 29.0944 35.0748 29.0054 35.0562 28.9198C35.0376 28.8342 34.9969 28.7549 34.9383 28.6898C34.8797 28.6246 34.8051 28.576 34.7218 28.5485C34.6386 28.5211 34.5497 28.5158 34.4638 28.5332ZM33.3583 31.1089C31.297 31.3011 29.2226 31.3075 27.1601 31.128L26.6767 29.699C29.0442 30.1033 31.4638 30.0953 33.8286 29.6756L33.3583 31.1089Z" fill="#E40C25"/> </svg> <h2 class="transport_finance_title">{{ 'finance.credit.credit_new_cars_in_credit'|trans({}, 'portal_base') }}</h2> <span class="transport_finance_more">{{ 'catalog.more_detail'|trans({}, 'portal_base') }}</span> </a> <a href="{{ path('portal_finance_credit_catalog',{state:'used' ,type:'car'}) }}" class="transport_finance_box"> <svg width="60" height="60" viewbox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <rect x="0.5" y="0.5" width="59" height="59" rx="29.5" stroke="#E40C25"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M36.0323 19.2188C32.9597 19.2188 30.4688 21.7096 30.4688 24.7822C30.4688 27.8548 32.9597 30.3457 36.0323 30.3457C39.1049 30.3457 41.5958 27.8548 41.5958 24.7822C41.5958 21.7096 39.1049 19.2188 36.0323 19.2188ZM29.5313 24.7822C29.5313 21.1918 32.4419 18.2812 36.0323 18.2812C39.6226 18.2812 42.5333 21.1918 42.5333 24.7822C42.5333 28.3726 39.6226 31.2832 36.0323 31.2832C32.4419 31.2832 29.5313 28.3726 29.5313 24.7822ZM34.0149 22.0892C33.656 22.0892 33.3651 22.3801 33.3651 22.7389C33.3651 23.0978 33.656 23.3888 34.0149 23.3888C34.3738 23.3888 34.6647 23.0978 34.6647 22.7389C34.6647 22.3801 34.3738 22.0892 34.0149 22.0892ZM32.4276 22.7389C32.4276 21.8623 33.1383 21.1517 34.0149 21.1517C34.8916 21.1517 35.6022 21.8623 35.6022 22.7389C35.6022 23.6156 34.8916 24.3263 34.0149 24.3263C33.1383 24.3263 32.4276 23.6156 32.4276 22.7389ZM38.4521 21.2701C38.6633 21.4197 38.7135 21.7122 38.5639 21.9235L34.1327 28.1825C33.9831 28.3938 33.6905 28.4438 33.4793 28.2943C33.268 28.1447 33.2179 27.8521 33.3675 27.6408L37.7987 21.3818C37.9483 21.1705 38.2408 21.1205 38.4521 21.2701ZM21.8403 26.5517C22.1839 25.638 23.0578 25.033 24.034 25.033H28.7245C28.9834 25.033 29.1933 25.2429 29.1933 25.5018C29.1933 25.7607 28.9834 25.9705 28.7245 25.9705H24.034C23.4483 25.9705 22.9239 26.3335 22.7177 26.8817L21.7033 29.5787C21.5294 30.041 21.2757 30.4691 20.9538 30.8436L19.8018 32.1837C19.5825 32.4388 19.4619 32.7641 19.4619 33.1005V37.4035C19.4619 37.6646 19.6752 37.8753 19.9363 37.8722L38.855 37.6452C39.1117 37.6421 39.3181 37.4332 39.3181 37.1765V32.7521C39.3181 32.6402 39.2781 32.532 39.2052 32.4471L38.6823 31.837C38.5138 31.6405 38.5367 31.3445 38.7331 31.1761C38.9298 31.0076 39.2256 31.0304 39.3941 31.2269L39.917 31.8369C40.1354 32.0918 40.2556 32.4164 40.2556 32.7521V37.1765C40.2556 37.9338 39.6566 38.5526 38.9042 38.5816V39.5395C38.9042 40.4456 38.1697 41.1802 37.2636 41.1802H35.4751C34.5691 41.1802 33.8345 40.4456 33.8345 39.5395V38.643L24.8418 38.7509V39.5395C24.8418 40.4456 24.1072 41.1802 23.2011 41.1802H21.4126C20.5066 41.1802 19.772 40.4456 19.772 39.5395V38.801C19.071 38.7223 18.5244 38.1273 18.5244 37.4035V33.1005C18.5244 32.5398 18.7254 31.9977 19.0909 31.5726L20.0411 30.4672H18.2231C17.7232 30.4672 17.3179 30.0619 17.3179 29.5619C17.3179 28.5799 18.114 27.7837 19.0961 27.7837H20.0531C20.312 27.7837 20.5219 27.9936 20.5219 28.2525C20.5219 28.5114 20.312 28.7212 20.0531 28.7212H19.0961C18.6426 28.7212 18.2729 29.0803 18.256 29.5297H20.7049C20.7495 29.4381 20.7898 29.3443 20.8258 29.2487L21.8403 26.5517ZM20.7095 38.8005V39.5395C20.7095 39.9279 21.0243 40.2427 21.4126 40.2427H23.2011C23.5895 40.2427 23.9043 39.9279 23.9043 39.5395V38.7621L20.7095 38.8005ZM34.772 38.6318V39.5395C34.772 39.9279 35.0868 40.2427 35.4751 40.2427H37.2636C37.652 40.2427 37.9668 39.9279 37.9668 39.5395V38.5934L34.772 38.6318ZM37.9897 26.3072C37.6308 26.3072 37.3399 26.5981 37.3399 26.957C37.3399 27.3159 37.6308 27.6068 37.9897 27.6068C38.3486 27.6068 38.6394 27.3159 38.6394 26.957C38.6394 26.5981 38.3486 26.3072 37.9897 26.3072ZM36.4024 26.957C36.4024 26.0804 37.113 25.3697 37.9897 25.3697C38.8663 25.3697 39.5769 26.0804 39.5769 26.957C39.5769 27.8336 38.8663 28.5443 37.9897 28.5443C37.113 28.5443 36.4024 27.8336 36.4024 26.957ZM22.4697 29.7714C22.5692 29.5324 22.8437 29.4194 23.0827 29.519L23.9941 29.8988H31.0535C31.3124 29.8988 31.5222 30.1087 31.5222 30.3676C31.5222 30.6265 31.3124 30.8363 31.0535 30.8363H23.9004C23.8385 30.8363 23.7772 30.8241 23.7201 30.8003L22.7221 30.3844C22.4831 30.2848 22.3701 30.0104 22.4697 29.7714ZM20.7631 32.8978C20.9045 32.681 21.1949 32.6198 21.4118 32.7613L21.4344 32.7761C21.9676 33.1238 22.5904 33.309 23.227 33.309H24.6074C24.8663 33.309 25.0762 33.5188 25.0762 33.7777C25.0762 34.0366 24.8663 34.2465 24.6074 34.2465H23.227C22.4086 34.2465 21.6215 34.0173 20.8996 33.5465C20.6828 33.4051 20.6216 33.1146 20.7631 32.8978ZM37.4763 32.7613C37.6932 32.6198 37.9836 32.681 38.125 32.8978C38.2665 33.1146 38.2053 33.4051 37.9885 33.5465C37.2723 34.0136 36.4796 34.2465 35.6611 34.2465H34.2807C34.0218 34.2465 33.8119 34.0366 33.8119 33.7777C33.8119 33.5188 34.0218 33.309 34.2807 33.309H35.6611C36.2977 33.309 36.9205 33.1238 37.4536 32.7761L37.4763 32.7613ZM25.2616 36.2313C25.2616 35.9724 25.4714 35.7626 25.7303 35.7626H33.0913C33.3501 35.7626 33.56 35.9724 33.56 36.2313C33.56 36.4902 33.3501 36.7001 33.0913 36.7001H25.7303C25.4714 36.7001 25.2616 36.4902 25.2616 36.2313Z" fill="#E40C25"/> </svg> <h2 class="transport_finance_title">{{ 'finance.credit.credit_second_hand_cars'|trans({}, 'portal_base') }}</h2> <span class="transport_finance_more">{{ 'catalog.more_detail'|trans({}, 'portal_base') }}</span> </a> <a href="{{ path('portal_finance_credit_catalog_category',{state:'new' ,type:'car', group:'commercial-vehicles'}) }}" class="transport_finance_box"> <svg width="60" height="60" viewbox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <rect x="0.5" y="0.5" width="59" height="59" rx="29.5" stroke="#E40C25"/> <g clip-path="url(#clip0_3347_7715)"> <path d="M26.2172 19.3945H33.7827C34.2512 19.3945 34.6323 19.0134 34.6323 18.5449V17.6074C34.6323 17.139 34.2512 16.7578 33.7827 16.7578H26.2172C25.7488 16.7578 25.3676 17.139 25.3676 17.6074V18.5449C25.3676 19.0134 25.7488 19.3945 26.2172 19.3945ZM26.2465 17.6367H33.7534V18.5156H26.2465V17.6367ZM37.4092 31.9673C37.2966 31.7297 37.0633 31.582 36.8003 31.582H23.1997C22.9367 31.582 22.7033 31.7297 22.5907 31.9673C22.4781 32.205 22.5115 32.479 22.6781 32.6826L24.9313 35.4365C25.0598 35.5936 25.2499 35.6837 25.4528 35.6837H34.5471C34.75 35.6837 34.94 35.5935 35.0685 35.4365L37.3218 32.6826C37.4884 32.479 37.5219 32.205 37.4092 31.9673ZM34.4499 34.8047H25.5501L23.6324 32.4609H36.3676L34.4499 34.8047ZM44.1504 26.2869H42.7822C42.5128 26.2869 42.2568 26.4167 42.0974 26.634L41.7447 27.1148L40.446 16.9196C40.3066 15.8252 39.3696 15 38.2663 15H21.7337C20.6304 15 19.6934 15.8252 19.554 16.9196L18.2553 27.1148L17.9027 26.6341C17.7432 26.4167 17.4872 26.2869 17.2178 26.2869H15.8496C15.3812 26.2869 15 26.6681 15 27.1365V28.8281C15 29.2966 15.3812 29.6777 15.8496 29.6777H17.9883V37.6079C17.2552 37.7319 16.7603 38.4827 16.9345 39.2071L17.4015 41.1993C17.5419 41.7984 18.0697 42.2168 18.685 42.2168H19.3945V43.6816C19.3945 44.4086 19.986 45 20.7129 45H23.0994C23.8263 45 24.4178 44.4086 24.4178 43.6816V42.2168H35.5822V43.6816C35.5822 44.4086 36.1737 45 36.9006 45H39.2871C40.014 45 40.6055 44.4086 40.6055 43.6816V42.2168H41.315C41.9303 42.2168 42.4581 41.7984 42.5985 41.1993L43.0655 39.2071C43.2406 38.4792 42.7369 37.731 42.0117 37.6079V29.6777H44.1504C44.6188 29.6777 45 29.2966 45 28.8281V27.1365C45 26.6681 44.6188 26.2869 44.1504 26.2869ZM20.4258 17.0307C20.5095 16.3741 21.0717 15.8789 21.7337 15.8789H38.2663C38.9283 15.8789 39.4905 16.3741 39.5742 17.0307L41.0733 28.7988H40.188L39.1922 21.0152C39.138 20.5923 38.7757 20.2734 38.3494 20.2734H21.7065C21.2838 20.2734 20.9219 20.5893 20.8648 21.008L20.541 23.3774C20.508 23.6179 20.6764 23.8395 20.9169 23.8723C21.1569 23.9055 21.3789 23.737 21.4117 23.4964L21.7321 21.1523H38.3237L39.3019 28.7988H20.6871L21.1308 25.5515C21.1638 25.311 20.9954 25.0894 20.755 25.0566C20.5152 25.024 20.2929 25.192 20.2601 25.4325L19.8 28.7988H18.9267L20.4258 17.0307ZM18.8672 32.4609H19.9573L21.8276 34.6053H18.8672V32.4609ZM15.8789 28.7988V27.1658H17.2027L18.094 28.3808L18.0407 28.7988H15.8789ZM23.5389 43.6816C23.5389 43.924 23.3418 44.1211 23.0994 44.1211H20.7129C20.4705 44.1211 20.2734 43.924 20.2734 43.6816V42.2168H23.5389V43.6816ZM39.7266 43.6816C39.7266 43.924 39.5295 44.1211 39.2871 44.1211H36.9006C36.6582 44.1211 36.4611 43.924 36.4611 43.6816V42.2168H39.7266V43.6816ZM42.2098 39.0065L41.7429 40.9987C41.696 41.1984 41.5201 41.3379 41.315 41.3379H18.685C18.4799 41.3379 18.304 41.1984 18.2571 40.9987L17.7902 39.0065C17.7246 38.7356 17.9399 38.465 18.2181 38.4667H34.5298C34.7726 38.4667 34.9693 38.27 34.9693 38.0273C34.9693 37.7846 34.7726 37.5878 34.5298 37.5878H18.8672V35.4841H22.4074C22.648 35.4841 22.8678 35.3426 22.9675 35.1236C23.0671 34.9046 23.0293 34.6459 22.8711 34.4645L20.576 31.8329C20.4369 31.6734 20.2356 31.5819 20.024 31.5819H18.8672V29.6776C18.8672 29.6776 41.1319 29.6777 41.1328 29.6776V31.582H39.976C39.7644 31.582 39.5631 31.6736 39.424 31.833L37.1289 34.4646C36.9708 34.646 36.9329 34.9047 37.0325 35.1237C37.1321 35.3428 37.3519 35.4843 37.5926 35.4843H41.1328V37.5879H36.5806C36.3379 37.5879 36.1412 37.7846 36.1412 38.0273C36.1412 38.27 36.3379 38.4668 36.5806 38.4668H41.782C42.0591 38.4648 42.2753 38.7362 42.2098 39.0065ZM41.1328 32.4609V34.6053H38.1724L40.0427 32.4609H41.1328ZM44.1211 28.7988H41.9593L41.906 28.3808L42.7973 27.1658H44.1211V28.7988Z" fill="#E40C25"/> </g> <defs> <clipPath id="clip0_3347_7715"> <rect width="30" height="30" fill="white" transform="translate(15 15)"/> </clipPath> </defs> </svg> <h2 class="transport_finance_title">{{ 'finance.credit.credit_commercial_cars'|trans({}, 'portal_base') }}</h2> <span class="transport_finance_more">{{ 'catalog.more_detail'|trans({}, 'portal_base') }}</span> </a> <a href="{{ path('portal_finance_credit_catalog',{state:'new' ,type:'bus'}) }}" class="transport_finance_box"> <svg width="60" height="60" viewbox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <rect x="0.5" y="0.5" width="59" height="59" rx="29.5" stroke="#E40C25"/> <path d="M47.848 29.1555C47.1832 28.6016 45.375 27.8311 44.5992 27.5604C44.1616 27.4076 44.0504 27.3428 43.7686 26.9583L40.9218 22.5023C40.5576 21.9324 40.1455 21.4463 39.6968 21.0577C38.8404 20.3163 38.0263 20 36.9747 20H14.8751C13.7099 20 12.9243 20.7701 12.6606 22.1829L12.4484 23.7404C12.0694 26.5245 11.8815 29.3604 11.8904 32.1693L11.8935 33.1635V34.0181C11.8935 34.0756 11.8936 34.1444 11.8968 34.2183L11.9023 35.9596C11.9044 36.6536 12.4708 37.2181 13.1648 37.2181H14.9475C15.284 37.2181 15.5655 36.9669 15.6023 36.6337C15.703 35.7181 16.6164 33.1047 19.3976 33.1047C21.5398 33.1047 22.5734 34.6555 22.9814 35.7857C22.9822 35.7896 22.9819 35.7937 22.9828 35.7976L23.2032 36.6928C23.2052 36.7009 23.2076 36.7089 23.2103 36.7169C23.2674 36.9472 23.4427 37.1251 23.6668 37.1896C23.6699 37.1907 23.6723 37.192 23.6754 37.1931C23.678 37.194 23.6811 37.1936 23.6838 37.1944C23.7374 37.2083 23.7924 37.218 23.8502 37.218H34.5006C34.558 37.218 34.6127 37.2079 34.6656 37.1936C34.6679 37.1929 34.6704 37.1932 34.6726 37.1924C34.6746 37.1917 34.6762 37.1905 34.6782 37.1899C34.8984 37.1253 35.0683 36.9463 35.1154 36.7188C35.1162 36.7161 35.1175 36.7143 35.1183 36.7116L35.3287 35.7929C35.3295 35.7892 35.3292 35.7855 35.3299 35.7819C35.7483 34.6557 36.8538 33.1047 38.9804 33.1047C41.7528 33.1047 42.6712 35.7088 42.7744 36.6212C42.813 36.9615 43.1008 37.218 43.4443 37.218H46.3542C47.3934 37.218 48.2388 36.3725 48.2388 35.3333V33.2145V30.6265V30.1544C48.239 29.7141 48.1038 29.3687 47.848 29.1555ZM34.5424 36.5603C34.5334 36.5907 34.5274 36.6043 34.5174 36.6127H23.825C23.807 36.6019 23.7952 36.5839 23.7786 36.5371L23.6524 36.0245H34.6648L34.5424 36.5603ZM47.6431 32.9168H46.2816C46.2407 32.8811 46.1612 32.7331 46.1612 32.5043V31.3372C46.1612 31.1084 46.2407 30.9605 46.2816 30.9247H47.6431V32.9168ZM47.6431 30.3288H46.2626C45.8651 30.3288 45.5654 30.7623 45.5654 31.3372V32.5043C45.5654 33.0792 45.8651 33.5127 46.2626 33.5127H47.6431V35.3335C47.6431 36.0441 47.065 36.6223 46.3543 36.6223H43.4444C43.4044 36.6223 43.371 36.5929 43.3667 36.5543C43.248 35.5048 42.1876 32.5089 38.9806 32.5089C36.6008 32.5089 35.3456 34.1361 34.8267 35.4287H31.7996V28.1359H41.7772C41.8818 28.1359 41.9787 28.0811 42.0326 27.9915C42.0864 27.902 42.0894 27.7907 42.0404 27.6983L39.5138 22.936C39.5072 22.9236 39.4998 22.9116 39.4914 22.9003C38.6871 21.796 38.2035 21.5157 35.638 21.5157H31.5015C31.337 21.5157 31.2035 21.6491 31.2035 21.8137V27.8381C31.2035 27.8445 31.205 27.8505 31.2054 27.8568C31.205 27.8631 31.2035 27.8691 31.2035 27.8755V35.4288H23.478C22.9678 34.1479 21.7719 32.5091 19.3972 32.5091C16.1802 32.5091 15.1254 35.5156 15.0095 36.5688C15.0062 36.5993 14.9794 36.6224 14.9471 36.6224H13.1644C12.798 36.6224 12.499 36.3243 12.4979 35.9577L12.495 35.0268H13.3575C13.755 35.0268 13.9328 34.5204 13.9328 34.0184V32.8513C13.9328 32.3495 13.755 31.8429 13.3575 31.8429H12.488C12.4942 29.1677 12.678 26.4708 13.0388 23.8209L13.2486 22.278C13.3919 21.5107 13.7906 20.596 14.875 20.596H36.9747C37.8707 20.596 38.568 20.8688 39.3067 21.5083C39.7119 21.8592 40.0864 22.3017 40.4195 22.8232L43.277 27.2947C43.6483 27.8025 43.8616 27.9341 44.4028 28.1231C45.1687 28.3904 46.8958 29.1379 47.4666 29.6133C47.6202 29.7415 47.6432 30.0076 47.6432 30.1548V30.3288H47.6431ZM31.7998 27.5399V22.1113H35.6383C38.0638 22.1113 38.3484 22.3445 38.9975 23.2339L41.2822 27.5399H31.7998ZM12.4894 34.0183V32.8512C12.4894 32.7063 12.4894 32.5124 12.514 32.4387H13.2687C13.2991 32.5076 13.3372 32.6497 13.3372 32.8512V34.0183C13.3372 34.2197 13.2991 34.3619 13.2687 34.4308H12.52C12.5051 34.3776 12.4894 34.2632 12.4894 34.0183Z" fill="#E40C25"/> <path d="M39.0066 33.6062C37.2383 33.6062 35.7998 35.0447 35.7998 36.813C35.7998 38.5813 37.2383 40.0198 39.0066 40.0198C40.7749 40.0198 42.2134 38.5813 42.2134 36.813C42.2135 35.0447 40.7749 33.6062 39.0066 33.6062ZM39.0066 39.4239C37.567 39.4239 36.3957 38.2526 36.3957 36.813C36.3957 35.3734 37.567 34.2021 39.0066 34.2021C40.4462 34.2021 41.6175 35.3734 41.6175 36.813C41.6177 38.2527 40.4463 39.4239 39.0066 39.4239Z" fill="#E40C25"/> <path d="M39.0068 35.2996C38.1721 35.2996 37.4932 35.9786 37.4932 36.8132C37.4932 37.6477 38.1722 38.3268 39.0068 38.3268C39.8413 38.3268 40.5204 37.6477 40.5204 36.8132C40.5204 35.9786 39.8413 35.2996 39.0068 35.2996ZM39.0068 37.7309C38.5006 37.7309 38.089 37.3192 38.089 36.8132C38.089 36.3072 38.5008 35.8954 39.0068 35.8954C39.5128 35.8954 39.9245 36.3072 39.9245 36.8132C39.9245 37.3192 39.5128 37.7309 39.0068 37.7309Z" fill="#E40C25"/> <path d="M19.3797 33.6062C17.6114 33.6062 16.1729 35.0447 16.1729 36.813C16.1729 38.5813 17.6114 40.0198 19.3797 40.0198C21.1479 40.0198 22.5865 38.5813 22.5865 36.813C22.5865 35.0447 21.1479 33.6062 19.3797 33.6062ZM19.3797 39.4239C17.9401 39.4239 16.7687 38.2526 16.7687 36.813C16.7687 35.3734 17.9401 34.2021 19.3797 34.2021C20.8193 34.2021 21.9906 35.3734 21.9906 36.813C21.9906 38.2527 20.8193 39.4239 19.3797 39.4239Z" fill="#E40C25"/> <path d="M19.3798 35.2996C18.5453 35.2996 17.8662 35.9786 17.8662 36.8132C17.8662 37.6477 18.5453 38.3268 19.3798 38.3268C20.2145 38.3268 20.8934 37.6477 20.8934 36.8132C20.8934 35.9786 20.2145 35.2996 19.3798 35.2996ZM19.3798 37.7309C18.8738 37.7309 18.4621 37.3192 18.4621 36.8132C18.4621 36.3072 18.8738 35.8954 19.3798 35.8954C19.8859 35.8954 20.2975 36.3072 20.2975 36.8132C20.2975 37.3192 19.8859 37.7309 19.3798 37.7309Z" fill="#E40C25"/> <path d="M30.5062 27.8752V22.3149C30.5062 21.8536 30.1309 21.4783 29.6695 21.4783H15.2182C14.7803 21.4783 14.4137 21.8205 14.3834 22.2575L13.9973 27.8548C13.9917 27.9372 14.0203 28.0183 14.0767 28.0785C14.1331 28.1389 14.2121 28.1732 14.2946 28.1732H30.2082C30.3729 28.1732 30.5062 28.0397 30.5062 27.8752ZM22.3742 27.5772H14.6138L14.9779 22.2983C14.9866 22.1725 15.0921 22.074 15.2182 22.074H22.3742V27.5772ZM29.9103 27.5772H22.9701V22.074H29.6695C29.8023 22.074 29.9103 22.182 29.9103 22.3148V27.5772Z" fill="#E40C25"/> <path d="M33.9853 29.0754H32.5919C32.4274 29.0754 32.2939 29.2088 32.2939 29.3734C32.2939 29.538 32.4273 29.6714 32.5919 29.6714H33.9854C34.1499 29.6714 34.2834 29.5381 34.2834 29.3734C34.2833 29.2088 34.1499 29.0754 33.9853 29.0754Z" fill="#E40C25"/> <path d="M30.2724 29.0754H28.8791C28.7145 29.0754 28.5811 29.2088 28.5811 29.3734C28.5811 29.538 28.7144 29.6714 28.8791 29.6714H30.2724C30.4369 29.6714 30.5704 29.5381 30.5704 29.3734C30.5704 29.2088 30.4371 29.0754 30.2724 29.0754Z" fill="#E40C25"/> </svg> <h2 class="transport_finance_title">{{ 'finance.credit.credit_microbus'|trans({}, 'portal_base') }}</h2> <span class="transport_finance_more">{{ 'catalog.more_detail'|trans({}, 'portal_base') }}</span> </a> <a href="{{ path('portal_finance_credit_catalog',{state:'new' ,type:'moto'}) }}" class="transport_finance_box"> <svg width="60" height="60" viewbox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <rect x="0.5" y="0.5" width="59" height="59" rx="29.5" stroke="#E40C25"/> <path d="M15.6689 29.8547C16.2102 29.4394 16.8069 29.1255 17.4392 28.9177C16.8921 28.7895 16.3269 28.6851 15.8071 28.6112C15.1702 28.5206 14.7671 27.8798 14.9661 27.2678C15.6477 25.1751 15.8342 24.2479 16.8518 23.0844L19.2453 20.3479C19.5722 19.9739 20.1179 19.8909 20.5422 20.1503L21.2895 20.6077C21.7162 20.8688 21.8896 21.4099 21.6926 21.8666C21.498 22.3182 21.226 23.1506 21.4311 23.9323L21.5644 23.525C21.6547 23.2489 21.8381 23.0082 22.0803 22.8471L23.6625 21.7951C24.2604 21.3975 25.0717 21.5588 25.4709 22.1549C25.8708 22.7523 25.7094 23.5586 25.1098 23.9571L24.1457 24.598C24.1769 24.5944 24.2082 24.5909 24.2397 24.5888C26.3573 23.2021 27.6774 22.9661 28.5018 22.7637C30.515 22.2695 32.4188 21.8029 34.8599 24.9802C35.5799 24.8664 37.6194 24.4766 38.9793 23.5491C39.6214 23.1111 40.4432 23.125 41.0491 23.5401L41.9746 22.6822C42.7346 21.9778 43.4766 22.0851 44.5208 22.0851C45.3157 22.0851 45.7507 23.0077 45.2451 23.6177L43.2051 26.0788C42.7219 26.6618 41.9566 26.9693 41.1851 26.8683L38.2903 29.2481C37.7444 29.6971 37.0631 29.9082 36.3802 29.8649L34.7962 29.7652L34.3873 30.3666L36.2865 31.2703C37.3123 29.9533 38.8858 29.1778 40.5726 29.1778C43.5652 29.1776 46 31.6041 46 34.5866C46 37.5691 43.5652 39.9954 40.5726 39.9954C37.826 39.9954 35.5411 37.9616 35.1927 35.2927L35.1737 35.2917L33.2811 38.0007C33.1354 38.2095 32.8959 38.3341 32.641 38.3341H29.4755C29.2164 38.3341 29.0067 38.1248 29.0067 37.8669C29.0067 37.6088 29.2164 37.3998 29.4755 37.3998H32.5587L34.3558 34.8272H31.8522C30.6215 36.2985 28.2301 35.6158 27.9396 33.7474C26.8734 34.3494 25.5858 34.7243 24.3454 34.6854C24.56 35.5521 24.7367 36.5139 24.8483 37.3998H27.2877C27.5465 37.3998 27.7565 37.609 27.7565 37.8669C27.7565 38.1248 27.5468 38.3341 27.2877 38.3341H24.7089C24.3136 38.3341 23.9806 38.0392 23.9342 37.6479C23.9325 37.6336 23.9303 37.6187 23.9286 37.6044C23.5881 38.1078 23.164 38.5565 22.6745 38.9212C19.1167 41.5723 14 39.0365 14 34.5866C14 33.1834 14.5413 31.8535 15.5022 30.8518C15.2844 30.5228 15.3623 30.0898 15.6689 29.8547ZM30.8951 30.2153L30.316 29.0041C30.0677 28.4846 29.6478 28.0547 29.1337 27.7934C28.7509 27.599 24.7543 25.5564 24.4064 25.5228C24.1445 25.4978 23.8747 25.6328 23.6591 25.7834C24.2531 26.0416 27.7675 27.6447 28.5307 28.2593C29.1657 28.7708 29.6268 29.4477 29.8751 30.1978C30.2152 30.1469 30.5734 30.1562 30.8951 30.2153ZM34.8309 28.0484C34.1717 27.9163 34.3971 27.9615 33.2455 27.7306L31.609 29.5362C31.8138 29.9649 32.0157 30.3871 32.2174 30.8092C32.3797 30.935 32.5472 31.0978 32.6649 31.2345C33.2687 30.3464 34.1339 29.0735 34.8309 28.0484ZM22.623 26.3569C20.6777 25.5447 20.04 23.9384 20.634 22.0306L19.3691 23.8922C19.0568 24.352 18.5598 24.6467 18.0053 24.7007L16.8091 24.8175C16.5998 25.2389 16.531 25.4897 16.3039 26.1868C17.3406 26.2832 18.0852 26.8026 18.0852 27.4698C18.0852 27.6854 18.011 27.8842 17.875 28.0591C19.3 28.4109 20.9069 28.9995 21.9992 29.9676C22.7949 28.9825 24.1095 28.1255 25.6459 27.7416C24.6879 27.2708 23.5883 26.7576 22.623 26.3569ZM19.9521 20.9617C17.2129 24.0934 17.5952 23.653 17.4614 23.815C17.9155 23.7708 18.3066 23.7897 18.593 23.3683L20.1835 21.0274L20.0515 20.9467C20.0195 20.9269 19.9775 20.9325 19.9521 20.9617ZM15.9394 27.6863C16.1172 27.7114 16.3108 27.7416 16.5156 27.7766C16.9253 27.688 17.1113 27.5318 17.1448 27.4696C17.0903 27.363 16.6926 27.1175 16.0049 27.1053L15.8579 27.5562C15.8384 27.6158 15.8772 27.6773 15.9394 27.6863ZM20.5722 31.925C20.7294 31.4448 20.6281 31.7545 21.0664 30.4155C20.8745 30.2737 20.6618 30.1372 20.4291 30.007C20.1191 30.9542 19.2326 33.6633 18.9675 34.4735C18.905 34.665 19.0095 34.871 19.2024 34.9338C19.3974 34.9971 19.602 34.8903 19.6643 34.6998L20.5722 31.925ZM19.0417 31.2336L19.5766 29.5988L19.4799 29.5569C18.4819 29.5209 17.448 29.7837 16.5408 30.3815L19.0417 31.2336ZM23.0627 24.3153C23.0951 24.2155 23.1606 24.1299 23.2482 24.0717L24.5895 23.1798C24.7582 23.0676 24.8031 22.8411 24.6911 22.6734C24.5788 22.5058 24.3508 22.4605 24.1828 22.5722L22.6008 23.6243C22.5326 23.6695 22.4811 23.7372 22.4557 23.8148L22.0827 24.9545C22.2692 25.116 22.4772 25.2493 22.6992 25.3625C22.7089 25.353 22.7187 25.344 22.7292 25.3343L23.0627 24.3153ZM28.7262 23.6708C27.9176 23.8693 27.1381 23.9754 25.4662 24.9355C26.5397 25.4333 28.5033 26.4245 29.5595 26.961C30.2567 27.3153 30.826 27.898 31.1625 28.6022L31.1727 28.6236L34.0443 25.4554C32.0187 22.8625 30.6268 23.2043 28.7262 23.6708ZM39.5088 24.3201C37.8931 25.4221 35.5494 25.826 34.8846 25.9221C34.5636 26.2764 34.7823 26.035 33.9767 26.924L35.7066 27.271C36.1295 27.3557 36.5623 27.2479 36.8953 26.9751L40.2854 24.198C40.033 24.1206 39.7464 24.1579 39.5088 24.3201ZM42.4822 25.4837L44.5234 23.0238C44.5234 23.0223 44.5222 23.0197 44.5237 23.0194H44.5205C43.4829 23.0194 43.0723 22.9406 42.6131 23.3661C41 24.8613 41.7298 24.224 40.1038 25.5562C40.7874 25.7863 40.5935 25.7211 41.1849 25.9204C41.6621 26.0311 42.1697 25.8608 42.4822 25.4837ZM37.6937 28.5272L40.1067 26.5435C39.7837 26.4348 39.9793 26.5004 39.2508 26.2552L37.4905 27.697C37.0355 28.0698 36.4483 28.2671 35.8404 28.2292C35.5333 28.6807 35.6273 28.5428 35.4066 28.8674C36.4215 28.9314 37.0318 29.0715 37.6937 28.5272ZM41.2071 33.6114C41.5625 33.7805 41.7925 34.1435 41.7925 34.5362C41.7925 35.1192 41.302 35.5883 40.7142 35.5599L38.2064 35.4387C38.5584 36.4124 39.4937 37.0939 40.5726 37.0939C41.9597 37.0939 43.0884 35.9691 43.0884 34.5866C43.0884 32.5253 40.7071 31.3377 39.0552 32.5876L41.2071 33.6114ZM36.1458 35.3389C36.5052 37.4635 38.3582 39.0611 40.5726 39.0611C43.0484 39.0611 45.0625 37.054 45.0625 34.5866C45.0625 32.1192 43.0484 30.1121 40.5726 30.1121C39.2466 30.1121 38.0049 30.6912 37.1563 31.6842L38.1346 32.1496C40.2879 30.0051 44.0261 31.5163 44.0261 34.5866C44.0261 36.4844 42.4768 38.0282 40.5726 38.0282C38.9603 38.0282 37.5811 36.9192 37.2147 35.3908C36.7823 35.3696 37.014 35.3808 36.1458 35.3389ZM34.6568 33.8927C34.9776 33.8927 35.2557 34.0866 35.3751 34.3662L40.7596 34.6268C40.8113 34.6299 40.8548 34.5881 40.8548 34.5362C40.8548 34.5017 40.8345 34.4696 40.8033 34.4547C40.6414 34.3779 34.0706 31.2513 33.8556 31.1491C33.5138 31.6518 33.6017 31.5226 33.1971 32.1175C33.4217 32.689 33.4603 33.3226 33.3336 33.8927H34.6568ZM32.3617 33.8927C32.8443 32.435 31.6471 30.9216 30.0682 31.116C30.0797 31.2338 30.0878 31.3912 30.0878 31.5163C30.0878 31.8212 29.9086 32.0995 29.6285 32.2243C29.6268 32.2253 29.6251 32.2263 29.6232 32.227C29.0819 32.4637 28.7648 33.0499 28.8707 33.6365C29.0546 34.6501 30.3741 35.1238 31.1798 34.1718C31.3297 33.9946 31.5448 33.8927 31.7762 33.8927H32.3617ZM28.09 32.5394C28.3024 32.0404 28.6996 31.6348 29.1486 31.417C29.1278 30.7413 28.8954 30.0832 28.4884 29.5486C28.0104 28.9194 27.4916 28.6781 27.102 28.4764C25.4377 28.5148 23.5839 29.4044 22.6425 30.663C23.3046 31.536 23.7653 32.6866 24.0837 33.7336C25.4516 33.8698 26.9984 33.3438 28.09 32.5394ZM19.4277 39.0611C21.3666 39.0611 23.0612 37.8465 23.6799 36.0268C23.3803 34.4698 22.8071 32.3613 21.8185 31.1299L21.5705 31.8881C24.1215 33.8944 22.6974 38.0282 19.4277 38.0282C18.0815 38.0282 16.8491 37.2397 16.2876 36.0192C16.1797 35.7847 16.2832 35.5073 16.5183 35.3998C16.7536 35.2922 17.032 35.3951 17.1399 35.6297C17.549 36.5192 18.447 37.0939 19.4277 37.0939C20.8149 37.0939 21.9433 35.9691 21.9433 34.5866C21.9433 33.9328 21.6923 33.3207 21.2521 32.8606L20.5556 34.9895C20.331 35.6754 19.5949 36.044 18.9116 35.8221C18.2263 35.5993 17.8528 34.8664 18.0761 34.1837L18.7324 32.1786C17.9421 32.4046 17.3049 33.0056 17.041 33.7922C16.959 34.037 16.6933 34.1691 16.448 34.0873C16.2024 34.0053 16.0698 33.7409 16.1518 33.4961C16.4018 32.7504 16.8962 32.1255 17.5356 31.7078L16.3696 31.3107C13.4087 34.055 15.3442 39.0611 19.4277 39.0611Z" fill="#E40C25"/> </svg> <h2 class="transport_finance_title">{{ 'finance.credit.credit_motocycle'|trans({}, 'portal_base') }}</h2> <span class="transport_finance_more">{{ 'catalog.more_detail'|trans({}, 'portal_base') }}</span> </a> </div> </div> </section> <section class="section_credit_seo_text"> <div class="container"> <h2 class="credit_seo_title">{{ 'finance.credit.credit_instalment'|trans({}, 'portal_base') }}</h2> <p class="credit_seo_text">{{ 'finance.credit.credit_instalment_seo_1'|trans({}, 'portal_base') }}</p> <p class="credit_seo_text">{{ 'finance.credit.credit_instalment_seo_2'|trans({}, 'portal_base') }}</p> <p class="credit_seo_text">{{ 'finance.credit.credit_instalment_seo_3'|trans({}, 'portal_base') }}</p> <p class="credit_seo_text">{{ 'finance.credit.credit_instalment_seo_4'|trans({}, 'portal_base') }}</p> <p class="credit_seo_text">{{ 'finance.credit.credit_advantages'|trans({}, 'portal_base') }}</p> <ul class="credit_seo_text-list"> <li class="credit_seo_text-item"> <span>{{ 'finance.credit.credit_adv_fin'|trans({}, 'portal_base') }}</span> {{ 'finance.credit.credit_adv_fin_text'|trans({}, 'portal_base') }}</li> <li class="credit_seo_text-item"> <span>{{ 'finance.credit.credit_adv_fin_cond'|trans({}, 'portal_base') }}</span> {{ 'finance.credit.credit_adv_fin_cond_text'|trans({}, 'portal_base') }}</li> <li class="credit_seo_text-item"> <span>{{ 'finance.credit.credit_adv_many'|trans({}, 'portal_base') }}</span> {{ 'finance.credit.credit_adv_many_text'|trans({}, 'portal_base') }}</li> <li class="credit_seo_text-item"> <span>{{ 'finance.credit.credit_adv_comp'|trans({}, 'portal_base') }}</span> {{ 'finance.credit.credit_adv_comp_text'|trans({}, 'portal_base') }}</li> </ul> <p class="credit_seo_text">{{ 'finance.credit.credit_adv_comfort'|trans({}, 'portal_base') }}</p> <p class="credit_seo_text">{{ 'finance.credit.credit_adv_add_info'|trans({}, 'portal_base') }}</p> </div> </section> <section class="section_credit_banks"> <div class="container"> <p class="credit_seo_title">{{ 'finance.credit.credit_banks'|trans({}, 'portal_base') }}</p> <div class="credit_banks_wrapper"> <img src="{{ asset('bundles/portal/img/service/credit-bank-1.png') }}" alt=""> <img src="{{ asset('bundles/portal/img/service/credit-bank-2.png') }}" alt=""> <img src="{{ asset('bundles/portal/img/service/credit-bank-3.png') }}" alt=""> <img src="{{ asset('bundles/portal/img/service/credit-bank-4.png') }}" alt=""> <img src="{{ asset('bundles/portal/img/service/credit-bank-5.png') }}" alt=""> </div> </div> </section> <section class="section_credit_rating"> <div class="container" id="reviewCalc"> <div class="credit_rating_wrapper"> <svg @click="toggleForm" v-if="showForm" class="credit_rating-close" width="12" height="12" viewbox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M11 11L1 1M11 1L1 11" stroke="#333333" stroke-width="2" stroke-linecap="round"/> </svg> <div class="rating_head_wrapper"> <div class="rating_head_box"> <p class="rating_head_title">{{ 'finance.credit.credit_estimate_page'|trans({}, 'portal_base') }}</p> <p class="rating_head_sub_title">{{ 'finance.credit.credit_estimate_easy'|trans({}, 'portal_base') }}</p> </div> <div class="rating_head_box rating_head_box-right"> <div class="rating"> <input v-model="stars" @click="showModalByClick" type="radio" id="star10" name="rating" value="10"/><label class="full" for="star10"> <span>10</span> </label> <input v-model="stars" @click="showModalByClick" type="radio" id="star9" name="rating" value="9"/><label class="full" for="star9"> <span>9</span> </label> <input v-model="stars" @click="showModalByClick" type="radio" id="star8" name="rating" value="8"/><label class="full" for="star8"> <span>8</span> </label> <input v-model="stars" @click="showModalByClick" type="radio" id="star7" name="rating" value="7"/><label class="full" for="star7"> <span>7</span> </label> <input v-model="stars" @click="showModalByClick" type="radio" id="star6" name="rating" value="6"/><label class="full" for="star6"> <span>6</span> </label> <input v-model="stars" @click="showModalByClick" type="radio" id="star5" name="rating" value="5"/><label class="full" for="star5"> <span>5</span> </label> <input v-model="stars" @click="showModalByClick" type="radio" id="star4" name="rating" value="4"/><label class="full" for="star4"> <span>4</span> </label> <input v-model="stars" @click="showModalByClick" type="radio" id="star3" name="rating" value="3"/><label class="full" for="star3"> <span>3</span> </label> <input v-model="stars" @click="showModalByClick" type="radio" id="star2" name="rating" value="2"/><label class="full" for="star2"> <span>2</span> </label> <input v-model="stars" @click="showModalByClick" type="radio" id="star1" name="rating" value="1"/><label class="full" for="star1"> <span>1</span> </label> </div> </div> </div> <div class="rating_check_show active" v-if="showForm"> <div class="rating_check_wrapper" @change="clearErrors"> <label class="checkbox-button" for="response-1" :class="{'error_input' : formErrors.estimate, active: estimate.includes('{{ 'finance.credit.credit_estimate_page_1'|trans({}, 'portal_base') }}') }"> <input id="response-1" type="checkbox" v-model="estimate" class="rating_check-item" value="{{ 'finance.credit.credit_estimate_page_1'|trans({}, 'portal_base') }}">{{ 'finance.credit.credit_estimate_page_1'|trans({}, 'portal_base') }} </label> <label class="checkbox-button" for="response-2" :class="{'error_input' : formErrors.estimate, active: estimate.includes('{{ 'finance.credit.credit_estimate_page_2'|trans({}, 'portal_base') }}') }"> <input id="response-2" type="checkbox" v-model="estimate" class="rating_check-item" value="{{ 'finance.credit.credit_estimate_page_2'|trans({}, 'portal_base') }}">{{ 'finance.credit.credit_estimate_page_2'|trans({}, 'portal_base') }} </label> <label class="checkbox-button" for="response-3" :class="{'error_input' : formErrors.estimate, active: estimate.includes('{{ 'finance.credit.credit_estimate_page_3'|trans({}, 'portal_base') }}') }"> <input id="response-3" type="checkbox" v-model="estimate" class="rating_check-item" value="{{ 'finance.credit.credit_estimate_page_3'|trans({}, 'portal_base') }}">{{ 'finance.credit.credit_estimate_page_3'|trans({}, 'portal_base') }} </label> <label class="checkbox-button" for="response-4" :class="{'error_input' : formErrors.estimate, active: estimate.includes('{{ 'finance.credit.credit_estimate_page_4'|trans({}, 'portal_base') }}') }"> <input id="response-4" type="checkbox" v-model="estimate" class="rating_check-item" value="{{ 'finance.credit.credit_estimate_page_4'|trans({}, 'portal_base') }}">{{ 'finance.credit.credit_estimate_page_4'|trans({}, 'portal_base') }} </label> <label class="checkbox-button" for="response-5" :class="{'error_input' : formErrors.estimate, active: estimate.includes('{{ 'finance.credit.credit_estimate_page_5'|trans({}, 'portal_base') }}') }"> <input id="response-5" type="checkbox" v-model="estimate" class="rating_check-item" value="{{ 'finance.credit.credit_estimate_page_5'|trans({}, 'portal_base') }}">{{ 'finance.credit.credit_estimate_page_5'|trans({}, 'portal_base') }} </label> <label class="checkbox-button" for="response-6" :class="{'error_input' : formErrors.estimate, active: estimate.includes('{{ 'finance.credit.credit_estimate_page_6'|trans({}, 'portal_base') }}') }"> <input id="response-6" type="checkbox" v-model="estimate" class="rating_check-item" value="{{ 'finance.credit.credit_estimate_page_6'|trans({}, 'portal_base') }}">{{ 'finance.credit.credit_estimate_page_6'|trans({}, 'portal_base') }} </label> <label class="checkbox-button" for="response-7" :class="{'error_input' : formErrors.estimate, active: estimate.includes('{{ 'finance.credit.credit_estimate_page_7'|trans({}, 'portal_base') }}') }"> <input id="response-7" type="checkbox" v-model="estimate" class="rating_check-item" value="{{ 'finance.credit.credit_estimate_page_7'|trans({}, 'portal_base') }}">{{ 'finance.credit.credit_estimate_page_7'|trans({}, 'portal_base') }} </label> <label class="checkbox-button" for="response-8" :class="{'error_input' : formErrors.estimate, active: estimate.includes('{{ 'finance.credit.credit_estimate_page_8'|trans({}, 'portal_base') }}') }"> <input id="response-8" type="checkbox" v-model="estimate" class="rating_check-item" value="{{ 'finance.credit.credit_estimate_page_8'|trans({}, 'portal_base') }}">{{ 'finance.credit.credit_estimate_page_8'|trans({}, 'portal_base') }} </label> <label class="checkbox-button" for="response-9" :class="{'error_input' : formErrors.estimate, active: estimate.includes('{{ 'finance.credit.credit_estimate_page_9'|trans({}, 'portal_base') }}') }"> <input id="response-9" type="checkbox" v-model="estimate" class="rating_check-item" value="{{ 'finance.credit.credit_estimate_page_9'|trans({}, 'portal_base') }}">{{ 'finance.credit.credit_estimate_page_9'|trans({}, 'portal_base') }} </label> </div> <div id="review_form"> <textarea v-model="review" class="credit_rating_textarea" placeholder="{{ 'finance.credit.credit_write_response'|trans({}, 'portal_base') }}"></textarea> <div class="credit_rating_input_wrapper"> <input class="credit_rating_input" :class="{'error_input' : formErrors.phoneEmailReview }" @change="clearErrors" v-model="phoneEmailReview" type="text" placeholder="{{ 'finance.credit.credit_email_phone'|trans({}, 'portal_base') }}"> <div class="checkboxes_rating_check"> <label class="checkbox rating_check_b"> <input v-model="approveConditions" @change="clearErrors" type="checkbox"/> <div class="checkbox_rating_check" :class="{'error_input' : formErrors.approveConditions }"></div> <div class="checkbox_rating_body">{{ 'reglament_to.consent_collection'|trans({}, 'portal_base') }} <a target="_blank" href="{{ path('portal_privacy_policy') }}">{{ 'finance.credit.credit_protected_policy'|trans({}, 'portal_base') }}</a> </div> </label> </div> </div> <button @click="sendSomeData" class="credit_rating_btn">{{ 'finance.credit.credit_send_estimate'|trans({}, 'portal_base') }}</button> </div> </div> </div> </div> </section> {% include '@Portal/Modules/call-me-popup.html.twig' with { 'route': path('form_call_me', {'formType': 4}), 'showDealer': true } %} {% include '@Portal/Modules/sps-popup-portal.html.twig' %} <section class="plashka-add" id="in-compare-hint" style="display: none"> <div class="container"> <div class="row d-inline-block row text-center"> <span class="plashka-add-icon"></span> <span class="plashka-add-title">{{ 'favorite.added_favorit'|trans({}, 'portal_base') }}</span> <a href="{{ path('portal_comparison') }}">{{ 'favorite.go_favorite'|trans({}, 'portal_base') }} <span id="in-compare-footer-cnt">5</span></a> </div> </div> </section>{% endblock %}{% block script %} <script src="/dist/{{ MODE }}/portal/js/portalCreditCalc.js?{{ VERSION }}"></script> <script> $(() => { const obj = new portal.portalCreditCalc.Credit(); obj.initReviewCreditCalc({ reviewCreditCalcUrl: '{{ path('portal_finance_client_review') }}', }); obj.initCreditCalc({ getVehicleBrandUrl: '{{ path('dc_credit_find_brand') }}', getVehicleModelUrl: '{{ path('dc_credit_find_model') }}', getVehicleEquipmentUrl: '{{ path('dc_credit_find_equipment') }}', getVehicleVariationUrl: '{{ path('dc_credit_find_variation') }}', getVehicleUrl: '{{ path('dc_credit_get_vehicle') }}', initCreditCalcUrl: '{{ path('portal_finance_credit_init') }}', initTradeInUrl: '{{ path('dc_ti_init') }}', agreementUrl: '{{ path('automarket_personal_data_agreement') }}', loadListDocumentUrl: '{{ path('dc_credit_load_documents') }}', schedulePaymentUrl: '{{ path('dc_credit_load_schedule_credit_pdf') }}', getVehiclesByWalletUrl: '{{ path('portal_finance_credit_by_price') }}', getVehiclesWithMinPriceUrl: '{{ path('portal_finance_credit_by_price_min') }}', getCrmUUIDUrl: '{{ path('portal_finance_crm_lead_by_uuid') }}', getCrmDataUrl: '{{ path('portal_finance_crm_create_lead') }}', sendLeadUrl: '{{ path('dc_credit_save') }}', ks: '{{ 'catalog.k_s'|trans({}, 'portal_base') }}', enginePower: '{{ 'cars.engine'|trans({}, 'portal_base') }}', translate_month: '{{ 'finance.credit.credit_month_short'|trans({}, 'portal_base') }}', translate_under: '{{ 'finance.credit.credit_under'|trans({}, 'portal_base') }}', translate_first_payment: '{{ 'form.first_give'|trans({}, 'portal_base') }}', translate_uah: ' грн', translate_not_enough_money: '{{ 'finance.credit.not_enough_money'|trans({}, 'portal_base') }}', translate_not_estimate_vehicle: '{{ 'finance.credit.not_estimate_vehicle'|trans({}, 'portal_base') }}', translate_min_first_payment_for_car: '{{ 'finance.credit.min_first_payment_for_car'|trans({}, 'portal_base') }}', translate_unfortunately_not_enough: '{{ 'finance.credit.unfortunately_not_enough'|trans({}, 'portal_base') }}', translate_price_of_your_car: '{{ 'finance.credit.price_of_your_car'|trans({}, 'portal_base') }}', translate_min: '{{ 'finance.credit.min'|trans({}, 'portal_base') }}', translate_min_first_payment: '{{ 'finance.credit.min_first_payment'|trans({}, 'portal_base') }}', translate_min_month_payment: '{{ 'finance.credit.min_month_payment'|trans({}, 'portal_base') }}', translate_month_term_credit: '{{ 'finance.credit.month_term_credit'|trans({}, 'portal_base') }}', continue_first_least: '{{ 'finance.credit.continue_first_least'|trans({}, 'portal_base') }}', translate_term_months: '{{ 'finance.credit.term_months'|trans({}, 'portal_base') }}', translate_term_months_short: '{{ 'finance.credit.term_months_short'|trans({}, 'portal_base') }}', translate_price_from: '{{ 'finance.credit.price_from'|trans({}, 'portal_base') }}', translate_max_first_payment: '{{ 'finance.credit.translate_max_first_payment'|trans({}, 'portal_base') }}', translate_change_sum: '{{ 'finance.credit.translate_change_sum'|trans({}, 'portal_base') }}', translate_pre_estimate_count_1: '{{ 'finance.credit.translate_pre_estimate_count_1'|trans({}, 'portal_base') }}', translate_pre_estimate_count_2: '{{ 'finance.credit.translate_pre_estimate_count_2'|trans({}, 'portal_base') }}', name: '{{ app.user.name | default(null) }}', phone: '{{ app.user.phone | default(null) }}', }); }); </script> <script> {# accordion #} $(".tabs_change_ac_title").click(function() { $(this) .toggleClass("active") .next(".tabs_change_ac_content") .slideToggle() .parent() .siblings() .find(".tabs_change_ac_content") .slideUp() .prev() .removeClass("active"); }); $("#show-call-me-form").click(function(e) { e.preventDefault(); $("#call-me").modal('toggle'); }); </script>{% endblock %}