Crash_Override/FreeDATA
1
0
Fork 0
mirror of https://github.com/DJ2LS/FreeDATA synced 2024-05-14 10:04:33 +02:00
Code Issues Packages Projects Releases Wiki Activity
FreeDATA/gui/src/components/main_modals.vue
DJ2LS ff82b0e0f4 renamed gui_vue to gui
2023-10-22 10:20:32 +02:00

1110 lines
36 KiB
Vue
Raw Blame History

<script setup lang="ts">
import { setActivePinia } from "pinia";
import pinia from "../store/index";
setActivePinia(pinia);
import { useStateStore } from "../store/stateStore.js";
const state = useStateStore(pinia);
import { useChatStore } from "../store/chatStore.js";
const chat = useChatStore(pinia);
import {
deleteChatByCallsign,
getNewMessagesByDXCallsign,
} from "../js/chatHandler";
import { sendTestFrame, setTxAudioLevel } from "../js/sock.js";
function tuneAudio() {
sendTestFrame();
}
function set_audio_level() {
setTxAudioLevel(state.audio_level);
}
function deleteChat() {
//console.log(chat.selectedCallsign)
deleteChatByCallsign(chat.selectedCallsign);
}
import {
Chart as ChartJS,
CategoryScale,
LinearScale,
PointElement,
LineElement,
Title,
Tooltip,
Legend,
} from "chart.js";
import { Line } from "vue-chartjs";
import { ref, computed } from "vue";
ChartJS.register(
CategoryScale,
LinearScale,
PointElement,
LineElement,
Title,
Tooltip,
Legend,
);
</script>
<template>
<!-- updater release notes-->
<div
class="modal fade"
ref="modalEle"
id="updaterReleaseNotes"
tabindex="-1"
aria-hidden="true"
>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<span class="input-group-text" id="updater_last_version"></span>
<span class="input-group-text ms-1" id="updater_last_update"></span>
<button
type="button"
class="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="modal-dialog modal-dialog-scrollable">
<div class="" id="updater_release_notes"></div>
</div>
</div>
<div class="modal-footer">
<button
type="button"
class="btn btn-secondary"
data-bs-dismiss="modal"
>
Close
</button>
</div>
</div>
</div>
</div>
<!-- delete chat modal -->
<div
class="modal fade"
ref="modalEle"
id="deleteChatModal"
tabindex="-1"
aria-labelledby="exampleModalLabel"
aria-hidden="true"
>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="deleteChatModalLabel">
Sub menu for: {{ chat.selectedCallsign }}
</h1>
<button
type="button"
class="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1"
>Total Messages</span
>
<span class="input-group-text" id="basic-addon1">{{
getNewMessagesByDXCallsign(chat.selectedCallsign)[0]
}}</span>
</div>
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">New Messages</span>
<span class="input-group-text" id="basic-addon1">{{
getNewMessagesByDXCallsign(chat.selectedCallsign)[1]
}}</span>
</div>
</div>
<div class="modal-footer">
<button
type="button"
class="btn btn-secondary"
data-bs-dismiss="modal"
>
Close
</button>
<button
type="button"
class="btn btn-danger"
@click="deleteChat"
data-bs-dismiss="modal"
>
Delete Chat
</button>
</div>
</div>
</div>
</div>
<!-- Message Info Modal -->
<div
class="modal fade"
ref="modalEle"
id="messageInfoModal"
tabindex="-1"
aria-labelledby="exampleModalLabel"
aria-hidden="true"
>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="messageInfoModalLabel">
{{ chat.selectedMessageObject["uuid"] }}
</h1>
<button
type="button"
class="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
{{ chat.selectedMessageObject }}
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">Status</span>
<span class="input-group-text" id="basic-addon1">{{
chat.selectedMessageObject["status"]
}}</span>
</div>
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">Attempts</span>
<span class="input-group-text" id="basic-addon1">{{
chat.selectedMessageObject["attempt"]
}}</span>
</div>
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1"
>Bytes per Minute</span
>
<span class="input-group-text" id="basic-addon1">{{
chat.selectedMessageObject["bytesperminute"]
}}</span>
</div>
</div>
<div class="modal-footer">
<button
type="button"
class="btn btn-secondary"
data-bs-dismiss="modal"
>
Close
</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
<!-- HELP MODALS AUDIO -->
<div
class="modal fade"
data-bs-backdrop="static"
tabindex="-1"
id="audioHelpModal"
>
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Help</h5>
<button
type="button"
class="btn btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="card mb-3">
<div class="card-body">
<div class="input-group input-group-sm mb-1">
<span class="input-group-text">
<i class="bi bi-mic-fill" style="font-size: 1rem"></i>
</span>
<select
class="form-select form-select-sm"
aria-label=".form-select-sm"
disabled
>
<!-- <option selected value="3011">USB Interface</option>-->
</select>
</div>
<p class="card-text">
Select your audio device for transmitting. It
<strong>must</strong> be using a sample rate of
<strong>48000Hz</strong>
</p>
</div>
</div>
<div class="card">
<div class="card-body">
<div class="input-group input-group-sm">
<span class="input-group-text">
<i class="bi bi-volume-up" style="font-size: 1rem"></i>
</span>
<select
class="form-select form-select-sm"
aria-label=".form-select-sm"
disabled
></select>
</div>
<p class="card-text">
Select your audio device for receiving. It
<strong>must</strong> be using a sample rate of
<strong>48000Hz</strong>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- HELP MODALS RIGCONTROL -->
<div
class="modal fade"
data-bs-backdrop="static"
tabindex="-1"
id="rigcontrolHelpModal"
>
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Help</h5>
<button
type="button"
class="btn btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">Rig Control</h5>
<p class="card-text">
This section is where you configure rig control method (none
(VOX) or hamlib) for both GUI and TNC. For the best experience
hamlib control is recommended.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">None/Vox</h5>
<p class="card-text">
Select "None/Vox" if you want to use Vox for triggering PTT. No
connection to rigctld will be established. No frequency
information is availble.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">Hamlib</h5>
<p class="card-text">
Select "Hamlib" if you want to have more control over your
radio. Define your hamlib settings in settings, and click the
start button to start rigctld. You may use the 'PTT test' button
to ensure rig control is working.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- HELP MODALS STATION -->
<div
class="modal fade"
data-bs-backdrop="static"
tabindex="-1"
id="stationHelpModal"
>
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Help</h5>
<button
type="button"
class="btn btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="alert alert-info" role="alert">
These settings will be saved automatically when changing.
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
<div
class="input-group input-group-sm mb-0"
data-bs-placement="bottom"
data-bs-toggle="tooltip"
data-bs-trigger="hover"
data-bs-html="false"
title="Enter your callsign and save it"
>
<span class="input-group-text">
<i
class="bi bi-person-bounding-box"
style="font-size: 1rem"
></i>
</span>
<input
type="text"
class="form-control"
placeholder="callsign"
pattern="[A-Z]*"
maxlength="8"
style="max-width: 8rem"
aria-label="Input group"
aria-describedby="btnGroupAddon"
disabled
/>
<select
class="form-select form-select-sm"
aria-label=".form-select-sm"
style="max-width: 6rem"
disabled
>
<option selected value="SSID">SSID</option>
</select>
</div>
</h5>
<p class="card-text">
Enter your callsign and SSID. Your callsign can have a maximum
length of 7 characters
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
<div
class="input-group input-group-sm mb-0"
data-bs-placement="bottom"
data-bs-toggle="tooltip"
data-bs-trigger="hover"
data-bs-html="false"
title="Enter your gridsquare and save it"
>
<span class="input-group-text">
<i class="bi bi-house-fill" style="font-size: 1rem"></i>
</span>
<input
type="text"
class="form-control mr-1"
style="max-width: 6rem"
placeholder="locator"
maxlength="6"
aria-label="Input group"
aria-describedby="btnGroupAddon"
disabled
/>
</div>
</h5>
<p class="card-text">
Enter your position as a 4 or 6 digit grid square, also known as
a maidenhead locator. Six digits are recommended.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- HELP MODALS UPDATER -->
<div
class="modal fade"
data-bs-backdrop="static"
tabindex="-1"
id="updaterHelpModal"
>
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Help</h5>
<button
type="button"
class="btn btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">Auto-Updater</h5>
<p class="card-text">
The auto updater loads the latest version from Github and
installs it automatically. You can select the update channel in
settings. Once an update has been downlaoded, you need to
confirm the auto-installation and restart.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">Alpha</h5>
<p class="card-text">
Alpha releases are more frequent and contain the latest
features, but are likely to be unstable and introduce bugs.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">Beta</h5>
<p class="card-text">
Beta releases are more stable than Alpha releases. They are a
good tradeoff between latest features and stability. They will
be updated less often. A beta release has not been released yet.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">Stable</h5>
<p class="card-text">
Stable releases are the most stable versions with no known major
issues. A stable release has not been released yet.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- HELP MODALS LOCAL REMOTE -->
<div
class="modal fade"
data-bs-backdrop="static"
tabindex="-1"
id="localRemoteHelpModal"
>
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Help</h5>
<button
type="button"
class="btn btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
<div
class="btn-group btn-group-sm me-2"
role="group"
aria-label="local-remote-switch toggle button group"
data-bs-placement="bottom"
data-bs-toggle="tooltip"
data-bs-trigger="hover"
data-bs-html="true"
title="Select a local or a remote location of your TNC daemon. Normally local is the preferred option."
>
<input
type="radio"
class="btn-check"
name="local-remote-switch"
autocomplete="off"
checked
disabled
/>
<label
class="btn btn-sm btn-outline-secondary"
for="local-remote-switch1"
>
<i class="bi bi-pc-display-horizontal"></i>
<span class="ms-2 me-2">Local modem</span>
</label>
<input
type="radio"
class="btn-check"
name="local-remote-switch"
autocomplete="off"
disabled
/>
<label
class="btn btn-sm btn-outline-secondary"
for="local-remote-switch2"
>
<i class="bi bi-ethernet"></i>
<span class="ms-2 me-2">Remote modem</span>
</label>
</div>
</h5>
<p class="card-text">
Local / Remote switch. If the TNC is running on the same
computer as the GUI, select local. Otherwise choose remote and
enter the IP/Port of where the TNC is running.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
<div class="input-group input-group-sm me-2">
<span class="input-group-text">modem ip</span>
<input
type="text"
class="form-control"
placeholder="ip address"
value="192.168.178.163"
maxlength="17"
style="width: 8rem"
aria-label="Username"
aria-describedby="basic-addon1"
disabled
/>
<span class="input-group-text">:</span>
<input
type="text"
class="form-control"
placeholder="port"
value="3000"
maxlength="5"
max="65534"
min="1025"
style="width: 4rem"
aria-label="Username"
aria-describedby="basic-addon1"
disabled
/>
<button class="btn btn-sm btn-danger" type="button" disabled>
<i class="bi bi-diagram-3" style="font-size: 1rem"></i>
</button>
</div>
</h5>
<p class="card-text">
Remote IP of TNC. Port is port of daemon. The modem port will
automatically adjusted. ( daemon port - 1 )
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- HELP MODALS START STOP TNC -->
<div
class="modal fade"
data-bs-backdrop="static"
tabindex="-1"
id="startStopTNCHelpModal"
>
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Help</h5>
<button
type="button"
class="btn btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
<div class="btn-group" role="group">
<button
type="button"
class="btn btn-sm btn-outline-success"
data-bs-toggle="tooltip"
data-bs-trigger="hover"
data-bs-html="false"
title="Start the TNC. Please set your audio and radio settings first!"
disabled
>
<i class="bi bi-play-fill"></i>
<span class="ms-2">Start modem</span>
</button>
<button
type="button"
class="btn btn-sm btn-outline-danger"
data-bs-toggle="tooltip"
data-bs-trigger="hover"
data-bs-html="false"
title="Stop the TNC."
disabled
>
<i class="bi bi-stop-fill"></i>
<span class="ms-2">Stop modem</span>
</button>
</div>
</h5>
<p class="card-text">
Start or stop the TNC service. The TNC daemon must be running
and will work whether the TNC is local or remote.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- HELP MODALS AUDIO LEVEL -->
<div
class="modal fade"
data-bs-backdrop="static"
tabindex="-1"
id="audioLevelHelpModal"
>
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Help</h5>
<button
type="button"
class="btn btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
<div class="progress mb-0" style="height: 22px">
<div
class="progress-bar progress-bar-striped bg-primary force-gpu"
role="progressbar"
style="width: 5%"
aria-valuenow="5"
aria-valuemin="0"
aria-valuemax="100"
></div>
<p
class="justify-content-center d-flex position-absolute w-100"
>
-38 dBFS (Audio Level)
</p>
</div>
<div class="progress mb-0" style="height: 8px">
<div
class="progress-bar progress-bar-striped bg-warning"
role="progressbar"
style="width: 1%"
aria-valuenow="1"
aria-valuemin="0"
aria-valuemax="100"
></div>
<div
class="progress-bar bg-success"
role="progressbar"
style="width: 89%"
aria-valuenow="50"
aria-valuemin="0"
aria-valuemax="100"
></div>
<div
class="progress-bar progress-bar-striped bg-warning"
role="progressbar"
style="width: 20%"
aria-valuenow="20"
aria-valuemin="0"
aria-valuemax="100"
></div>
<div
class="progress-bar progress-bar-striped bg-danger"
role="progressbar"
style="width: 29%"
aria-valuenow="29"
aria-valuemin="0"
aria-valuemax="100"
></div>
</div>
</h5>
<p class="card-text">
Represents the level of audio from transceiver. Excessively high
levels will affect decoding performance negatively.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
<div class="progress mb-0" style="height: 22px">
<div
class="progress-bar progress-bar-striped bg-primary force-gpu"
role="progressbar"
style="width: 30%"
aria-valuenow="0"
aria-valuemin="0"
aria-valuemax="100"
></div>
<p
class="justify-content-center d-flex position-absolute w-100"
id="noise_level_value"
>
-24 S-Meter (dBm)
</p>
</div>
<div class="progress mb-0" style="height: 8px">
<div
class="progress-bar progress-bar-striped bg-warning"
role="progressbar"
style="width: 1%"
aria-valuenow="1"
aria-valuemin="0"
aria-valuemax="100"
></div>
<div
class="progress-bar bg-success"
role="progressbar"
style="width: 89%"
aria-valuenow="50"
aria-valuemin="0"
aria-valuemax="100"
></div>
<div
class="progress-bar progress-bar-striped bg-warning"
role="progressbar"
style="width: 20%"
aria-valuenow="20"
aria-valuemin="0"
aria-valuemax="100"
></div>
<div
class="progress-bar progress-bar-striped bg-danger"
role="progressbar"
style="width: 29%"
aria-valuenow="29"
aria-valuemin="0"
aria-valuemax="100"
></div>
</div>
</h5>
<p class="card-text">
Represents noise level of the channel from the transceiver.
Requires hamlib rig control.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
<button
type="button"
class="btn btn-sm btn-outline-secondary"
@click="tuneAudio"
>
Tune
</button>
</h5>
<p class="card-text">
Adjust volume level of outgoing audio to transceiver. For best
results lower the level so that a minimum amount of ALC is used.
Can be used in combination with rig's mic/input gain for
furthrer refinement.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
<button type="button" class="btn btn-sm btn-outline-danger">
Record audio
</button>
</h5>
<p class="card-text">Create a recording of current channel</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- HELP MODALS BROADCASTS -->
<div
class="modal fade"
data-bs-backdrop="static"
tabindex="-1"
id="broadcastsHelpModal"
>
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Help</h5>
<button
type="button"
class="btn btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="card mb-3">
<div class="card-body">
<button
class="btn btn-sm btn-outline-secondary ms-1"
type="button"
disabled
>
Ping
</button>
<p class="card-text">
Send a ping to a remote station by entering a callsign and
optional SSID (-0 will be used if not specified.) Alternatively
click on a station in the heard station list to populate the
call sign field. If the remote station decodes the ping it will
transmit a reply. If able to decode the reply, a signal report
will be listed in the heard station list.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<button
class="btn btn-sm btn-outline-secondary"
type="button"
disabled
>
Call CQ
</button>
<p class="card-text">Sending out a CQ CQ CQ to the world.</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<button
type="button"
class="btn btn-sm btn-outline-secondary"
disabled
>
<i class="bi bi-soundwave"></i>Toggle beacon
</button>
<p class="card-text">
Sends a periodic broadcast (duration is definable in settings)
that announces you are available. Check explorer to see other
active stations that may have decoded your beacon.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- HELP MODALS WATERFALL -->
<div
class="modal fade"
data-bs-backdrop="static"
tabindex="-1"
id="waterfallHelpModal"
>
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Help</h5>
<button
type="button"
class="btn btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
Waterfall
<input
type="radio"
class="btn-check"
name="waterfall-scatter-switch"
autocomplete="off"
checked
/>
<label
class="btn btn-sm btn-outline-secondary"
for="waterfall-scatter-switch1"
><strong><i class="bi bi-water"></i></strong>
</label>
</h5>
<p class="card-text">
Displays a waterfall for activity of current channel.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
Busy Indicator
<button class="btn btn-sm btn-success" type="button">
busy
</button>
</h5>
<p class="card-text">
Green when channel is open and changes to red to indicate there
is activity on the channel.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
Signal Indicator
<button class="btn btn-sm btn-success" type="button">
signal
</button>
</h5>
<p class="card-text">
Changes to green when Codec2 data is detected on channel.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
Constellation Plot
<input type="radio" class="btn-check" autocomplete="off" />
<label class="btn btn-sm btn-outline-secondary"
><strong><i class="bi bi-border-outer"></i></strong>
</label>
</h5>
<p class="card-text">
Displays a plot of last decoded message. A constellation plot is
a simple way to represent signal quality.
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">
Speed Chart
<input type="radio" class="btn-check" autocomplete="off" />
<label class="btn btn-sm btn-outline-secondary"
><strong><i class="bi bi-graph-up-arrow"></i></strong>
</label>
</h5>
<p class="card-text">
Shows history of SNR and bit rate of messages.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- HELP MODALS HEARD STATIONS -->
<div
class="modal fade"
data-bs-backdrop="static"
tabindex="-1"
id="heardStationsHelpModal"
>
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Station List Help</h5>
<button
type="button"
class="btn btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="card mb-3">
<div class="card-body">
<p class="card-text">
Stations that you've been able to decode will be listed here.
Details such as time, frequency, message type, call sign,
location and SNR will be listed. Existing entries are updated if
they already exist and more detailed history can be viewed in
chat window for each station.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- AUDIO MODAL -->
<div
class="modal fade"
data-bs-backdrop="static"
tabindex="-1"
id="audioModal"
>
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Audio tuning</h5>
<button
type="button"
class="btn btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="input-group input-group-sm mb-1">
<span class="input-group-text">Test-Frame</span>
<button
type="button"
id="sendTestFrame"
@click="sendTestFrame()"
class="btn btn-danger"
>
Transmit
</button>
</div>
<div class="input-group input-group-sm mb-1">
<span class="input-group-text">TX Level</span>
<span class="input-group-text">{{ state.audio_level }}</span>
<span class="input-group-text w-75">
<input
type="range"
class="form-range"
min="0"
max="250"
step="1"
id="audioLevelTX"
@click="set_audio_level()"
v-model="state.audio_level"
/></span>
</div>
</div>
</div>
</div>
</div>
</template>
Reference in a new issue View git blame Copy permalink