From 2645c398feef1019f5a0ab2741d7ffe7729b63f4 Mon Sep 17 00:00:00 2001
From: gifrerenom <lluis.gifre@cttc.es>
Date: Fri, 27 Jan 2023 17:09:25 +0000
Subject: [PATCH] WebUI component:
- Device List: show number of endpoints instead of detail
- Device List: show number of rules
- Remove UUIDs from topology elements
- Service List: add service name
- Service Details: add service name
- Slice List: add slice name
- Slice Details: add slice name
---
src/webui/service/templates/device/home.html | 44 +++++--------------
src/webui/service/templates/js/topology.js | 4 +-
.../service/templates/service/detail.html | 3 +-
src/webui/service/templates/service/home.html | 6 ++-
src/webui/service/templates/slice/detail.html | 3 +-
src/webui/service/templates/slice/home.html | 9 ++--
6 files changed, 25 insertions(+), 44 deletions(-)
diff --git a/src/webui/service/templates/device/home.html b/src/webui/service/templates/device/home.html
index 7b4437cce..ef4345b36 100644
--- a/src/webui/service/templates/device/home.html
+++ b/src/webui/service/templates/device/home.html
@@ -48,7 +48,7 @@
<th scope="col">Endpoints</th>
<th scope="col">Drivers</th>
<th scope="col">Status</th>
- <!-- <th scope="col">Configuration</th> -->
+ <th scope="col">Config Rules</th>
<th scope="col"></th>
</tr>
</thead>
@@ -56,40 +56,16 @@
{% if devices %}
{% for device in devices %}
<tr>
- <td>
- {{ device.device_id.device_uuid.uuid }}
- </td>
- <td>
- {{ device.name }}
- </td>
- <td>
- {{ device.device_type }}
- </td>
- <td>
- <ul>
- {% for end_point in device.device_endpoints %}
- <li>{{ end_point.endpoint_id.endpoint_uuid.uuid }}</li>
- {% endfor %}
- </ul>
- </td>
- <td>
- <ul>
- {% for driver in device.device_drivers %}
- <li>{{ dde.Name(driver).replace('DEVICEDRIVER_', '').replace('UNDEFINED', 'EMULATED') }}</li>
- {% endfor %}
- </ul>
- </td>
+ <td>{{ device.device_id.device_uuid.uuid }}</td>
+ <td>{{ device.name }}</td>
+ <td>{{ device.device_type }}</td>
+ <td>{{ device.device_endpoints | length }}</td>
+ <td><ul>{% for driver in device.device_drivers %}
+ <li>{{ dde.Name(driver).replace('DEVICEDRIVER_', '').replace('UNDEFINED', 'EMULATED') }}</li>
+ {% endfor %}
+ </ul></td>
<td>{{ dose.Name(device.device_operational_status).replace('DEVICEOPERATIONALSTATUS_', '') }}</td>
- <!-- <td>
- <ul>
- {% for config in device.device_config.config_rules %}
- <li>
- Key: {{ config.resource_key }}<br/>
- Value: {{ config.resource_value }}
- </li>
- {% endfor %}
- </ul>
- </td> -->
+ <td>{{ device.device_config.config_rules | length }}</td>
<td>
<a href="{{ url_for('device.detail', device_uuid=device.device_id.device_uuid.uuid) }}">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye" viewBox="0 0 16 16">
diff --git a/src/webui/service/templates/js/topology.js b/src/webui/service/templates/js/topology.js
index adcabf62c..47c246614 100644
--- a/src/webui/service/templates/js/topology.js
+++ b/src/webui/service/templates/js/topology.js
@@ -88,9 +88,9 @@ d3.json("{{ url_for('main.topology') }}", function(data) {
.call(d3.drag().on("start", dragstarted).on("drag", dragged).on("end", dragended));
// node tooltip
- node.append("title").text(function(n) { return n.name + ' (' + n.id + ')'; });
+ node.append("title").text(function(n) { return n.name; });
// link tooltip
- link.append("title").text(function(l) { return l.name + ' (' + l.id + ')'; });
+ link.append("title").text(function(l) { return l.name; });
// link style
link
diff --git a/src/webui/service/templates/service/detail.html b/src/webui/service/templates/service/detail.html
index 67b240b3d..e8d3a4221 100644
--- a/src/webui/service/templates/service/detail.html
+++ b/src/webui/service/templates/service/detail.html
@@ -17,7 +17,7 @@
{% extends 'base.html' %}
{% block content %}
-<h1>Service {{ service.service_id.service_uuid.uuid }}</h1>
+<h1>Service {{ service.name }} ({{ service.service_id.service_uuid.uuid }})</h1>
<div class="row mb-3">
<div class="col-sm-3">
@@ -45,6 +45,7 @@
<div class="col-sm-4">
<b>Context: </b> {{ service.service_id.context_id.context_uuid.uuid }}<br>
<b>UUID: </b> {{ service.service_id.service_uuid.uuid }}<br>
+ <b>Name: </b> {{ service.name }}<br>
<b>Type: </b> {{ ste.Name(service.service_type).replace('SERVICETYPE_', '') }}<br>
<b>Status: </b> {{ sse.Name(service.service_status.service_status).replace('SERVICESTATUS_', '') }}<br>
</div>
diff --git a/src/webui/service/templates/service/home.html b/src/webui/service/templates/service/home.html
index c0a01839b..280685fc5 100644
--- a/src/webui/service/templates/service/home.html
+++ b/src/webui/service/templates/service/home.html
@@ -43,7 +43,8 @@
<table class="table table-striped table-hover">
<thead>
<tr>
- <th scope="col">#</th>
+ <th scope="col">UUID</th>
+ <th scope="col">Name</th>
<th scope="col">Type</th>
<th scope="col">End points</th>
<th scope="col">Status</th>
@@ -59,6 +60,9 @@
{{ service.service_id.service_uuid.uuid }}
<!-- </a> -->
</td>
+ <td>
+ {{ service.name }}
+ </td>
<td>
{{ ste.Name(service.service_type).replace('SERVICETYPE_', '') }}
</td>
diff --git a/src/webui/service/templates/slice/detail.html b/src/webui/service/templates/slice/detail.html
index 404dede39..4f26c75a5 100644
--- a/src/webui/service/templates/slice/detail.html
+++ b/src/webui/service/templates/slice/detail.html
@@ -17,7 +17,7 @@
{% extends 'base.html' %}
{% block content %}
-<h1>Slice {{ slice.slice_id.slice_uuid.uuid }} </h1>
+<h1>Slice {{ slice.name }} ({{ slice.slice_id.slice_uuid.uuid }}) </h1>
<div class="row mb-3">
<div class="col-sm-3">
@@ -46,6 +46,7 @@
<div class="col-sm-4">
<b>Context: </b> {{ slice.slice_id.context_id.context_uuid.uuid }}<br>
<b>UUID: </b> {{ slice.slice_id.slice_uuid.uuid }}<br>
+ <b>Name: </b> {{ slice.name }}<br>
<b>Owner: </b> {{ slice.slice_owner.owner_uuid.uuid }}<br>
<b>Status: </b> {{ sse.Name(slice.slice_status.slice_status).replace('SLICESTATUS_', '') }}<br>
</div>
diff --git a/src/webui/service/templates/slice/home.html b/src/webui/service/templates/slice/home.html
index 46a2b4f1a..141234aca 100644
--- a/src/webui/service/templates/slice/home.html
+++ b/src/webui/service/templates/slice/home.html
@@ -31,20 +31,19 @@
<table class="table table-striped table-hover">
<thead>
<tr>
- <th scope="col">#</th>
+ <th scope="col">UUID</th>
+ <th scope="col">Name</th>
<th scope="col">End points</th>
<th scope="col">Status</th>
<th scope="col"></th>
-
</tr>
</thead>
<tbody>
{% if slices %}
{% for slice in slices %}
<tr>
- <td>
- {{ slice.slice_id.slice_uuid.uuid }}
- </td>
+ <td>{{ slice.slice_id.slice_uuid.uuid }}</td>
+ <td>{{ slice.name }}</td>
<td>
<ul>
{% for i in range(slice.slice_endpoint_ids|length) %}
--
GitLab