{% extends "AppBundle::layout_backend.html.twig" %}

{% block title 'Obtención Masiva Órdenes' %}

{% block stylesheets3rd %}{% endblock %}

{% block content %}
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
    <div class="panel cfj-panel-2">
        <div class="panel-heading cfj-deg-violeta">
            Obtención Masiva
        </div>
        <div class="panel-body">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <label for="mkpConns" class="text-nowrap">Seleccione la conexión</label>
                <select
                        id="mkpConns"
                        name="mkpConns"
                        class="form-control cfj-inputs-shadow"
                >
                {% for mkpConn in mkpConnections %}
                    <option value="{{ mkpConn.id }}">ID Config {{ mkpConn.id }} - {{mkpConn.marketplace.nombre}} -  {{mkpConn.nombreconfiguracion}}</option>
                {% endfor %}
                </select>
            </div>
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="margin-top:20px;">
                <label for="id_orders_pull">Ingresa los ID de las ventas (un ID por línea)</label>
                <textarea
                    id="id_orders_pull"
                    name="id_orders_pull"
                    class="form-control cfj-inputs-shadow"
                    value=""
                ></textarea>
            </div>
            <button class="btn btn-primary btn-flat cfj-save-button" style="margin-top:20px;" id="startMassivePull" type="submit">Comenzar</button>
        </div>
    </div>
    <div id="instructionsMassivePull" class="massive-order-pull-instruction cfj-panel-2">Elige el canal e ingresa los ID de las ventas para comenzar.</div>
    <div id="orderList" hidden style="max-height:300px; overflow-y:auto;">
        <table id="example" class="table table-hover col-12 display">
          <thead>
              <tr>
                  <th style="width:5%"></th>
                  <th style="width:35%"></th>
                  <th style="width:60%"></th>
              </tr>
          </thead>
          <tbody id="orderTableBodyList">
          </tbody>
        </table>
      </div>
</div>
<script src="{{ asset('bundles/app/dist/easyautocomplete/jquery.easy-autocomplete.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('bundles/app/plugins/datepicker/locales/bootstrap-datepicker.es.js') }}" type="text/javascript"></script>
<script src="{{ asset('bundles/app/dist/croppie/demo/prism.js') }}" type="text/javascript"></script>
<script src="{{ asset('bundles/app/dist/croppie/dist/sweetalert.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('bundles/app/dist/croppie/croppie.js') }}" type="text/javascript"></script>
{% endblock %}
{% block javascripts3rd %}
    {% javascripts
        '@AppBundle/Resources/public/js/Ordenes/orderMassivePullHelper.js'
    %}
        <script src="{{ asset_url }}"></script>
    {% endjavascripts %}
{% endblock %}