{% extends '_base_list.html' %}
{% load i18n %}

{% block help_message %}
    {% trans 'System user is Jumpserver jump login assets used by the users, can be understood as the user login assets, such as web, sa, the dba (` ssh web@some-host `), rather than using a user the username login server jump (` ssh xiaoming@some-host `); '%}
    {% trans 'In simple terms, users log into Jumpserver using their own username, and Jumpserver uses system users to log into assets. '%}
    {% trans 'When system users are created, if you choose auto push Jumpserver to use Ansible push system users into the asset, if the asset (Switch) does not support ansible, please manually fill in the account password.' %}
{% endblock %}

{% block table_search %}
    <div class="" style="float: right">
       <div class=" btn-group">
            <button data-toggle="dropdown" class="btn btn-default btn-sm dropdown-toggle">CSV <span class="caret"></span></button>
            <ul class="dropdown-menu">
                <li>
                    <a class=" btn_export" tabindex="0">
                    <span>{% trans "Export" %}</span>
                    </a>
                </li>
                <li>
                    <a class=" btn_import" data-toggle="modal" data-target="#import_modal" tabindex="0">
                    <span>{% trans "Import" %}</span>
                    </a>
                </li>
                <li>
                    <a class=" btn_update" data-toggle="modal" data-target="#update_modal" tabindex="0">
                    <span>{% trans "Update" %}</span>
                    </a>
                </li>
            </ul>
       </div>
   </div>
{% endblock %}

{% block table_container %}
<div class="uc pull-left m-r-5">
    <a href="{% url 'assets:system-user-create' %}" class="btn btn-sm btn-primary "> {% trans "Create system user" %} </a>
