packagehandler/template/package_list.html

   1 {% extends "project_descriptors.html" %}
   2 {% load staticfiles %}
   3
   4
   5 {% block head_block %}
   6         {{ block.super }}
   7 <link rel="stylesheet" href="/static/bower_components/select2/dist/css/select2.min.css">
   8 {% endblock %}
   9
  10 {% block title_header_big %}
  11     {{ block.super }}
  12   {% if package_type  %}
  13      {{ package_type|upper }}
  14   {% else%}
  15     Undefined
  16   {% endif %} Packages
  17 {% endblock %}
  18
  19 {% block left_sidebar %}
  20     {% include 'osm/osm_project_left_sidebar.html' %}
  21 {% endblock %}
  22
  23 {% block breadcrumb_body %}
  24         {{ block.super }}
  25     <li><a href="{% url 'projects:open_project' %}">{{project_id}}</a></li>
  26     <li><a> {% if package_type  %}
  27      {{ package_type }}
  28   {% else%}
  29     Undefined
  30   {% endif %} Packages</a></li>
  31
  32 {% endblock %}
  33
  34 {% block content_body %}
  35         {{ block.super }}
  36 {% include 'osm/modal/files_list.html' %}
  37 {% include 'modal/instance_create.html' %}
  38 {% include 'modal/choose_package_name.html' %}
  39 <div class="row">
  40     {% if package_type == 'ns' %}
  41         {% include "package_list_ns.html" %}
  42     {% elif package_type == 'vnf' %}
  43         {% include "package_list_vnf.html" %}
  44     {% endif %}
  45
  46 </div>
  47 {% endblock %}
  48
  49
  50 {% block resource_block %}
  51         {{ block.super }}
  52      <script src="/static/bower_components/select2/dist/js/select2.js"></script>
  53     <script src="/static/src/instancehandler/instance_create.js"></script>
  54     <script src="/static/src/packagehandler/packages_list.js"></script>
  55     <script src="/static/src/drop_zone.js"></script>
  56     <script src="/static/src/packagehandler/onboard_package.js"></script>
  57
  58     <script>
  59     var csrf_token = '{{csrf_token}}';
  60     var descr_list_url = '{% url "packages:list_packages"   package_type=package_type%}';
  61     var new_desc_url = '{% url "packages:onboard_package"   package_type=package_type%}'
  62     var vim_list_url = '{% url "vims:list"  %}';
  63     var package_type = '{{ package_type | safe }}';
  64     var project_id = '{{ project_id }}';
  65     var table;
  66     var row_builder = {
  67         'ns': [
  68                 {
  69                     "render": function (data, type, row) {
  70                        return row['short-name'] || '';
  71                     },
  72                     "targets": 0
  73                 },
  74                 {
  75                     "render": function (data, type, row) {
  76                        return row['_id'];
  77                     },
  78                     "targets": 1
  79                 },
  80                 {
  81                     "render": function (data, type, row) {
  82                        return row['description'] || '';
  83                     },
  84                     "targets": 2
  85                 },
  86                 {
  87                     "render": function (data, type, row) {
  88                        return row['vendor'] || '';
  89                     },
  90                     "targets": 3
  91                 },
  92                 {
  93                     "render": function (data, type, row) {
  94                        return row['version'] || '';
  95                     },
  96                     "targets": 4
  97                 },
  98                 {
  99                     "render": function (data, type, row) {
 100                        var result = '<div class="btn-group">\n' ;
 101
 102                            result += '    <button type="button" class="btn btn-default" data-container="body"\n' +
 103                                'data-toggle="tooltip" data-placement="top" title="Instantiate NS"\n' +
 104                                'onclick="javascript:openModalCreateNS({ \'project_id\':\'' + project_id +'\', \'package_type\': \''+ package_type +'\', \'descriptor_name\':\''+row["name"]+'\', \'descriptor_id\':\''+row["_id"]+'\',\'vim_list_url\': \''+vim_list_url+'\',  \'nsd_list_url\': \''+descr_list_url+'\' })">\n' +
 105                                '<i class="fa fa-paper-plane"></i></button>\n';
 106                         result += '<button type="button" class="btn btn-default" data-container="body"\n' +
 107                            '        data-toggle="tooltip" data-placement="top" title="Edit"\n' +
 108                            '        onclick="javascript:openDescriptorView(\'nsd\', \''+row["_id"]+'\')">\n' +
 109                            '    <i class="fa fa-edit"></i></button>\n' +
 110                            '<button type="button" class="btn btn-default" data-container="body"\n' +
 111                            '        data-toggle="tooltip" data-placement="top" title="Show content"\n' +
 112                            '        onclick="javascript:openPackageContentList(\''+ package_type +'\', \''+row["_id"]+'\')">\n' +
 113                            '    <i class="fa fa-folder-open"></i></button>\n' +
 114                             '<button type="button" class="btn btn-default" data-container="body"\n' +
 115                            '        data-toggle="tooltip" data-placement="top" title="Clone"\n' +
 116                            '        onclick="javascript:clonePackage(\''+ package_type +'\', \''+row["_id"]+'\')">\n' +
 117                            '    <i class="fa fa-clone"></i></button>\n';
 118                            result += '<button type="button" class="btn btn-default" data-container="body"\n' +
 119                            '        data-toggle="tooltip" data-placement="top" title="Show Graph"\n' +
 120                            '  onclick="location.href=\'/projects/descriptors/composer?type=nsd&id='+row["_id"] +'\'"\n' +
 121                            '        ><i class="fa fa-sitemap fa-fw"></i></button>\n';
 122                         result +=
 123                            '<button type="button" class="btn btn-default" data-container="body"\n' +
 124                            '        data-toggle="tooltip" data-placement="top" title="Download package"\n' +
 125                            '        onclick="location.href=\'/packages/'+package_type+'/'+ row["_id"] +'/download\'">\n' +
 126                            '    <i class="fa fa-download fa-fw"></i></button>\n' +
 127                            '<button type="button" class="btn btn-default" data-container="body"\n' +
 128                            '        data-toggle="tooltip" data-placement="top" title="Delete"\n' +
 129                            '        onclick="javascript:deletePackage( \'' + package_type + '\', \''+row["_id"] + '\', \''+row["name"] + '\')">\n' +
 130                            '    <i class="far fa-trash-alt"></i></button>\n' +
 131                            '</div>';
 132
 133                                return result
 134                     },
 135                     "targets": 5,
 136                     "orderable": false
 137                 }],
 138         'vnf': [
 139                 {
 140                     "render": function (data, type, row) {
 141                        return row['short-name'] || '';
 142                     },
 143                     "targets": 0
 144                 },
 145                 {
 146                     "render": function (data, type, row) {
 147                        return row['_id'];
 148                     },
 149                     "targets": 1
 150                 },
 151                 {
 152                     "render": function (data, type, row) {
 153                        return row['_admin']['type'] || '';
 154                     },
 155                     "targets": 2,
 156                     "orderable": false
 157                 },
 158                 {
 159                     "render": function (data, type, row) {
 160                        return row['description'] || '';
 161                     },
 162                     "targets": 3
 163                 },
 164                 {
 165                     "render": function (data, type, row) {
 166                        return row['vendor'] || '';
 167                     },
 168                     "targets": 4
 169                 },
 170                 {
 171                     "render": function (data, type, row) {
 172                        return row['version'] || '';
 173                     },
 174                     "targets": 5
 175                 },
 176                 {
 177                     "render": function (data, type, row) {
 178                        var result = '<div class="btn-group">\n' ;
 179                         result += '<button type="button" class="btn btn-default" data-container="body"\n' +
 180                            '        data-toggle="tooltip" data-placement="top" title="Edit"\n' +
 181                            '        onclick="javascript:openDescriptorView(\'vnfd\', \''+row["_id"]+'\')">\n' +
 182                            '    <i class="fa fa-edit"></i></button>\n' +
 183                            '<button type="button" class="btn btn-default" data-container="body"\n' +
 184                            '        data-toggle="tooltip" data-placement="top" title="Show content"\n' +
 185                            '        onclick="javascript:openPackageContentList(\''+ package_type +'\', \''+row["_id"]+'\')">\n' +
 186                            '    <i class="fa fa-folder-open"></i></button>\n' +
 187                             '<button type="button" class="btn btn-default" data-container="body"\n' +
 188                            '        data-toggle="tooltip" data-placement="top" title="Clone"\n' +
 189                            '        onclick="javascript:clonePackage(\''+ package_type +'\', \''+row["_id"]+'\')">\n' +
 190                            '    <i class="fa fa-clone"></i></button>\n';
 191                            result += '<button type="button" class="btn btn-default" data-container="body"\n' +
 192                            '        data-toggle="tooltip" data-placement="top" title="Show Graph"\n' +
 193                            '  onclick="location.href=\'/projects/descriptors/composer?type=vnfd&id='+row["_id"] +'\'"\n' +
 194                            '        ><i class="fa fa-sitemap fa-fw"></i></button>\n';
 195                         result +=
 196                            '<button type="button" class="btn btn-default" data-container="body"\n' +
 197                            '        data-toggle="tooltip" data-placement="top" title="Download package"\n' +
 198                            '        onclick="location.href=\'/packages/'+package_type+'/'+ row["_id"] +'/download\'">\n' +
 199                            '    <i class="fa fa-download fa-fw"></i></button>\n' +
 200                            '<button type="button" class="btn btn-default" data-container="body"\n' +
 201                            '        data-toggle="tooltip" data-placement="top" title="Delete"\n' +
 202                            '        onclick="javascript:deletePackage( \'' + package_type + '\', \''+row["_id"] + '\', \''+row["name"] + '\')">\n' +
 203                            '    <i class="far fa-trash-alt"></i></button>\n' +
 204                            '</div>';
 205
 206                                return result
 207                     },
 208                     "targets": 6,
 209                     "orderable": false
 210                 }
 211             ]
 212     };
 213     function refreshTable() {
 214         var type_vnf = $('#type_vnf').val()
 215         var url = (type_vnf && type_vnf !== '') ? ("/packages/" +package_type+"/list?type="+type_vnf) : ("/packages/" +package_type+"/list")
 216         table.ajax.url(url);
 217         table.ajax.reload();
 218     }
 219
 220     $(document).ready( function () {
 221         table = $('#descriptors_table').DataTable({
 222             responsive: true,
 223             "ajax": {
 224                 "url": "/packages/" +package_type+"/list",
 225                 "dataSrc": function (json) {
 226                     return json['descriptors'];
 227                 },
 228                 statusCode: {
 229                     401: function () {
 230                         console.log("no auth");
 231                         moveToLogin(window.location.pathname);
 232                     }
 233                 },
 234                 "error": function (hxr, error, thrown) {
 235
 236                 }
 237
 238             },
 239             "columns": row_builder[package_type]
 240
 241         });
 242
 243         setInterval(refreshTable, 10000);
 244
 245
 246         $("#formCreatePackage").submit(function (event) {
 247                 event.preventDefault(); //prevent default action
 248                 var post_url = $(this).attr("action"); //get form action url
 249                 var request_method = $(this).attr("method");
 250                 var form_data = new FormData(this); //Encode form elements for submission
 251
 252                 $.ajax({
 253                     url: post_url,
 254                     type: request_method,
 255                     data: form_data,
 256                     headers: {
 257                         "Accept": 'application/json'
 258                     },
 259                     contentType: false,
 260                     processData: false
 261                 }).done(function (response, textStatus, jqXHR) {
 262                     var map = {
 263                         ns: 'nsd',
 264                         vnf: 'vnfd'
 265                     };
 266                     location.href='/projects/descriptors/composer?type=' + map[response['data']['type']]+'&id=' + response['data']['id'];
 267                 }).fail(function (result) {
 268                     var data = result.responseJSON;
 269                     var title = "Error " + (data.code ? data.code : 'unknown');
 270                     var message = data.detail ? data.detail : 'No detail available.';
 271                     bootbox.alert({
 272                         title: title,
 273                         message: message
 274                     });
 275                 });
 276             });
 277     });
 278
 279     $(document).on('change', '#type_vnf', function(){
 280         refreshTable();
 281     });
 282     </script>
 283
 284
 285 {% endblock %}
 286
 287 {% block footer %}
 288     {% include "footer.html"  %}
 289 {% endblock %}