src/PortalBundle/Resources/views/Service/night-booking.html.twig line 1

Open in your IDE?
  1. {% extends '@Portal/base.html.twig' %}
  3. {% block seo %}
  4.     <title></title>
  5.     <meta name="description" content=""/>
  6. {% endblock %}
  8. {% block css %}
  9.     <link rel="stylesheet" href="{{ asset('bundles/portal/css/night-booking.css') }}">
  10. {% endblock %}
  12. {% block content %}
  13.     <section class="main-block__night-booking">
  14.         <div class="container">
  15.             <div class="section__for__night-booking__wrapper">
  16.                 <div class="section__for__night-booking">
  17.                     <div class="main-block__name-night-booking">
  18.                         {{ 'night_booking.next_service_level'|trans({}, 'portal_base') }} VIDI
  19.                     </div>
  20.                     <h1 class="main-block__h1-night-booking">
  21.                         {{ 'night_booking.booking_not_working_time'|trans({}, 'portal_base') }}
  22.                     </h1>
  23.                     <div class="main-block__text-night-booking">
  24.                         {{ 'night_booking.situations'|trans({}, 'portal_base') }}
  25.                     </div>
  26.                     <div class="main-block__btn-night-booking">
  27.                         <a href="{{ path('my_profile_night_service') }}">{{ 'night_booking.send_request'|trans({}, 'portal_base') }}</a>
  28.                     </div>
  30.                 </div>
  31.                 <div class="main-block__img-night-booking"
  32.                      style="background-image: url('{{ asset('bundles/portal/img/night-booking/artboard.jpg') }}')"></div>
  33.             </div>
  34.         </div>
  35.     </section>
  36.     <section  class="night-booking">
  37.         <div class="container">
  38.             <div class="section__for__night-booking">
  39.                 <h2>{{ 'night_booking.what_to_do'|trans({}, 'portal_base') }}</h2>
  40.                 <div class="text__profile-night-booking">{{ 'night_booking.we_propose'|trans({}, 'portal_base') }}
  41.                     – <a href="{{ path('my_profile_night_service') }}">{{ 'night_booking.we_propose_href'|trans({}, 'portal_base') }}</a>
  42.                 </div>
  43.             </div>
  45.         </div>
  46.     </section>
  47.     <section class="night-booking mb-5">
  48.         <div class="container">
  49.             <h2>{{ 'night_booking.service_advantages'|trans({}, 'portal_base') }}</h2>
  50.             <div class="section__for__advantages-night-booking__wrapper">
  51.                 <div class="box__advantages-night-booking">
  52.                     <img class="icon__night-booking"
  53.                          src="{{ asset('bundles/portal/img/night-booking/icon/icon_1.png') }}" alt=""
  54.                          style="visibility: visible;">
  55.                     <div class="text__advantages-night-booking">{{ 'night_booking.client_has_option'|trans({}, 'portal_base') }}</div>
  56.                 </div>
  57.                 <div class="box__advantages-night-booking">
  58.                     <img class="icon__night-booking"
  59.                          src="{{ asset('bundles/portal/img/night-booking/icon/icon_2.png') }}" alt=""
  60.                          style="visibility: visible;">
  61.                     <div>{{ 'night_booking.auto_special_place'|trans({}, 'portal_base') }}</div>
  62.                 </div>
  63.                 <div class="box__advantages-night-booking">
  64.                     <img class="icon__night-booking"
  65.                          src="{{ asset('bundles/portal/img/night-booking/icon/icon_3.png') }}" alt=""
  66.                          style="visibility: visible;">
  67.                     <div class="text__advantages-night-booking">{{ 'night_booking.key_from_auto'|trans({}, 'portal_base') }}</div>
  68.                 </div>
  69.                 <div class="box__advantages-night-booking">
  70.                     <img class="icon__night-booking"
  71.                          src="{{ asset('bundles/portal/img/night-booking/icon/icon_4.png') }}" alt=""
  72.                          style="visibility: visible;">
  73.                     <div class="text__advantages-night-booking">{{ 'night_booking.works_approval'|trans({}, 'portal_base') }}</div>
  74.                 </div>
  75.                 <div class="box__advantages-night-booking">
  76.                     <img class="icon__night-booking"
  77.                          src="{{ asset('bundles/portal/img/night-booking/icon/icon_5.png') }}" alt=""
  78.                          style="visibility: visible;">
  79.                     <div class="text__advantages-night-booking">{{ 'night_booking.free_service'|trans({}, 'portal_base') }}</div>
  80.                 </div>
  81.                 <div class="box__advantages-night-booking">
  82.                     <img class="icon__night-booking"
  83.                          src="{{ asset('bundles/portal/img/night-booking/icon/icon_6.png') }}" alt=""
  84.                          style="visibility: visible;">
  85.                     <div class="text__advantages-night-booking">{{ 'night_booking.safe_service'|trans({}, 'portal_base') }}</div>
  86.                 </div>
  87.             </div>
  89.         </div>
  90.     </section>
  91. {#    <section id="night-booking-page" class="night-booking">#}
  92. {#        <div class="container">#}
  93. {#            <h2>Як працює послуга?</h2>#}
  94. {#            <div class="section__for__night-booking__wrapper">#}
  95. {#                <div class="section__for__night-booking">#}
  96. {#                    <div class="left__night-booking__wrapper">#}
  97. {#                        <div class="control__info-night-booking">#}
  98. {#                            <div class="btn-arrow-night-booking left" :class="{'active': stage > 1 }"#}
  99. {#                                 v-on:click="prevStage"></div>#}
  100. {#                            <div class="control__title__stage-night-booking"><span>КРОК</span> <span#}
  101. {#                                        v-html="stage"></span></div>#}
  102. {#                            <div class="btn-arrow-night-booking right" :class="{'active': stage < maxStage  }"#}
  103. {#                                 v-on:click="nextStage"></div>#}
  104. {#                        </div>#}
  105. {#                        <div class="">#}
  106. {#                            <div v-if="stage == 1">Клієнт в особистому кабінеті на сайті розміщує заявку із потребою#}
  107. {#                                залишити автомобіль у неробочий час, в якій зазначає свої контактні дані, дату та час#}
  108. {#                                приїзду, державний номер автомобіля та, при необхідності, номер евакуатора.#}
  109. {#                                Отримує на власний смартфон підтвердження замовлення, а також посилання на інформацію#}
  110. {#                                щодо подальших дій.#}
  111. {#                            </div>#}
  113. {#                            <div v-if="stage == 2">Після прибуття клієнта до в’їзду на територію VIDI система перевіряє#}
  114. {#                                державний#}
  115. {#                                номер автомобіля або евакуатора та автоматично відчиняє ворота для в’їзду.#}
  116. {#                            </div>#}
  118. {#                            <div v-if="stage == 3">За допомогою інформаційних елементів (пілонів) автомобіль клієнта#}
  119. {#                                (евакуатор)#}
  120. {#                                скеровується до паркувального майданчика, де здійснюється його паркування або#}
  121. {#                                розвантаження.#}
  122. {#                            </div>#}
  124. {#                            <div v-if="stage == 4">Після паркування або розвантаження автомобіля, клієнт, за допомогою#}
  125. {#                                інформаційних#}
  126. {#                                елементів (пілонів), скеровується у приміщення, де розміщений поштомат. Користуючись#}
  127. {#                                особистим кабінетом, клієнт відчиняє дверцята вільної комірки поштомату та залишає в#}
  128. {#                                ній ключі та, за необхідності, супроводжувальні документи на автомобіль.#}
  129. {#                            </div>#}
  131. {#                            <div v-if="stage == 5">Після зачинення дверцят комірки клієнт отримує автоматичне#}
  132. {#                                підтвердження про факт#}
  133. {#                                надання послуги.#}
  135. {#                                Виїзд евакуатора з території здійснюється зворотнім порядком, вихід клієнта – за#}
  136. {#                                допомогою спеціального одноразового «електронного квитка» у особистому кабінеті#}
  137. {#                                через спеціально обладнаний прохід#}
  138. {#                            </div>#}
  140. {#                            <div v-if="stage == 6">У найближчий робочий день майстер-приймальник телефонує Клієнту, і,#}
  141. {#                                після#}
  142. {#                                погодження, приймає автомобіль до виконання робіт.#}
  143. {#                            </div>#}
  144. {#                        </div>#}
  145. {#                    </div>#}
  146. {#                </div>#}
  147. {#                <div class="section__for__night-booking">#}
  148. {#                    <img v-if="stage == 1" class="section__for__img-night-booking"#}
  149. {#                         src="{{ asset('bundles/portal/img/night-booking/night-booking-stage-1.jpg') }}"#}
  150. {#                         alt=""#}
  151. {#                         style="visibility: visible;">#}
  152. {#                    <img v-if="stage == 2" class="section__for__img-night-booking"#}
  153. {#                         src="{{ asset('bundles/portal/img/night-booking/night-booking-stage-2.jpg') }}"#}
  154. {#                         alt=""#}
  155. {#                         style="visibility: visible;">#}
  156. {#                    <img v-if="stage == 3" class="section__for__img-night-booking"#}
  157. {#                         src="{{ asset('bundles/portal/img/night-booking/night-booking-stage-3.jpg') }}"#}
  158. {#                         alt=""#}
  159. {#                         style="visibility: visible;">#}
  160. {#                    <img v-if="stage == 4" class="section__for__img-night-booking"#}
  161. {#                         src="{{ asset('bundles/portal/img/night-booking/night-booking-stage-4.jpg') }}"#}
  162. {#                         alt=""#}
  163. {#                         style="visibility: visible;">#}
  164. {#                    <img v-if="stage == 5" class="section__for__img-night-booking"#}
  165. {#                         src="{{ asset('bundles/portal/img/night-booking/night-booking-stage-5.jpg') }}"#}
  166. {#                         alt=""#}
  167. {#                         style="visibility: visible;">#}
  168. {#                    <img v-if="stage == 6" class="section__for__img-night-booking"#}
  169. {#                         src="{{ asset('bundles/portal/img/night-booking/night-booking-end.jpg') }}" alt=""#}
  170. {#                         style="visibility: visible;">#}
  171. {#                </div>#}
  173. {#            </div>#}
  174. {#        </div>#}
  175. {#    </section>#}
  176. {% endblock %}
  178. {% block pageJS %}
  179.     <script>
  180.         app.onCustomEvent('appInit', function () {
  181.             app.loadJs('{{ asset('/bundles/portal/js/night-booking.js') }}', function () {
  182.                 initNightBookingPage({});
  183.             });
  184.         });
  185.     </script>
  186. {% endblock %}