Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

frontend: Add dashboard templates, version 0.1.0 without server functionality #40

Closed
wants to merge 26 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
26 commits
Select commit Hold shift + click to select a range
baa5d47
frontend: Add dashboard templates, temp-endpoint
Kappuccino111 Jun 27, 2024
65f0db9
License Page Addition
Kappuccino111 Jul 3, 2024
2132a49
Merge branch 'origin/main' into frontend
Kappuccino111 Jul 31, 2024
9a7c307
Integrate new API from main with prev frontend PR
Kappuccino111 Jul 31, 2024
a13bd95
Finish all previous frontend changes
Kappuccino111 Aug 1, 2024
07ad587
Update all necessary files for release 0.1.0
Kappuccino111 Aug 4, 2024
2cdfc4d
Basic Update
Kappuccino111 Aug 4, 2024
3a81ed1
Update all instances of FlowNexus to flownexus
Kappuccino111 Jul 31, 2024
49c7f09
Update leftover instances of Flow Nexus
Kappuccino111 Jul 31, 2024
9e4256e
doc: build: fix west init command and align with workspace format
jonas-rem Aug 2, 2024
2aab1d9
doc: replace lwm2m_server
jonas-rem Aug 2, 2024
b1ad2bc
firmware: extend lwm2m client demo with temp/hum
jonas-rem Aug 3, 2024
660ad50
leshan: add observations to status, result fields of the update obj
jonas-rem Jul 31, 2024
f727398
django: enable execute send request
jonas-rem Jul 31, 2024
682b44e
django: fix error in resource types
jonas-rem Jul 31, 2024
a71b095
django: enable firmware update
jonas-rem Jul 31, 2024
9e9e484
django: db model: add migrations for FirmwareUpdate list
jonas-rem Jul 31, 2024
f6254ff
doc: document the OTA process
jonas-rem Jul 31, 2024
71228ac
doc: document ota updates
jonas-rem Aug 3, 2024
f2bbd3e
west: import all modules from zephyr
jonas-rem Aug 3, 2024
35bbb3a
simulate: DL_SERVER: Add new KConfig symbol for DL Server URL
jonas-rem Aug 3, 2024
3858ddb
simulation: lwm2m_client: revise sample
jonas-rem Aug 3, 2024
14b213d
Simulate: Add TLS support to the firmware per default
jonas-rem Aug 3, 2024
ba57a5f
File formatting for views.py
Kappuccino111 Aug 4, 2024
8fd1b76
Merge branch 'main' into frontend
Kappuccino111 Aug 4, 2024
58d6654
Fix all failing tests
Kappuccino111 Aug 4, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
from rest_framework import serializers
from ..models import Resource
from drf_spectacular.utils import extend_schema_field

class GenericResourceSerializer(serializers.ModelSerializer):
resource_type = serializers.CharField(source='resource_type.name', read_only=True)
value = serializers.SerializerMethodField()

class Meta:
model = Resource
fields = ['timestamp_created', 'value', 'resource_type']

@extend_schema_field(serializers.FloatField)
def get_value(self, obj) -> float:
return obj.get_value()
18 changes: 18 additions & 0 deletions server/django/sensordata/templates/admin_dashboard.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
{% extends 'base.html' %}
{% block content %}
<h1>Admin Dashboard</h1>
<table class="table">
<thead>
<tr>
<th>Endpoint</th>
</tr>
</thead>
<tbody>
{% for device in devices %}
<tr>
<td>{{ device.endpoint }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% endblock %}
160 changes: 160 additions & 0 deletions server/django/sensordata/templates/base.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,160 @@
<!DOCTYPE html>
<html lang="en">

<head>
{% load static %}
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/admin-lte@3.2/dist/css/adminlte.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;400;400i;700&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="{% static 'css/style.css' %}">
</head>

<body class="hold-transition sidebar-mini layout-fixed">
<div class="wrapper">

<aside class="main-sidebar sidebar-dark-orange elevation-4">

<a href="#" class="brand-link">
<img src="{% static 'img/flownexus_logo_light.svg' %}" alt="flownexus logo" class="brand-image-xl" style="opacity:1" >
</a>

<div class="sidebar">
<nav class="mt-2">
<ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu">

