{{ header }}
<style media="screen">

.modal-body iframe{
  width: 100% !important;
}
.modal-body img{
  width: 100% !important;
}
</style>
<div id="container" class="container j-container">
  <ul class="breadcrumb">
    {% for breadcrumb in breadcrumbs %}
    <li><a href="{{ breadcrumb['href'] }}">{{ breadcrumb['text'] }}</a></li>
    {% endfor %}
  </ul>
  {% if attention is defined and attention %}
  <div class="alert alert-info"><i class="fa fa-info-circle"></i> {{ attention }}
    <button type="button" class="close" data-dismiss="alert">&times;</button>
  </div>
  {% endif %}
  {% if success is defined and success %}
  <div class="alert alert-success success"><i class="fa fa-check-circle"></i> {{ success }}
    <button type="button" class="close" data-dismiss="alert">&times;</button>
  </div>
  {% endif %}
  {% if error_warning %}
  <div class="alert alert-danger warning"><i class="fa fa-exclamation-circle"></i> {{ error_warning }}
    <button type="button" class="close" data-dismiss="alert">&times;</button>
  </div>
  {% endif %}
  <div class="row">{{ column_left }}
    {% if column_left and column_right %}
    {% set class = 'col-sm-6' %}
    {% elseif column_left or column_right %}
    {% set class = 'col-sm-9' %}
    {% else %}
    {% set class = 'col-sm-12' %}
    {% endif %}
    <div id="content" class="{{ class }}">{{ content_top }}
      <h1>{{ heading_title }}
        {% if weight %}
        &nbsp;({{ weight }})
        {% endif %}
      </h1>
      <form action="{{ action }}" method="post" enctype="multipart/form-data" id="quotation-from">
        <div class="table-responsive">
          <table class="table table-bordered list">
            <thead>
              <tr>
                <td class="text-center">{{ column_image }}</td>
                <td class="text-left">{{ column_name }}</td>
                <td class="text-left">{{ column_model }}</td>
                <td class="text-left">{{ column_quantity }}</td>
                <td class="text-right">{{ column_price }}</td>
                <td class="text-right">{{ column_total }}</td>
                <td class="text-left">{{ column_request_price }}</td>
                <td class="text-right">{{ column_request_total }}</td>
              </tr>
            </thead>
            <tbody>
              {% for product in products %}
              <tr>
                <td class="text-center">{% if product['thumb'] %}
                  <a href="{{ product['href'] }}"><img src="{{ product['thumb'] }}" alt="{{ product['name'] }}" title="{{ product['name'] }}" class="img-thumbnail" /></a>
                  {% endif %}</td>
                <td class="text-left"><a href="{{ product['href'] }}">{{ product['name'] }}</a>
                  {% if product['stock'] is defined and not product['stock'] %}
                  <span class="text-danger">***</span>
                  {% endif %}
                  {% if product['option'] %}
                  {% for option in product['option'] %}
                  <br />
                  <small>{{ option['name'] }}: {{ option['value'] }}</small>
                  {% endfor %}
                  {% endif %}
                  {% if product['reward'] %}
                  <br />
                  <small>{{ product['reward'] }}</small>
                  {% endif %}
                  {% if product['recurring'] %}
                  <br />
                  <span class="label label-info">{{ text_recurring_item }}</span> <small>{{ product['recurring'] }}</small>
                  {% endif %}</td>
                <td class="text-left">{{ product['model'] }}</td>
                <td class="text-left"><div class="input-group btn-block" style="max-width: 250px;">
                    <input type="text" name="quantity[{{ product['cart_id'] }}]" value="{{ product['quantity'] }}" size="3" class="form-control quantity" qid="{{ product['cart_id'] }}" id="quantity_{{ product['cart_id'] }}"/>
                    <span class="input-group-btn">
                    <button type="submit" data-toggle="tooltip" title="{{ button_update }}" class="btn btn-primary"><i class="fa fa-refresh"></i></button>
                    <button type="button" data-toggle="tooltip" title="{{ button_remove }}" class="btn btn-danger" onclick="quotation.remove('{{ product['cart_id'] }}');"><i class="fa fa-times-circle"></i></button>
                    </span>
                  </div>
                  <span class="pull-left" id="message_quantity{{ product['cart_id'] }}"></span>
                </td>
                <td class="text-right">{{ product['price'] }}</td>
                <td class="text-right">{{ product['total'] }}</td>
                <td class="text-left">
                  <div class="input-group btn-block" style="max-width: 250px;">
                    <span class="input-group-btn"><button type="button" class="btn btn-default">{% if product['request_price'] != 0 %}{{ product['request_price1'] }} {% else %} {{ currency_symbol }}{% endif %}</button></span>
                    <input type="text" class="form-control request" price={{ product['request_price'] }} name="request_price[{{ product['cart_id'] }}]" placeholder="{{ request_price_placeholder }}"  id="{{ product['cart_id'] }}"/>
                    <span class="input-group-btn"><button pid="{{ product['request_price'] }}" bid="{{ product['cart_id'] }}" type="button" data-toggle="tooltip" title="{{ text_request_price }}" class="btn success request_price"><i class="fa fa-refresh"></i></button><span>
                  </div>
                  <span class="pull-left" id="message_request{{ product['cart_id'] }}"></span>
                </td>
                <td class="text-right">
                  <p id="total_{{ product['cart_id'] }}">{% if product['request_price'] !=0 %}{{ product['request_total'] }}{% endif %}</p>
                </td>
              </tr>
              {% endfor %}
            </tbody>
          </table>
        </div>
      </form>
      <br />
      <form id="form-quotation" action="{{ request  }}" method="post">
        <div class="form-group">
          <label for="comment">{{ label_comment  }}</label>
          <textarea class="form-control" rows="5" id="comment" name="comment">{{ quotation_comment }}</textarea>
        </div>
      <div class="buttons clearfix">
        <div class="pull-left"><a href="{{ continue }}" class="btn btn-default">{{ button_shopping }}</a></div>
        {% if products is defined and products %}<div class="pull-right">{{ text_agree }}&nbsp;<input type="checkbox" id='agree' name='agree' {% if quotation_agree %}{{ 'checked' }}{% endif %}/>&nbsp;<button type="button" id="request-quote" class="btn btn-primary">{{ button_request }}</button></div>{% endif %}
      </div>
      </form>
      {{ content_bottom }}</div>
    {{ column_right }}</div>
