Add new Vue.js component to handle submit and cancel buttons

This commit is contained in:
Frederic Guillot
2016-09-04 20:03:24 -04:00
parent f9bca15b0b
commit 21f8cebe85
5 changed files with 43 additions and 10 deletions

View File

@@ -0,0 +1,30 @@
Vue.component('submit-cancel', {
props: ['labelButton', 'labelOr', 'labelCancel', 'callback'],
template: '<div class="form-actions">' +
'<button type="button" class="btn btn-blue" @click="onSubmit" :disabled="isLoading">' +
'<span v-show="isLoading"><i class="fa fa-spinner fa-pulse"></i> </span>' +
'{{ labelButton }}' +
'</button> ' +
'{{ labelOr }} <a href="#" v-on:click.prevent="onCancel">{{ labelCancel }}</a>' +
'</div>'
,
data: function () {
return {
loading: false
};
},
computed: {
isLoading: function () {
return this.loading;
}
},
methods: {
onSubmit: function () {
this.loading = true;
this.callback();
},
onCancel: function () {
_KB.get('Popover').close();
}
}
});