Vue.component('weather-panel', {
    props: ['tempc', 'windkmh', 'value'],
    template: '\
    <div class="weather-panel">\
    <div class="weather-unit">Temperature: {{ tempc }}</div>\
    <div class="weather-unit">Windspeed: {{ windkmh }}</div>\
    <div class="weather-unit">\
    <input type="checkbox" :checked="value" v-on:change="update">Verified</input>\
    </div>\
    </div>',
    methods: {
        update: function(event) {
            this.$emit('input', event.target.checked);
        }

    }
});


var vm = new Vue({
    el: "#weatherPanel",
    data: {
        temp: 20,
        wind: 10,
        checked: false
    }


});