templates/website/user/profile/user-profile-payment.html.twig line 1

Open in your IDE?
  1. <div class="aviso sucesso">
  2.     <p>{{ getLanguage('secure_page', 'profile') }}</p>
  3. </div>
  4. <div class="profile-payment">
  5.     <h2>{{ getLanguage('my_cards', 'profile') }}</h2>
  6.     
  7.     {% embed 'website/includes/list-pagination.html.twig' with 
  8.         { 
  9.             tableId: 'table-user-cards',
  10.             colNumber: 6,
  11.             useSearch: false,
  12.         } 
  13.     %}
  14.         {% block thContent %}
  15.             <th data-order-status="" data-order-field="uc.cardFlag" data-label="{{ getLanguage('flag', 'profile') }}"></th>
  16.             <th data-order-status="" data-order-field="uc.cardName" data-label="{{ getLanguage('name', 'profile') }}"></th>
  17.             <th data-order-status="" data-order-field="uc.digitsStart" data-label="{{ getLanguage('number', 'profile') }}"></th>
  18.             <th data-order-status="" data-order-field="uc.dateExpire" data-label="{{ getLanguage('expiration_date', 'profile') }}"></th>
  19.             <th class="action" data-dont-order="true" data-label="{{ getLanguage('main', 'profile') }}"></th>
  20.             <th class="action" data-dont-order="true" data-label="{{ getLanguage('exclude', 'profile') }}"></th>
  21.         {% endblock %}
  22.         {% block vazio %}{{ getLanguage('empty_no', 'profile') }} <b>{{ getLanguage('card', 'profile') }}</b> {{ getLanguage('found', 'profile') }}.{% endblock %}
  23.     {% endembed %}
  25.     <p class="tx-centro">
  26.         <button class="btn-continuar-peq js--modal-abre" data-modal="modal-add-credit-card">
  27.             {% include 'svg/check-circle.svg' %}&ensp;{{ getLanguage('add_card', 'profile') }}
  28.         </button>
  29.     </p>
  31.     <hr class="sep">
  33.     <h2>{{ getLanguage('billing', 'profile')|title }}</h2>
  34.     {% embed 'website/includes/list-pagination.html.twig' with 
  35.         { 
  36.             tableId: 'table-user-data-checkout',
  37.             colNumber: 7,
  38.             useSearch: false,
  39.         }
  40.     %}
  41.         {% block thContent %}
  42.             <th data-order-status="" data-order-field="ui.name" data-label="{{ getLanguage('name', 'profile') }}"></th>
  43.             <th data-order-status="" data-order-field="ui.email" data-label="E-mail"></th>
  44.             <th data-order-status="" data-order-field="ui.document" data-label="{{ getLanguage('document', 'profile') }}"></th>
  45.             <th data-order-status="" data-order-field="ui.address" data-label="{{ getLanguage('address', 'profile') }}"></th>
  46.             <th class="action" data-dont-order="true" data-label="{{ getLanguage('main', 'profile') }}"></th>
  47.             <th class="action" data-dont-order="true" data-label="{{ getLanguage('edit', 'profile')|capitalize }}"></th>
  48.             <th class="action" data-dont-order="true" data-label="{{ getLanguage('exclude', 'profile') }}"></th>
  49.         {% endblock %}
  50.         {% block vazio %}{{ getLanguage('empty_no', 'profile') }} <b>{{ getLanguage('billing', 'profile') }}</b> {{ getLanguage('found', 'profile') }}.{% endblock %}
  51.     {% endembed %}
  53.     <p class="tx-centro">
  54.         <button class="btn-continuar-peq js--modal-abre" data-modal="modal-user-info-checkout" data-modal-mode="create">
  55.             {% include 'svg/check-circle.svg' %}&ensp;{{ getLanguage('add_billing', 'profile') }}
  56.         </button>
  57.     </p>
  58. </div>
  60. {# MODAL -- CARTÃO #}
  61. {% embed "website/includes/modal.html.twig" with {'id': 'modal-add-credit-card', 'title': getLanguage('add_card_title', 'profile'), 'classes': 'modal-card'}%}
  62.     {% block content %}
  63.         {% from 'utils.html.twig' import ico %}
  65.         <form id="formUserCard" action="{{ path('userCardRegister') }}" method="POST" class="form-geral form-col-4 form-add-card">
  66.             <div class="cp-cols">
  67.                 <div class="cp cp-0">
  68.                     <label for="card-number">{{ getLanguage('card_number', 'profile') }}</label>
  69.                     <input type="text" maxlength="19" id="card-number" class="card_number" name="card-number" placeholder="{{ getLanguage('enter_card_number', 'profile') }}" required="required" autocomplete="cc-number">
  70.                 </div>
  71.                 <div class="cp cp-0">
  72.                     <label for="card-name">{{ getLanguage('name', 'profile') }} <small>({{ getLanguage('name_on_card', 'profile') }})</small></label>
  73.                     <input type="text" maxlength="30" id="card-name" class="card_holder_name" name="card-name" placeholder="{{ getLanguage('name_card', 'profile') }}" required="required" autocomplete="cc-name">
  74.                 </div>
  75.                 <div class="cp cp-4-2">
  76.                     <label for="card-month">{{ getLanguage('due_date', 'profile') }}</label>
  77.                     <div class="cp-mes-ano">
  78.                         {# MÊS #}
  79.                         <div>
  80.                             <select id="card-month" name="card-month" required="">
  81.                                 <option value="" selected="selected">MM</option>
  82.                                 <option value="01">01</option>
  83.                                 <option value="02">02</option>
  84.                                 <option value="03">03</option>
  85.                                 <option value="04">04</option>
  86.                                 <option value="05">05</option>
  87.                                 <option value="06">06</option>
  88.                                 <option value="07">07</option>
  89.                                 <option value="08">08</option>
  90.                                 <option value="09">09</option>
  91.                                 <option value="10">10</option>
  92.                                 <option value="11">11</option>
  93.                                 <option value="12">12</option>
  94.                             </select>
  95.                         </div>
  97.                         {# ANO #}
  98.                         {% set anoAtual = ('now' | date('Y')) + 0 %}
  99.                         {% set anos = range(anoAtual, anoAtual + 10) %}
  101.                         <div>
  102.                             <select id="card-year" name="card-year" required="">
  103.                                 <option value="" selected="selected">AA</option>
  104.                                 {% for ano in anos %}
  105.                                     <option value="{{ ano[-2:] }}">{{ ano[-2:] }}</option>
  106.                                 {% endfor %}
  107.                             </select>
  108.                         </div>
  109.                     </div>
  110.                 </div>
  111.                 <div class="cp cp-4-2">
  112.                     <label for="card-cvv">{{ getLanguage('code_of_security', 'profile') }}</label>
  113.                     <input type="text" maxlength="4" id="card-cvv" class="card_cvv" name="card-cvv" placeholder="CVC" required="required" autocomplete="cc-csc">
  114.                 </div>
  115.             </div>
  116.             <nav class="actions">
  117.                 <button type="button" class="js--modal-fecha cancel">{{ getLanguage('cancel', 'profile') }}</button>
  118.                 <button type="button" id="btnFormUserCard" class="btn-continuar-peq btn-load">
  119.                     <span>{% include 'svg/check-circle.svg' %}&nbsp;{{ getLanguage('add_card', 'profile') }}</span>
  120.                     <span>{{ getLanguage('wait', 'util') }}&hellip;&ensp;<i class="loader">{{ ico('loader-wish') }}</i></span>
  121.                 </button>
  122.             </nav>
  123.         </form>
  124.     {% endblock %}
  125. {% endembed %}
  127. {# MODAL -- USER INFO CHECKOUT #}
  128. {% include 'website/user/userInfoCheckout/user-info-checkout-modal.html.twig' with { reqAddress: true }%}