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

webapp: optimize placement of device profile doc buttons

Browse Source 
* remove empty container for device profile links. if a device profile
  has no links, no buttons are generated, but a row was still part of
  the DOM, adding spurious space between the select and the alert with
  the hint.
* "float" the buttons to the right, as we always place these kinds of
  buttons to the right.
This commit is contained in:
Bernhard Kirchen 2024-10-27 19:57:25 +01:00 committed by Bernhard Kirchen
parent 121b7cfc40
commit c87ba97a2b
1 changed files with 15 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -78,19 +78,15 @@
</div>
</div>
<div class="row mb-3">
<div class="col-sm-2"></div>
<div class="col-sm-10">
<div
class="btn-group mb-2 me-2"
v-for="(doc, index) in pinMappingList.find(
(i) => i.name === deviceConfigList.curPin.name
)?.links"
<div class="mb-3 d-flex justify-content-end gap-3" v-if="docLinks.length">
<a
v-for="(doc, index) in docLinks"
:key="index"
:href="doc.url"
class="btn btn-primary"
target="_blank"
>{{ doc.name }}</a
>
<a :href="doc.url" class="btn btn-primary" target="_blank">{{ doc.name }}</a>
</div>
</div>
</div>
<div
@ -313,6 +309,12 @@ export default defineComponent({
this.deviceConfigList.led.every((v) => (v.brightness = this.deviceConfigList.led[0].brightness));
},
},
computed: {
docLinks() {
const mapping = this.pinMappingList.find((i) => i.name === this.deviceConfigList.curPin.name);
return mapping?.links || [];
},
},
methods: {
getPinMappingList() {
this.pinMappingLoading = true;