{% extends 'base.html' %}
{% load static %}
{% load widget_tweaks %}

{% block body %}


    <div class="d-flex flex-column-fluid">
        <!--begin::Container-->
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    <!--begin::Card-->
                    <div class="card card-custom">
                        <div class="card-header">
                            <h3 class="card-title">
                                List
                                {{ model_name }}
                            </h3>
                        </div>
                        <!--begin::Form-->
                        <div class="card-body">
                        {% include 'component/filter-form.html' %}
                            {% if not disableTable %}
                                <table class="table table-striped table-custom-border text-center table-rounded table-borderless table-thead-primary"
                                       id="table">
                                    <thead>
                                    {% for field in cols %}
                                        <th>{{ field }}</th>
                                    {% endfor %}
                                    {% if deleteShow or editShow %}
                                        <th>عملیات</th>
                                    {% endif %}
                                    </thead>
                                    <tbody>

                                    </tbody>
                                </table>
                            {% endif %}
                        </div>
                        <!--end::Form-->
                    </div>
                    <!--end::Card-->
                </div>
            </div>
        </div>
        <!--end::Container-->
    </div>
{% endblock %}

{% block script %}
    <script src="{% static 'assets/plugins/custom/datatables/datatables.bundle.js' %}" type="text/javascript"></script>
    <script src="{% static 'badi_utils/js/datatable.js' %}" type="text/javascript"></script>
    <script>
        {% if not disableTable %}
            var table = datatable_simple_show({
                url: "{{ api_url }}datatable/",
                real_cols: {{cols|length}},
                hide_id: true,
                loading_all: true,
                responsive: true,
                datable_id: '#table',
                {% if not deleteShow %}
                    not_delete_able: true,
                    del_url: '',
                {% else %}
                    del_url: '{{deleteURL}}',
                {% endif %}
                {% if not editShow %}
                    not_edit_able: true,
                    up_url: '',
                {% else %}
                    up_url: "{{editURL}}",
                {% endif %}
                {% if not deleteShow and not editShow %}
                    no_action_nutton: true,
                {% endif %}
                extra_del_params: {
                    ajax: true,
                },
            },
        {
            rowCallback: function (row,data){
                defaultDrawCallBack(row, data)
                let colors = ['primary', 'info', 'danger']
                boldCol(0, row, data[1], color = colors[parseInt(data[3]) - 1])
                boldCol(5, row, data[6], color = colors[parseInt(data[3]) - 1])
                $(`td:eq(2)`, row).html(`<label class="btn btn-${colors[parseInt(data[3]) - 1]} w-40px btn-sm noHover">${data[3]}</label>`)
            }
        });

        {% endif %}

        $(' select').select2({
            dir: "ltr"
        });

        $('.filters').submit(function (e) {
            console.log('WTF')
            e.preventDefault();
            table.draw();
        })
    </script>
    <script>


    </script>
{% endblock %}
