{% load i18n admin_urls static admin_modify %}
<div class="js-inline-admin-kubi-formset inline-group" id="{{ inline_admin_formset.formset.prefix }}-group"
     data-inline-type="tabular"
     data-inline-formset="{{ inline_admin_formset.inline_formset_data }}">
  <div class="tabular inline-related {% if forloop.last %}last-related{% endif %}">
    {{ inline_admin_formset.formset.management_form }}
    <fieldset class="module {{ inline_admin_formset.classes }}">
      <div class="row">
        <div class="col-xs-12 col-sm-12 col-lg-4 col-xl-3 module-left-section py-4 pe-4 bg-body-tertiary">
          <h3>{{ inline_admin_formset.opts.verbose_name_plural|capfirst }}</h3>
          {% if inline_admin_formset.opts.description %}
            <div class="description">{{ inline_admin_formset.opts.description|safe }}</div>
          {% endif %}
          <div class="form-group"></div>
        </div>
        <div class="col-xs-12 col-sm-12 col-lg-8 col-xl-9 module-right-section py-4 px-4">
          {{ inline_admin_formset.formset.non_form_errors }}
          <div class="table-responsive">
            <table class="table table-inline">
             <thead><tr>
               <th class="original" scope="col"></th>
                 {% for field in inline_admin_formset.fields %}
                   {% if not field.widget.is_hidden %}
                     <th{% if field.required %} class="required"{% endif %} data-label="{{ field.label|capfirst }}" scope="col">{{ field.label|capfirst }}
                     {% if field.help_text %}&nbsp;<img src="{% static "admin/img/icon-unknown.svg" %}" class="help help-tooltip" width="10" height="10" alt="({{ field.help_text|striptags }})" title="{{ field.help_text|striptags }}" />{% endif %}
                     </th>
                   {% endif %}
                 {% endfor %}
                 {% if inline_admin_formset.formset.can_delete and inline_admin_formset.has_delete_permission %}<th class="text-end">{% trans "Delete?" %}</th>{% endif %}
             </tr></thead>

             <tbody>
             {% for inline_admin_form in inline_admin_formset %}
                {% if inline_admin_form.form.non_field_errors %}
                  <tr class="table-danger"><td colspan="{{ inline_admin_form|cell_count }}">{{ inline_admin_form.form.non_field_errors }}</td></tr>
                {% endif %}
                <tr class="ti-tr-row {% if inline_admin_form.original or inline_admin_form.show_url %}has_original{% endif %}{% if forloop.last %} empty-form{% endif %}"
                     id="{{ inline_admin_formset.formset.prefix }}-{% if not forloop.last %}{{ forloop.counter0 }}{% else %}empty{% endif %}">
                  <td class="original table-active">
                    {% if inline_admin_form.original or inline_admin_form.show_url %}
                      <div class="original-content text-truncate">
                      {% if inline_admin_form.original %}
                      {{ inline_admin_form.original }}
                      {% if inline_admin_form.model_admin.show_change_link and inline_admin_form.model_admin.has_registered_model %}<a href="{% url inline_admin_form.model_admin.opts|admin_urlname:'change' inline_admin_form.original.pk|admin_urlquote %}" class="inlinechangelink"><i class="fa fa-edit"></i> {% trans "Change" %}</a>{% endif %}
                      {% endif %}
                      {% if inline_admin_form.show_url %}<a href="{{ inline_admin_form.absolute_url }}"><i class="fa fa-link"></i> {% trans "View on site" %}</a>{% endif %}
                      </div>
                    {% endif %}
                    {% if inline_admin_form.needs_explicit_pk_field %}{{ inline_admin_form.pk_field.field }}{% endif %}
                    {{ inline_admin_form.fk_field.field }}
                    {% spaceless %}
                    {% for fieldset in inline_admin_form %}
                      {% for line in fieldset %}
                        {% for field in line %}
                          {% if field.field.is_hidden %} {{ field.field }} {% endif %}
                        {% endfor %}
                      {% endfor %}
                    {% endfor %}
                    {% endspaceless %}
                  </td>
                  {% for fieldset in inline_admin_form %}
                    {% for line in fieldset %}
                      {% for field in line %}
                        {% if not field.field.is_hidden %}
                          {% include 'admin/includes/field_form_group.html' with field=field disable_labels=True as_td=True only %}
                        {% endif %}
                      {% endfor %}
                    {% endfor %}
                  {% endfor %}
                  {% if inline_admin_formset.formset.can_delete and inline_admin_formset.has_delete_permission %}
                    <td class="delete">
                      {% if inline_admin_form.original %}
                        <span class="js-inline-remove-trigger btn btn-secondary inline-original-deletelink">
                          <span class="cb d-none">{{ inline_admin_form.deletion_field.field }}</span>
                          <i class="fa fa-trash fa-sm"></i><span class="sr-only">{{ inline_admin_form.deletion_field.label_tag }}</span>
                        </span>
                      {% endif %}
                    </td>
                  {% endif %}
                </tr>
             {% endfor %}
             </tbody>
            </table>
          </div>
        </div>
      </div>
    </fieldset>
  </div>
</div>


<script type="text/javascript">
  (function($) {

    $(document).ready(function() {
      $("#{{ inline_admin_formset.formset.prefix }}-group").each(function() {
          const data = $(this).data(),
              inlineOptions = data.inlineFormset;
          let selector;
          switch(data.inlineType) {
          case "tabular":
              selector = inlineOptions.name + "-group .tabular.inline-related tbody:first > tr.ti-tr-row";
              $(selector).tabularFormset(selector, inlineOptions.options);
              break;
          }
      });

      setTimeout(function(){
        $formset = $('#{{ inline_admin_formset.formset.prefix }}-group');
        $addRow = $formset.find('.add-row');
        if ($addRow.length > 0) {
          $addbutton = $addRow.find('a').prepend('<i class="fa fa-plus-circle"></i> ');
        }
      }, 50);

      $("#{{ inline_admin_formset.formset.prefix }}-group .js-inline-remove-trigger").on('click', function() {
          var $cb = $(this).find(":input"), $row = $(this).parents('tr');
          if($cb.prop("checked")){
              $cb.prop("checked", "");
              $row.removeClass("bg-danger-subtle");
              $(this).find('.fa-undo').removeClass('fa-undo').addClass('fa-trash');
          } else {
              $cb.prop("checked", "checked");
              $row.addClass('bg-danger-subtle');
              $(this).find('.fa-trash').removeClass('fa-trash').addClass('fa-undo');
          }
      });
    });

  })(django.jQuery);
</script>
