asset:update assets_list by tag

apps/assets/templates/assets/asset_create.html

@@ -44,7 +44,8 @@
             $('.select2').select2();
             $("#tags").select2({
                 tags: true,
-                maximumSelectionLength: 8  //最多能够选择的个数
+                maximumSelectionLength: 8,  //最多能够选择的个数
+                closeOnSelect: false
             });
         })
 

apps/assets/templates/assets/asset_group_create.html

@@ -10,6 +10,7 @@ div.dataTables_wrapper div.dataTables_filter,
 .dataTables_length {
     float: left;
 }
+
 </style>
 {% endblock %}
 {% block content %}
@@ -45,9 +46,15 @@ div.dataTables_wrapper div.dataTables_filter,
                                         <div class="hr-line-dashed"></div>
                                         <h3 class="widget-head-color-box">用户选择的资产</h3>
                                             <div class="form-group">
-                                                <label class="col-sm-2 control-label">已选</label>
+                                                <label class="col-sm-2 control-label" id="asset_on_count">已选（{{ assets_count }}）</label>
                                                 <div class="col-sm-9" id="asset_sed">
-                                                        <input type="text" class=" form-control" id="add_asset" value="{{ assets_count }}">
+                                                    <div class="form-asset-on" id="add_asset">
+                                                        <p id="asset_on_p">
+                                                            {% for asset in assets_on_list %}
+                                                            <button name='asset_hostname' title='{{ asset.ip }}' type='button' class='btn btn-default btn-xs'>{{ asset.hostname }}</button>
+                                                           {% endfor %}
+                                                        </p>
+                                                    </div>
                                                 </div>
                                             </div>
                                         <div class="hr-line-dashed"></div>

apps/assets/templates/assets/asset_list.html

-{% extends 'base.html' %}
-{% load static %}
+{% extends '_base_list.html' %}
 {% load i18n %}
 {% load common_tags %}
 {% block custom_head_css_js %}
-    <link href="{% static "css/plugins/dataTables/dataTables.min.css" %}" rel="stylesheet">
-    <link href="{% static "css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css" %}" rel="stylesheet">
-    <link href="{% static "css/plugins/select2/select2.min.css" %}" rel="stylesheet">
-    <script src="{% static "js/plugins/select2/select2.full.min.js" %}"></script>
-    <script src="{% static "js/plugins/dataTables/dataTables.min.js" %}"></script>
+<style>
+div.dataTables_wrapper div.dataTables_filter,
+.dataTables_length {
+    float: right !important;
+}
+.custom{
+    float:left;
+    margin-right:5px;
+
+    }
+
+</style>
+{% endblock %}
+{% block content_left_head %}
 {% endblock %}
+        {% block table_search %}
+                        {% endblock %}
+{% block tags_list %}
 
-{% block content %}
-<div class="wrapper wrapper-content animated fadeInRight">
-    <div class="row">
-        <div class="col-sm-12">
-            <div class="ibox float-e-margins">
-                <div class="ibox-title">
-                    <div class="ibox-tools">
-                        <div style="float:left">
-                            <a href="{% url 'assets:asset-create' %}" class="btn btn-sm btn-primary "> {% trans "Create asset" %} </a>
-                        </div>
-                        <button class="btn btn-sm btn-primary" id="zksx" onclick="tagShow()">标签</button>
-                            <a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
-                            <a class="dropdown-toggle" data-toggle="dropdown" href="#"><i class="fa fa-wrench"></i></a>
-                            <a class="close-link"><i class="fa fa-times"></i></a>
-                    </div>
-                </div>
-                <div class="ibox-content">
-                    <div class="">
-                       <div class="ydxbd" id="ydxbd" style="display: none;">
+                      <div class="ydxbd" id="ydxbd" style="display: block;">
                            <div>
                                <p id="tags_p">
                                    {% for tag in tag_list %}
@@ -46,13 +39,10 @@
                                </p>
                            </div>
                        </div>
-                        {% block content_left_head %}{% endblock %}
-                        {% block table_search %}{% endblock %}
-                    </div>
-{% block table_container %}
-<table aria-describedby="editable_info" role="grid" class="table table-striped table-bordered table-hover  dataTable" id="editable">
-    <thead>
-        <tr>
+
+{% endblock %}
+
+{% block table_head %}
     <th class="text-center"><input type="checkbox" id="check_all"  onclick="checkAll()"></th>
     <th class="text-center"><a href="{% url 'assets:asset-list' %}?sort=hostname">{% trans 'Hostname' %}</a></th>
     <th class="text-center"><a href="{% url 'assets:asset-list' %}?sort=username">{% trans 'IP' %}</a></th>
