src/Aqarmap/Bundle/ListingBundle/Resources/views/Listing/compoundUnits.html.twig line 1

Open in your IDE?
  2. {% set isRTL = app.request.get('_locale') == 'ar'  %}
  3. {% set primaryActiveClass = hasPrimaryUnits ? 'active': '' %}
  4. {% set allowActiveResale = not hasPrimaryUnits and hasResaleUnits %}
  5. {% set resaleActiveClass = allowActiveResale ? 'active': '' %}
  6. {% set allowActiveRent = not hasPrimaryUnits and not allowActiveResale and hasRentUnits %}
  7. {% set rentActiveClass = allowActiveRent ? 'active': '' %}
  8. {% set resaleEvent = [{'isFired':true , 'trigger': 'gtm-btn-resale-tab-click' }] %}
  9. {% set primaryEvent = [{'isFired':true , 'trigger': 'gtm-btn-primary-tab-click' }] %}
  10. {% set rentEvent = [{'isFired':true , 'trigger': 'gtm-btn-rent-tab-click' }] %}
  11. {% set tableHeight = 188 %}
  12. {% set unitsLimit = 5 %}
  13. {% set listingSlug = listing.slug %}
  14. {% if not isPrimaryUnitsOnly %}
  15.     <ul class="nav nav-justified units-tabs" id="pills-tab" role="tablist">
  16.         <li class="nav-item units-tabs__item">
  17.             <span class="{{primaryActiveClass}} units-tabs__link large-element-tab mb-0" id="pills-primary-tab" data-toggle="pill" href="#pills-primary" role="tab" aria-controls="pills-primary" aria-selected="true"
  18.                 onclick="elementEvents.fireGTM('', '', {{ primaryEvent|json_encode() }})">
  19.                 {{'compound_units.primary'|trans}}
  20.             </span>
  21.         </li>
  22.         {% if hasResaleUnits %}
  23.             <li class="nav-item units-tabs__item">
  24.                 <span class="{{resaleActiveClass}} units-tabs__link large-element-tab mb-0" id="pills-resale-tab" data-toggle="pill" href="#pills-resale" role="tab" aria-controls="pills-resale" aria-selected="false"
  25.                     onclick="elementEvents.fireGTM('', '', {{ resaleEvent|json_encode() }})">
  26.                     {{'compound_units.resale'|trans}}
  27.                 </span>
  28.             </li>
  29.         {% endif %}    
  30.         {% if hasRentUnits %}
  31.             <li class="nav-item units-tabs__item">
  32.                 <span class="{{rentActiveClass}} units-tabs__link large-element-tab mb-0" id="pills-rent-tab" data-toggle="pill" href="#pills-rent" role="tab" aria-controls="pills-rent" aria-selected="false"
  33.                     onclick="elementEvents.fireGTM('', '', {{ rentEvent|json_encode() }})">
  34.                     {{'compound_units.rent'|trans}}
  35.                 </span>
  36.             </li>
  37.         {% endif %}   
  38.     </ul>
  39. {% endif %}   
  41. <div class="tab-content" id="pills-tabContent">
  42.     <div class="tab-pane {{primaryActiveClass}}" id="pills-primary" role="tabpanel" aria-labelledby="pills-primary-tab">
  43.         {% if isPrimarySoldOutCta %}
  44.             {% include "@AqarmapListing/Listing/soldOutCta.html.twig" %}
  45.         {% else %}
  46.             <div class="properties-container">
  47.                 {% for properties in liveUnitsPaginated %}
  48.                     {% set units = properties.propertyTypeChildren %}
  49.                     {% set isShowMoreEnabled = units|length > unitsLimit %}
  50.                     {% set largeElementParent = isShowMoreEnabled ?  'large-element-parent' : ''%}
  51.                     {% set largeElement = isShowMoreEnabled ?  'large-element' : ''%}
  52.                     <div class="units-container  {{largeElementParent}}">
  53.                         <div class="units-list-container mb-0">
  54.                             <p class="units-container__title">{{ properties.title }}</p>
  55.                             <div class="units-list {{largeElement}}" data-height="{{tableHeight}}">
  56.                                 {% for unit in  units %}
  57.                                     {% set unitUrl = listingSlug ? path('listing_slug', {'id': unit.id, 'slug':listingSlug})  :  path('listing_view', {'id': unit.id}) %}
  58.                                     <a class=' units-list__item unit' href='{{ unitUrl }}' target="_blank">
  59.                                         <p class="unit__area border-0 px-0">{{ unit.area }} {{ get_setting('general', 'measurement_unit')|trans }}</p>
  60.                                         <p class="d-flex justify-content-end align-items-center">
  61.                                             <span class="unit__price">
  62.                                                 {{ unit.price|number_format }} {{ get_setting('general', 'currency')|trans }}
  63.                                             </span>
  64.                                             {% if isRTL %}
  65.                                                 <i class="fa fa-chevron-left unit__redirect-arrow"></i>
  66.                                             {% else %}    
  67.                                                 <i class="fa fa-chevron-right unit__redirect-arrow"></i>
  68.                                             {% endif %}   
  69.                                         </p>
  70.                                     </a>
  71.                                 {% endfor %}
  72.                             </div>
  73.                         </div>
  74.                         {% if isShowMoreEnabled %}
  75.                             <a href="javascript:void(0)" class="see-more see-more-paragraph-button"
  76.                             data-seeMore="
  77.                             {{ 'listing.show_more'|trans }}
  78.                             <i class='fa fa-chevron-down see-more__arrow'></i>" 
  79.                             data-seeLess="{{ 'listing.show_less'|trans }}
  80.                             <i class='fa fa-chevron-up see-more__arrow'></i>">
  81.                             </a>
  82.                         {% endif %}   
  83.                     </div>
  84.                 {% endfor %}
  85.             </div>
  86.         {% endif %}
  87.     </div>
  88.     {% if hasResaleUnits %}
  89.         <div class="tab-pane {{resaleActiveClass}}" id="pills-resale" role="tabpanel" aria-labelledby="pills-resale-tab">
  90.             <div class="properties-container">
  91.                 {% for properties in resaleUnitsPaginated %}
  92.                     {% set units = properties.propertyTypeChildren %}
  93.                     {% set isShowMoreEnabled = units|length > unitsLimit %}
  94.                     {% set largeElementParent = isShowMoreEnabled ?  'large-element-parent' : ''%}
  95.                     {% set largeElement = isShowMoreEnabled ?  'large-element' : ''%}
  96.                     <div class="units-container  {{largeElementParent}}">
  97.                         <div class="units-list-container mb-0">
  98.                             <p class="units-container__title">{{ properties.title }}</p>
  99.                             <div class="units-list {{largeElement}}" data-height="{{tableHeight}}">
  100.                                 {% for unit in  units %}
  101.                                     {% set unitUrl = listingSlug ? path('listing_slug', {'id': unit.id, 'slug':listingSlug})  :  path('listing_view', {'id': unit.id}) %}
  102.                                     <a class='units-list__item unit' href='{{ unitUrl }}' target="_blank">
  103.                                         <p class="unit__area border-0 px-0">{{ unit.area }} {{ get_setting('general', 'measurement_unit')|trans }}</p>
  104.                                         <p class="d-flex justify-content-end align-items-center">
  105.                                             <span class="unit__price">
  106.                                                 {{ unit.price|number_format }} {{ get_setting('general', 'currency')|trans }}
  107.                                             </span>
  108.                                             {% if isRTL %}
  109.                                                 <i class="fa fa-chevron-left unit__redirect-arrow"></i>
  110.                                             {% else %}    
  111.                                                 <i class="fa fa-chevron-right unit__redirect-arrow"></i>
  112.                                             {% endif %}   
  113.                                         </p>
  114.                                     </a>
  115.                                 {% endfor %}
  116.                             </div>
  117.                         </div>
  118.                         {% if isShowMoreEnabled %}
  119.                             <a href="javascript:void(0)" class="see-more see-more-paragraph-button"
  120.                             data-seeMore="
  121.                             {{ 'listing.show_more'|trans }}
  122.                             <i class='fa fa-chevron-down see-more__arrow'></i>" 
  123.                             data-seeLess="{{ 'listing.show_less'|trans }}
  124.                             <i class='fa fa-chevron-up see-more__arrow'></i>">
  125.                             </a>
  126.                         {% endif %}   
  127.                     </div>
  128.                 {% endfor %}
  129.             </div>
  130.         </div>
  131.     {% endif %}
  132.     {% if hasRentUnits %}
  133.         <div class="tab-pane  {{rentActiveClass}} " id="pills-rent" role="tabpanel" aria-labelledby="pills-rent-tab">
  134.             <div class="properties-container">
  135.                 {% for properties in rentUnitsPaginated %}
  136.                     {% set units = properties.propertyTypeChildren %}
  137.                     {% set isShowMoreEnabled = units|length > unitsLimit %}
  138.                     {% set largeElementParent = isShowMoreEnabled ?  'large-element-parent' : ''%}
  139.                     {% set largeElement = isShowMoreEnabled ?  'large-element' : ''%}
  140.                     <div class="units-container  {{largeElementParent}}">
  141.                         <div class="units-list-container mb-0">
  142.                             <p class="units-container__title">{{ properties.title }}</p>
  143.                             <div class="units-list {{largeElement}}" data-height="{{tableHeight}}">
  144.                                 {% for unit in  units %}
  145.                                     {% set unitUrl = listingSlug ? path('listing_slug', {'id': unit.id, 'slug':listingSlug})  :  path('listing_view', {'id': unit.id})%}
  146.                                     <a class='units-list__item unit' href='{{ unitUrl }}' target="_blank">
  147.                                         <p class="unit__area border-0 px-0">{{ unit.area }} {{ get_setting('general', 'measurement_unit')|trans }}</p>
  148.                                         <p class="d-flex justify-content-end align-items-center">
  149.                                             <span class="unit__price">
  150.                                             {{ unit.price != 0 ? unit.price|number_format ~ ' ' ~ get_setting('general', 'currency')|trans : 'listing.call_for_price'|trans }}
  151.                                             </span>
  152.                                             {% if isRTL %}
  153.                                                 <i class="fa fa-chevron-left unit__redirect-arrow"></i>
  154.                                             {% else %}    
  155.                                                 <i class="fa fa-chevron-right unit__redirect-arrow"></i>
  156.                                             {% endif %}    
  157.                                         </p>
  158.                                     </a>
  159.                                 {% endfor %}
  160.                             </div>
  161.                         </div>
  162.                         {% if isShowMoreEnabled %}
  163.                             <a href="javascript:void(0)" class="see-more see-more-paragraph-button"
  164.                             data-seeMore="
  165.                             {{ 'listing.show_more'|trans }}
  166.                             <i class='fa fa-chevron-down see-more__arrow'></i>" 
  167.                             data-seeLess="{{ 'listing.show_less'|trans }}
  168.                             <i class='fa fa-chevron-up see-more__arrow'></i>">
  169.                             </a>
  170.                         {% endif %}    
  171.                     </div>
  172.                 {% endfor %}
  173.             </div>
  174.         </div>
  175.     {% endif %}    
  176. </div>