Updated mycall & freq widget

This commit is contained in:
Mashintime 2023-12-16 11:56:55 -05:00
parent 6b7df9d0a6
commit de4eb9355b
3 changed files with 17 additions and 54 deletions

View file

@ -64,7 +64,7 @@ const gridWidgets = [
), ),
new gridWidget( new gridWidget(
active_stats, active_stats,
{ x: 16, y: 17, w: 8, h: 80 }, { x: 16, y: 16, w: 8, h: 80 },
"Stats (waterfall, etc)", "Stats (waterfall, etc)",
true, true,
true, true,
@ -144,7 +144,7 @@ const gridWidgets = [
), ),
new gridWidget( new gridWidget(
grid_mycall, grid_mycall,
{ x: 0, y: 95, w: 4, h: 9 }, { x: 8, y: 40, w: 5, h: 8 },
"My callsign widget", "My callsign widget",
true, true,
true, true,
@ -168,7 +168,7 @@ const gridWidgets = [
), ),
new gridWidget( new gridWidget(
grid_freq, grid_freq,
{ x: 20, y: 8, w: 4, h: 9 }, { x: 20, y: 8, w: 4, h: 8 },
"Frequency widget", "Frequency widget",
true, true,
true, true,

View file

@ -7,27 +7,12 @@ import { useStateStore } from "../../store/stateStore.js";
const state = useStateStore(pinia); const state = useStateStore(pinia);
</script> </script>
<template> <template>
<div class="w-100">
<div class="input-group input-group-sm" style="width: calc(100% - 24px)">
<span class="input-group-text">Hz</span>
<input
type="text"
class="form-control"
style="min-width: 3em"
placeholder="mycall"
v-model="state.frequency"
readonly
/>
<a <a
class="btn btn-secondary dropdown-toggle" class="d-flex justify-content-center align-items-center object-fill border rounded w-100 h-100 link-underline link-underline-opacity-0 link-underline-opacity-75-hover"
v-bind:class="{ :class="state.ptt_state === true ? 'text-bg-warning' : 'text-bg-light'"
disabled: state.hamlib_status === 'disconnected',
}"
type="button"
data-bs-toggle="offcanvas" data-bs-toggle="offcanvas"
data-bs-target="#offcanvasFrequency" data-bs-target="#offcanvasFrequency"
></a> >
</div> {{ state.frequency / 1000}} kHz
</div> </a>
</template> </template>

View file

@ -5,40 +5,18 @@ import { setConfig } from "../../js/api";
import pinia from "../../store/index"; import pinia from "../../store/index";
setActivePinia(pinia); setActivePinia(pinia);
import { settingsStore as setting } from "../../store/settingsStore.js"; import { settingsStore } from "../../store/settingsStore.js";
const settings = reactive(setting);
import { useStateStore } from "../../store/stateStore.js";
const state = useStateStore(pinia);
function updateMyCall() { function updateMyCall() {
setConfig(); setConfig();
} }
</script> </script>
<template> <template>
<div class="w-100"> <div
<div class="input-group input-group-sm" style="width: calc(100% - 24px)"> class="d-flex justify-content-center align-items-center object-fill border rounded text-bg-light w-100 h-100"
<input ><strong>
type="text" {{ settingsStore.remote.STATION.mycall}}-{{ settingsStore.remote.STATION.myssid}}
class="form-control" </strong>
style="min-width: 3em"
placeholder="mycall"
v-model="settings.remote.STATION.mycall"
/>
<span class="input-group-text">-</span>
<input
type="text"
class="form-control"
style="min-width: 2em; max-width: 2.5em"
placeholder="id"
v-model="settings.remote.STATION.myssid"
/>
<a
class="btn btn-sm btn-secondary"
title="Apply changes to callsign/ssid"
@click="updateMyCall"
><i class="bi bi-check"></i
></a>
</div>
</div> </div>
</template> </template>