<li class="nav-item">
<a href="{% url 'admin_dashboard' %}"
class="nav-link {% if request.path == '/admin_dashboard/' %}active{% endif %}">
<i class="nav-icon fas fa-tachometer-alt"></i>
<p>
Admin Dashboard
</p>
</a>
</li>

<li class="nav-item">
<a href="{% url 'firmware_dashboard' %}"
class="nav-link {% if request.path == '/firmware_dashboard/' %}active{% endif %}">
<i class="nav-icon fas fa-microchip"></i>
<p>
Firmware Update
</p>
</a>
</li>

<li class="nav-item">
<a href="{% url 'event_dashboard' %}"
class="nav-link {% if request.path == '/event_dashboard/' %}active{% endif %}">
<i class="nav-icon fas fa-calendar-alt"></i>
<p>
Event Dashboard
</p>
</a>
</li>

<li class="nav-item">
<a href="{% url 'graph_dashboard' %}"
class="nav-link {% if request.path == '/graph_dashboard/' %}active{% endif %}">
<i class="nav-icon fas fa-chart-pie"></i>
<p>
Graph Dashboard
</p>
</a>
</li>

<li class="nav-item">
<a href="{% url 'pending_communication_dashboard' %}"
class="nav-link {% if request.path == '/pending_communication_dashboard/' %}active{% endif %}">
<i class="nav-icon fas fa-envelope"></i>
<p>
Communications
</p>
</a>
</li>

</ul>
</nav>
</div>
</aside>


<nav class="main-header navbar navbar-expand navbar-dark">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
</li>
<li class="nav-item d-none d-sm-inline-block">
<a href="https://jonas-rem.github.io/flownexus/" class="nav-link">Documentation</a>
</li>

<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown2" role="button" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
About
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown2">
<a class="dropdown-item" href="{% url 'license_dashboard' %}">Overview</a>
<a class="dropdown-item" href="https://github.com/jonas-rem/flownexus">Contact</a>
</div>
</li>
</ul>

<ul class="navbar-nav ml-auto">
{% if user.is_authenticated %}
<li class="nav-item" style="margin-right: 10px;">
<a class="nav-link" href="#" style="padding-right: 0; margin-right: 0;"><i class="fa fa-user-secret"></i>
{{ user.username }}</a>
</li>
<li class="nav-item">
<form id="logout-form" action="{% url 'logout' %}" method="post" style="margin: 0; padding: 0;">
{% csrf_token %}
<button type="submit" class="btn btn-link nav-link"
style="padding: 0; margin: 0; font-size: 1rem; line-height: inherit;">Logout</button>
</form>
</li>
{% else %}
<li class="nav-item" style="margin-right: 10px;">
<a class="nav-link" href="#" style="padding-right: 0; margin-right: 0;"><i class="fa fa-user"></i> Guest</a>
</li>
<li class="nav-item">
<form action="{% url 'login' %}" method="get" style="margin: 0; padding: 0;">
<button type="submit" class="btn btn-link nav-link"
style="padding: 0; margin: 0; font-size: 1rem; line-height: inherit;">Login</button>
</form>
</li>
{% endif %}
</ul>

</nav>


<div class="content-wrapper">
<div class="content-header">
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0">{{ title }}</h1>
</div>
</div>
</div>
</div>

<section class="content">
<div class="container-fluid">
{% block content %}
{% endblock %}
</div>
</section>
</div>

</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.2/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/admin-lte@3.2/dist/js/adminlte.min.js"></script>
Kappuccino111 marked this conversation as resolved.
Show resolved Hide resolved
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</body>

</html>
171 changes: 171 additions & 0 deletions server/django/sensordata/templates/base_license.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,171 @@
<!DOCTYPE html>
<html lang="en">

<head>
{% load static %}
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/admin-lte@3.2/dist/css/adminlte.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;400;400i;700&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="{% static 'css/style.css' %}">
</head>

<body class="hold-transition sidebar-mini layout-fixed">
<div class="wrapper">

<aside class="main-sidebar sidebar-dark-orange elevation-4">

<a href="#" class="brand-link">
<img src="{% static 'img/flownexus_logo_light.svg' %}" alt="flownexus logo" class="brand-image-xl"
style="opacity:1">
</a>

<div class="sidebar">
<nav class="mt-2">
<ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu">

