src/DcSiteBundle/Resources/views/LandRover/Used/used.html.twig line 1

Open in your IDE?
  1. {% extends '@DcSite/LandRover/base.html.twig' %}
  3. {% block title %}
  4.     <title>{{ 'used.seo_title'|trans({}, 'dc_landrover') }}</title>
  5. {% endblock title %}
  7. {% block seo %}
  8.     <meta name="description" content="{{ 'used.seo_desc'|trans({}, 'dc_landrover') }}" />
  9. {% endblock seo %}
  11. {% block ogtagDynamic %}
  12.     <meta property="og:title" content="{{ 'used.seo_title'|trans({}, 'dc_landrover') }}"/>
  13.     <meta property="og:description" content="{{ 'used.seo_desc'|trans({}, 'dc_landrover') }}"/>
  14. {% endblock ogtagDynamic %}
  17. {% block css %}
  18.     <link rel="stylesheet" href="{{ asset('bundles/dcsite/css/modules/base-style/form-control.css') }}">
  19.     <link rel="stylesheet" href="{{ asset('bundles/dcsite/css/landrover/used/used.css') }}">
  20. {% endblock %}
  23. {% block content %}
  24.     <section class="breadcrumbs__new">
  25.         <div class="container">
  26.             <ol class="global_breadcrumbs__new" itemscope itemtype="https://schema.org/BreadcrumbList">
  27.                 <li class="marker__none" itemprop="itemListElement" itemscope
  28.                     itemtype="https://schema.org/ListItem">
  29.                     <a itemprop="item" href="{{ path('landrover_homepage') }}">
  30.                         <span class="breadcrumbs__link" itemprop="name">Land Rover</span></a>
  31.                     <meta itemprop="position" content="1"/>
  32.                 </li>
  34.                 <div class="arrow-bcs"> ❯ </div>
  35.                 <li itemprop="item" class="marker__none" itemprop="itemListElement" itemscope
  36.                     itemtype="https://schema.org/ListItem">
  37.                     <span style="color: #ABABAB;" class="breadcrumbs__link" itemprop="name">{{ 'used.h1'|trans({}, 'dc_landrover') }}</span>
  38.                     <meta itemprop="position" content="2"/>
  39.                 </li>
  40.             </ol>
  41.         </div>
  42.     </section>
  44.     <main>
  46.         <section class="page-name dark-bg">
  47.             <div class="container">
  48.                 <div class="row">
  49.                     <div class="col-md-12">
  50.                         <h1 class="page-name-title">{{ 'used.h1'|trans({}, 'dc_landrover') }}</h1>
  51.                     </div>
  52.                 </div>
  53.             </div>
  54.         </section>
  56.         <section>
  57.             <div class="container">
  58.                 <div class="row ">
  59.                     <div class="col-md-12">
  60.                         <img src="{{ asset('bundles/dcsite/img/landrover/used/used-car.jpg') }}" alt="" class="w-100">
  61.                     </div>
  62.                 </div>
  63.             </div>
  64.         </section>
  66.         <section class="section-padding bg-grey" id="catalog-filter">
  67.             <div class="container">
  68.                 <div class="row justify-content-center">
  69.                 </div>
  70.                 <div class="row">
  71.                     <div class="col-md-12">
  72.                         <div class="used-filter elements__style-form-el">
  73.                             <div class="row align-items-center">
  74.                                 <div class="col-sm-12 col-md-6 col-lg-4 col-xl-3">
  75.                                     <div class="form-group">
  76.                                         <select class="form-control" v-model="selectedModel">
  77.                                             <option value="all">{{ 'car_page.filter_model'|trans({}, 'dc_base') }}</option>
  78.                                             <option v-for="model in filters.model" v-bind:value="model" v-html="model"></option>
  79.                                         </select>
  80.                                     </div>
  81.                                 </div>
  82.                                 <div class="col-sm-12 col-md-6 col-lg-4 col-xl-3">
  83.                                     <div class="form-group">
  84.                                         <select class="form-control" v-model="selectedYear">
  85.                                             <option value="all">{{ 'car_page.filter_year'|trans({}, 'dc_base') }}</option>
  86.                                             <option v-for="year in filters.year" v-bind:value="year" v-html="year"></option>
  87.                                         </select>
  88.                                     </div>
  89.                                 </div>
  90.                                 <div class="col-sm-12 col-md-6 col-lg-4 col-xl-3">
  91.                                     <div class="form-group">
  92.                                         <input v-model="selectedMileage" type="text" class="form-control" placeholder="{{ 'car_page.filter_mileage_to'|trans({}, 'dc_base') }}">
  93.                                     </div>
  94.                                 </div>
  95.                                 <div class="col-sm-12 col-md-6 col-lg-4 col-xl-3">
  96.                                     <div class="form-group">
  97.                                         <div class="form-group">
  98.                                             <select class="form-control" v-model="selectedEngine">
  99.                                                 <option value="all">{{ 'car_page.filter_engine'|trans({}, 'dc_base') }}</option>
  100.                                                 <option v-for="engine in filters.engineVolume" v-bind:value="engine" v-html="engine"></option>
  101.                                             </select>
  102.                                         </div>
  103.                                     </div>
  104.                                 </div>
  105.                                 <div class="col-sm-12 col-md-6 col-lg-4 col-xl-3">
  106.                                     <button v-on:click="applyFilter" class="btn btn-black">{{ 'used.apply'|trans({}, 'dc_landrover') }}</button>
  107.                                 </div>
  108.                                 <div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 offset-xl-6">
  109.                                     <button v-on:click="discardFilter" class="modules__used-cars-filter-btn filter-btn-reset d-flex align-items-center">
  110.                                         <span class="close-icon"></span> {{ 'used.delete'|trans({}, 'dc_landrover') }}
  111.                                     </button>
  112.                                 </div>
  113.                             </div>
  115.                         </div>
  116.                     </div>
  117.                 </div>
  119.                 <div class="row" ref="type_twig" v-if="!isDelayedShow">
  120.                     {% for vehicle in vehicles %}
  121.                         <div class="col-sm-12 col-md-6 col-lg-4 col-xl-3">
  122.                         {% if vehicle.sold %}
  123.                             {% set class = 'sales' %}
  124.                         {% elseif vehicle.deposit %}
  125.                             {% set class = 'deposit' %}
  126.                         {% elseif vehicle.reserved %}
  127.                             {% set class = 'reserved' %}
  128.                         {% else %}
  129.                             {% set class = null %}
  130.                         {% endif %}
  131.                         <div class="used_filter-card {{ class }}">
  132.                             <div class="deposit-sales-bg"></div>
  133.                             {% if vehicle.hasNds %}
  134.                                 <span class="pdv-title">
  135.                                     {{ 'pages.base.pdv'|trans({}, 'dc_base') }}
  136.                                     <div class="pdv-title__tooltip">
  137.                                         <span>{{ 'small_words.nds'|trans({},'automarket_base') }}</span>
  138.                                         <p>{{ 'small_words.nds_full'|trans({},'automarket_base') }}</p>
  139.                                     </div>
  140.                                 </span>
  141.                             {% endif %}
  142.                             <div class="used_filter-card-img">
  143.                                 {% if vehicle.deposit %}
  144.                                     <span class="deposit-title">{{ 'main.deposit'|trans({}, 'dc_landrover') }}</span>
  145.                                 {% endif %}
  146.                                 {% if vehicle.sold %}
  147.                                     <span class="sales-title">Продано</span>
  148.                                 {% endif %}
  149.                                 {% if vehicle.reserved %}
  150.                                     <span class="reserved-title">{{ 'main.reserved_car'|trans({}, 'dc_landrover') }}</span>
  151.                                 {% endif %}
  152.                                 <img src="{{ vehicle.img }}" alt="">
  153.                             </div>
  155.                             <div class="used_filter-head">
  156.                                 <h5 class="card-title">{{ vehicle.model }}</h5>
  157.                                 <span class="car-year">{{ vehicle.year }}</span>
  158.                                 {% if vehicle.program %}
  159.                                     <h5 class="card-title">{{ vehicle.program }}</h5>
  160.                                 {% else %}
  161.                                     <h5 class="card-title" style="height: 22px"></h5>
  162.                                 {% endif %}
  163.                             </div>
  165.                             <div class="used_filter-body">
  166.                                 <span>
  167.                                     <img src="{{ asset('bundles/dcsite/img/landrover/used/mileage.svg') }}" alt="">
  168.                                     {{ vehicle.mileage }} км
  169.                                 </span>
  170.                                 <span>
  171.                                     <img src="{{ asset('bundles/dcsite/img/landrover/used/manual.svg') }}" alt="">
  172.                                     {{ vehicle.transmission }}
  173.                                 </span>
  174.                                 <span class="used_filter-body-last">
  175.                                     <img src="{{ asset('bundles/dcsite/img/landrover/used/engine.svg') }}" alt="">
  176.                                     {{ vehicle.fuel }}, {{ vehicle.engineVolume }} л / {{ vehicle.enginePower }} к.с.
  177.                                 </span>
  178.                             </div>
  179.                             <div class="used_filter-price">
  180.                                 <span class="used_filter-price-uah">{{ vehicle.priceUA|price }}</span>
  181.                                 <span class="used_filter-price-usd">{{ vehicle.priceEU|price }}</span>
  182.                             </div>
  184.                             <a href="{{ vehicle.path }}" class="btn btn-black">{{ 'main.details'|trans({}, 'dc_landrover') }}</a>
  185.                         </div>
  186.                     </div>
  187.                     {% endfor %}
  188.                 </div>
  190.                 <div class="row" ref="type_vue" v-if="isDelayedShow">
  191.                     <div class="col-sm-12 col-md-6 col-lg-4 col-xl-3" v-for="vehicle in filteredVehicles.slice(0, displayedVehicles)">
  192.                         <div class="used_filter-card" v-bind:class="{ sales: vehicle.sold, 'deposit': vehicle.deposit, 'reserved': vehicle.reserved }">
  193.                             <div class="deposit-sales-bg"></div>
  194.                             <span class="pdv-title" v-if="vehicle.hasNds">
  195.                                 {{ 'pages.base.pdv'|trans({}, 'dc_base') }}
  196.                                 <div class="pdv-title__tooltip">
  197.                                     <span>{{ 'small_words.nds'|trans({},'automarket_base') }}</span>
  198.                                     <p>{{ 'small_words.nds_full'|trans({},'automarket_base') }}</p>
  199.                                 </div>
  200.                             </span>
  201.                             <div class="used_filter-card-img">
  202.                                 <span class="deposit-title" v-if="vehicle.deposit">{{ 'main.deposit'|trans({}, 'dc_landrover') }}</span>
  203.                                 <span class="sales-title" v-if="vehicle.sold">Продано</span>
  204.                                 <span class="reserved-title" v-if="vehicle.reserved">{{ 'main.reserved_car'|trans({}, 'dc_landrover') }}</span>
  205.                                 <img :src="vehicle.img" alt="">
  206.                             </div>
  208.                             <div class="used_filter-head">
  209.                                 <h5 class="card-title" v-html="vehicle.model"></h5>
  210.                                 <span class="car-year" v-html="vehicle.year"></span>
  211.                                 <h5 class="card-title" v-if="vehicle.program" v-html="vehicle.program"></h5>
  212.                                 <h5 class="card-title" v-else style="height: 22px"></h5>
  213.                             </div>
  215.                             <div class="used_filter-body">
  216.                                 <span>
  217.                                     <img src="{{ asset('bundles/dcsite/img/landrover/used/mileage.svg') }}" alt="">
  218.                                     {% verbatim %}{{ vehicle.mileage }}{% endverbatim %} км
  219.                                 </span>
  220.                                 <span>
  221.                                     <img src="{{ asset('bundles/dcsite/img/landrover/used/manual.svg') }}" alt="">
  222.                                     {% verbatim %}{{ vehicle.transmission }}{% endverbatim %}
  223.                                 </span>
  224.                                 <span class="used_filter-body-last">
  225.                                     <img src="{{ asset('bundles/dcsite/img/landrover/used/engine.svg') }}" alt="">
  226.                                     {% verbatim %}{{ vehicle.fuel }}, {{ vehicle.engineVolume }} л / {{ vehicle.enginePower }} к.с.{% endverbatim %}
  227.                                 </span>
  228.                             </div>
  229.                             <div class="used_filter-price">
  230.                                 <span class="used_filter-price-uah" v-html="vehicle.priceUA.toLocaleString('ru-RU')"></span>
  231.                                 <span class="used_filter-price-usd" v-html="vehicle.priceEU.toLocaleString('ru-RU')"></span>
  232.                             </div>
  234.                             <a v-bind:href="vehicle.path" class="btn btn-black">{{ 'main.details'|trans({}, 'dc_landrover') }}</a>
  235.                         </div>
  236.                     </div>
  237.                 </div>
  238.                 <div class="row">
  239.                     <div class="col-md-12 text-center">
  240.                         <button v-on:click="delayedShow" v-if="displayedVehicles < totalVehicles" class="btn used_filter-show-more">{{ 'used.show_more'|trans({}, 'dc_landrover') }}</button>
  241.                     </div>
  242.                 </div>
  243.             </div>
  244.         </section>
  246.     </main>
  247. {% endblock content %}
  249. {% block pageJS %}
  250.     <script>
  251.         app.onCustomEvent('appInit', function () {
  252.             app.loadJs('{{ asset('bundles/dcsite/js/landrover/catalog-used.js') }}',function () {
  253.                 init({
  254.                     initUrl: '{{ path('landrover_init_used_catalog') }}',
  255.                 });
  256.             });
  257.         });
  258.     </script>
  259. {% endblock %}