github
/
jumpserver
mirror of https://github.com/jumpserver/jumpserver
1
0
Fork 0
Code Issues Releases Wiki Activity
Browse Source

增加隐藏树功能

pull/1043/head
q4speed 7 years ago
parent
1f3b11a223
commit
66b8e8bcf8
3 changed files with 213 additions and 124 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 28
      apps/assets/templates/assets/asset_list.html
  2. 28
      apps/perms/templates/perms/asset_permission_list.html
  3. 281
      apps/static/css/jumpserver.css

28
apps/assets/templates/assets/asset_list.html
Unescape View File

@ -35,7 +35,7 @@
{% block content %}
<div class="wrapper wrapper-content">
<div class="row">
<div class="col-lg-3">
<div class="col-lg-3" id="split-left">
<div class="ibox float-e-margins">
<div class="ibox-content mailbox-content" style="padding-top: 0">
<div class="file-manager ">
@ -47,7 +47,12 @@
</div>
</div>
</div>
<div class="col-lg-9 animated fadeInRight">
<div class="col-lg-9 animated fadeInRight" id="split-right">
<div class="tree-toggle">
<div class="btn btn-sm btn-primary tree-toggle-btn" onclick="toggle()">
<i class="fa fa-angle-left fa-2x" id="toggle-icon"></i>
</div>
</div>
<div class="mail-box-header">
<div class="uc pull-left m-r-5"><a class="btn btn-sm btn-primary btn-create-asset"> {% trans "Create asset" %} </a></div>
<div class="html5buttons">
@ -68,7 +73,7 @@
{% endfor %}
</ul>
</div>
<table class="table table-striped table-bordered table-hover " id="asset_list_table" >
<table class="table table-striped table-bordered table-hover " id="asset_list_table" style="width: 100%">
<thead>
<tr>
<th class="text-center"><input type="checkbox" class="ipt_check_all"></th>
@ -122,7 +127,7 @@
{% block custom_foot_js %}
<script>
var zTree, rMenu, asset_table;
var zTree, rMenu, asset_table, show = 0;
function initTable() {
var options = {
ele: $('#asset_list_table'),
@ -339,6 +344,21 @@ function initTree() {
});
}
function toggle() {
if (show === 0) {
$("#split-left").hide(500, function () {
$("#split-right").attr("class", "col-lg-12");
$("#toggle-icon").attr("class", "fa fa-angle-right fa-2x");
show = 1;
});
} else {
$("#split-right").attr("class", "col-lg-9");
$("#toggle-icon").attr("class", "fa fa-angle-left fa-2x");
$("#split-left").show(500);
show = 0;
}
}
$(document).ready(function(){
initTable();
initTree();

28
apps/perms/templates/perms/asset_permission_list.html
Unescape View File

@ -35,7 +35,7 @@
{% block content %}
<div class="wrapper wrapper-content">
<div class="row">
<div class="col-lg-3">
<div class="col-lg-3" id="split-left">
<div class="ibox float-e-margins">
<div class="ibox-content mailbox-content" style="padding-top: 0">
<div class="file-manager ">
@ -46,14 +46,19 @@
</div>
</div>
</div>
<div class="col-lg-9 animated fadeInRight">
<div class="col-lg-9 animated fadeInRight" id="split-right">
<div class="tree-toggle">
<div class="btn btn-sm btn-primary tree-toggle-btn" onclick="toggle()">
<i class="fa fa-angle-left fa-2x" id="toggle-icon"></i>
</div>
</div>
<div class="mail-box-header">
<div class="uc pull-left m-r-5">
<a class="btn btn-sm btn-primary btn-create-permission">
{% trans "Create permission" %}
</a>
</div>
<table class="table table-striped table-bordered table-hover" id="permission_list_table" >
<table class="table table-striped table-bordered table-hover" id="permission_list_table" style="width: 100%">
<thead>
<tr>
<th class="text-center">
@ -79,7 +84,7 @@
{% block custom_foot_js %}
<script>
var zTree, rMenu, table;
var zTree, rMenu, table, show = 0;
function initTable() {
var options = {
ele: $('#permission_list_table'),
@ -191,6 +196,21 @@ function initTree() {
});
}
function toggle() {
if (show === 0) {
$("#split-left").hide(500, function () {
$("#split-right").attr("class", "col-lg-12");
$("#toggle-icon").attr("class", "fa fa-angle-right fa-2x");
show = 1;
});
} else {
$("#split-right").attr("class", "col-lg-9");
$("#toggle-icon").attr("class", "fa fa-angle-left fa-2x");
$("#split-left").show(500);
show = 0;
}
}
$(document).ready(function(){
initTable();
initTree();

281
apps/static/css/jumpserver.css
Unescape View File

@ -3,258 +3,295 @@
}
.form-group.required .control-label:after {
content: " *";
color: red;
content: " *";
color: red;
}
.n-invalid {border: 1px solid #f00;}
.n-invalid {
border: 1px solid #f00;
}
.primary-panel .ibox-title {
color: #ffffff;
background-color: #1AB394;
color: #ffffff;
background-color: #1AB394;
}
.primary-panel .ibox-content {
border: 1px solid #1AB394;
border: 1px solid #1AB394;
}
.info-panel .ibox-title {
color: #ffffff;
background-color: #23c6c8;
color: #ffffff;
background-color: #23c6c8;
}
.info-panel .ibox-content {
border: 1px solid #23c6c8;;
border: 1px solid #23c6c8;;
}
th a {
color: #676a6c;
color: #676a6c;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: #d2d2d2 !important;
color: #333 !important;
}
background-color: #d2d2d2 !important;
color: #333 !important;
}
.select2-selection--single,
.select2-selection--multiple {
border: 1px solid #e5e6e7 !important;
cursor: text !important;
}
border: 1px solid #e5e6e7 !important;
cursor: text !important;
}
.select2-container--forcus {
border: 1px solid #1AB394 !important;
}
border: 1px solid #1AB394 !important;
}
.select2-selection__choice,
.chosen-container-multi .chosen-choices li.search-choice {
background: #f1f1f1 !important;
border: 1px solid #e5e6e7 !important;
/*border: 1px solid #ededed;*/
border-radius: 2px !important;
box-shadow: none !important;
color: #333333 !important;
cursor: default !important;
line-height: 13px !important;
/*margin: 3px 0 3px 5px !important;*/
padding: 3px 20px 3px 5px !important;
position: relative !important;
}
background: #f1f1f1 !important;
border: 1px solid #e5e6e7 !important;
/*border: 1px solid #ededed;*/
border-radius: 2px !important;
box-shadow: none !important;
color: #333333 !important;
cursor: default !important;
line-height: 13px !important;
/*margin: 3px 0 3px 5px !important;*/
padding: 3px 20px 3px 5px !important;
position: relative !important;
}
.select2-container--default.select2-container--focus .select2-selection--multiple {
border: 1px solid #1ab394 !important;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3) !important;
border: 1px solid #1ab394 !important;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3) !important;
}
.passwordBox2 {
max-width: 660px;
margin: 0 auto;
padding: 100px 20px 20px 20px;
max-width: 660px;
margin: 0 auto;
padding: 100px 20px 20px 20px;
}
.no-borders-tr td {
border-top: none !important;
border-top: none !important;
}
table.dataTable tbody > tr.selected, table.dataTable tbody > tr > .selected {
background-color: #1ab394 !important;
}
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
{
table.dataTable tbody td.selected td i.text-navy {
color: white !important;
}
.m-0 {
margin: 0px !important;
margin: 0px !important;
}
.m-t-0 {
margin-top: 0px !important;
margin-top: 0px !important;
}
.m-b-0 {
margin-bottom: 0px !important;
margin-bottom: 0px !important;
}
.m-l-0 {
margin-left: 0px !important;
margin-left: 0px !important;
}
.m-r-0 {
margin-right: 0px !important;
margin-right: 0px !important;
}
.m-5 {
margin: 5px !important;
margin: 5px !important;
}
.m-t-5 {
margin-top: 5px !important;
margin-top: 5px !important;
}
.m-b-5 {
margin-bottom: 5px !important;
margin-bottom: 5px !important;
}
.m-l-5 {
margin-left: 5px !important;
margin-left: 5px !important;
}
.m-r-5 {
margin-right: 5px !important;
margin-right: 5px !important;
}
.m-10 {
margin: 10px !important;
margin: 10px !important;
}
.m-t-10 {
margin-top: 10px !important;
margin-top: 10px !important;
}
.m-b-10 {
margin-bottom: 10px !important;
margin-bottom: 10px !important;
}
.m-l-10 {
margin-left: 10px !important;
margin-left: 10px !important;
}
.m-r-10 {
margin-right: 10px !important;
margin-right: 10px !important;
}
.m-15 {
margin: 15px !important;
margin: 15px !important;
}
.m-t-15 {
margin-top: 15px !important;
margin-top: 15px !important;
}
.m-b-15 {
margin-bottom: 15px !important;
margin-bottom: 15px !important;
}
.m-l-15 {
margin-left: 15px !important;
margin-left: 15px !important;
}
.m-r-15 {
margin-right: 15px !important;
margin-right: 15px !important;
}
.m-20 {
margin: 20px !important;
margin: 20px !important;
}
.m-t-20 {
margin-top: 20px !important;
margin-top: 20px !important;
}
.m-b-20 {
margin-bottom: 20px !important;
margin-bottom: 20px !important;
}
.m-l-20 {
margin-left: 20px !important;
margin-left: 20px !important;
}
.m-r-20 {
margin-right: 20px !important;
margin-right: 20px !important;
}
.m-25 {
margin: 25px !important;
margin: 25px !important;
}
.m-t-25 {
margin-top: 25px !important;
margin-top: 25px !important;
}
.m-b-25 {
margin-bottom: 25px !important;
margin-bottom: 25px !important;
}
.m-l-25 {
margin-left: 25px !important;
margin-left: 25px !important;
}
.m-r-25 {
margin-right: 25px !important;
margin-right: 25px !important;
}
.m-30 {
margin: 30px !important;
margin: 30px !important;
}
.m-t-30 {
margin-top: 30px !important;
margin-top: 30px !important;
}
.m-b-30 {
margin-bottom: 30px !important;
margin-bottom: 30px !important;
}
.m-l-30 {
margin-left: 30px !important;
margin-left: 30px !important;
}
.m-r-30 {
margin-right: 30px !important;
margin-right: 30px !important;
}
.ydxbd {
font-size: 12px;
width: 100%;
overflow: hidden;
padding-top: 15px;
margin-bottom: 15px;
display: block;
background: #f4f4f4;
padding-left: 10px;
padding-bottom: 15px;
font-size: 12px;
width: 100%;
overflow: hidden;
padding-top: 15px;
margin-bottom: 15px;
display: block;
background: #f4f4f4;
padding-left: 10px;
padding-bottom: 15px;
}
.mar {
margin-left: 2px;
line-height: 0px;
}
.mar-j {
margin-left: 3px;
margin-right: 3px;
}
.form-asset-on p{
margin-bottom:0px;
.form-asset-on p {
margin-bottom: 0px;
}
.form-asset-on button{
.form-asset-on button {
background: #f1f1f1;
margin-right: 2px;
}
.form-asset-on{
.form-asset-on {
border: 1px solid #e5e6e7;
padding-top:5px;
padding-top: 5px;
padding-bottom: 0px;
padding-left: 5px;
padding-right: 5px;
min-height:34px;
min-height: 34px;
height: 100%;
}
.mgl-5 {
margin-left: 5px;
font-size: 12px;
margin-left: 5px;
font-size: 12px;
}
.c02 {
color: #999;
color: #999;
}
.tagBtnList {
font-size: 12px;
line-height: 32px;
margin: -5px 0 0 0;
padding-left: 0px;
font-size: 12px;
line-height: 32px;
margin: -5px 0 0 0;
padding-left: 0px;
}
.tagBtn2 {
margin: 0 5px 5px 0;
font-size: 12px;
vertical-align: middle;
margin: 0 5px 5px 0;
font-size: 12px;
vertical-align: middle;
}
div.dataTables_wrapper div.dataTables_filter,
@ -267,18 +304,18 @@ div.dataTables_wrapper div.dataTables_filter {
}
.simple-tag {
background-color: #f3f3f4;
border: 1px solid #e7eaec;
border-radius: 2px;
color: inherit;
display: inline-block;
font-size: 10px;
margin-right: 5px;
margin-top: 5px;
padding: 5px 12px;
}
#op.col-md-6{
background-color: #f3f3f4;
border: 1px solid #e7eaec;
border-radius: 2px;
color: inherit;
display: inline-block;
font-size: 10px;
margin-right: 5px;
margin-top: 5px;
padding: 5px 12px;
}
#op.col-md-6 {
padding-left: 0;
}
@ -286,7 +323,7 @@ div.dataTables_wrapper div.dataTables_filter {
padding-left: 10px;
font-size: 12px;
line-height: 18px;
margin-bottom:0;
margin-bottom: 0;
margin-left: 10px;
margin-right: 10px
}
@ -349,7 +386,7 @@ div.dataTables_wrapper div.dataTables_filter {
border-radius: 5px 5px 0 0;
}
.popover{
.popover {
padding: 9px 14px;
position: absolute;
top: 0;
@ -357,7 +394,7 @@ div.dataTables_wrapper div.dataTables_filter {
z-index: 1060;
display: none;
max-width: 276px;
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
font-style: normal;
font-weight: 400;
@ -374,7 +411,19 @@ div.dataTables_wrapper div.dataTables_filter {
background-clip: padding-box;
border: 1px solid #ccc;
border-radius: 6px;
box-shadow: 0 5px 10px rgba(0,0,0,.2);
box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
line-break: auto;
}
.tree-toggle {
position: absolute;
left: 0;
top: 1px;
height: 100%;
}
.tree-toggle-btn {
width: 12px;
text-align: center;
padding: 5px 0;
}

Write Preview
Loading…
Cancel
Save