{% extends 'old-bootstrap-modal-layout.html.twig' %}
{% set showSms = ( verifiedMobile|length > 0) %}

{% block title %} {{'短信验证码'|trans}} {% endblock %}

{% block body %}
{% if showSms %}
    <form id = "js-sms-modal-form">
      <input type="hidden" name="mobile" data-role="mobile" value="{{ verifiedMobile }}"/>
      <div class = "form-group">
        <div class = "controls row" >
          <div class = "col-md-5 col-md-offset-2" >
            <label class="control-label">{{'已绑定手机号码%blur_phone_number%'|trans({'%blur_phone_number%':blur_phone_number(verifiedMobile)})}} </label>
          </div>
          <div class = "col-md-3" >
            <a class="text-sm color-gray" href="{{path('settings_bind_mobile')}}" target="_blank">{{'修改手机号码'|trans}}</a>
          </div>
        </div>
        <br>
        <div class="controls row" >
          <div class = "col-md-5 col-md-offset-2" >
            <input type="text" class="form-control" id="sms-code-modal" name="sms_code_modal" {# data-explain="输入短信验证码" #} required="required" placeholder="{{'输入短信验证码'|trans}}" data-url="{{path('edu_cloud_sms_check',{type:'sms_user_pay'})}}">
          </div>
          <div class="col-md-5">
            <span class="btn btn-default btn-sm js-sms-send" data-url="{{ path('edu_cloud_sms_send') }}">
              <span id="js-time-left"></span>
              <span id="js-fetch-btn-text">{{'获取短信验证码'|trans}}{# 秒后重新获取 #}</span>
           </span>
          </div>
          <div class="col-md-12 col-md-offset-2">
            <div class="help-block"></div>
          </div>
        </div>

      </div>
    </form>
{% else %}
  <p class="mt20 mb20 text-center">{{'您还未绑定手机号'|trans}}<a class="btn btn-primary ml10" href="{{path('settings_bind_mobile')}}" target="_blank">{{'去绑定'|trans}}</a></p>
{% endif %}

{% endblock %}

{% block footer %}
  {% if showSms %}
     <button class="btn btn-primary pull-right js-confirm">{{'确定'|trans}}</button>
      {% include 'seajs_loader_compatible.html.twig' with {topxiawebbundle: true} %}
      <script>app.lazyLoad = function() { app.load('order/order-create-sms') };</script>
  {% endif %}
{% endblock %}