ui improvements

This commit is contained in:
liamcottle
2024-07-17 01:06:53 +12:00
parent 35db5920c4
commit a52a9f8a79

View File

@@ -23,21 +23,33 @@
<div id="app" class="space-y-2 p-3"> <div id="app" class="space-y-2 p-3">
<div class="border bg-gray-50 p-3 rounded"> <div class="border bg-gray-50 p-3 rounded shadow">
<div class="font-bold">RNode Flasher</div> <div class="font-bold">RNode Flasher</div>
<div>Only RAK4631 is supported at this time.</div> <div>Only RAK4631 is supported at this time.</div>
</div> </div>
<div class="border bg-gray-50 p-3 rounded"> <div class="border bg-gray-50 rounded shadow">
<div class="mb-1">1. Put device into DFU Mode</div>
<div class="border-b px-2 py-1">
1. Put device into DFU Mode
</div>
<div class="p-3">
<button @click="enterDfuMode" class="border border-gray-500 px-2 bg-gray-100 hover:bg-gray-200 rounded"> <button @click="enterDfuMode" class="border border-gray-500 px-2 bg-gray-100 hover:bg-gray-200 rounded">
Enter DFU Mode Enter DFU Mode
</button> </button>
</div> </div>
<div class="border bg-gray-50 p-3 rounded"> </div>
<div class="border bg-gray-50 rounded shadow">
<div class="border-b px-2 py-1">
2. Select firmware to flash (.zip)
</div>
<div class="p-3">
<div class="mb-1">2. Select firmware.zip to flash</div>
<div class="mb-1"> <div class="mb-1">
<input ref="file" type="file"/> <input ref="file" type="file"/>
</div> </div>
@@ -55,11 +67,28 @@
<div class="h-2 rounded-full bg-blue-600" :style="{ 'width': `${flashingProgress}%`}"></div> <div class="h-2 rounded-full bg-blue-600" :style="{ 'width': `${flashingProgress}%`}"></div>
</div> </div>
</div> </div>
</div>
<div class="border-t px-2 py-1">
<div class="text-sm space-x-1">
<a target="_blank" href="https://github.com/markqvist/RNode_Firmware/releases" class="text-blue-500 hover:underline">Official Firmware</a>
<span></span>
<a target="_blank" href="https://github.com/liberatedsystems/RNode_Firmware_CE/releases" class="text-blue-500 hover:underline">CE Firmware</a>
<span></span>
<a target="_blank" href="https://github.com/attermann/microReticulum_Firmware/releases" class="text-blue-500 hover:underline">Transport Node Firmware</a>
</div>
</div>
</div> </div>
<div class="border bg-gray-50 p-3 rounded"> <div class="border bg-gray-50 rounded shadow">
<div class="mb-1">3. Provision EEPROM with device info, checksum and signature.</div>
<div class="border-b px-2 py-1">
3. Provision EEPROM with device info, checksum and signature.
</div>
<div class="p-3">
<div class="flex mb-1 space-x-1"> <div class="flex mb-1 space-x-1">
<div class="min-w-[70px] my-auto text-right">Product</div> <div class="min-w-[70px] my-auto text-right">Product</div>
<select v-model="selectedProduct" class="min-w-[250px] bg-white border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block pl-2 pr-8"> <select v-model="selectedProduct" class="min-w-[250px] bg-white border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block pl-2 pr-8">
@@ -79,17 +108,33 @@
Provision Provision
</button> </button>
</div> </div>
</div> </div>
<div class="border bg-gray-50 p-3 rounded"> </div>
<div class="mb-1">4. Set Firmware Hash, for now it uses what the board knows, will fix later.</div>
<div class="border bg-gray-50 rounded shadow">
<div class="border-b px-2 py-1">
4. Set Firmware Hash, for now it uses what the board knows, will fix later.
</div>
<div class="p-3">
<button @click="setFirmwareHash" class="border border-gray-500 px-2 bg-gray-100 hover:bg-gray-200 rounded"> <button @click="setFirmwareHash" class="border border-gray-500 px-2 bg-gray-100 hover:bg-gray-200 rounded">
Set Firmware Hash Set Firmware Hash
</button> </button>
</div> </div>
<div class="border bg-gray-50 p-3 rounded"> </div>
<div class="mb-1">5. Configure TNC Mode</div>
<div class="border bg-gray-50 rounded shadow">
<div class="border-b px-2 py-1">
5. Configure TNC Mode
</div>
<div class="p-3">
<div class="flex mb-1 space-x-1"> <div class="flex mb-1 space-x-1">
<div class="min-w-[125px] my-auto text-right">Frequency (Hz)</div> <div class="min-w-[125px] my-auto text-right">Frequency (Hz)</div>
<input v-model="configFrequency" type="number" class="min-w-[250px] bg-white border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block px-2"> <input v-model="configFrequency" type="number" class="min-w-[250px] bg-white border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block px-2">
@@ -124,10 +169,19 @@
Disable Disable
</button> </button>
</div> </div>
</div> </div>
<div class="border bg-gray-50 p-3 rounded"> </div>
<div class="mb-1">Extra Tools</div>
<div class="border bg-gray-50 rounded shadow">
<div class="border-b px-2 py-1">
Extra Tools
</div>
<div class="p-3">
<div class="space-x-1"> <div class="space-x-1">
<button @click="detect" class="border border-gray-500 px-2 bg-gray-100 hover:bg-gray-200 rounded"> <button @click="detect" class="border border-gray-500 px-2 bg-gray-100 hover:bg-gray-200 rounded">
Detect RNode Detect RNode
@@ -142,7 +196,11 @@
Wipe EEPROM Wipe EEPROM
</button> </button>
</div> </div>
<div class="text-sm text-gray-500">EEPROM dumps are shown in dev tools console.</div> <div class="text-sm text-gray-500">EEPROM dumps are shown in dev tools console.</div>
</div>
</div> </div>
</div> </div>