</div>
<table class="table table-striped table-bordered table-hover " id="system_user_list_table" >
    <thead>
    <tr>
        <th class="text-center">
            <input type="checkbox" id="check_all" class="ipt_check_all">
        </th>
        <th class="text-center">{% trans 'Name' %}</th>
        <th class="text-center">{% trans 'Username' %}</th>
        <th class="text-center">{% trans 'Protocol' %}</th>
        <th class="text-center">{% trans 'Login mode' %}</th>
        <th class="text-center">{% trans 'Asset' %}</th>
{#        <th class="text-center">{% trans 'Reachable' %}</th>#}
{#        <th class="text-center">{% trans 'Unreachable' %}</th>#}
{#        <th class="text-center">{% trans 'Ratio' %}</th>#}
        <th class="text-center">{% trans 'Comment' %}</th>
        <th class="text-center">{% trans 'Action' %}</th>
    </tr>
    </thead>
    <tbody>
    </tbody>
</table>
    {% include 'assets/_system_user_import_modal.html' %}
    {% include 'assets/_system_user_update_modal.html' %}
{% endblock %}
{% block custom_foot_js %}
<script>
var system_user_table = 0;
function initTable() {
    var options = {
        ele: $('#system_user_list_table'),
        columnDefs: [
            {targets: 1, createdCell: function (td, cellData, rowData) {
                cellData = htmlEscape(cellData);
                var detail_btn = '<a href="{% url "assets:system-user-detail" pk=DEFAULT_PK %}">' + cellData + '</a>';
                $(td).html(detail_btn.replace('{{ DEFAULT_PK }}', rowData.id));
            }},
            {targets: 4, createdCell: function (td, cellData, rowData) {
                $(td).html(rowData.login_mode_display);
            }},
            {targets: 7, createdCell: function (td, cellData, rowData) {
                var update_btn = '<a href="{% url "assets:system-user-update" pk=DEFAULT_PK %}" class="btn btn-xs m-l-xs btn-info">{% trans "Update" %}</a>'.replace('{{ DEFAULT_PK }}', cellData);
                var del_btn = '<a class="btn btn-xs btn-danger m-l-xs btn_admin_user_delete" data-uid="{{ DEFAULT_PK }}">{% trans "Delete" %}</a>'.replace('{{ DEFAULT_PK }}', cellData);
                $(td).html(update_btn + del_btn)
            }},
        ],
        ajax_url: '{% url "api-assets:system-user-list" %}',
        columns: [
            {data: "id" }, {data: "name" }, {data: "username" }, {data: "protocol"},
            {data: "login_mode"}, {data: "assets_amount", orderable: false },
            {data: "comment" }, {data: "id", orderable: false, width: "100px"}
        ],
        op_html: $('#actions').html()
    };
    system_user_table = jumpserver.initServerSideDataTable(options);
    return system_user_table
}

$(document).ready(function(){
    initTable();
})

.on('click', '.btn_admin_user_delete', function () {
    var $this = $(this);
    var $data_table = $('#cluster_list_table').DataTable();
    var name = $(this).closest("tr").find(":nth-child(2)").children('a').html();
    var uid = $this.data('uid');
    var the_url = '{% url "api-assets:system-user-detail" pk=DEFAULT_PK %}'.replace('{{ DEFAULT_PK }}', uid);
    objectDelete($this, name, the_url);
    setTimeout( function () {
        $data_table.ajax.reload();
    }, 3000);
})

.on('click', '#btn_bulk_update', function () {
    var action = $('#slct_bulk_update').val();
    var $data_table = $('#system_user_list_table').DataTable();
    var id_list = [];
    var plain_id_list = [];
    $data_table.rows({selected: true}).every(function(){
        id_list.push({id: this.data().id});
        plain_id_list.push(this.data().id);
    });
    if (id_list === []) {
        return false;
    }
    var the_url = "{% url 'api-assets:system-user-list' %}";
    function doDelete() {
        swal({
            title: "{% trans 'Are you sure?' %}",
            text: "{% trans 'This will delete the selected System Users !!!' %}",
            type: "warning",
            showCancelButton: true,
            cancelButtonText: "{% trans 'Cancel' %}",
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "{% trans 'Confirm' %}",
            closeOnConfirm: false
        }, function() {
            var success = function() {
                var msg = "{% trans 'System Users Deleted.' %}";
                swal("{% trans 'System Users Delete' %}", msg, "success");
                $('#system_user_list_table').DataTable().ajax.reload();
            };
            var fail = function() {
                var msg = "{% trans 'System Users Deleting failed.' %}";
                swal("{% trans 'System Users Delete' %}", msg, "error");
            };
            var url_delete = the_url + '?id__in=' + JSON.stringify(plain_id_list);
            requestApi({url: url_delete, method: 'DELETE', success: success, error: fail});
            $data_table.ajax.reload();
            jumpserver.checked = false;
        });
    }
    function doUpdate() {
{#        TODO: bulk update the System Users #}
    }
    switch (action) {
        case 'delete':
            doDelete();
            break;
        case 'update':
            doUpdate();
            break;
        default:
            break;
    }
})
.on('click', '.btn_export', function () {
    var system_users = system_user_table.selected;
    var data = {
        'resources': system_users
    };
    var search = $("input[type='search']").val();
    var props = {
        method: "POST",
        body: JSON.stringify(data),
        success_url: "{% url 'api-assets:system-user-list' %}",
        format: "csv",
        params:{
            search:search
        }
    };
    APIExportData(props);
})
.on('click', '#btn_import_confirm', function () {
    var url = "{% url 'api-assets:system-user-list' %}";
    var file = document.getElementById('id_file').files[0];
    if(!file){
        toastr.error("{% trans 'Please select file' %}");
        return
    }
    var data_table = $('#system_user_list_table').DataTable();
    APIImportData({
        url: url,
        method: "POST",
        body: file,
        data_table: data_table
    });
})
.on('click', '#download_update_template', function () {
    var system_users = system_user_table.selected;
    var data = {
        'resources': system_users
    };
    var search = $("input[type='search']").val();
    var props = {
        method: "POST",
        body: JSON.stringify(data),
        success_url: "{% url 'api-assets:system-user-list' %}?format=csv&template=update",
        format: "csv",
        params:{
            search:search
        }
    };
    APIExportData(props);
})
.on('click', '#btn_update_confirm', function () {
    var file = document.getElementById('update_file').files[0];
    if(!file){
        toastr.error("{% trans "Please select file" %}");
        return
    }
    var url = "{% url 'api-assets:system-user-list' %}";
    var data_table = $('#system_user_list_table').DataTable();

    APIImportData({
        url: url,
        method: "PUT",
        body: file,
        data_table: data_table
    });
})
</script>
{% endblock %}



