mirror of
https://github.com/DJ2LS/FreeDATA
synced 2024-05-14 08:04:33 +00:00
Merge remote-tracking branch 'origin/develop' into develop
This commit is contained in:
DJ2LS
commit
12c77d5c4c
5 changed files with 378 additions and 416 deletions
|
|
@ -15,13 +15,8 @@ import Dynamic_components from "./dynamic_components.vue";
|
|||
import { getFreedataMessages } from "../js/api";
|
||||
import { getRemote } from "../store/settingsStore.js";
|
||||
import { loadAllData } from "../js/eventHandler";
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<template>
|
||||
<!-------------------------------- INFO TOASTS ---------------->
|
||||
<div aria-live="polite" aria-atomic="true" class="position-relative z-3">
|
||||
|
|
@ -31,24 +26,22 @@ import { loadAllData } from "../js/eventHandler";
|
|||
></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
|
||||
<!-- Collapsible Left Navbar -->
|
||||
<div class="col-auto p-0 bg-body-secondary border-end">
|
||||
<!-- Collapsible Left Navbar -->
|
||||
<div class="col-auto p-0 bg-body-secondary border-end">
|
||||
<div class="flex-shrink-0 p-3">
|
||||
<div class="collapse collapse-horizontal show" id="collapseLeftNavbar">
|
||||
<div
|
||||
class="collapse collapse-horizontal show"
|
||||
id="collapseLeftNavbar"
|
||||
>
|
||||
<main_left_navbar />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col min-vh-100 m-0 p-0">
|
||||
<!--
|
||||
<!--
|
||||
<main_top_navbar />
|
||||
-->
|
||||
<div class="tab-content" id="nav-tabContent-settings">
|
||||
|
|
@ -57,9 +50,7 @@ import { loadAllData } from "../js/eventHandler";
|
|||
id="list-home"
|
||||
role="tabpanel"
|
||||
aria-labelledby="list-home-list"
|
||||
>
|
||||
|
||||
</div>
|
||||
></div>
|
||||
|
||||
<div
|
||||
class="tab-pane fade d-none"
|
||||
|
|
@ -67,9 +58,8 @@ import { loadAllData } from "../js/eventHandler";
|
|||
role="tabpanel"
|
||||
aria-labelledby="list-mesh-list"
|
||||
>
|
||||
<mesh />
|
||||
</div>
|
||||
|
||||
<mesh />
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="tab-pane fade show active"
|
||||
|
|
@ -89,13 +79,10 @@ import { loadAllData } from "../js/eventHandler";
|
|||
<chat />
|
||||
</div>
|
||||
|
||||
|
||||
<settings_view />
|
||||
<main_footer_navbar />
|
||||
|
||||
<settings_view />
|
||||
<main_footer_navbar />
|
||||
</div>
|
||||
|
||||
|
||||
<!---------------------------------------------------------------------- FOOTER AREA ------------------------------------------------------------>
|
||||
|
||||
<div class="container">
|
||||
|
|
|
|||
|
|
@ -8,48 +8,46 @@ const state = useStateStore(pinia);
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<nav
|
||||
class="navbar navbar-expand-xl bg-body-tertiary border-top p-2"
|
||||
>
|
||||
<div class="col">
|
||||
<div class="btn-toolbar" role="toolbar">
|
||||
<div class="btn-group btn-group-sm me-1" role="group">
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-1"
|
||||
v-bind:class="{
|
||||
'btn-danger': state.ptt_state == true,
|
||||
'btn-secondary': state.ptt_state == false,
|
||||
}"
|
||||
id="ptt_state"
|
||||
type="button"
|
||||
style="pointer-events: auto"
|
||||
disabled
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-placement="top"
|
||||
data-bs-title="PTT trigger state"
|
||||
>
|
||||
<i class="bi bi-broadcast-pin" style="font-size: 0.8rem"></i>
|
||||
</button>
|
||||
<nav class="navbar navbar-expand-xl bg-body-tertiary border-top p-2">
|
||||
<div class="col">
|
||||
<div class="btn-toolbar" role="toolbar">
|
||||
<div class="btn-group btn-group-sm me-1" role="group">
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-1"
|
||||
v-bind:class="{
|
||||
'btn-danger': state.ptt_state == true,
|
||||
'btn-secondary': state.ptt_state == false,
|
||||
}"
|
||||
id="ptt_state"
|
||||
type="button"
|
||||
style="pointer-events: auto"
|
||||
disabled
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-placement="top"
|
||||
data-bs-title="PTT trigger state"
|
||||
>
|
||||
<i class="bi bi-broadcast-pin" style="font-size: 0.8rem"></i>
|
||||
</button>
|
||||
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-1"
|
||||
id="busy_state"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
v-bind:class="{
|
||||
'btn-danger': state.busy_state === true,
|
||||
'btn-secondary': state.busy_state === false,
|
||||
}"
|
||||
data-bs-title="Modem state"
|
||||
disabled
|
||||
style="pointer-events: auto"
|
||||
>
|
||||
<i class="bi bi-cpu" style="font-size: 0.8rem"></i>
|
||||
</button>
|
||||
<!--
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-1"
|
||||
id="busy_state"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
v-bind:class="{
|
||||
'btn-danger': state.busy_state === true,
|
||||
'btn-secondary': state.busy_state === false,
|
||||
}"
|
||||
data-bs-title="Modem state"
|
||||
disabled
|
||||
style="pointer-events: auto"
|
||||
>
|
||||
<i class="bi bi-cpu" style="font-size: 0.8rem"></i>
|
||||
</button>
|
||||
<!--
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-1"
|
||||
id="arq_session"
|
||||
|
|
@ -69,7 +67,7 @@ const state = useStateStore(pinia);
|
|||
<i class="bi bi-arrow-left-right" style="font-size: 0.8rem"></i>
|
||||
</button>
|
||||
-->
|
||||
<!--
|
||||
<!--
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-1"
|
||||
id="arq_state"
|
||||
|
|
@ -88,7 +86,7 @@ const state = useStateStore(pinia);
|
|||
<i class="bi bi-file-earmark-binary" style="font-size: 0.8rem"></i>
|
||||
</button>
|
||||
-->
|
||||
<!--
|
||||
<!--
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-1"
|
||||
id="rigctld_state"
|
||||
|
|
@ -102,7 +100,7 @@ const state = useStateStore(pinia);
|
|||
<i class="bi bi-usb-symbol" style="font-size: 0.8rem"></i>
|
||||
</button>
|
||||
-->
|
||||
<!--
|
||||
<!--
|
||||
<button
|
||||
class="btn btn-sm btn-secondary disabled me-3"
|
||||
type="button"
|
||||
|
|
@ -120,154 +118,144 @@ const state = useStateStore(pinia);
|
|||
<i class="bi bi-hourglass"></i>
|
||||
</button>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btn-group btn-group-sm me-1" role="group">
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-4 disabled"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-title="What's the frequency, Kenneth?"
|
||||
style="pointer-events: auto"
|
||||
>
|
||||
{{ state.frequency / 1000 }} kHz
|
||||
</button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-sm me-1" role="group">
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-4 disabled"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-title="What's the frequency, Kenneth?"
|
||||
style="pointer-events: auto"
|
||||
>
|
||||
{{ state.frequency / 1000 }} kHz
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="btn-group btn-group-sm me-1" role="group">
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-0"
|
||||
type="button"
|
||||
title="Speed level"
|
||||
>
|
||||
<i class="bi bi-speedometer2" style="font-size: 1rem"></i>
|
||||
</button>
|
||||
<div class="btn-group btn-group-sm me-1" role="group">
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-0"
|
||||
type="button"
|
||||
title="Speed level"
|
||||
>
|
||||
<i class="bi bi-speedometer2" style="font-size: 1rem"></i>
|
||||
</button>
|
||||
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-4 disabled"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
data-bs-titel="speed level"
|
||||
>
|
||||
<i
|
||||
class="bi"
|
||||
style="font-size: 1rem"
|
||||
v-bind:class="{
|
||||
'bi-reception-0': state.speed_level == 0,
|
||||
'bi-reception-1': state.speed_level == 1,
|
||||
'bi-reception-2': state.speed_level == 2,
|
||||
'bi-reception-3': state.speed_level == 3,
|
||||
'bi-reception-4': state.speed_level == 4,
|
||||
}"
|
||||
></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-sm me-1" role="group">
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-0"
|
||||
type="button"
|
||||
title="Bytes transfered"
|
||||
>
|
||||
<i
|
||||
class="bi bi-file-earmark-binary"
|
||||
style="font-size: 1rem"
|
||||
></i>
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-4 disabled"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
data-bs-titel="speed level"
|
||||
>
|
||||
<i
|
||||
class="bi"
|
||||
style="font-size: 1rem"
|
||||
v-bind:class="{
|
||||
'bi-reception-0': state.speed_level == 0,
|
||||
'bi-reception-1': state.speed_level == 1,
|
||||
'bi-reception-2': state.speed_level == 2,
|
||||
'bi-reception-3': state.speed_level == 3,
|
||||
'bi-reception-4': state.speed_level == 4,
|
||||
}"
|
||||
></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-sm me-1" role="group">
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-0"
|
||||
type="button"
|
||||
title="Bytes transfered"
|
||||
>
|
||||
<i class="bi bi-file-earmark-binary" style="font-size: 1rem"></i>
|
||||
</button>
|
||||
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-4 disabled"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
data-bs-title="total bytes of transmission"
|
||||
>
|
||||
{{ state.arq_total_bytes }}
|
||||
</button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-sm me-1" role="group">
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-0"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
data-bs-title="Current or last connected with station"
|
||||
>
|
||||
<i
|
||||
class="bi bi-file-earmark-binary"
|
||||
style="font-size: 1rem"
|
||||
></i>
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-4 disabled"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
data-bs-title="total bytes of transmission"
|
||||
>
|
||||
{{ state.arq_total_bytes }}
|
||||
</button>
|
||||
</div>
|
||||
<div class="btn-group btn-group-sm me-1" role="group">
|
||||
<button
|
||||
class="btn btn-sm btn-secondary me-0"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
data-bs-title="Current or last connected with station"
|
||||
>
|
||||
<i class="bi bi-file-earmark-binary" style="font-size: 1rem"></i>
|
||||
</button>
|
||||
|
||||
<button
|
||||
class="btn btn-sm btn-secondary disabled me-1"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
data-bs-title="the dxcallsign of the connected station"
|
||||
>
|
||||
{{ state.dxcallsign }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
class="btn btn-sm btn-secondary disabled me-1"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
data-bs-title="the dxcallsign of the connected station"
|
||||
>
|
||||
{{ state.dxcallsign }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<div style="margin-right: 2px">
|
||||
<div class="progress w-100" style="height: 20px; min-width: 200px">
|
||||
<div
|
||||
class="progress-bar progress-bar-striped bg-primary force-gpu"
|
||||
id="transmission_progress"
|
||||
role="progressbar"
|
||||
:style="{ width: state.arq_transmission_percent + '%' }"
|
||||
aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100"
|
||||
></div>
|
||||
<p
|
||||
class="justify-content-center m-0 d-flex position-absolute w-100 text-dark"
|
||||
>
|
||||
Message Progress
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div
|
||||
hidden
|
||||
class="progress mb-0 rounded-0 rounded-bottom"
|
||||
style="height: 10px"
|
||||
>
|
||||
<div
|
||||
class="progress-bar progress-bar-striped bg-warning"
|
||||
id="transmission_timeleft"
|
||||
role="progressbar"
|
||||
:style="{
|
||||
width: state.arq_seconds_until_timeout_percent + '%',
|
||||
}"
|
||||
aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100"
|
||||
>
|
||||
<p
|
||||
class="justify-content-center m-0 d-flex position-absolute w-100 text-dark"
|
||||
>
|
||||
timeout in {{ state.arq_seconds_until_timeout }}s
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<div style="margin-right: 2px">
|
||||
<div
|
||||
class="progress w-100"
|
||||
style="height: 20px; min-width: 200px"
|
||||
>
|
||||
<div
|
||||
class="progress-bar progress-bar-striped bg-primary force-gpu"
|
||||
id="transmission_progress"
|
||||
role="progressbar"
|
||||
:style="{ width: state.arq_transmission_percent + '%' }"
|
||||
aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100"
|
||||
></div>
|
||||
<p
|
||||
class="justify-content-center m-0 d-flex position-absolute w-100 text-dark"
|
||||
>
|
||||
Message Progress
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div
|
||||
hidden
|
||||
class="progress mb-0 rounded-0 rounded-bottom"
|
||||
style="height: 10px"
|
||||
>
|
||||
<div
|
||||
class="progress-bar progress-bar-striped bg-warning"
|
||||
id="transmission_timeleft"
|
||||
role="progressbar"
|
||||
:style="{
|
||||
width: state.arq_seconds_until_timeout_percent + '%',
|
||||
}"
|
||||
aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100"
|
||||
>
|
||||
<p
|
||||
class="justify-content-center m-0 d-flex position-absolute w-100 text-dark"
|
||||
>
|
||||
timeout in {{ state.arq_seconds_until_timeout }}s
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,28 +1,25 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import { ref } from "vue";
|
||||
import main_modem_healthcheck from "./main_modem_healthcheck.vue";
|
||||
import { getOverallHealth } from "../js/eventHandler.js";
|
||||
|
||||
|
||||
const isTextVisible = ref(false); // Initially, the text is invisible
|
||||
function toggleTextVisibility() {
|
||||
isTextVisible.value = !isTextVisible.value; // Toggle the visibility
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
<template>
|
||||
|
||||
|
||||
<!-- Button -->
|
||||
|
||||
<div class="btn-group" role="group" aria-label="Basic example">
|
||||
|
||||
<button class="btn btn-outline-secondary border-0 ms-2 mb-3" type="button" @click="toggleTextVisibility()">
|
||||
<span class=" fw-semibold"><i class="bi bi-text-paragraph"></i></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<button
|
||||
class="btn btn-outline-secondary border-0 ms-2 mb-3"
|
||||
type="button"
|
||||
@click="toggleTextVisibility()"
|
||||
>
|
||||
<span class="fw-semibold"><i class="bi bi-text-paragraph"></i></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<a
|
||||
class="btn border btn-outline-secondary list-group-item rounded-3"
|
||||
|
|
@ -39,70 +36,66 @@ function toggleTextVisibility() {
|
|||
"
|
||||
><i class="h3 bi bi-activity"></i>
|
||||
<span class="ms-2" v-if="isTextVisible">Healtcheck</span>
|
||||
|
||||
</a>
|
||||
|
||||
<div
|
||||
class="list-group bg-body-secondary"
|
||||
id="main-list-tab"
|
||||
role="tablist"
|
||||
style="margin-top: 100px"
|
||||
@click="loadAllData"
|
||||
>
|
||||
|
||||
|
||||
<a
|
||||
class="list-group-item list-group-item-dark list-group-item-action border-0 rounded-3 mb-2 active"
|
||||
id="list-grid-list"
|
||||
data-bs-toggle="list"
|
||||
href="#list-grid"
|
||||
role="tab"
|
||||
aria-controls="list-grid"
|
||||
title="Grid"
|
||||
>
|
||||
<i class="bi bi-grid h3"></i>
|
||||
<span class="ms-2" v-if="isTextVisible">Home</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="list-group-item list-group-item-dark list-group-item-action border-0 rounded-3 mb-2"
|
||||
id="list-chat-list"
|
||||
data-bs-toggle="list"
|
||||
href="#list-chat"
|
||||
role="tab"
|
||||
aria-controls="list-chat"
|
||||
title="Chat"
|
||||
@click="getFreedataMessages"
|
||||
>
|
||||
<i class="bi bi-chat-text h3"></i>
|
||||
<span class="ms-2" v-if="isTextVisible">RF Chat</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="list-group-item list-group-item-dark list-group-item-action d-none border-0 rounded-3 mb-2"
|
||||
id="list-mesh-list"
|
||||
data-bs-toggle="list"
|
||||
href="#list-mesh"
|
||||
role="tab"
|
||||
aria-controls="list-mesh"
|
||||
>
|
||||
<i class="bi bi-rocket h3"></i>
|
||||
<span class="ms-2" v-if="isTextVisible">Mesh</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="list-group-item list-group-item-dark list-group-item-action border-0 rounded-3 mb-2"
|
||||
id="list-settings-list"
|
||||
data-bs-toggle="list"
|
||||
href="#list-settings"
|
||||
role="tab"
|
||||
aria-controls="list-settings"
|
||||
title="Settings"
|
||||
<div
|
||||
class="list-group bg-body-secondary"
|
||||
id="main-list-tab"
|
||||
role="tablist"
|
||||
style="margin-top: 100px"
|
||||
@click="loadAllData"
|
||||
>
|
||||
<i class="bi bi-gear-wide-connected h3"></i>
|
||||
<span class="ms-2" v-if="isTextVisible">Settings</span>
|
||||
</a>
|
||||
</div>
|
||||
<a
|
||||
class="list-group-item list-group-item-dark list-group-item-action border-0 rounded-3 mb-2 active"
|
||||
id="list-grid-list"
|
||||
data-bs-toggle="list"
|
||||
href="#list-grid"
|
||||
role="tab"
|
||||
aria-controls="list-grid"
|
||||
title="Grid"
|
||||
>
|
||||
<i class="bi bi-grid h3"></i>
|
||||
<span class="ms-2" v-if="isTextVisible">Home</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="list-group-item list-group-item-dark list-group-item-action border-0 rounded-3 mb-2"
|
||||
id="list-chat-list"
|
||||
data-bs-toggle="list"
|
||||
href="#list-chat"
|
||||
role="tab"
|
||||
aria-controls="list-chat"
|
||||
title="Chat"
|
||||
@click="getFreedataMessages"
|
||||
>
|
||||
<i class="bi bi-chat-text h3"></i>
|
||||
<span class="ms-2" v-if="isTextVisible">RF Chat</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="list-group-item list-group-item-dark list-group-item-action d-none border-0 rounded-3 mb-2"
|
||||
id="list-mesh-list"
|
||||
data-bs-toggle="list"
|
||||
href="#list-mesh"
|
||||
role="tab"
|
||||
aria-controls="list-mesh"
|
||||
>
|
||||
<i class="bi bi-rocket h3"></i>
|
||||
<span class="ms-2" v-if="isTextVisible">Mesh</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="list-group-item list-group-item-dark list-group-item-action border-0 rounded-3 mb-2"
|
||||
id="list-settings-list"
|
||||
data-bs-toggle="list"
|
||||
href="#list-settings"
|
||||
role="tab"
|
||||
aria-controls="list-settings"
|
||||
title="Settings"
|
||||
@click="loadAllData"
|
||||
>
|
||||
<i class="bi bi-gear-wide-connected h3"></i>
|
||||
<span class="ms-2" v-if="isTextVisible">Settings</span>
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,2 +1 @@
|
|||
<template>
|
||||
</template>
|
||||
<template></template>
|
||||
|
|
|
|||
|
|
@ -1,131 +1,126 @@
|
|||
<template>
|
||||
<div class="container">
|
||||
<nav>
|
||||
<div class="nav nav-tabs" id="nav-tab-mesh" role="tablist-mesh">
|
||||
<button
|
||||
class="nav-link active"
|
||||
id="nav-route-tab"
|
||||
data-bs-toggle="tab"
|
||||
data-bs-target="#nav-route"
|
||||
type="button"
|
||||
role="tab"
|
||||
aria-controls="nav-route"
|
||||
aria-selected="true"
|
||||
>
|
||||
Routes
|
||||
</button>
|
||||
<button
|
||||
class="nav-link"
|
||||
id="nav-signaling-tab"
|
||||
data-bs-toggle="tab"
|
||||
data-bs-target="#nav-signaling"
|
||||
type="button"
|
||||
role="tab"
|
||||
aria-controls="nav-signaling"
|
||||
aria-selected="false"
|
||||
>
|
||||
Signaling
|
||||
</button>
|
||||
<button
|
||||
class="nav-link"
|
||||
id="nav-actions-tab"
|
||||
data-bs-toggle="tab"
|
||||
data-bs-target="#nav-actions"
|
||||
type="button"
|
||||
role="tab"
|
||||
aria-controls="nav-actions"
|
||||
aria-selected="false"
|
||||
>
|
||||
Actions
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="container">
|
||||
<nav>
|
||||
<div class="nav nav-tabs" id="nav-tab-mesh" role="tablist-mesh">
|
||||
<button
|
||||
class="nav-link active"
|
||||
id="nav-route-tab"
|
||||
data-bs-toggle="tab"
|
||||
data-bs-target="#nav-route"
|
||||
type="button"
|
||||
role="tab"
|
||||
aria-controls="nav-route"
|
||||
aria-selected="true"
|
||||
>
|
||||
Routes
|
||||
</button>
|
||||
<button
|
||||
class="nav-link"
|
||||
id="nav-signaling-tab"
|
||||
data-bs-toggle="tab"
|
||||
data-bs-target="#nav-signaling"
|
||||
type="button"
|
||||
role="tab"
|
||||
aria-controls="nav-signaling"
|
||||
aria-selected="false"
|
||||
>
|
||||
Signaling
|
||||
</button>
|
||||
<button
|
||||
class="nav-link"
|
||||
id="nav-actions-tab"
|
||||
data-bs-toggle="tab"
|
||||
data-bs-target="#nav-actions"
|
||||
type="button"
|
||||
role="tab"
|
||||
aria-controls="nav-actions"
|
||||
aria-selected="false"
|
||||
>
|
||||
Actions
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="tab-content d-none" id="nav-tabContent-Mesh">
|
||||
<div
|
||||
class="tab-pane fade show active vw-100 vh-90 overflow-auto"
|
||||
id="nav-route"
|
||||
role="tabpanel"
|
||||
aria-labelledby="nav-route-tab"
|
||||
>
|
||||
<div class="container-fluid">
|
||||
<div
|
||||
class="table-responsive overflow-auto"
|
||||
style="max-width: 99vw; max-height: 99vh"
|
||||
>
|
||||
<table class="table table-hover table-sm">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Timestamp</th>
|
||||
<th scope="col">DXCall</th>
|
||||
<th scope="col">Router</th>
|
||||
<th scope="col">Hops</th>
|
||||
<th scope="col">Score</th>
|
||||
<th scope="col">SNR</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="mesh-table"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="tab-pane fade"
|
||||
id="nav-signaling"
|
||||
role="tabpanel"
|
||||
aria-labelledby="nav-signaling-tab"
|
||||
>
|
||||
<div class="container-fluid">
|
||||
<div
|
||||
class="table-responsive overflow-auto"
|
||||
style="max-width: 99vw; max-height: 99vh"
|
||||
>
|
||||
<table class="table table-hover table-sm">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Timestamp</th>
|
||||
<th scope="col">Destination</th>
|
||||
<th scope="col">Origin</th>
|
||||
<th scope="col">Frametype</th>
|
||||
<th scope="col">Payload</th>
|
||||
<th scope="col">Attempt</th>
|
||||
<th scope="col">Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="mesh-signalling-table"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tab-content d-none" id="nav-tabContent-Mesh">
|
||||
<div
|
||||
class="tab-pane fade show active vw-100 vh-90 overflow-auto"
|
||||
id="nav-route"
|
||||
role="tabpanel"
|
||||
aria-labelledby="nav-route-tab"
|
||||
>
|
||||
<div class="container-fluid">
|
||||
<div
|
||||
class="table-responsive overflow-auto"
|
||||
style="max-width: 99vw; max-height: 99vh"
|
||||
>
|
||||
<table class="table table-hover table-sm">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Timestamp</th>
|
||||
<th scope="col">DXCall</th>
|
||||
<th scope="col">Router</th>
|
||||
<th scope="col">Hops</th>
|
||||
<th scope="col">Score</th>
|
||||
<th scope="col">SNR</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="mesh-table"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="tab-pane fade"
|
||||
id="nav-signaling"
|
||||
role="tabpanel"
|
||||
aria-labelledby="nav-signaling-tab"
|
||||
>
|
||||
<div class="container-fluid">
|
||||
<div
|
||||
class="table-responsive overflow-auto"
|
||||
style="max-width: 99vw; max-height: 99vh"
|
||||
>
|
||||
<table class="table table-hover table-sm">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Timestamp</th>
|
||||
<th scope="col">Destination</th>
|
||||
<th scope="col">Origin</th>
|
||||
<th scope="col">Frametype</th>
|
||||
<th scope="col">Payload</th>
|
||||
<th scope="col">Attempt</th>
|
||||
<th scope="col">Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="mesh-signalling-table"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="tab-pane fade"
|
||||
id="nav-actions"
|
||||
role="tabpanel-mesh"
|
||||
aria-labelledby="nav-actions-tab"
|
||||
>
|
||||
<div class="input-group mt-1">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
style="max-width: 6rem; text-transform: uppercase"
|
||||
placeholder="DXcall"
|
||||
pattern="[A-Z]*"
|
||||
id="dxCallMesh"
|
||||
maxlength="11"
|
||||
aria-label="Input group"
|
||||
aria-describedby="btnGroupAddon"
|
||||
/>
|
||||
<button
|
||||
id="transmit_mesh_ping"
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
>
|
||||
mesh ping
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="tab-pane fade"
|
||||
id="nav-actions"
|
||||
role="tabpanel-mesh"
|
||||
aria-labelledby="nav-actions-tab"
|
||||
>
|
||||
<div class="input-group mt-1">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
style="max-width: 6rem; text-transform: uppercase"
|
||||
placeholder="DXcall"
|
||||
pattern="[A-Z]*"
|
||||
id="dxCallMesh"
|
||||
maxlength="11"
|
||||
aria-label="Input group"
|
||||
aria-describedby="btnGroupAddon"
|
||||
/>
|
||||
<button id="transmit_mesh_ping" type="button" class="btn btn-primary">
|
||||
mesh ping
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
Loading…
Reference in a new issue