40 lines
		
	
	
		
			795 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			40 lines
		
	
	
		
			795 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
|   <div class="btn-group-toggle" data-toggle="buttons">
 | |
|     <label class="btn" :class="[{ active: value }, buttonClasses]">
 | |
|       <input v-model="model" type="checkbox" checked="" autocomplete="off">
 | |
|       <slot></slot>
 | |
|     </label>
 | |
|   </div>
 | |
| </template>
 | |
| <script>
 | |
|   export default {
 | |
|     name: 'button-checkbox',
 | |
|     props: {
 | |
|       value: {
 | |
|         type: Boolean,
 | |
|         description: 'Checked value'
 | |
|       },
 | |
|       buttonClasses: {
 | |
|         type: [String, Object],
 | |
|         description: 'Inner button css classes'
 | |
|       }
 | |
|     },
 | |
|     model: {
 | |
|       prop: 'value',
 | |
|       event: 'change'
 | |
|     },
 | |
|     computed: {
 | |
|       model: {
 | |
|         get() {
 | |
|           return this.value
 | |
|         },
 | |
|         set(val) {
 | |
|           this.$emit('change', val)
 | |
|         }
 | |
|       }
 | |
|     }
 | |
|   }
 | |
| </script>
 | |
| <style>
 | |
| </style>
 |