webapp: Reduce wasted horizontal space for better mobile UX
This commit is contained in:
parent
41f3955429
commit
a7479d33e3
@ -2,7 +2,7 @@
|
|||||||
<div class="card" :class="{
|
<div class="card" :class="{
|
||||||
'border-info': channelType == 'AC',
|
'border-info': channelType == 'AC',
|
||||||
'border-secondary': channelType == 'INV'
|
'border-secondary': channelType == 'INV'
|
||||||
}">
|
}" style="overflow: hidden">
|
||||||
<div v-if="channelType == 'INV'" class="card-header text-bg-secondary">
|
<div v-if="channelType == 'INV'" class="card-header text-bg-secondary">
|
||||||
{{ $t('inverterchannelinfo.General') }}
|
{{ $t('inverterchannelinfo.General') }}
|
||||||
</div>
|
</div>
|
||||||
@ -16,24 +16,17 @@
|
|||||||
{{ $t('inverterchannelinfo.Phase', { num: channelNumber + 1 }) }}
|
{{ $t('inverterchannelinfo.Phase', { num: channelNumber + 1 }) }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="card-body">
|
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-striped table-hover">
|
<table class="table table-striped table-hover" style="margin: 0">
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th scope="col">{{ $t('inverterchannelinfo.Property') }}</th>
|
|
||||||
<th style="text-align: right" scope="col">{{ $t('inverterchannelinfo.Value') }}</th>
|
|
||||||
<th scope="col">{{ $t('inverterchannelinfo.Unit') }}</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr v-for="(property, key) in channelData" :key="`prop-${key}`">
|
<tr v-for="(property, key) in channelData" :key="`prop-${key}`">
|
||||||
<template v-if="key != 'name' && property">
|
<template v-if="key != 'name' && property">
|
||||||
<th scope="row">{{ $t('inverterchannelproperty.' + key) }}</th>
|
<th scope="row">{{ $t('inverterchannelproperty.' + key) }}</th>
|
||||||
<td style="text-align: right">
|
<td style="text-align: right; padding-right: 0;">
|
||||||
{{ $n(property.v, 'decimal', {
|
{{ $n(property.v, 'decimal', {
|
||||||
minimumFractionDigits: property.d,
|
minimumFractionDigits: property.d,
|
||||||
maximumFractionDigits: property.d})
|
maximumFractionDigits: property.d
|
||||||
|
})
|
||||||
}}
|
}}
|
||||||
</td>
|
</td>
|
||||||
<td>{{ property.u }}</td>
|
<td>{{ property.u }}</td>
|
||||||
@ -43,7 +36,6 @@
|
|||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
|
|||||||
@ -317,10 +317,7 @@
|
|||||||
"inverterchannelinfo": {
|
"inverterchannelinfo": {
|
||||||
"String": "String {num}",
|
"String": "String {num}",
|
||||||
"Phase": "Phase {num}",
|
"Phase": "Phase {num}",
|
||||||
"General": "Allgemein",
|
"General": "Allgemein"
|
||||||
"Property": "Eigenschaft",
|
|
||||||
"Value": "Wert",
|
|
||||||
"Unit": "Einheit"
|
|
||||||
},
|
},
|
||||||
"invertertotalinfo": {
|
"invertertotalinfo": {
|
||||||
"TotalYieldTotal": "Gesamtertrag Insgesamt",
|
"TotalYieldTotal": "Gesamtertrag Insgesamt",
|
||||||
|
|||||||
@ -317,10 +317,7 @@
|
|||||||
"inverterchannelinfo": {
|
"inverterchannelinfo": {
|
||||||
"String": "String {num}",
|
"String": "String {num}",
|
||||||
"Phase": "Phase {num}",
|
"Phase": "Phase {num}",
|
||||||
"General": "General",
|
"General": "General"
|
||||||
"Property": "Property",
|
|
||||||
"Value": "Value",
|
|
||||||
"Unit": "Unit"
|
|
||||||
},
|
},
|
||||||
"invertertotalinfo": {
|
"invertertotalinfo": {
|
||||||
"TotalYieldTotal": "Total Yield Total",
|
"TotalYieldTotal": "Total Yield Total",
|
||||||
|
|||||||
@ -317,10 +317,7 @@
|
|||||||
"inverterchannelinfo": {
|
"inverterchannelinfo": {
|
||||||
"String": "Ligne {num}",
|
"String": "Ligne {num}",
|
||||||
"Phase": "Phase {num}",
|
"Phase": "Phase {num}",
|
||||||
"General": "General",
|
"General": "General"
|
||||||
"Property": "Propriété",
|
|
||||||
"Value": "Valeur",
|
|
||||||
"Unit": "Unité"
|
|
||||||
},
|
},
|
||||||
"invertertotalinfo": {
|
"invertertotalinfo": {
|
||||||
"TotalYieldTotal": "Rendement total",
|
"TotalYieldTotal": "Rendement total",
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user