Merge pull request #1524 from bartbutenaers/switch-custom-icon-non-cl…

…ickable Switch custom icon not clickable
FlowFuse · Dec 11, 2024 · a85ce73 · a85ce73
2 parents e12dcbf + cf43fea
commit a85ce73
Showing 1 changed file with 10 additions and 1 deletion.
diff --git a/ui/src/widgets/ui-switch/UISwitch.vue b/ui/src/widgets/ui-switch/UISwitch.vue
@@ -21,12 +21,21 @@
             v-if="!icon" v-model="status"
             :disabled="!state.enabled"
             :class="{'active': status, 'nrdb-ui-switch-default-cursor': !switchClickable}"
+            :style="{'pointer-events': switchClickable ? 'inherit' : 'none'}"
             hide-details="auto" color="primary"
             :loading="loading ? (status === true ? 'secondary' : 'primary') : null"
             readonly
             @click.stop="switchClickable ? toggle() : null"
         />
-        <v-btn v-else-if="!loading" variant="text" :disabled="!state.enabled" :icon="icon" :color="color" @click.stop="toggle" />
+        <v-btn
+            v-else-if="!loading"
+            variant="text"
+            :disabled="!state.enabled"
+            :style="{'pointer-events': switchClickable ? 'inherit' : 'none', cursor: switchClickable ? 'pointer' : 'default'}"
+            :icon="icon"
+            :color="color"
+            @click.stop="switchClickable ? toggle() : null"
+        />
         <v-progress-circular v-else indeterminate color="primary" />
     </div>
 </template>