<div id="app_{{ widget.name }}" class="field-item">
    <input type="hidden" name="{{ widget.name }}" value="{{ widget.value }}">
    <el-input v-model="value" :type="type" :name="name" @change="updateValue" :disabled="disabled" style="width: 400px;"/>
</div>
<script>
    var value = '{{ widget.value }}'
    var filed_value = ''
    if (value == '' || value == 'None') {
        filed_value = ''
    }else{
        filed_value = value
    }
    if ('{{ widget.el_disabled }}' == 'True') {
        disabled = true
    }else{
        disabled = false
    }
    new Vue({
        el: '#app_{{ widget.name }}',
        data: {
            type: 'email',
            name: '{{ widget.name }}',
            value: filed_value,
            field_name: '{{ widget.field_name }}',
            disabled: disabled
        },
        methods: {
            updateValue() {
                this.$el.querySelector('input[name="{{ widget.name }}"]').value = this.value;
            }
        }
    })
</script>
