src/DcSiteBundle/Resources/views/Morris_Garage/Car/car-in-stocks.html.twig line 1

Open in your IDE?
  1. {% extends '@DcSite/Morris_Garage/base.html.twig' %}
  3. {% block seo %}
  4.     <title>{{ 'seo.car_in_stock.title'|trans({}, 'dc_morris') }}</title>
  5.     <meta name="description" content="{{ 'seo.car_in_stock.desc'|trans({}, 'dc_morris') }}" />
  6.     <meta name="facebook-domain-verification" content="dzyq8tksmolgarcjvze99xuevh7wwz" />
  7. {% endblock seo %}
  9. {% block ogtagDynamic %}
  10.     <meta property="og:title" content="{{ 'seo.car_in_stock.title'|trans({}, 'dc_morris') }}"/>
  11.     <meta property="og:description" content="{{ 'seo.car_in_stock.desc'|trans({}, 'dc_morris') }}"/>
  12. {% endblock ogtagDynamic %}
  14. {% block css %}
  15. {% endblock %}
  18. {% block content %}
  19.     <section class="breadcrumbs__new">
  20.         <div class="container">
  21.             <ol class="global_breadcrumbs__new" itemscope itemtype="https://schema.org/BreadcrumbList">
  22.                 <li class="marker__none" itemprop="itemListElement" itemscope
  23.                     itemtype="https://schema.org/ListItem">
  24.                     <a itemprop="item" href="{{ path('mg_homepage') }}">
  25.                         <span class="breadcrumbs__link" itemprop="name">Morris Garages</span></a>
  26.                     <meta itemprop="position" content="1"/>
  27.                 </li>
  29.                 <div class="arrow-bcs"> ❯ </div>
  30.                 <li itemprop="item" class="marker__none" itemprop="itemListElement" itemscope
  31.                     itemtype="https://schema.org/ListItem">
  32.                     <span style="color: #727272;" class="breadcrumbs__link" itemprop="name">{{ 'pages.car_in_stock.breadcrumb_title'|trans({}, 'dc_morris') }}</span>
  33.                     <meta itemprop="position" content="2"/>
  34.                 </li>
  35.             </ol>
  36.         </div>
  37.     </section>
  39.     <section class="modules__used-cars elements__style-form-el pt-0" id="used-car-catalog">
  40.         <div class="modules__used-cars-filter" v-if="step === 2">
  41.             <div class="container">
  42.                 <div class="row">
  43.                     <div class="col-md-3">
  44.                         <div class="form-group">
  45.                             <select class="form-control" v-model="selected.model">
  46.                                 <option :value="0">Модель</option>
  47.                                 <option :value="model.id" v-for="model in models" v-html="model.name"></option>
  48.                             </select>
  49.                         </div>
  50.                     </div>
  51.                     <div class="col-md-3">
  52.                         <div class="form-group">
  53.                             <select class="form-control" v-model="selected.equipment" :disabled="!selected.model">
  54.                                 <option :value="0">{{ 'car_in_stock_module.complectation'|trans({}, 'dc_base') }}</option>
  55.                                 <option v-for="equipment in equipments[selected.model]" :value="equipment.id" v-html="equipment.name"></option>
  56.                             </select>
  57.                         </div>
  58.                     </div>
  59.                     <div class="col-md-3">
  60.                         <div class="form-group">
  61.                             <select class="form-control" v-model="selected.fuelType" :disabled="!selected.model">
  62.                                 <option :value="0">{{ 'car_in_stock_module.fuel_type'|trans({}, 'dc_base') }}</option>
  63.                                 <option v-for="fuel in fuelTypes[selected.model]" :value="fuel.id" v-html="fuel.name"></option>
  64.                             </select>
  65.                         </div>
  66.                     </div>
  67.                     <div class="col-md-3" v-if="colors[selected.model]">
  68.                         <div class="form-group">
  69.                             <select class="form-control" v-model="selected.color" :disabled="!selected.model">
  70.                                 <option :value="0">{{ 'car_in_stock_module.color'|trans({}, 'dc_base') }}</option>
  71.                                 <option v-for="color in colors[selected.model]" :value="color" v-html="color"></option>
  72.                             </select>
  73.                         </div>
  74.                     </div>
  75.                 </div>
  76.                 <div class="row">
  77.                     <div class="col-md-3 d-flex justify-content-between">
  78.                         <button class="modules__used-cars-filter-btn filter-btn-reset d-flex align-items-center" @click="reset">
  79.                             {{ 'car_in_stock_module.reset_all'|trans({}, 'dc_base') }} <span class="close-icon"></span>
  80.                         </button>
  81.                     </div>
  82.                 </div>
  83.             </div>
  84.         </div>
  86.         <header class="page-header">
  87.             <div class="container">
  88.                 <h1 class="section-title text-center mb-3">{{ 'pages.car_in_stock.title'|trans({}, 'dc_morris') }}</h1>
  90.                 {% include '@DcSite/Modules/car-instock/index.html.twig' with {
  91.                     'paths': {
  92.                         'leasingPage': path('mg_finance_leasing'),
  93.                         'creditPage': path('mg_finance_credit'),
  94.                         'tradeInPage': path('mg_finance_trade_in'),
  95.                         'testDrivePage': path('mg_service_consultation')
  96.                     }
  97.                 } %}
  99.                 <div class="page-header__descr text-center">
  100.                     {{ 'pages.car_in_stock.title_desc'|trans({}, 'dc_morris')|raw }}
  101.                 </div>
  102.             </div>
  103.         </header>
  105.         <div class="container" v-if="display__twig">
  107.             {% if vehicles.vehicles is defined %}
  108.                 <div class="row car-list mb-0">
  109.                     {% for vehicle in vehicles.vehicles %}
  110.                         <div class="col-6 col-md-4">
  111.                             <div class="car-list__item">
  112.                                 <a href="{{ vehicle.url }}" class="car-list__photo">
  113.                                     <img src="{{ vehicle.image }}" alt="{{ vehicle.name }}">
  114.                                 </a>
  116.                                 <div class="car-list__title">
  117.                                     <a href="{{ vehicle.url }}">MG <span>{{ vehicle.name }}</span></a>
  118.                                 </div>
  119.                                 <div class="car-list__compelctation">{{ vehicle.equipment.title }}</div>
  121.                                 {% if vehicle.hasStorage and not vehicle.hasReserved %}
  122.                                     <div class="modules__filter-car-instock">
  123.                                         {{ 'car_in_stock_module.in_stock'|trans({}, 'dc_base') }}
  124.                                     </div>
  125.                                 {% endif %}
  127.                                 <ul class="car-list-options --price --b-bottom">
  128.                                     {% if vehicle.hasReserved %}
  129.                                         <li class="first-price">{{ 'car_in_stock_module.reserved'|trans({}, 'dc_base') }}</li>
  130.                                     {% elseif vehicle.inDelivery and not vehicle.hasStorage %}
  131.                                         <li class="first-price">{{ 'car_in_stock_module.in_delivery'|trans({}, 'dc_base') }}</li>
  132.                                     {% else %}
  133.                                         <li class="car-list-options__item">
  134.                                             <span class="car-list-options__title">{{ 'car.price.title'|trans({}, 'dc_morris') }}, {{ 'car.price.currency_hrn'|trans({}, 'dc_morris') }}</span>
  135.                                             <span class="car-list-options__val">
  136.                                                 <span>{{ vehicle.price|price }} грн</span>
  137.                                                 {% if vehicle.fullPrice and vehicle.fullPrice > vehicle.price %}
  138.                                                     <div class="second-price">{{ vehicle.fullPrice|price }} грн</div>
  139.                                                 {% endif %}
  140.                                             </span>
  141.                                         </li>
  142.                                     {% endif %}
  143.                                 </ul>
  145.                                 <ul class="car-list-options">
  146.                                     <li class="car-list-options__item">
  147.                                         <span class="car-list-options__title">{{ 'car.options.power'|trans({}, 'dc_morris') }}</span>
  148.                                         <span class="car-list-options__val">{{ vehicle.power }} к.с.
  149.                                         </span>
  150.                                     </li>
  151.                                     <li class="car-list-options__item">
  152.                                         <span class="car-list-options__title">{{ 'car.options.fuel_type'|trans({}, 'dc_morris') }}</span>
  153.                                         <span class="car-list-options__val">{{ vehicle.fuelType.name }}
  154.                                         </span>
  155.                                     </li>
  156.                                     <li class="car-list-options__item">
  157.                                         <span class="car-list-options__title">{{ 'car.options.year'|trans({}, 'dc_morris') }}</span>
  158.                                         <span class="car-list-options__val">{{ vehicle.year }}</span>
  159.                                     </li>
  160.                                 </ul>
  162.                                 <a href="{{ vehicle.url }}" class="btn btn-outline-primary --size-md w-100 car-list__more">{{ 'pages.buttons.details'|trans({}, 'dc_base') }}</a>
  163.                             </div>
  164.                         </div>
  165.                     {% endfor %}
  166.                 </div>
  167.             {% endif %}
  168.         </div>
  169.         <div class="container" v-if="display__vue">
  170.             <div class="row car-list mb-0 ">
  171.                 <div class="col-6 col-md-4" v-if="filter(vehicle)" v-for="vehicle in vehicles">
  172.                     <div class="car-list__item">
  173.                         <a :href="vehicle.url" class="car-list__photo">
  174.                             <img :src="vehicle.image" :alt="vehicle.name">
  175.                         </a>
  177.                         <div class="car-list__title">
  178.                             <a :href="vehicle.url">MG <span v-html="vehicle.name"></span></a>
  179.                         </div>
  180.                         <div class="car-list__compelctation" v-html="vehicle.equipment.title"></div>
  182.                         <div v-if="vehicle.hasStorage && !vehicle.hasReserved" class="modules__filter-car-instock">
  183.                             {{ 'car_in_stock_module.in_stock'|trans({}, 'dc_base') }}
  184.                         </div>
  186.                         <ul class="car-list-options --price --b-bottom">
  187.                             <li v-if="vehicle.hasReserved" class="first-price">{{ 'car_in_stock_module.reserved'|trans({}, 'dc_base') }}</li>
  188.                             <li v-else-if="vehicle.inDelivery && !vehicle.hasStorage" class="first-price">{{ 'car_in_stock_module.in_delivery'|trans({}, 'dc_base') }}</li>
  189.                             <li v-else class="car-list-options__item">
  190.                                 <span class="car-list-options__title">{{ 'car.price.title'|trans({}, 'dc_morris') }}, {{ 'car.price.currency_hrn'|trans({}, 'dc_morris') }}</span>
  191.                                 <span class="car-list-options__val">
  192.                                     <span v-html="vehicle.price.toLocaleString() + ' грн'"></span>
  193.                                     <div class="second-price" v-if="vehicle.fullPrice > vehicle.price" v-html="vehicle.fullPrice.toLocaleString() + ' грн'"></div>
  194.                                 </span>
  195.                             </li>
  196.                         </ul>
  198.                         <ul class="car-list-options">
  199.                              <li class="car-list-options__item">
  200.                                 <span class="car-list-options__title">{{ 'car.options.transmission_type'|trans({}, 'dc_morris') }}<</span>
  201.                                 <span class="car-list-options__val" v-html="vehicle.transmissionType.name">
  202.                                 </span>
  203.                             </li>
  204.                             <li class="car-list-options__item">
  205.                                 <span class="car-list-options__title">{{ 'car.options.power'|trans({}, 'dc_morris') }}</span>
  206.                                 <span class="car-list-options__val" v-html="vehicle.power + ' к.с.'">
  207.                                 </span>
  208.                             </li>
  209.                             <li class="car-list-options__item">
  210.                                 <span class="car-list-options__title">{{ 'car.options.fuel_type'|trans({}, 'dc_morris') }}</span>
  211.                                 <span class="car-list-options__val" v-html="vehicle.fuelType.name">
  212.                                 </span>
  213.                             </li>
  214.                             <li class="car-list-options__item">
  215.                                 <span class="car-list-options__title">{{ 'car.options.year'|trans({}, 'dc_morris') }}</span>
  216.                                 <span class="car-list-options__val" v-html="vehicle.year"></span>
  217.                             </li>
  218.                         </ul>
  220.                         <a :href="vehicle.url" class="btn btn-outline-primary --size-md w-100 car-list__more">{{ 'pages.buttons.details'|trans({}, 'dc_base') }}</a>
  221.                     </div>
  222.                 </div>
  223.             </div>
  225.         </div>
  226.     </section>
  230. {% endblock %}
  234. {% block pageJS %}
  235.     <script>
  236.         app.onCustomEvent('appInit', function () {
  237.             app.loadCss('{{ asset('bundles/dcsite/css/modules/used-cars/used-cars.css') }}');
  239.             app.loadJs('{{ asset('bundles/dcsite/js/modules/car-in-stock.js') }}',function () {
  240.                 usedCarsCatalog({
  241.                     initUrl: '{{ path('base_car_in_stock_init_catalog') }}',
  242.                     withoutFirstStep : true,
  243.                 });
  244.             });
  245.         });
  246.     </script>
  247. {% endblock %}