{% if options %}
{% for option in options %}
{% if option.type == 'select' %}
<div class="form-group{% if option.required %} required {% endif %}">
  <label class="control-label" for="input-option{{ option.product_option_id }}">{{ option.name }}</label>
  <select name="option[{{ option.product_option_id }}]" id="input-option{{ option.product_option_id }}" class="form-control">
    <option value="">{{ text_select }}</option>
    {% for option_value in option.product_option_value %}
    <option value="{{ option_value.product_option_value_id }}">{{ option_value.name }}
    {% if option_value.price %}
    ({{ option_value.price_prefix }}{{ option_value.price }})
    {% endif %} </option>
    {% endfor %}
  </select>
</div>
{% endif %}
{% if option.type == 'radio' %}
<div class="form-group{% if option.required %} required {% endif %}">
  <label class="control-label">{{ option.name }}</label>
  <div id="input-option{{ option.product_option_id }}"> {% for option_value in option.product_option_value %}
    <label class="radio">
      <input type="radio" name="option[{{ option.product_option_id }}]" value="{{ option_value.product_option_value_id }}" />
      <span>
        {% if option_value.image %}
        <img src="{{ option_value.image }}" alt="{{ option_value.name }} {% if option_value.price %} {{ option_value.price_prefix }} {{ option_value.price }} {% endif %}" class="img-thumbnail" /> {% endif %}
        {{ option_value.name }}
        {% if option_value.price %}
        ({{ option_value.price_prefix }}{{ option_value.price }})
        {% endif %}
      </span>
    </label>
    {% endfor %}
  </div>
</div>
{% endif %}
{% if option.type == 'checkbox' %}
<div class="form-group{% if option.required %} required {% endif %}">
  <label class="control-label">{{ option.name }}</label>
  <div id="input-option{{ option.product_option_id }}"> {% for option_value in option.product_option_value %}
    <!-- <div class="checkbox"> -->
      <label class="checkbox">
        <input type="checkbox" name="option[{{ option.product_option_id }}][]" value="{{ option_value.product_option_value_id }}" />
        <span>
          {% if option_value.image %}
            <img src="{{ option_value.image }}" alt="{{ option_value.name }} {% if option_value.price %} {{ option_value.price_prefix }} {{ option_value.price }} {% endif %}" class="img-thumbnail" />
          {% endif %}
          {{ option_value.name }}
          {% if option_value.price %}
          ({{ option_value.price_prefix }}{{ option_value.price }})
          {% endif %}
        </span>
      </label>
    <!-- </div> -->
    {% endfor %} </div>
</div>
{% endif %}
{% if option.type == 'text' %}
<div class="form-group{% if option.required %} required {% endif %}">
  <label class="control-label" for="input-option{{ option.product_option_id }}">{{ option.name }}</label>
  <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" placeholder="{{ option.name }}" id="input-option{{ option.product_option_id }}" class="form-control" />
</div>
{% endif %}
{% if option.type == 'textarea' %}
<div class="form-group{% if option.required %} required {% endif %}">
  <label class="control-label" for="input-option{{ option.product_option_id }}">{{ option.name }}</label>
  <textarea name="option[{{ option.product_option_id }}]" rows="5" placeholder="{{ option.name }}" id="input-option{{ option.product_option_id }}" class="form-control">{{ option.value }}</textarea>
</div>
{% endif %}
{% if option.type == 'file' %}
<div class="form-group{% if option.required %} required {% endif %}">
  <label class="control-label">{{ option.name }}</label>
  <button type="button" id="button-upload{{ option.product_option_id }}" data-loading-text="{{ text_loading }}" class="btn btn-default btn-block"><i class="fa fa-upload"></i> {{ button_upload }}</button>
  <input type="hidden" name="option[{{ option.product_option_id }}]" value="" id="input-option{{ option.product_option_id }}" />
</div>
{% endif %}
{% if option.type == 'date' %}
<div class="form-group{% if option.required %} required {% endif %}">
  <label class="control-label" for="input-option{{ option.product_option_id }}">{{ option.name }}</label>
  <div class="input-group date">
    <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" data-date-format="YYYY-MM-DD" id="input-option{{ option.product_option_id }}" class="form-control" />
    <div class="input-group-btn">
    <button class="btn btn-default" type="button"><i class="fa fa-calendar"></i></button>
    </div></div>
</div>
{% endif %}
{% if option.type == 'datetime' %}
<div class="form-group{% if option.required %} required {% endif %}">
  <label class="control-label" for="input-option{{ option.product_option_id }}">{{ option.name }}</label>
  <div class="input-group datetime">
    <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" data-date-format="YYYY-MM-DD HH:mm" id="input-option{{ option.product_option_id }}" class="form-control" />
    <div class="input-group-btn">
    <button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button>
    </div></div>
</div>
{% endif %}
{% if option.type == 'time' %}
<div class="form-group{% if option.required %} required {% endif %}">
  <label class="control-label" for="input-option{{ option.product_option_id }}">{{ option.name }}</label>
  <div class="input-group time">
    <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" data-date-format="HH:mm" id="input-option{{ option.product_option_id }}" class="form-control" />
    <div class="input-group-btn">
    <button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button>
    </div></div>
</div>
{% endif %}
{% endfor %}
{% endif %}

<script type="text/javascript"><!--
  $('.date, .datetime, .time').datetimepicker({
    language: '{{ datepicker }}',
  });

  $('button[id^=\'button-upload\']').on('click', function() {
    var element = this;

    $('#form-upload').remove();

    $('body').prepend('<form enctype="multipart/form-data" id="form-upload" style="display: none;"><input type="file" name="file" /></form>');

    $('#form-upload input[name=\'file\']').trigger('click');

    if (typeof timer != 'undefined') {
        clearInterval(timer);
    }

    timer = setInterval(function() {
      if ($('#form-upload input[name=\'file\']').val() != '') {
        clearInterval(timer);

        $.ajax({
          url: 'index.php?route=tool/upload',
          type: 'post',
          dataType: 'json',
          data: new FormData($('#form-upload')[0]),
          contentType: false,
          processData: false,
          success: function(json) {
            $('.text-danger').remove();

            if (json['error']) {
              $(element).parent().find('input').after('<div class="text-danger">' + json['error'] + '</div>');
            }

            if (json['success']) {
              layer.msg(json['success']);

              $(element).parent().find('input').val(json['code']);
            }
          }
        });
      }
    }, 500);
  });
//--></script>