patrick/OpenDTU
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

webapp: Show current active pin config

Browse Source
This commit is contained in:
Thomas Basler 2023-01-16 23:41:58 +01:00
parent 3d3feb3517
commit 19b42223f5
7 changed files with 87 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/WebApi_device.cpp
View File

@ -4,6 +4,7 @@
*/ */
#include "WebApi_device.h" #include "WebApi_device.h"
#include "Configuration.h" #include "Configuration.h"
#include "PinMapping.h"
#include "WebApi.h" #include "WebApi.h"
#include "WebApi_errors.h" #include "WebApi_errors.h"
#include "helper.h" #include "helper.h"
@ -32,8 +33,27 @@ void WebApiDeviceClass::onDeviceAdminGet(AsyncWebServerRequest* request)
AsyncJsonResponse* response = new AsyncJsonResponse(false, MQTT_JSON_DOC_SIZE); AsyncJsonResponse* response = new AsyncJsonResponse(false, MQTT_JSON_DOC_SIZE);
JsonObject root = response->getRoot(); JsonObject root = response->getRoot();
const CONFIG_T& config = Configuration.get(); const CONFIG_T& config = Configuration.get();
const PinMapping_t& pin = PinMapping.get();
root[F("dev_pinmapping")] = config.Dev_PinMapping; JsonObject curPin = root.createNestedObject("curPin");
curPin[F("name")] = config.Dev_PinMapping;
JsonObject nrfObj = curPin.createNestedObject("nrf24");
nrfObj[F("clk")] = pin.nrf24_clk;
nrfObj[F("cs")] = pin.nrf24_cs;
nrfObj[F("en")] = pin.nrf24_en;
nrfObj[F("irq")] = pin.nrf24_irq;
nrfObj[F("miso")] = pin.nrf24_miso;
nrfObj[F("mosi")] = pin.nrf24_mosi;
JsonObject ethObj = curPin.createNestedObject("eth");
ethObj[F("enabled")] = pin.eth_enabled;
ethObj[F("phy_addr")] = pin.eth_phy_addr;
ethObj[F("power")] = pin.eth_power;
ethObj[F("mdc")] = pin.eth_mdc;
ethObj[F("mdio")] = pin.eth_mdio;
ethObj[F("type")] = pin.eth_type;
ethObj[F("clk_mode")] = pin.eth_clk_mode;
response->setLength(); response->setLength();
request->send(response); request->send(response);

45
webapp/src/components/PinInfo.vue
View File

