webapp: optimize syslog settings

* avoid duplicate id for hostname input * hide server and port inputs if syslog disabled
hoylabs · Sep 28, 2024 · d0ba065 · d0ba065
1 parent aa159fd
commit d0ba065
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 16 deletions.
diff --git a/webapp/src/locales/de.json b/webapp/src/locales/de.json
@@ -511,7 +511,8 @@
         "MdnsSettings": "mDNS-Einstellungen",
         "EnableSyslog": "Syslog aktivieren",
         "SyslogSettings": "Syslog-Einstellungen",
-        "Port": "Port:"
+        "SyslogHostname": "Syslog Server",
+        "SyslogPort": "Port"
     },
     "mqttadmin": {
         "MqttSettings": "MQTT-Einstellungen",

diff --git a/webapp/src/locales/en.json b/webapp/src/locales/en.json
@@ -513,7 +513,8 @@
         "MdnsSettings": "mDNS Settings",
         "EnableSyslog": "Enable Syslog",
         "SyslogSettings": "Syslog Settings",
-        "Port": "Port:"
+        "SyslogHostname": "Syslog Server",
+        "SyslogPort": "Port"
     },
     "mqttadmin": {
         "MqttSettings": "MQTT Settings",

diff --git a/webapp/src/views/NetworkAdminView.vue b/webapp/src/views/NetworkAdminView.vue
@@ -89,20 +89,22 @@
                     type="checkbox"
                 />
 
-                <InputElement
-                    :label="$t('networkadmin.Hostname', { num: 1 })"
-                    v-model="networkConfigList.sysloghostname"
-                    type="text"
-                    maxlength="128"
-                />
-
-                <InputElement
-                    :label="$t('networkadmin.Port')"
-                    v-model="networkConfigList.syslogport"
-                    type="number"
-                    min="1"
-                    max="65535"
-                />
+                <div v-if="networkConfigList.syslogenabled">
+                    <InputElement
+                        :label="$t('networkadmin.SyslogHostname')"
+                        v-model="networkConfigList.sysloghostname"
+                        type="text"
+                        maxlength="128"
+                    />
+
+                    <InputElement
+                        :label="$t('networkadmin.SyslogPort')"
+                        v-model="networkConfigList.syslogport"
+                        type="number"
+                        min="1"
+                        max="65535"
+                    />
+                </div>
             </CardElement>
 
             <CardElement :text="$t('networkadmin.AdminAp')" textVariant="text-bg-primary" add-space>