Mirror/liamcottle___reticulum-meshchat
1
0
Fork 0
mirror of https://github.com/liamcottle/reticulum-meshchat.git synced 2026-04-27 16:10:32 +00:00
Code Issues Projects Releases Packages Wiki Activity

ui improvements for interfaces page

Browse source
This commit is contained in:
liamcottle 2025-01-02 02:03:25 +13:00
commit 629e8d47fb
1 changed files with 34 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

54
src/frontend/components/interfaces/Interface.vue
View file

@ -48,34 +48,22 @@
<div class="text-sm flex space-x-1 dark:text-zinc-100">
<!-- auto interface -->
<span v-if="iface.type === 'AutoInterface'">
<div v-if="iface.type === 'AutoInterface'">
{{ iface.type }} • Ethernet and WiFi
</span>
</div>
<!-- tcp client interface -->
<span v-else-if="iface.type === 'TCPClientInterface'">
<div v-else-if="iface.type === 'TCPClientInterface'">
{{ iface.type }} • {{ iface.target_host }}:{{ iface.target_port }}
</span>
</div>
<!-- tcp server interface -->
<span v-else-if="iface.type === 'TCPServerInterface'">
<div v-else-if="iface.type === 'TCPServerInterface'">
{{ iface.type }} • {{ iface.listen_ip }}:{{ iface.listen_port }}
</span>
</div>
<!-- udp interface -->
<span v-else-if="iface.type === 'UDPInterface'">
{{ iface.type }} • {{ iface.listen_ip }}:{{ iface.listen_port }} • {{ iface.forward_ip }}:{{ iface.forward_port }}
</span>
<!-- rnode interface details -->
<span v-else-if="iface.type === 'RNodeInterface'">
{{ iface.type }} • {{ iface.port }} • freq={{ iface.frequency }} • bw={{ iface.bandwidth }} • power={{ iface.txpower }}dBm • sf={{ iface.spreadingfactor }} • cr={{ iface.codingrate }}
</span>
<!-- unknown interface types -->
<span v-else>
{{ iface.type ?? 'Unknown Interface Type' }}
</span>
<!-- other interface types -->
<div v-else>{{ iface.type }}</div>
</div>
</div>
@ -167,6 +155,29 @@
</div>
<!-- extra interface details -->
<div v-if="['UDPInterface', 'RNodeInterface'].includes(iface.type)" class="flex p-2 border-t dark:border-zinc-700">
<div class="text-sm flex space-x-1 dark:text-zinc-100">
<!-- udp interface -->
<div v-if="iface.type === 'UDPInterface'">
<div>Listen: {{ iface.listen_ip }}:{{ iface.listen_port }}</div>
<div>Forward: {{ iface.forward_ip }}:{{ iface.forward_port }}</div>
</div>
<!-- rnode interface details -->
<div v-else-if="iface.type === 'RNodeInterface'">
<div>Port: {{ iface.port }}</div>
<div>Frequency: {{ formatFrequency(iface.frequency) }}</div>
<div>Bandwidth: {{ formatFrequency(iface.bandwidth) }}</div>
<div>Spreading Factor: {{ iface.spreadingfactor }}</div>
<div>Coding Rate: {{ iface.codingrate }}</div>
<div>Transmit Power: {{ iface.txpower }}dBm</div>
</div>
</div>
</div>
<div class="flex bg-gray-50 p-1 text-sm text-gray-500 space-x-1 border-t rounded-b dark:bg-zinc-800 dark:text-white dark:border-zinc-700">
<!-- status -->
@ -234,6 +245,9 @@ export default {
formatBytes: function(bytes) {
return Utils.formatBytes(bytes);
},
formatFrequency(hz) {
return Utils.formatFrequency(hz);
},
},
}
</script>