@@ -61,13 +51,19 @@
     <th class="text-center">{% trans 'Hardware' %}</th>
     <th class="text-center">{% trans 'Valid' %}</th>
     <th class="text-center"></th>
-        </tr>
-    </thead>
-    <tbody>
+{% endblock %}
+
+{% block table_body %}
      {% for asset in asset_list %}
          <tr class="gradeX"  name="oAssets">
-            <td class="text-center"><input type="checkbox" name="checked" value="{{ asset.id }}"></td>
-            <td class="text-center"><a href="{% url 'assets:asset-detail' pk=asset.id %}">{{ asset.hostname }}</a></td>
+             <td class="text-center">
+                 <input type="checkbox" name="checked" value="{{ asset.id }}">
+             </td>
+             <td class="text-center">
+                 <a href="{% url 'assets:asset-detail' pk=asset.id %}">
+                     {{ asset.hostname }}
+                 </a>
+             </td>
              <td class="text-center">{{ asset.ip }}</td>
              <td class="text-center">{{ asset.port }}</td>
              <td class="text-center">{{ asset.type }}</td>
@@ -85,13 +81,9 @@
              </td>
          </tr>
      {% endfor %}
-    </tbody>
-</table>
 {% endblock %}
-    <div class="row">
-        <div class="col-sm-4">
-            {# Update batch #}
-            {% block content_bottom_left %}
+
+{% block content_bottom_left %}
     <form id="" method="get" action="" class=" mail-search">
         <div class="input-group">
             <select class="form-control m-b" style="width: auto">
@@ -100,24 +92,15 @@
                 <option>{% trans 'Deactive selected' %}</option>
                 <option>{% trans 'Export selected' %}</option>
             </select>
+
             <div class="input-group-btn pull-left" style="padding-left: 5px;">
                 <button id='search_btn' type="submit" style="height: 32px;"  class="btn btn-sm btn-primary">
                  {% trans 'Submit' %}
                 </button>
             </div>
+
         </div>
    </form>
-            {% endblock %}
-        </div>
-            {% block table_pagination %}
-                {% include '_pagination.html' %}
-            {% endblock %}
-    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
 {% endblock %}
 
 {% block custom_foot_js %}
@@ -141,12 +124,17 @@
 
     $(document).ready(function(){
         var table = $('#editable').DataTable({
-            aLengthMenu: [[2, 25, 50, -1], ["2", "25", "50", "all"]],
+            "aLengthMenu": [[10, 25, 50, -1], ["10", "25", "50", "all"]],
+            "iDisplayLength":25,
             "aaSorting": [[7, "asc"]],
             "aoColumnDefs": [ { "bSortable": false, "aTargets": [ 0 ] }],
             "bAutoWidth": false,
-            "language": {
-            "url": "/static/js/plugins/dataTables/i18n/zh-hans.json"
+            "language": {"url": "/static/js/plugins/dataTables/i18n/zh-hans.json"},
+            //"dom": '<lf<t>ip>',
+            "dom": '<"custom">lftip',
+            "initComplete": function() {
+                //alert( 'DataTables has finished its initialisation.' );
+                $('#editable_length').before("<a href=\"{% url 'assets:asset-create' %}\" class=\"btn btn-sm btn-primary custom \"> {% trans 'Create asset' %} </a>&nbsp; <button class='btn btn-sm btn-primary custom' id='zksx' onclick='tagShow()'>标签</button>");
             },
         columns: [
             {data: "checkbox"},

apps/assets/templates/assets/asset_modal_list.html

@@ -50,7 +50,8 @@
 $(document).ready(function(){
 
     var table = $('#editable').DataTable({
-        aLengthMenu: [[2, 25, 50, -1], ["2", "25", "50", "all"]],
+        "aLengthMenu": [[10, 25, 50, -1], ["10", "25", "50", "all"]],
+        "iDisplayLength":25,
         "aaSorting": [[2, "asc"]],
         "aoColumnDefs": [ { "bSortable": false, "aTargets": [ 0 ] }],
         "bAutoWidth": false,
@@ -60,7 +61,7 @@ $(document).ready(function(){
         columns: [
             {data: "checkbox"},
             {data: "id"},
-            {data: "name"},
+            {data: "hostname"},
             {data: "ip"},
             {data: "type"},
             {data: "group"},
@@ -84,17 +85,26 @@ $(document).ready(function(){
     $('#close-btn').on('click',function(){
         $('#modal').modal('hide');
     });
+    var size_name = document.getElementById('asset_on_count').innerText
     $('#save-btn').on('click',function(){
-   // alert( table.rows('.selected').data().length +' row(s) selected' );
+        //alert( table.rows('.selected').data().length +' row(s) selected' );
         var d = table.rows('.selected').data();
         var size = d.length;
+        var re = /\d+/
         document.getElementById('add_asset').value = size;
+        var str= size_name;
+        var re=/\d+/g;
+        document.getElementById('asset_on_count').innerText = str.replace(re, size);
         var column2 = table.rows('.selected').data();
         $("#asset_sed").find("input[name='assets']").remove();
+        $("#asset_sed").find("button[name='asset_hostname']").remove();
         for(var i=0;i<column2.length;i++){
             column2[i].checkbox='<input name="checked" value="1" checked="" type="checkbox">';
             var value = column2[i].id;
+            var ip = column2[i].ip;
+            var hostname = column2[i].hostname;
             $("#asset_sed").append("<input  type='hidden' name='assets' value='"+value+"'>");
+            $("#asset_on_p").append("<button name='asset_hostname' title='"+ip+"' type='button' class='btn btn-default btn-xs ss'>"+hostname+"</button> ");
         }
         $('#modal').modal('hide');
     });

apps/assets/templates/assets/asset_tag_create.html

@@ -42,9 +42,15 @@ div.dataTables_wrapper div.dataTables_filter,
                                         <h3 class="widget-head-color-box">基本信息</h3>
                                         {{ form.name|bootstrap_horizontal }}
                                             <div class="form-group">
-                                                <label class="col-sm-2 control-label">关联的资产</label>
+                                                <label class="col-sm-2 control-label" id="asset_on_count">关联的资产（{{ assets_count }}）</label>
                                                 <div class="col-sm-9" id="asset_sed">
-                                                        <input type="text" class=" form-control" id="add_asset" value="{{ assets_count }}">
+                                                    <div class="form-asset-on" id="add_asset">
+                                                        <p id="asset_on_p">
+                                                            {% for asset in assets_on_list %}
+                                                            <button name='asset_hostname' title='{{ asset.ip}}' type='button' class='btn btn-default btn-xs'>{{ asset.hostname }}</button>
+                                                           {% endfor %}
+                                                        </p>
+                                                    </div>
                                                 </div>
                                             </div>
                                         <div class="form-group">

apps/assets/views.py

@@ -229,11 +229,12 @@ class AssetGroupUpdateView(AdminUserRequiredMixin, UpdateView):
         return super(AssetGroupUpdateView, self).get(request, *args, **kwargs)
 
     def get_context_data(self, **kwargs):
+        assets_all = self.object.assets.all()
         context = {
             'app': _('Assets'),
             'action': _('Create asset group'),
-            # 'assets': Asset.objects.all(),
-            'assets_count': self.object.assets.all().count(),
+            'assets_on_list': assets_all,
+            'assets_count': len(assets_all),
             'group_id':self.object.id,
         }
         kwargs.update(context)
@@ -663,10 +664,12 @@ class AssetTagUpdateView(AdminUserRequiredMixin, UpdateView):
         return super(AssetTagUpdateView, self).get(request, *args, **kwargs)
 
     def get_context_data(self, **kwargs):
+        assets_all = self.object.asset_set.all()
         context = {
             'app': _('Tag'),
             'action': _('Asset Tags detail'),
-            'assets_count': self.object.asset_set.all().count(),
+            'assets_count': len(assets_all),
+            'assets_on_list': assets_all,
             'tag_id':self.object.id,
         }
         kwargs.update(context)

apps/static/css/jumpserver.css

@@ -215,3 +215,20 @@ table.dataTable tbody td.selected td i.text-navy
     margin-left: 3px;
     margin-right: 3px;
 }
+
+.form-asset-on button{
+    background: #f1f1f1;
+    margin-right: 2px;
+}
+.form-asset-on{
+    border: 1px solid #e5e6e7;
+    padding-top:5px;
+    padding-bottom: 0px;
+    padding-left: 5px;
+    padding-right: 5px;
+    min-height:34px;
+    height: 100%;
+}
+.form-asset-on p{
+    margin-bottom:0px;
+}
\ No newline at end of file

apps/templates/_base_list.html

@@ -30,7 +30,7 @@
                     </div>
                 </div>
                 <div class="ibox-content">
-                    <div class="">
+                    <div class="" id="content_start">
                         {% block content_left_head %} {% endblock %}
                         {% block table_search %}
                         <form id="search_form" method="get" action="" class="pull-right mail-search">
@@ -44,6 +44,7 @@
                             </div>
                         </form>
                         {% endblock %}
+                        {% block tags_list %}{% endblock %}
                     </div>
                     {% block table_container %}
                     <table class="table table-striped table-bordered table-hover " id="editable" >