webapp: use wide labels for battery discharge current limit settings,…

… hide settings
hoylabs · Oct 23, 2024 · 8bb5ac5 · 8bb5ac5
1 parent 25f1902
commit 8bb5ac5
Showing 1 changed file with 14 additions and 3 deletions.
diff --git a/webapp/src/views/BatteryAdminView.vue b/webapp/src/views/BatteryAdminView.vue
@@ -128,13 +128,15 @@
                 <InputElement
                     :label="$t('batteryadmin.LimitDischargeCurrent')"
                     v-model="batteryConfigList.enable_discharge_current_limit"
+                    :wide="true"
                     type="checkbox"
                 />
 
                 <template v-if="batteryConfigList.enable_discharge_current_limit">
                     <InputElement
                         :label="$t('batteryadmin.DischargeCurrentLimit')"
                         v-model="batteryConfigList.discharge_current_limit"
+                        :wide="true"
                         type="number"
                         min="0"
                         step="0.1"
@@ -143,7 +145,9 @@
 
                     <InputElement
                         :label="$t('batteryadmin.DischargeCurrentLimitBelowSoc')"
+                        v-show="batteryConfigList.enabled"
                         v-model="batteryConfigList.discharge_current_limit_below_soc"
+                        :wide="true"
                         type="number"
                         min="0"
                         max="100"
@@ -154,7 +158,9 @@
 
                     <InputElement
                         :label="$t('batteryadmin.DischargeCurrentLimitBelowVoltage')"
+                        v-show="batteryConfigList.enabled"
                         v-model="batteryConfigList.discharge_current_limit_below_voltage"
+                        :wide="true"
                         type="number"
                         min="0"
                         max="60"
@@ -165,6 +171,8 @@
 
                     <InputElement
                         :label="$t('batteryadmin.UseBatteryReportedDischargeCurrentLimit')"
+                        :wide="true"
+                        v-show="batteryConfigList.enabled"
                         v-model="batteryConfigList.use_battery_reported_discharge_current_limit"
                         type="checkbox"
                     />
@@ -179,31 +187,34 @@
                     <div
                         class="alert alert-secondary"
                         role="alert"
+                        v-show="batteryConfigList.enabled"
                         v-html="$t('batteryadmin.BatteryReportedDischargeCurrentLimitInfo')"
                     ></div>
 
-                    <template v-if="batteryConfigList.provider == 2">
+                    <template v-if="batteryConfigList.enabled && batteryConfigList.provider == 2">
                         <InputElement
                             :label="$t('batteryadmin.MqttDischargeCurrentTopic')"
                             v-model="batteryConfigList.mqtt_discharge_current_topic"
+                            :wide="true"
                             type="text"
                             maxlength="256"
                         />
 
                         <InputElement
                             :label="$t('batteryadmin.MqttJsonPath')"
                             v-model="batteryConfigList.mqtt_discharge_current_json_path"
+                            :wide="true"
                             type="text"
                             maxlength="128"
                             :tooltip="$t('batteryadmin.MqttJsonPathDescription')"
                         />
 
                         <div class="row mb-3">
-                            <label for="mqtt_amperage_unit" class="col-sm-2 col-form-label">
+                            <label for="mqtt_amperage_unit" class="col-sm-4 col-form-label">
                                 {{ $t('batteryadmin.MqttAmperageUnit') }}
                             </label>
 
-                            <div class="col-sm-10">
+                            <div class="col-sm-8">
                                 <select
                                     id="mqtt_amperage_unit"
                                     class="form-select"