Skip to content

Commit

Permalink
fix(ui): use inverted checkbox to clarify settings (#3823)
Browse files Browse the repository at this point in the history
  • Loading branch information
robertsLando authored Jul 22, 2024
1 parent cac4a0d commit 7b48ad9
Show file tree
Hide file tree
Showing 2 changed files with 36 additions and 8 deletions.
26 changes: 26 additions & 0 deletions src/components/custom/InvertedCheckbox.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
<template>
<v-checkbox v-model="inverted" v-bind="$attrs"></v-checkbox>
</template>

<script>
export default {
props: {
value: {
type: Boolean,
default: false,
},
},
computed: {
inverted: {
get() {
return !this.value
},
set(value) {
this.$emit('input', !value)
},
},
},
}
</script>

<style></style>
18 changes: 10 additions & 8 deletions src/views/Settings.vue
Original file line number Diff line number Diff line change
Expand Up @@ -1365,12 +1365,12 @@
</v-expansion-panels>

<v-container cols="12" sm="6" class="ml-1">
<v-switch
hint="Enable this to use Z-Wave JS UI only as Control Panel"
<inverted-checkbox
persistent-hint
label="Disable MQTT Gateway"
label="MQTT Gateway"
hint="Enable MQTT gateway"
v-model="newMqtt.disabled"
></v-switch>
></inverted-checkbox>
</v-container>

<v-expansion-panels
Expand Down Expand Up @@ -1735,14 +1735,14 @@
v-if="newZwave.serverEnabled"
cols="6"
>
<v-switch
hint="Disable this to prevent applications like Home Assistant to automatically detect and connect to your Z-Wave JS UI instance"
<inverted-checkbox
hint="Allows applications like Home Assistant to automatically detect and connect to your Z-Wave JS UI instance"
persistent-hint
label="Disable DNS Discovery"
label="DNS Discovery"
v-model="
newZwave.serverServiceDiscoveryDisabled
"
></v-switch>
></inverted-checkbox>
</v-col>
</v-row>
<v-row v-if="!newMqtt.disabled">
Expand Down Expand Up @@ -1909,6 +1909,8 @@ export default {
DialogGatewayValue: () =>
import('@/components/dialogs/DialogGatewayValue.vue'),
fileInput: () => import('@/components/custom/file-input.vue'),
invertedCheckbox: () =>
import('@/components/custom/InvertedCheckbox.vue'),
},
props: {
socket: {
Expand Down

0 comments on commit 7b48ad9

Please sign in to comment.