{% extends "./baseStore.html" %}
{% load custom_tags %}

{% block storeBody %}
  <p class="has-text-centered	mt-2 mb-2 is-size-5	">عملیات جدید انبار</p>

  <form action="{% url 'admin_panel:operation' %}" method="post" class="columns is-multiline is-mobile">
    {% csrf_token %}
    <div class="field column is-12-mobile is-4-desktop">
      <label class="label">نام محصول</label>
      <div class="control">
        <input disabled value="{{ product.product_name }}" class="input" type="text" placeholder="نام محصول">
        <input id="prd_id" name="prd_id" hidden value="{{ product.id }}" class="input is-hidden" type="text">
      </div>
    </div>

    <div class="field column is-12-mobile is-4-desktop">
      <label class="label">نوع عملیات</label>
      <div class="control">
        <div class="select  is-fullwidth">
          <select name="actionType" id="actionType" required>
            <option></option>
            {% if not user|has_group:"khadamat" %}
            <option value="vorod">ورود</option>
            <option value="khoroj">خروج</option>
            {% endif %}
            <option value="transfer">انتقال</option>
          </select>
        </div>
      </div>
    </div>

    <div class="field column is-12-mobile is-4-desktop">
      <label class="label">تعداد</label>
      <div class="control">
        <input name="tedad" class="input" type="text" placeholder="تعداد">
      </div>
    </div>

    <div id="azanbar" class="field is-hidden column is-12-mobile is-4-desktop">
      <label class="label">از انبار</label>
      <div class="control">
        <div class="select is-fullwidth">
          <select name="azanbar">
            <option value="{{ storeO.id }}">{{ storeO.store_name }}</option>
          </select>
        </div>
      </div>
    </div>

    <div  id="beanbar" class="field is-hidden column is-12-mobile is-4-desktop">
      <label class="label">به انبار</label>
      <div class="control">
        <div class="select  is-fullwidth">
          <select name="beanbar">
            <option></option>
            {% for store in allStores %}
            <option value="{{ store.id }}">{{ store.store_name }}</option>
            {% endfor %}
          </select>
        </div>
      </div>
    </div>

    <div class="field column is-12-mobile is-4-desktop">
      <label class="label">توضیحات</label>
      <div class="control">
        <input name="desc" id="desc" class="input" type="text" placeholder="توضیحات">
      </div>
    </div>

    <div class="field column is-12-mobile is-12-desktop">
      <div class="control">
        <button class="button is-link">ثبت</button>
      </div>
    </div>

  </form>  

<script>
  $("#actionType").change(function(){
    var actionType = $(this).val();
    if (actionType == 'transfer'){
      $("#azanbar").removeClass("is-hidden");
      $("#beanbar").removeClass("is-hidden");
    }else{
      $("#azanbar").addClass("is-hidden");
      $("#beanbar").addClass("is-hidden");
    }
  });
</script>    


{% endblock %}