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

{% block help_message %}
    <div class="alert alert-info help-message">
{#    系统用户是 Jumpserver跳转登录资产时使用的用户，可以理解为登录资产用户，如 web, sa, dba(`ssh web@some-host`), 而不是使用某个用户的用户名跳转登录服务器(`ssh xiaoming@some-host`);#}
{#    简单来说是 用户使用自己的用户名登录Jumpserver, Jumpserver使用系统用户登录资产。#}
{#    系统用户创建时，如果选择了自动推送 Jumpserver会使用ansible自动推送系统用户到资产中，如果资产(交换机、windows)不支持ansible, 请手动填写账号密码。#}
{#    目前还不支持Windows的自动推送#}
    {% 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.' %}
    </div>
{% 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: 6, createdCell: function (td, cellData) {#}
            {#    var innerHtml = "";#}
            {#    var data = cellData.reachable;#}
            {#    if (data !== 0) {#}
            {#        innerHtml = "<span class='text-navy'>" + data + "</span>";#}
            {#    } else {#}
            {#        innerHtml = "<span>" + data + "</span>";#}
            {#    }#}
            {#    $(td).html(innerHtml)#}
            {#}},#}
            {#{targets: 7, createdCell: function (td, cellData) {#}
            {#    var data = cellData.unreachable;#}
            {#    var innerHtml = "";#}
            {#    if (data !== 0) {#}
            {#        innerHtml = "<span class='text-danger'>" + data + "</span>";#}
            {#    } else {#}
            {#        innerHtml = "<span>" + data + "</span>";#}
            {#    }#}
            {#    $(td).html('<span href="javascript:void(0);" data-toggle="tooltip" title="' + data + '">' + innerHtml + '</span>');#}
            {#}},#}
            {#{targets: 8, createdCell: function (td, cellData, rowData) {#}
            {#    var val = 0;#}
            {#    var innerHtml = "";#}
            {#    var total = rowData.assets_amount;#}
            {#    var reachable = cellData.reachable;#}
            {#    if (total && total !== 0) {#}
            {#        val = reachable/total * 100;#}
            {#    }#}
            {##}
            {#    if (val === 100) {#}
            {#        innerHtml = "<span class='text-navy'>" + val + "% </span>";#}
            {#    } else {#}
            {#        var num = new Number(val);#}
            {#        innerHtml = "<span class='text-danger'>" + num.toFixed(1) + "% </span>";#}
            {#    }#}
            {#    $(td).html('<span href="javascript:void(0);" data-toggle="tooltip" title="' + cellData + '">' + innerHtml + '</span>');#}
            {#}},#}
            {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_display"}, {data: "assets_amount" },
            {data: "comment" }, {data: "id" }
        ],
        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 %}



