{% extends 'memberaudit/base.html' %}

{% load i18n %}
{% load humanize %}
{% load static %}

{% block details %}
    <div>
        {% include 'memberaudit/partials/reports/tabs_navigation.html' %}

        <div class="panel panel-default panel-tabs">
            <div class="panel-body">
                <!-- Tab panes -->
                <div class="tab-content">
                    {% include 'memberaudit/partials/reports/tabs/user_compliance.html' %}
                    {% include 'memberaudit/partials/reports/tabs/corporation_compliance.html' %}
                    {% include 'memberaudit/partials/reports/tabs/skill_sets.html' %}
                </div>
            </div>

        </div>
    </div>
{% endblock details %}

{% block extra_javascript %}
    {% include 'bundles/datatables-js.html' %}

    <script type="application/javascript" src="{% static 'memberaudit/vendor/datatables/plugins/dataTables.rowGroup.min.js' %}"></script>
    <script type="application/javascript" src="{% static 'js/filterDropDown/filterDropDown.min.js' %}"></script>

    <script>
        $(document).ready(function() {
            $('#tab_user_compliance').DataTable({
                ajax: {
                    url: '{% url 'memberaudit:user_compliance_report_data' %}',
                    dataSrc: '',
                    cache: false
                },
                columns: [
                    {
                        data: 'main',
                        render: {
                            _: 'display',
                            sort: 'sort'
                        }
                    },
                    { data: 'state' },
                    {
                        data: 'organization',
                        render: {
                            _: 'display',
                            sort: 'sort'
                        }
                    },
                    { data: 'registered_str' },
                    { data: 'compliance_str' },
                    { data: 'total_chars' },
                    /* hidden columns */
                    { data: 'alliance_name' },
                    { data: 'corporation_name' },
                ],
                columnDefs: [
                    { "visible": false, "targets": [ 6, 7 ] },
                ],
                order: [ [ 0, "asc" ] ],
                filterDropDown: {
                    columns: [
                        {
                            idx: 1,
                            title: "{% translate 'State' %}"
                        },
                        {
                            idx: 6,
                            title: "{% translate 'Alliance' %}"
                        },
                        {
                            idx: 7,
                            title: "{% translate 'Corporation' %}"
                        },
                        {
                            idx: 3,
                            title: "{% translate 'Registered?' %}"
                        },
                        {
                            idx: 4,
                            title: "{% translate 'Compliant?' %}"
                        }
                    ],
                    bootstrap: true
                },
                createdRow: function( row, data, dataIndex )
                {
                    if (data['is_compliant']){
                        $(row).addClass('success');
                    }
                    else if (data['is_registered']){
                        $(row).addClass('warning');
                    }
                    else {
                        $(row).addClass('danger');
                    }
                }
            });

            $('#tab_corporation_compliance').DataTable({
                ajax: {
                    url: '{% url 'memberaudit:corporation_compliance_report_data' %}',
                    dataSrc: '',
                    cache: false
                },
                columns: [
                    {
                        data: 'organization_html',
                        render: {
                            _: 'display',
                            sort: 'sort'
                        }
                    },
                    { data: 'mains_count' },
                    { data: 'characters_count' },
                    { data: 'compliance_percent' },
                    /* hidden columns */
                    { data: 'alliance_name' },
                    { data: 'corporation_name' },
                    { data: 'is_compliant_str' },
                ],
                columnDefs: [
                    { "visible": false, "targets": [ 4, 5, 6 ] },
                ],
                order: [ [ 0, "asc" ] ],
                filterDropDown: {
                    columns: [
                        {
                            idx: 4,
                            title: "{% translate 'Alliance' %}"
                        },
                        {
                            idx: 5,
                            title: "{% translate 'Corporation' %}"
                        },
                        {
                            idx: 6,
                            title: "{% translate 'Compliant?' %}"
                        },
                    ],
                    autoSize: false,
                    bootstrap: true
                },
                createdRow: function( row, data, dataIndex )
                {
                    if (data['is_compliant']){
                        $(row).addClass('success');
                    }
                    else if (data['is_partly_compliant']){
                        $(row).addClass('warning');
                    }
                    else {
                        $(row).addClass('danger');
                    }
                }
            });

            $('#tab_skill_sets').DataTable({
                ajax: {
                    url: "{% url 'memberaudit:skill_sets_report_data' %}",
                    dataSrc: '',
                    cache: false
                },
                columns: [
                    { data: 'group' },
                    { data: 'main_html' },
                    { data: 'state' },
                    { data: 'organization_html' },
                    { data: 'character_html' },
                    { data: 'has_required' },

                    /* hidden columns */
                    { data: 'alliance' },
                    { data: 'corporation' },
                    { data: 'has_required_str' },
                    { data: 'is_doctrine_str' },
                ],
                order: [[0, "asc"], [1, "asc"], [4, "asc"]],
                rowGroup: {
                    dataSrc: 'group',
                    className: 'table-group'
                },
                columnDefs: [
                    { "visible": false, "targets": [0, 6, 7, 8, 9] }
                ],
                filterDropDown: {
                    columns: [
                        {
                            idx: 0,
                            title: "{% translate 'Groups' %}"
                        },
                        {
                            idx: 2,
                            title: "{% translate 'State' %}"
                        },
                        {
                            idx: 6,
                            title: "{% translate 'Alliance' %}"
                        },
                        {
                            idx: 7,
                            title: "{% translate 'Corporation' %}"
                        },
                        {
                            idx: 8,
                            title: "{% translate 'Required Skills?' %}"
                        },
                        {
                            idx: 9,
                            title: "{% translate 'Doctrine?' %}"
                        }
                    ],
                    autoSize: false,
                    bootstrap: true
                }
            });

        });
    </script>
{% endblock %}

{% block extra_css %}
    {% include 'bundles/datatables-css.html' %}
    <link rel="stylesheet" href="{% static 'memberaudit/css/global.css' %}" type="text/css">
    <link rel="stylesheet" href="{% static 'memberaudit/css/memberaudit.css' %}" type="text/css">
    <link rel="stylesheet" href="{% static 'memberaudit/css/reports.css' %}" type="text/css">
{% endblock %}

{% block extra_script %}

{% endblock %}
