<template>
    <v-layout>     
            <v-checkbox
                v-model="init_value"
                @change="changeCbx"
                hide-details class="shrink mr-2"
            ></v-checkbox>
        
            <v-text-field
                :label="__label"
                outline
                v-model=init_note
            ></v-text-field>
    </v-layout>
</template>

<script>
module.exports = {
    props : ['label', 'value', 'note'],
    mounted: function() {
      this.$nextTick( function() {
         this.init_note = this.note ? this.note : "";
         this.init_value = this.value;
      })
   },

    data () {
        return {
            init_value : false,
            init_note : ""
        }
        
    },

    methods : {
        changeCbx (n, o) {
        /*    if (n)  {
                this.init_note = "";
            } 
         */
            var prm = {checked: n, note: this.init_note};
            this.$emit('x_change',prm);
         
        }
    },
    computed : {
        __label () {
            if (this.label)
                return this.label;

            return "";
        },
        __placeholder () {
            if (this.placeholder)
                return this.placeholder;

            return "";
        },
        x_disabled () {
            if (this.init_value === "true" || this.init_value === true)
                return true;
            return false;
        },
        x_note () {
            if (this.note)
                return this.note;

            return "";
        }
    }
}
</script>