<li class="nav-item">
<a href="{% url 'admin_dashboard' %}"
class="nav-link {% if request.path == '/admin_dashboard/' %}active{% endif %}">
<i class="nav-icon fas fa-tachometer-alt"></i>
<p>
Admin Dashboard
</p>
</a>
</li>

<li class="nav-item">
<a href="{% url 'firmware_dashboard' %}"
class="nav-link {% if request.path == '/firmware_dashboard/' %}active{% endif %}">
<i class="nav-icon fas fa-microchip"></i>
<p>
Firmware Update
</p>
</a>
</li>

<li class="nav-item">
<a href="{% url 'event_dashboard' %}"
class="nav-link {% if request.path == '/event_dashboard/' %}active{% endif %}">
<i class="nav-icon fas fa-calendar-alt"></i>
<p>
Event Dashboard
</p>
</a>
</li>

<li class="nav-item">
<a href="{% url 'graph_dashboard' %}"
class="nav-link {% if request.path == '/graph_dashboard/' %}active{% endif %}">
<i class="nav-icon fas fa-chart-pie"></i>
<p>
Graph Dashboard
</p>
</a>
</li>

<li class="nav-item">
<a href="{% url 'pending_communication_dashboard' %}"
class="nav-link {% if request.path == '/pending_communication_dashboard/' %}active{% endif %}">
<i class="nav-icon fas fa-envelope"></i>
<p>
Communications
</p>
</a>
</li>

</ul>
</nav>
</div>
</aside>


<nav class="main-header navbar navbar-expand navbar-dark">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
</li>
<li class="nav-item d-none d-sm-inline-block">
<a href="https://jonas-rem.github.io/flownexus/" class="nav-link">Documentation</a>
</li>

<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown2" role="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
About
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown2">
<a class="dropdown-item" href="{% url 'license_dashboard' %}">Licenses</a>
<a class="dropdown-item"
href="https://github.com/jonas-rem/flownexus">Contact</a>
</div>
</li>
</ul>

<ul class="navbar-nav ml-auto">
{% if user.is_authenticated %}
<li class="nav-item" style="margin-right: 10px;">
<a class="nav-link" href="#" style="padding-right: 0; margin-right: 0;"><i
class="fa fa-user-secret"></i>
{{ user.username }}</a>
</li>
<li class="nav-item">
<form id="logout-form" action="{% url 'logout' %}" method="post" style="margin: 0; padding: 0;">
{% csrf_token %}
<button type="submit" class="btn btn-link nav-link"
style="padding: 0; margin: 0; font-size: 1rem; line-height: inherit;">Logout</button>
</form>
</li>
{% else %}
<li class="nav-item" style="margin-right: 10px;">
<a class="nav-link" href="#" style="padding-right: 0; margin-right: 0;"><i class="fa fa-user"></i>
Guest</a>
</li>
<li class="nav-item">
<form action="{% url 'login' %}" method="get" style="margin: 0; padding: 0;">
<button type="submit" class="btn btn-link nav-link"
style="padding: 0; margin: 0; font-size: 1rem; line-height: inherit;">Login</button>
</form>
</li>
{% endif %}
</ul>

</nav>


<div class="content-wrapper">
<div class="content-header">
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0">{{ title }}</h1>
</div>
</div>
</div>
</div>

<section class="content">
<div class="container-fluid">
{% block content %}
{% endblock %}
</div>
</section>
</div>
<footer class="main-footer">
<strong>Made with ❤️ by <a href="https://github.com/jonas-rem/flownexus">Vol-JoKar</a></strong>
Copyright &copy; 2024, Individual flownexus contributors.
<div class="float-right d-none d-sm-inline-block">
<b>Version</b> 1.0.0-alpha
</div>
</footer>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.2/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/admin-lte@3.2/dist/js/adminlte.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</body>

</html>
27 changes: 27 additions & 0 deletions server/django/sensordata/templates/base_login.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
<!DOCTYPE html>
<html lang="en">

<head>
{% load static %}
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/admin-lte@3.2/dist/css/adminlte.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;400;400i;700&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="{% static 'css/style.css' %}">
</head>

<body class="hold-transition login-page">
<div class="login-box">
{% block content %}
{% endblock %}
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.2/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/admin-lte@3.2/dist/js/adminlte.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</body>

</html>
Loading
Loading