</div>
<script type="text/javascript">
var select = true;
$('#request-quote').on('click', function() {
    $('.request').each(function(i){
      if ($(this).attr('price') == 0) {
        select = false;
      }
    });
    if (!select) {
      $('#modal-text_confirm').modal();
      $('#ok').on('click', function(){
        $('#form-quotation').submit();
      });
    } else {
      $('#form-quotation').submit();
    }
});
 // Update Price Request
$(document).ready(function(){
  $('.request_price').on('click', function(){
    var id = $(this).attr('bid');
    var request_price = $('#'+id).val();
    console.log(request_price);
    var comment = $('#comment').val();
    var agree = $('#agree:checked').val();

    $.ajax({
      url:'index.php?route=quotemanager/cart/updateprice',
      type:'post',
      dataType: 'json',
      data:{request_price:request_price, cart_id:id,comment:comment, agree: agree},
      success:function(response){
        if(response['success'] === 'success'){
          location.reload();
        }
      }
    });
  });
});

$(document).ready(function(){
  // Input validation for request_price
  $('.request').on('keyup', function(){
    var request_price = $(this).val();
    var id = $(this).attr('id');
    if(request_price==''){
      $('#message_request'+id+'').text("");
    }else if (request_price != parseFloat(request_price, 10)){
      $('#message_request'+id+'').text("{{ text_message_digit }}").css({'color':'red'});
      return false;
    }else{
      $('#message_request'+id+'').text("");
    }
  });
  // Input validation for quantity

  $('.quantity').on('keyup', function(){
    var qunntity = $(this).val();
    var id = $(this).attr('qid');
    if(qunntity == ''){
      $('#message_quantity'+id+'').text("");
    }else if (qunntity != parseInt(qunntity, 10)){
      $('#message_quantity'+id+'').text("{{ text_message_digit }}").css({'color':'red'});
      return false;
    }else{
      $('#message_quantity'+id+'').text("");
    }
  });
});
</script>
<script language="javascript">
  $('#quotation-from').on('keyup keypress', function(e) {
    var keyCode = e.keyCode || e.which;
    if (keyCode === 13) {
      e.preventDefault();
      return false;
    }
  });
</script>
<div class="modal fade" id="modal-text-agree" role="dialog" tabindex="-1">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h3 class="modal-title">{{ quotation_t_and_c }}</h3>
      </div>
      <div class="modal-body">
        <p style="font-size : 16px; ">{{ quotation_t_c }}</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">{{ button_close }}</button>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="modal-text_confirm" role="dialog" tabindex="-1">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h3 class="modal-title">{{ request_price }}</h3>
      </div>
      <div class="modal-body" style="width: 100%">
        <p style="font-size : 16px; ">{{ text_confirm }}</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal" id="ok">{{ button_ok }}</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">{{ button_close }}</button>
      </div>
    </div>
  </div>
</div>
{{ footer }}