@ -6,64 +6,78 @@
<tr> <tr>
<th>{{ $t('pininfo.Category') }}</th> <th>{{ $t('pininfo.Category') }}</th>
<th>{{ $t('pininfo.Name') }}</th> <th>{{ $t('pininfo.Name') }}</th>
<th>{{ $t('pininfo.Number') }}</th> <th>{{ $t('pininfo.ValueSelected') }}</th>
<th>{{ $t('pininfo.ValueActive') }}</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr> <tr>
<td rowspan="6">NRF24</td> <td rowspan="6">NRF24</td>
<td>MISO</td> <td>MISO</td>
<td>{{ pinAssignment?.nrf24?.miso }}</td> <td>{{ selectedPinAssignment?.nrf24?.miso }}</td>
<td>{{ currentPinAssignment?.nrf24?.miso }}</td>
</tr> </tr>
<tr> <tr>
<td>MOSI</td> <td>MOSI</td>
<td>{{ pinAssignment?.nrf24?.mosi }}</td> <td>{{ selectedPinAssignment?.nrf24?.mosi }}</td>
<td>{{ currentPinAssignment?.nrf24?.mosi }}</td>
</tr> </tr>
<tr> <tr>
<td>CLK</td> <td>CLK</td>
<td>{{ pinAssignment?.nrf24?.clk }}</td> <td>{{ selectedPinAssignment?.nrf24?.clk }}</td>
<td>{{ currentPinAssignment?.nrf24?.clk }}</td>
</tr> </tr>
<tr> <tr>
<td>IRQ</td> <td>IRQ</td>
<td>{{ pinAssignment?.nrf24?.irq }}</td> <td>{{ selectedPinAssignment?.nrf24?.irq }}</td>
<td>{{ currentPinAssignment?.nrf24?.irq }}</td>
</tr> </tr>
<tr> <tr>
<td>EN</td> <td>EN</td>
<td>{{ pinAssignment?.nrf24?.en }}</td> <td>{{ selectedPinAssignment?.nrf24?.en }}</td>
<td>{{ currentPinAssignment?.nrf24?.en }}</td>
</tr> </tr>
<tr> <tr>
<td>CS</td> <td>CS</td>
<td>{{ pinAssignment?.nrf24?.cs }}</td> <td>{{ selectedPinAssignment?.nrf24?.cs }}</td>
<td>{{ currentPinAssignment?.nrf24?.cs }}</td>
</tr> </tr>
<tr> <tr>
<td rowspan="7">Ethernet</td> <td rowspan="7">Ethernet</td>
<td>enabled</td> <td>enabled</td>
<td>{{ pinAssignment?.eth?.enabled }}</td> <td>{{ selectedPinAssignment?.eth?.enabled }}</td>
<td>{{ currentPinAssignment?.eth?.enabled }}</td>
</tr> </tr>
<tr> <tr>
<td>phy_addr</td> <td>phy_addr</td>
<td>{{ pinAssignment?.eth?.phy_addr }}</td> <td>{{ selectedPinAssignment?.eth?.phy_addr }}</td>
<td>{{ currentPinAssignment?.eth?.phy_addr }}</td>
</tr> </tr>
<tr> <tr>
<td>power</td> <td>power</td>
<td>{{ pinAssignment?.eth?.power }}</td> <td>{{ selectedPinAssignment?.eth?.power }}</td>
<td>{{ currentPinAssignment?.eth?.power }}</td>
</tr> </tr>
<tr> <tr>
<td>mdc</td> <td>mdc</td>
<td>{{ pinAssignment?.eth?.mdc }}</td> <td>{{ selectedPinAssignment?.eth?.mdc }}</td>
<td>{{ currentPinAssignment?.eth?.mdc }}</td>
</tr> </tr>
<tr> <tr>
<td>mdio</td> <td>mdio</td>
<td>{{ pinAssignment?.eth?.mdio }}</td> <td>{{ selectedPinAssignment?.eth?.mdio }}</td>
<td>{{ currentPinAssignment?.eth?.mdio }}</td>
</tr> </tr>
<tr> <tr>
<td>type</td> <td>type</td>
<td>{{ pinAssignment?.eth?.type }}</td> <td>{{ selectedPinAssignment?.eth?.type }}</td>
<td>{{ currentPinAssignment?.eth?.type }}</td>
</tr> </tr>
<tr> <tr>
<td>clk_mode</td> <td>clk_mode</td>
<td>{{ pinAssignment?.eth?.clk_mode }}</td> <td>{{ selectedPinAssignment?.eth?.clk_mode }}</td>
<td>{{ currentPinAssignment?.eth?.clk_mode }}</td>
</tr> </tr>
</tbody> </tbody>
@ -82,7 +96,8 @@ export default defineComponent({
CardElement, CardElement,
}, },
props: { props: {
pinAssignment: { type: Object as PropType<Device | undefined>, required: true }, selectedPinAssignment: { type: Object as PropType<Device | undefined>, required: true },
currentPinAssignment: { type: Object as PropType<Device | undefined>, required: true },
}, },
}); });
</script> </script>

3
webapp/src/locales/de.json
View File

@ -481,6 +481,7 @@
"PinOverview": "Anschlussübersicht", "PinOverview": "Anschlussübersicht",
"Category": "Kategorie", "Category": "Kategorie",
"Name": "Name", "Name": "Name",
"Number": "Nummer" "ValueSelected": "Ausgewählt",
"ValueActive": "Aktiv"
} }
} }

4
webapp/src/locales/en.json
View File

@ -481,6 +481,8 @@
"PinOverview": "Connection overview", "PinOverview": "Connection overview",
"Category": "Category", "Category": "Category",
"Name": "Name", "Name": "Name",
"Number": "Number" "Number": "Number",
"ValueSelected": "Selected",
"ValueActive": "Active"
} }
} }

