{% extends 'adminvisualsortable/sort-base.html' %}
{% load static %}
{% load admin_utils %}
{% block extra_style %}
<style>
    {% for r in res %}
    {% if preview_field and r.img %}
    #bg-image-{{ r.obj.id }} {
        background-image: url("{{ r.img.url }}");
    }
    {% else %}
    #bg-image-{{ r.obj.id }} {
        background-image: url("{% static 'adminvisualsortable/img/placeholder-image.png' %}");
    }
    {% endif %}
    {% endfor %}
</style>
{% endblock %}
{% block cur_sorting_model %}Sorting for Model: <b>{{targetModel.name}}</b>{% endblock %}
{% block sort_info %}{{ targetModel.verbose_name_plural }}{% endblock %}
{% block breadcrumb %}<a href="{{ targetModel|get_parent_admin_url_list }}">Back to Admin Page ></a> <span>{{ targetModel.verbose_name_plural }} Instances</span>{% endblock %}
{% block main %}
<div class="sorter-cont">
    <div id="sortable-items-cont">
        {% for r in res %}
        <div class="dropzone" data-ord="{{r.ord}}" data-id="{{r.obj.id}}">
            <div class="drag-drop">
                <div id="bg-image-{{ r.obj.id }}" class="cover bg-image"></div>
                <div class="item-title">
                    <p class="item-title-int"> {{ r.obj }}</p>
                    <div class="item-title-action-cont">
                        <a class="action-link" href="{{ r.obj|get_parent_admin_url_detail }}"><i class="fa-solid fa-pencil"></i> Edit in admin</a><span class="idx-cont"><span class="live-ord" data-id="{{ r.obj.id }}">{{ r.ord }}</span></span><br>
                        {% if r.has_sort_inlines %}
                        <a class="action-link" href="{% url 'adminvisualsortable:sortable inlines' app=app modelparentname=targetModel.name.lower model_id=r.obj.id %}"><i class="fa-regular fa-bring-forward"></i> Sort Children</a>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>
        {% endfor %}
    </div>
</div>
{% endblock %}
