BookStack Code Mirror - bookstack/blob - resources/assets/js/components/toggle-switch.vue

   1
   2 <template>
   3     <div class="toggle-switch" @click="switch" :class="{'active': isActive}">
   4         <input type="hidden" :name="name" :value="value"/>
   5         <div class="switch-handle"></div>
   6     </div>
   7 </template>
   8
   9
  10 <script>
  11     module.exports = {
  12         props: ['name', 'value'],
  13         data: function() {
  14             return {
  15                 isActive: this.value == true && this.value != 'false'
  16             }
  17         },
  18         ready: function() {
  19             this.value = (this.value == true && this.value != 'false') ? 'true' : 'false';
  20         },
  21         methods: {
  22             switch: function() {
  23                 this.isActive = !this.isActive;
  24                 this.value = this.isActive ? 'true' : 'false';
  25             }
  26         }
  27     };
  28 </script>