3
webapp/src/locales/fr.json
View File

@ -481,6 +481,7 @@
"PinOverview": "Connection overview", "PinOverview": "Connection overview",
"Category": "Category", "Category": "Category",
"Name": "Name", "Name": "Name",
"Number": "Number" "ValueSelected": "Selected",
"ValueActive": "Active"
} }
} }

4
webapp/src/types/DeviceConfig.ts
View File

@ -1,3 +1,5 @@
import type { Device } from "./PinMapping";
export interface DeviceConfig { export interface DeviceConfig {
dev_pinmapping: string; curPin: Device;
} }

48
webapp/src/views/DeviceAdminView.vue
View File

@ -4,28 +4,28 @@
{{ alertMessage }} {{ alertMessage }}
</BootstrapAlert> </BootstrapAlert>
<form @submit="saveDtuConfig"> <nav>
<div class="nav nav-tabs" id="nav-tab" role="tablist">
<nav> <button class="nav-link active" id="nav-pin-tab" data-bs-toggle="tab" data-bs-target="#nav-pin"
<div class="nav nav-tabs" id="nav-tab" role="tablist"> type="button" role="tab" aria-controls="nav-pin" aria-selected="true">{{
<button class="nav-link active" id="nav-pin-tab" data-bs-toggle="tab" data-bs-target="#nav-pin" $t('deviceadmin.PinAssignment')
type="button" role="tab" aria-controls="nav-pin" aria-selected="true">{{ }}</button>
$t('deviceadmin.PinAssignment') </div>
}}</button> </nav>
</div> <div class="tab-content" id="nav-tabContent">
</nav> <div class="tab-pane fade show active" id="nav-pin" role="tabpanel" aria-labelledby="nav-pin-tab"
<div class="tab-content" id="nav-tabContent"> tabindex="0">
<div class="tab-pane fade show active" id="nav-pin" role="tabpanel" aria-labelledby="nav-pin-tab" <div class="card">
tabindex="0"> <div class="card-body">
<div class="card">
<div class="card-body">
<form @submit="savePinConfig">
<div class="row mb-3"> <div class="row mb-3">
<label for="inputPinProfile" class="col-sm-2 col-form-label">{{ <label for="inputPinProfile" class="col-sm-2 col-form-label">{{
$t('deviceadmin.SelectedProfile') $t('deviceadmin.SelectedProfile')
}}</label> }}</label>
<div class="col-sm-10"> <div class="col-sm-10">
<select class="form-select" id="inputPinProfile" v-model="deviceConfigList.dev_pinmapping"> <select class="form-select" id="inputPinProfile"
v-model="deviceConfigList.curPin.name">
<option v-for="device in pinMappingList" :value="device.name"> <option v-for="device in pinMappingList" :value="device.name">
{{ device.name }} {{ device.name }}
</option> </option>
@ -33,17 +33,21 @@
</div> </div>
</div> </div>
<div class="alert alert-danger mt-3" role="alert" v-html="$t('deviceadmin.ProfileHint')"></div> <div class="alert alert-danger mt-3" role="alert" v-html="$t('deviceadmin.ProfileHint')">
</div>
<PinInfo :pinAssignment="pinMappingList.find(i => i.name === deviceConfigList.dev_pinmapping)" /> <PinInfo
:selectedPinAssignment="pinMappingList.find(i => i.name === deviceConfigList.curPin.name)"
:currentPinAssignment="deviceConfigList.curPin" />
</div> <button type="submit" class="btn btn-primary mb-3">{{ $t('deviceadmin.Save') }}</button>
</form>
</div> </div>
</div> </div>
</div> </div>
</div>
<button type="submit" class="btn btn-primary mb-3">{{ $t('deviceadmin.Save') }}</button>
</form>
</BasePage> </BasePage>
</template> </template>
@ -109,7 +113,7 @@ export default defineComponent({
} }
); );
}, },
saveDtuConfig(e: Event) { savePinConfig(e: Event) {
e.preventDefault(); e.preventDefault();
const formData = new FormData(); const formData = new FormData();