src/Aqarmap/Bundle/ListingBundle/Resources/views/ListingSearch/listingCardHorizontal.html.twig line 1

Open in your IDE?
  1. {# Constants #}
  2. {% set SHOW_PHONE_CONSTANT = constant('Aqarmap\\Bundle\\ListingBundle\\Constant\\LeadTypes::SHOW_PHONE') %}
  4. {% for listing in listings %}
  5.     {% if agent is defined %}
  6.         {% set listing = listing['listing'] %}
  7.     {% endif %}
  9.     {# Listing Vars #}
  10.     {% set isListingPhotosDefined = listingPhotos[listing.id] is defined and listingPhotos[listing.id].main is defined %}
  11.     {% set listingPhotoSize = 110 %}
  12.     {% set disableLazyLoadImgIndex = loop.index in [1, 2] %}
  13.     {% if isEnabledFeature('listing_card.lead.button') %}
  14.         {% set listingPhones = isEnabledFeature('listing_user_phones') ? listing.phones : listing.listingPhones %}
  15.     {% else %}
  16.         {% set listingPhones = [] %}
  17.     {% endif %}
  18.     {% set listingPhone = null %}
  19.     {% if listingPhones is not empty %}
  20.         {% set listingPhone = listingPhones|first %}
  21.     {% endif %}
  22.     {% if (listing.user.getWhatsAppNumber) %}
  23.         {% set whatsAppNumber = listing.user.getWhatsAppNumber.getPhone.getNumber %}
  24.     {% endif %}
  25.     {% set hasWhatsapp = listing.user.getWhatsAppNumber %}
  26.     {% if listing.slug %}
  27.         {% set LISTING_URL = isRelatedResults ? path("listing_slug", {id: listing.id, slug: listing.slug}|merge({'relatedseaarchlisting': true})) :  path("listing_slug", {id: listing.id, slug: listing.slug}) %}
  28.     {% else %}
  29.         {% set LISTING_URL = isRelatedResults ? path('listing_view', {'id': listing.id}|merge({'relatedseaarchlisting': true})) : path('listing_view', {'id': listing.id}) %}
  30.     {% endif %}
  31.     {% set callBtnClass = not hasWhatsapp ? 'big': '' %}
  32.     {% set urlSource = app.request.query.get("source") ? app.request.query.get("source") : ''%}
  33.     {% set containerSource = source is defined ? source : null %}
  34.     {% set leadSources = containerSource ? [containerSource] : [urlSource] %}
  35.     {% set encodedSellerPhones = []%}
  36.     {% for phone in listingPhones %}
  37.         {% set encodedSellerPhones = encodedSellerPhones | merge([{'number': phone.number|phoneNumberEncode}]) %}
  38.     {% endfor %}
  39.     {% set listingUser = listing.user %}
  40.     {% set sellerName =  listingUser.fullName %}
  41.     {% set userLogo = listingUser.logo ? listingUser.logo.file : null %}
  42.     {% set logo = listing.validUserLogo %}
  43.     {% set financeFeatureValue = get_setting('features', 'finance_service') %}
  44.     {% set activeListingsCount = liveListingsPerUser[listing.user.id] is defined ? liveListingsPerUser[listing.user.id] : 0 %}
  45.     {% set leadsCount = listingUser.getClientServedCount() %}
  47.     <div class="col-12 horizontal-listing-card horizontal-listing-card_mb-l"
  48.         ng-init='setListingDetail("{{listing.id}}",{
  49.             "section": "{{listing.section.id}}",
  50.             "sellerPhones": {{encodedSellerPhones|serialize('json')}},
  51.             "sellerPhone": "{{hasWhatsapp  ? whatsAppNumber|phoneNumberEncode : listingPhone ? listingPhone.number|phoneNumberEncode : "" }}",
  52.             "financeUrl":"{{listing.getFinancialAidURL()}}",
  53.             "userEmail": {{currentUserEmail|json_encode()}},
  54.             "financeFeatureValue": "{{financeFeatureValue}}",
  55.             "listingName" : "{{listing.customSlug|default(listing.id)}}",
  56.             "listingTitle" : "{{listing.title}}",
  57.             "listingUser": {
  58.                 "sellerName" : "{{sellerName}}",
  59.                 "sellerLogo": "",
  60.                 "sellerUrl": "{{sellerUrl}}",
  61.                 "joinedData":"{{joinedData}}",
  62.                 "activeListingsCount": "{{activeListingsCount}}",
  63.                 "leadsCount":"{{leadsCount}}"
  64.             }
  65.         })'>
  66.         <div class="horizontal-listing-card__container">
  67.             <a class="horizontal-listing-card__container__link "
  68.                 itemprop="url"
  69.                 ng-click="onCardClick({{leadSources|serialize('json')}})"
  70.                 href="{{ LISTING_URL }}">
  71.                 <div class="horizontal-listing-card__wrapper">
  72.                     <div class="horizontal-listing-card__img">
  73.                         <div class="horizontal-listing-card__img__wrapper">
  74.                             {% if isListingPhotosDefined %}
  75.                                 {% if disableLazyLoadImgIndex %}
  76.                                     <picture>
  77.                                         <source src="{{ custom_vich_uploader_asset(listingPhotos[listing.id].main.file, 'file')|thumbnail('search-thumb-webp') }}"
  78.                                             type="image/webp">
  79.                                         <source src="{{ custom_vich_uploader_asset(listingPhotos[listing.id].main.file, 'file')|thumbnail('search-thumb') }}"
  80.                                             type="image/jpg">
  81.                                         <img itemprop="photo"
  82.                                             src="{{ custom_vich_uploader_asset(listingPhotos[listing.id].main.file, 'file')|thumbnail('search-thumb') }}"
  83.                                             alt="{{ listing.title|excludeNumbers }}"
  84.                                             width="{{ listingPhotoSize }}" height="{{ listingPhotoSize }}" />
  85.                                     </picture>
  86.                                 {% else %}
  87.                                     <img itemprop="photo"
  88.                                         src="/images/placeholder.svg"
  89.                                         data-src="{{ custom_vich_uploader_asset(listingPhotos[listing.id].main.file, 'file')|thumbnail('search-thumb') }}"
  90.                                         class="lazyload" alt="{{ listing.title|excludeNumbers }}"
  91.                                         width="{{ listingPhotoSize }}" height="{{ listingPhotoSize }}" />
  92.                                 {% endif %}
  93.                             {% elseif listing.mainPhoto %}
  94.                                 {% if disableLazyLoadImgIndex %}
  95.                                     <picture>
  96.                                         <source  src="{{ custom_vich_uploader_asset(listing.mainPhoto.file, 'file')|thumbnail('search-thumb-webp') }}"
  97.                                             type="image/webp"
  98.                                             class="lazyload">
  99.                                         <source  src="{{ custom_vich_uploader_asset(listing.mainPhoto.file, 'file')|thumbnail('search-thumb') }}"
  100.                                             type="image/jpg"
  101.                                             class="lazyload">
  102.                                         <img itemprop="photo"
  103.                                             src="{{ custom_vich_uploader_asset(listing.mainPhoto.file, 'file')|thumbnail('search-thumb') }}"
  104.                                             alt="{{ listing.title|excludeNumbers }}"
  105.                                             width="{{ listingPhotoSize }}" height="{{ listingPhotoSize }}" />
  106.                                     </picture>
  107.                                 {% else %}
  108.                                     <img itemprop="photo"
  109.                                         src="/images/placeholder.svg"
  110.                                         data-src="{{ custom_vich_uploader_asset(listing.mainPhoto.file, 'file')|thumbnail('search-thumb') }}"
  111.                                         class="lazyload" alt="{{ listing.title|excludeNumbers }}"
  112.                                         width="{{ listingPhotoSize }}" height="{{ listingPhotoSize }}" />
  113.                                 {% endif %}
  114.                             {% else %}
  115.                                 <div class="horizontal-listing-card__img__no-photo">{{ 'layout.no_listing_photo'|trans }}</div>
  116.                             {% endif %}
  117.                         </div>
  118.                     </div>
  119.                     <div class="horizontal-listing-card__details">
  120.                         <div class="horizontal-listing-card__details__wrapper">
  122.                             <div class="horizontal-listing-card__price">
  123.                                 {% if listing.price %}
  124.                                     <span class="integer">{{ listing.price|number_format }}</span>
  125.                                     <span class="mx-2">{{ get_setting('general', 'currency')|trans }}</span>
  126.                                 {% elseif listing.section.searchable %}
  127.                                     {{ 'listing.call_for_price'|trans }}
  128.                                 {% endif %}
  129.                             </div>
  130.                             <p class="horizontal-listing-card__address">
  131.                                 <img
  132.                                     src="/images/BrandsIcons/listing/ic_location.svg"
  133.                                     class="horizontal-listing-card__attributes_icon"
  134.                                 />
  135.                                 {{ listing.address }}
  136.                             </p>
  137.                             <div class="horizontal-listing-card__attributes">
  138.                                 <label class="horizontal-listing-card__attributes_item">
  139.                                     <img
  140.                                         src="/images/BrandsIcons/listing/ic_size.svg"
  141.                                         class="horizontal-listing-card__attributes_icon"
  142.                                     />
  143.                                     {{ listing.area}} {{ get_setting('general', 'measurement_unit')|trans }}
  144.                                 </label>
  145.                                 {% set listing_attributes = listing.getAttributesList() %}
  146.                                 {% if listing_attributes|length > 0 %}
  147.                                     {% set listing_rooms = (listing_attributes["rooms"]) is defined ? getRoomsLabel(listing_attributes["rooms"]) : '' %}
  148.                                     {% set listing_baths = (listing_attributes["baths"]) is defined ? getBathsLabel(listing_attributes["baths"]) : '' %}
  149.                                     {% if listing_rooms %}
  150.                                         <label class="horizontal-listing-card__attributes_item">
  151.                                         <img
  152.                                             src="/images/BrandsIcons/listing/ic_bedroom.svg"
  153.                                             class="horizontal-listing-card__attributes_icon"
  154.                                         />
  155.                                              {{ listing_rooms }}
  156.                                         </label>
  157.                                     {% endif %}
  158.                                     {% if listing_baths %}
  159.                                         <label class="horizontal-listing-card__attributes_item">
  160.                                             <img
  161.                                                 src="/images/BrandsIcons/listing/ic_bathroom.svg"
  162.                                                 class="horizontal-listing-card__attributes_icon"
  163.                                             />
  164.                                             {{ listing_baths }}
  165.                                         </label>
  166.                                     {% endif %}
  167.                                 {% endif %}
  168.                             </div>
  169.                         </div>
  170.                     </div>
  171.                 </div>
  172.             </a>
  173.             <div class="horizontal-listing-card__footer">
  174.                 <hr class="desktop-separator">
  175.                 <div class="horizontal-listing-card__cta w-100">
  176.                     {% if listingPhones is not empty and not listing.isCallRequest %}
  177.                         {% if hasWhatsapp %}
  178.                             <a class="horizontal-listing-card__cta-button horizontal-listing-card__cta-button_whatsapp whatsapp big"
  179.                                 href="javascript:void(0);"
  180.                                 ng-click="onSendLead($event,{
  181.                                     actionType:'{{ SEND_WHATSAPP_CONSTANT }}' ,
  182.                                     listingType:  {{leadSources|serialize('json')}} ,
  183.                                     listingId: '{{ listing.id }}' ,
  184.                                 });"
  185.                                 >
  186.                                 <img
  187.                                     src="/images/BrandsIcons/listing/ic_whatsapp.svg"
  188.                                     class="horizontal-listing-card__cta-button_whatsapp_icon"
  189.                                 />
  190.                                 {{ 'label.lead.whatsApp'|trans }}
  191.                             </a>
  192.                             <div class="vertical-separator"></div>
  193.                         {% endif %}
  194.                         {% set phoneBtnClass = 'horizontal-listing-card__cta-button horizontal-listing-card__cta-button_call ' ~ callBtnClass %}
  195.                         <a class="{{ phoneBtnClass }}"
  196.                             href="javascript:void(0);"
  197.                             submit-text="{{ 'listing.show_seller_phone'|trans }}"
  198.                             ng-click="searchActionType = 'showNumber';
  199.                                     onSendLead($event,{
  200.                                         actionType:'{{ SHOW_PHONE_CONSTANT }}' ,
  201.                                         listingType:  {{leadSources|serialize('json')}} ,
  202.                                         listingId: '{{ listing.id }}' ,
  203.                                     });"
  204.                             ng-if="!phoneShowed[{{listing.id}}]"
  205.                             data-gtm-listing-id="{{ listing.id }}">
  206.                             <img
  207.                                 src="/images/BrandsIcons/listing/ic_phone.svg"
  208.                                 class="horizontal-listing-card__cta-button_call_icon"
  209.                             />
  210.                             <span class="cta-button-text"> {{ 'listing.show_seller_phone'|trans }}</span>
  211.                         </a>
  212.                         <a class="{{ phoneBtnClass }}"
  213.                             href="javascript:void(0);"
  214.                             ng-cloak
  215.                             ng-click="showPhoneModalByListingId({{listing.id}})"
  216.                             ng-if="phoneShowed[{{listing.id}}]">
  217.                             <img
  218.                                 src="/images/BrandsIcons/listing/ic_phone.svg"
  219.                                 class="horizontal-listing-card__cta-button_call_icon"
  220.                             />
  221.                             <span class="cta-button-text"> {{ 'listing.show_seller_phone'|trans }}</span>
  222.                         </a>
  223.                     {% else %}
  224.                         <a href=""
  225.                             class="horizontal-listing-card__cta-button horizontal-listing-card__cta-button_call-request big m-0"
  226.                             ng-hide="callRequested[{{listing.id}}]"
  227.                             ng-click="searchActionType = 'sendRequest';
  228.                                 onSendLead($event,{
  229.                                     actionType:'{{ CALL_REQUEST_CONSTANT }}' ,
  230.                                     listingType:  {{leadSources|serialize('json')}} ,
  231.                                     listingId: '{{ listing.id }}' ,
  232.                                 });"
  233.                             >
  234.                             <img
  235.                                 src="/images/BrandsIcons/listing/ic_phone.svg"
  236.                                 class="horizontal-listing-card__cta-button_call_icon"
  237.                             />
  238.                             <span ng-hide="callRequested[{{listing.id}}]" class="cta-button-text"> {{ 'label.lead.call_request'|trans }} </span>
  239.                         </a>
  240.                         <a href=""
  241.                             class="horizontal-listing-card__cta-button big success ng-hide"
  242.                             ng-show="callRequested[{{listing.id}}]"
  243.                             type= "button"
  244.                             disabled
  245.                             >
  246.                             <i class="fa fa-check circle-badge success"></i>
  247.                             <span class="mx-1"> {{ 'label.lead.call_requested'|trans }}  </span>
  248.                         </a>
  249.                     {% endif %}
  250.                 </div>
  251.             </div>
  252.         </div>
  253.     </div>
  254. {% endfor %}