text: {% extends layout %}
  
  {% form_theme form 'form/delivery.html.twig' %}
  
  {% block breadcrumb %}
  
  {% set delivery = form.vars.value %}
  
  <li><a href="{{ path('admin_deliveries') }}">{% trans %}adminDashboard.deliveries.title{% endtrans %}</a></li>
  {% if delivery.id is not null %}
  <li>#{{ delivery.id }}</li>
  {% else %}
  <li>{% trans %}delivery.createNew{% endtrans %}</li>
  {% endif %}
  
  {% endblock %}
  
  {% block content %}
  
  {% set delivery = form.vars.value %}
  {% set is_new = delivery.id is null %}
  
  {{ form_start(form, { attr: { 'data-store': delivery.store is not empty ? delivery.store.id : null } }) }}
  
    {% if order is defined and order is not empty %}
  
      {% if order.state == 'cart' %}
      <div class="alert alert-warning">
        <i class="fa fa-exclamation-triangle"></i> {{ 'form.delivery.to_be_confirmed.warning'|trans }}
        <span class="pull-right">
          <a class="btn btn-xs btn-success" href="{{ path('admin_order', { id: order.id }) }}">
            {{ 'form.delivery.view_order'|trans }}
          </a>
        </span>
      </div>
      {% endif %}
  
      {% if order.state == 'new' %}
      <div class="alert alert-info">
        <i class="fa fa-info-circle"></i> {{ 'form.delivery.has_order.info'|trans }}
        <span class="pull-right">
          <a class="btn btn-xs btn-success" href="{{ path('admin_order', { id: order.id }) }}">
            {{ 'form.delivery.view_order'|trans }}
          </a>
        </span>
      </div>
      {% endif %}
  
    {% endif %}
  
    {{ form_errors(form) }}
  
    <div class="row">
      <div class="col-md-7">
        {{ form_row(form.pickup) }}
      </div>
      <div class="col-md-5">
        <div class="form-horizontal">
          {% if form.store is defined %}
            {{ form_row(form.store) }}
          {% endif %}
          {% if form.vehicle is defined %}
            {{ form_row(form.vehicle) }}
          {% endif %}
          {{ form_row(form.weight) }}
          {% if form.packages is defined %}
          <div class="form-group">
            {{ form_label(form.packages) }}
            <div class="col-sm-9">
              {{ form_widget(form.packages) }}
            </div>
          </div>
          {% endif %}
        </div>
      </div>
    </div>
  
    <hr>
  
    <div class="row">
      <div class="col-md-7">
        {{ form_row(form.dropoff) }}
      </div>
      <div class="col-md-5">
        {% if not is_new %}
        <div class="alert alert-info">
          <a href="{{ url('public_delivery', { hashid: delivery|hashid }) }}" target="_blank" id="tracking_link">{% trans %}delivery.tracking_link{% endtrans %} <i class="fa fa-external-link"></i></a>
          <a href="#" class="pull-right" id="copy" data-clipboard-target="#tracking_link"><i class="fa fa-clipboard" aria-hidden="true"></i></a>
        </div>
        {% endif %}
        <div class="embed-responsive embed-responsive-16by9">
          <div class="embed-responsive-item" id="map"></div>
          <div class="map-distance-overlay">
            <span class="mr-2">{% trans %}form.delivery.distance.label{% endtrans %}</span>
            <span id="delivery_distance">
              {% if delivery.distance is not empty %}
                {{ delivery.distance|meters_to_kilometers }}
              {% endif %}
            </span>
          </div>
        </div>
      </div>
    </div>
  
    <hr>
  
    <div class="d-md-flex d-lg-flex d-xl-flex flex-row mb-4">
      <div class="col-md-7">
        {% if delivery.store is not empty and delivery.store.createOrders %}
          <div id="delivery-price" class="delivery-price-preview mb-4 mb-md-0"
            data-tax-rate-amount="{{ tax_rate.amount|e('html_attr') }}"
            data-tax-rate-is-included-in-price="{{ tax_rate.isIncludedInPrice()|json_encode|e('html_attr') }}">
  
            <div class="delivery-price">
              <span class="delivery-price-label">{% trans %}form.delivery.price.label{% endtrans %}</span>
              <span class="delivery-price-value" id="delivery_price">
                <span {% if not tax_rate.isIncludedInPrice() %}class="text-muted"{% endif %}>
                  <span data-tax="included">{{ 0|price_format }}</span>
                  <span class="ml-2">{{ 'basics.tax_incl'|trans }}</span>
                </span>
                <span {% if tax_rate.isIncludedInPrice() %}class="text-muted"{% endif %}>
                  <span data-tax="excluded">{{ 0|price_format }}</span>
                  <span class="ml-2">{{ 'basics.tax_excl'|trans }}</span>
                </span>
              </span>
            </div>
  
            <div class="text-center text-danger">
              <small id="delivery_price_error" class="delivery-price-error"></small>
            </div>
  
            {% if debug_pricing is defined and debug_pricing %}
              {% set pricing_rules = delivery.store.pricingRuleSet.rules %}
              <ul class="list-group" id="pricing-rules-debug">
              {% for pricing_rule in pricing_rules %}
                <li class="list-group-item" data-pricing-rule="/api/pricing_rules/{{ pricing_rule.id }}">
                  <span>{{ pricing_rule.expression }}</span>
                  <span class="pull-right">
                    <i class="fa fa-spinner fa-spin hidden"></i>
                  </span>
                </li>
              {% endfor %}
              </ul>
            {% endif %}
  
          </div>
        {% endif %}
      </div>
      <div class="col-md-5">
        <button id="delivery-submit" type="submit" class="btn btn-block btn-lg btn-primary h-100">
          <i class="fa fa-spinner fa-spin hidden" id="loader"></i>
          {% trans %}adminDashboard.deliveries.save{% endtrans %}
        </button>
      </div>
    </div>
  
  {{ form_end(form) }}
  
  {% endblock %}
  
  {% block styles %}
    {{ encore_entry_link_tags('delivery-form') }}
  {% endblock %}
  
  {% block scripts %}
  {{ encore_entry_script_tags('delivery-form') }}
  <script src="https://maps.googleapis.com/maps/api/js?key={{ coopcycle_setting('google_api_key') }}&libraries=places&callback=initMap"
    async defer></script>
  {% endblock %}
  