Dan Elbert
18603dc783
Some checks failed
parsley/pipeline/head There was a failure building this commit
64 lines
1.2 KiB
Vue
64 lines
1.2 KiB
Vue
<template>
|
|
<div>
|
|
|
|
<div class="field">
|
|
<label class="label is-small">Name</label>
|
|
<div class="control">
|
|
<input class="input is-small" type="text" placeholder="Name" v-model="taskItem.name" @keydown="inputKeydown" ref="nameInput">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="label is-small">Quantity</label>
|
|
<div class="control">
|
|
<input class="input is-small" type="text" placeholder="Qty" v-model="taskItem.quantity" @keydown="inputKeydown">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<div class="control">
|
|
<button class="button is-primary" @click="save">Add</button>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
props: {
|
|
taskItem: {
|
|
required: true,
|
|
type: Object
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
inputKeydown(evt) {
|
|
switch (evt.key) {
|
|
case "Enter":
|
|
evt.preventDefault();
|
|
this.save();
|
|
}
|
|
},
|
|
|
|
save() {
|
|
this.$emit("save", this.taskItem);
|
|
},
|
|
|
|
focus() {
|
|
this.$refs.nameInput.focus();
|
|
}
|
|
},
|
|
|
|
mounted() {
|
|
this.focus();
|
|
}
|
|
}
|
|
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
</style> |