mirror of https://github.com/jumpserver/jumpserver
Merge branch 'master' of code.simcu.com:jumpserver/jumpserver
rollback user_list.htmlpull/530/head
commit
0dec647116
|
@ -78,4 +78,25 @@ th a {
|
|||
border-top: none !important;
|
||||
}
|
||||
|
||||
table.dataTable tbody > tr.selected, table.dataTable tbody > tr > .selected {
|
||||
background-color: #1ab394;
|
||||
}
|
||||
table.dataTable tbody tr.selected a,
|
||||
table.dataTable tbody th.selected a,
|
||||
table.dataTable tbody td.selected a,
|
||||
table.dataTable tbody tr.selected td i.text-navy,
|
||||
table.dataTable tbody th.selected td i.text-navy,
|
||||
table.dataTable tbody td.selected td i.text-navy
|
||||
{
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
div.dataTables_wrapper div.dataTables_filter,
|
||||
.dataTables_length {
|
||||
float: right !important;
|
||||
}
|
||||
|
||||
div.dataTables_wrapper div.dataTables_filter {
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
|
|
@ -240,7 +240,6 @@ function objectDelete(obj, name, url){
|
|||
});
|
||||
}
|
||||
|
||||
var jumpserver = {};
|
||||
$.fn.serializeObject = function()
|
||||
{
|
||||
var o = {};
|
||||
|
@ -257,3 +256,80 @@ $.fn.serializeObject = function()
|
|||
});
|
||||
return o;
|
||||
};
|
||||
var jumpserver = {};
|
||||
jumpserver.initDataTable = function (options) {
|
||||
// options = {
|
||||
// ele *: $('#dataTable_id'),
|
||||
// ajax_url *: '{% url 'users:user-list-api' %}',
|
||||
// columns *: [{data: ''}, ....],
|
||||
// dom: 'fltip',
|
||||
// i18n_url: '{% static "js/...../en-us.json" %}',
|
||||
// order: [[1, 'asc'], [2, 'asc'], ...],
|
||||
// buttons: ['excel', 'pdf', 'print'],
|
||||
// columnDefs: [{target: 0, createdCell: ()=>{}}, ...],
|
||||
// uc_html: '<a>header button</a>',
|
||||
// op_html: 'div.btn-group?'
|
||||
// }
|
||||
var ele = options.ele || $('.dataTable');
|
||||
var columnDefs = [
|
||||
{
|
||||
targets: 0, orderable: false,
|
||||
createdCell: function(td) {
|
||||
$(td).html('<div class="checkbox checkbox-default"><input type="checkbox" class="ipt_check"><label></label></div>');
|
||||
}
|
||||
},
|
||||
{className: 'text-center', targets: '_all'},
|
||||
];
|
||||
columnDefs = options.columnDefs ? options.columnDefs.concat(columnDefs) : columnDefs;
|
||||
var table = ele.DataTable({
|
||||
pageLength: options.pageLength || 25,
|
||||
dom: options.dom || '<"#uc.pull-left"><"html5buttons"B>flti<"row m-t"<"#op.col-md-6"><"col-md-6"p>>',
|
||||
language: {
|
||||
url: options.i18n_url || "/static/js/plugins/dataTables/i18n/zh-hans.json"
|
||||
},
|
||||
order: options.order || [[ 1, 'asc' ]],
|
||||
buttons: options.buttons || [
|
||||
{extend: 'excel',
|
||||
exportOptions: {
|
||||
modifier: {
|
||||
selected: true
|
||||
}
|
||||
}
|
||||
},
|
||||
{extend: 'pdf',
|
||||
exportOptions: {
|
||||
modifier: {
|
||||
selected: true
|
||||
}
|
||||
}
|
||||
},
|
||||
{extend: 'print',
|
||||
customize: function (win){
|
||||
$(win.document.body).addClass('white-bg');
|
||||
$(win.document.body).css('font-size', '10px');
|
||||
$(win.document.body).find('table')
|
||||
.addClass('compact')
|
||||
.css('font-size', 'inherit');
|
||||
}
|
||||
}
|
||||
],
|
||||
columnDefs: columnDefs,
|
||||
select: options.select || {style: 'multi'},
|
||||
ajax: {
|
||||
url: options.ajax_url ,
|
||||
dataSrc: ""
|
||||
},
|
||||
columns: options.columns || []
|
||||
});
|
||||
table.on('select', function(e, dt, type, indexes) {
|
||||
var $node = table[ type ]( indexes ).nodes().to$();
|
||||
$node.find('input.ipt_check').prop('checked', true);
|
||||
}).on('deselect', function(e, dt, type, indexes) {
|
||||
var $node = table[ type ]( indexes ).nodes().to$();
|
||||
$node.find('input.ipt_check').prop('checked', false);
|
||||
}).on('draw', function(){
|
||||
$('#op').html(options.op_html || '');
|
||||
$('#uc').html(options.uc_html || '');
|
||||
});
|
||||
return table;
|
||||
}
|
||||
|
|
|
@ -7,17 +7,9 @@
|
|||
<link href="{% static "css/plugins/sweetalert/sweetalert.css" %}" rel="stylesheet">
|
||||
<link href="{% static "css/style.css" %}" rel="stylesheet">
|
||||
<link href="{% static "css/plugins/vaildator/jquery.validator.css" %}" rel="stylesheet">
|
||||
|
||||
|
||||
|
||||
<!-- scripts -->
|
||||
<script src="{% static 'js/jquery-2.1.1.js' %}"></script>
|
||||
|
||||
|
||||
<!-- Sweet alert -->
|
||||
<script src="{% static 'js/plugins/sweetalert/sweetalert.min.js' %}"></script>
|
||||
|
||||
<script src="{% static 'js/bootstrap.min.js' %}"></script>
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -2,16 +2,14 @@
|
|||
{% load i18n static %}
|
||||
{% get_current_language as LANGUAGE_CODE %}
|
||||
{% load common_tags %}
|
||||
{% block content_left_head %}
|
||||
<a href="{% url 'users:user-create' %}" class="btn btn-sm btn-primary "> {% trans "Create user" %} </a>
|
||||
{% endblock %}
|
||||
{% block table_search %}{% endblock %}
|
||||
{% block table_container %}
|
||||
<div class="uc pull-left"><a href="{% url "users:user-create" %}" class="btn btn-sm btn-primary"> {% trans "Create user" %} </a></div>
|
||||
<table class="table table-striped table-bordered table-hover " id="user_list_table" >
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-center">
|
||||
<div class="checkbox checkbox-success"><input id="" type="checkbox" class="ipt_check_all"><label></label></div>
|
||||
<div class="checkbox checkbox-default"><input id="" type="checkbox" class="ipt_check_all"><label></label></div>
|
||||
</th>
|
||||
<th class="text-center">{% trans 'Name' %}</a></th>
|
||||
<th class="text-center">{% trans 'Username' %}</a></th>
|
||||
|
@ -25,66 +23,43 @@
|
|||
<tbody>
|
||||
</tbody>
|
||||
</table>
|
||||
<div id="actions" class="hide">
|
||||
<div class="input-group">
|
||||
<select class="form-control m-b" style="width: auto" id="slct_bulk_update">
|
||||
<option value="delete">{% trans 'Delete selected' %}</option>
|
||||
<option value="update">{% trans 'Update selected' %}</option>
|
||||
<option value="deactive">{% trans 'Deactive selected' %}</option>
|
||||
</select>
|
||||
<div class="input-group-btn pull-left" style="padding-left: 5px;">
|
||||
<button id='btn_bulk_update' style="height: 32px;" class="btn btn-sm btn-primary">
|
||||
{% trans 'Submit' %}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include "users/_user_bulk_update_modal.html" %}
|
||||
{% endblock %}
|
||||
{% block content_bottom_left %}
|
||||
<div class="input-group">
|
||||
<select class="form-control m-b" style="width: auto" id="slct_bulk_update">
|
||||
<option value="delete">{% trans 'Delete selected' %}</option>
|
||||
<option value="update">{% trans 'Update selected' %}</option>
|
||||
<option value="deactive">{% trans 'Deactive selected' %}</option>
|
||||
</select>
|
||||
<div class="input-group-btn pull-left" style="padding-left: 5px;">
|
||||
<button id='btn_bulk_update' style="height: 32px;" class="btn btn-sm btn-primary">
|
||||
{% trans 'Submit' %}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
{% block custom_foot_js %}
|
||||
<script>
|
||||
jumpserver.checked = false;
|
||||
$(document).ready(function(){
|
||||
var table = $('#user_list_table').DataTable({
|
||||
dom: '<"html5buttons"B>lftip',
|
||||
language: {
|
||||
url: "{% static 'js/plugins/dataTables/i18n/language_code.json' %}".replace('language_code', '{{ LANGUAGE_CODE }}')
|
||||
},
|
||||
order: [[ 1, 'asc' ]],
|
||||
buttons: [
|
||||
{extend: 'excel',
|
||||
exportOptions: {
|
||||
modifier: {
|
||||
selected: true
|
||||
}
|
||||
}
|
||||
},
|
||||
{extend: 'pdf',
|
||||
exportOptions: {
|
||||
modifier: {
|
||||
selected: true
|
||||
}
|
||||
}
|
||||
},
|
||||
{extend: 'print',
|
||||
customize: function (win){
|
||||
$(win.document.body).addClass('white-bg');
|
||||
$(win.document.body).css('font-size', '10px');
|
||||
$(win.document.body).find('table')
|
||||
.addClass('compact')
|
||||
.css('font-size', 'inherit');
|
||||
}
|
||||
}
|
||||
],
|
||||
var options = {
|
||||
ele: $('#user_list_table'),
|
||||
columnDefs: [
|
||||
{targets: 0, orderable: false,
|
||||
createdCell: function(td) {
|
||||
$(td).html('<div class="checkbox checkbox-success"><input type="checkbox" class="ipt_check"><label></label></div>');
|
||||
}
|
||||
},
|
||||
{className: 'text-center', targets: [0, 1, 2, 3, 4, 5, 6, 7]},
|
||||
{targets: 7,
|
||||
createdCell: function (td, cellData, rowData) {
|
||||
{targets: 1, createdCell: function (td, cellData, rowData) {
|
||||
var detail_btn = '<a href="{% url "users:user-detail" pk=99991937 %}">' + cellData + '</a>';
|
||||
$(td).html(detail_btn.replace('99991937', rowData.id));
|
||||
}},
|
||||
{targets: 6, createdCell: function (td, cellData) {
|
||||
if (!cellData) {
|
||||
$(td).html('<i class="fa fa-times text-danger"></i>')
|
||||
} else {
|
||||
$(td).html('<i class="fa fa-check text-navy"></i>')
|
||||
}
|
||||
}},
|
||||
{targets: 7, createdCell: function (td, cellData, rowData) {
|
||||
var update_btn = '<a href="{% url "users:user-update" pk=99991937 %}" class="btn btn-xs btn-info">{% trans "Update" %}</a>'.replace('99991937', cellData);
|
||||
var del_btn = '<a class="btn btn-xs btn-danger m-l-xs btn_user_delete" data-uid="99991937">{% trans "Delete" %}</a>'.replace('99991937', cellData);
|
||||
if (rowData.id === 1) {
|
||||
|
@ -92,47 +67,13 @@ $(document).ready(function(){
|
|||
} else {
|
||||
$(td).html(update_btn + del_btn)
|
||||
}
|
||||
}
|
||||
},
|
||||
{targets: 6,
|
||||
createdCell: function (td, cellData) {
|
||||
if (!cellData) {
|
||||
$(td).html('<i class="fa fa-times text-danger"></i>')
|
||||
} else {
|
||||
$(td).html('<i class="fa fa-check text-navy"></i>')
|
||||
}
|
||||
}
|
||||
},
|
||||
{targets: 2,
|
||||
createdCell: function (td, cellData, rowData) {
|
||||
var detail_btn = '<a href="{% url "users:user-detail" pk=99991937 %}">' + cellData + '</a>';
|
||||
$(td).html(detail_btn.replace('99991937', rowData.id));
|
||||
}
|
||||
}
|
||||
],
|
||||
select: {style: 'multi'},
|
||||
ajax: {
|
||||
url: '{% url "users:user-bulk-update-api" %}',
|
||||
dataSrc: ""
|
||||
},
|
||||
columns: [
|
||||
{data: function(){return ""} },
|
||||
{data: "name" },
|
||||
{data: "username" },
|
||||
{data: "get_role_display" },
|
||||
{data: "group_display" },
|
||||
{data: function(){return 999} },
|
||||
{data: "active_display" },
|
||||
{data: "id" }
|
||||
]
|
||||
});
|
||||
table.on('select', function(e, dt, type, indexes) {
|
||||
var $node = table[ type ]( indexes ).nodes().to$();
|
||||
$node.find('input.ipt_check').prop('checked', true);
|
||||
}).on('deselect', function(e, dt, type, indexes) {
|
||||
var $node = table[ type ]( indexes ).nodes().to$();
|
||||
$node.find('input.ipt_check').prop('checked', false);
|
||||
});
|
||||
}}],
|
||||
ajax_url: '{% url "users:user-bulk-update-api" %}',
|
||||
columns: [{data: function(){return ""}}, {data: "username" }, {data: "name" }, {data: "get_role_display" }, {data: "group_display" },
|
||||
{data: function(){return 999}}, {data: "active_display" }, {data: "id" }],
|
||||
op_html: $('#actions').html()
|
||||
};
|
||||
jumpserver.initDataTable(options);
|
||||
}).on('click', '#btn_bulk_update', function(){
|
||||
var action = $('#slct_bulk_update').val();
|
||||
var $data_table = $('#user_list_table').DataTable()
|
||||
|
|
Loading…
Reference in New Issue