43 lines
746 B
Vue
43 lines
746 B
Vue
<template>
|
|
<div class="check" :class="{ checked: value, disabled: disabled }" @keydown="handleKeyDown" @click="handleClick" tabindex="0">
|
|
<div class="control">
|
|
<div class="inner"></div>
|
|
</div>
|
|
<div class="label">{{ title }}</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
title: String,
|
|
value: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
disabled: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
handleClick()
|
|
{
|
|
if (this.disabled)
|
|
return;
|
|
|
|
this.$emit('input', !this.value);
|
|
},
|
|
|
|
handleKeyDown(event)
|
|
{
|
|
if (event.keyCode == 32)
|
|
{
|
|
this.handleClick();
|
|
event.preventDefault();
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script> |