mirror of
https://github.com/directus/directus.git
synced 2026-01-30 13:58:05 -05:00
2897264acb
* Use variables for default colors in boolean interface/display Fixes #10333 * Fix translations name
56 lines
961 B
Vue
56 lines
961 B
Vue
<template>
|
|
<v-checkbox
|
|
block
|
|
:icon-on="iconOn"
|
|
:icon-off="iconOff"
|
|
:label="label"
|
|
:model-value="value"
|
|
:indeterminate="value === null"
|
|
:disabled="disabled"
|
|
:style="{
|
|
'--v-checkbox-color': colorOn,
|
|
'--v-checkbox-unchecked-color': colorOff,
|
|
}"
|
|
@update:model-value="$emit('input', $event)"
|
|
/>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { defineComponent } from 'vue';
|
|
import { i18n } from '@/lang';
|
|
|
|
export default defineComponent({
|
|
props: {
|
|
value: {
|
|
type: Boolean,
|
|
default: null,
|
|
},
|
|
disabled: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
label: {
|
|
type: String,
|
|
default: () => i18n.global.t('enabled'),
|
|
},
|
|
iconOn: {
|
|
type: String,
|
|
default: 'check_box',
|
|
},
|
|
iconOff: {
|
|
type: String,
|
|
default: 'check_box_outline_blank',
|
|
},
|
|
colorOn: {
|
|
type: String,
|
|
default: 'var(--primary)',
|
|
},
|
|
colorOff: {
|
|
type: String,
|
|
default: 'var(--foreground-subdued)',
|
|
},
|
|
},
|
|
emits: ['input'],
|
|
});
|
|
</script>
|