starts working on ItemInput

This commit is contained in:
2019-10-04 14:47:45 +02:00
parent f1548aedfa
commit 1ff2429244
2 changed files with 68 additions and 54 deletions

View File

@@ -1,42 +1,43 @@
<template>
<div class="container is-paddingless">
<div class="field has-addons">
<div class="control is-expanded"
:class="{'is-loading': is_loading }">
<input type="text"
v-model="item_name"
@input="autoCompletion"
class="input"
:class="{'is-danger': no_results,
'is-warning': auto_open}"
autocomplete="on">
</input>
</div>
<div class="control">
<input type="text" class="input"
:class="{'is-danger': !item_price}"
v-model.number="item_price"></input>
</div>
<div class="control">
<button class="button is-primary"
:disabled="no_results"
@click="addItem"
>+</button>
</div>
</div>
<div class="dropdown" :class="{'is-active': auto_open}">
<div class="dropdown-menu">
<div class="dropdown-content">
<a v-for="(result,i) in results" :key="i"
@click="setResult(result)"
class="dropdown-item"
>
{{ result.name }}
</a>
<div class="container is-paddingless">
<p class="heading">Ajouter un objet</p>
<div class="field has-addons">
<div class="control is-expanded" :class="{'is-loading': is_loading }">
<input type="text"
v-model="item_name"
@input="autocompletion"
class="input"
:class="{'is-danger': no_results,
'is-warning': auto_open}"
autocomplete="on"
></input>
</div>
<div class="control">
<input type="text"
class="input"
:class="{'is-danger': !item_price}"
v-model.number="item_price"
></input>
</div>
</div>
</div>
<div class="control">
<button class="button is-primary"
:disabled="no_results"
@click="additem"
>+</button>
</div>
</div>
<div class="dropdown" :class="{'is-active': auto_open}">
<div class="dropdown-menu">
<div class="dropdown-content">
<a v-for="(result,i) in results"
:key="i"
@click="setresult(result)"
class="dropdown-item"
>{{ result.name }}</a>
</div>
</div>
</div>
</div>
</template>
<script>
@@ -63,7 +64,7 @@
this.no_results = false;
} else {
this.results = this.source.filter(item => {
return item.name.includes(this.item_name);
return item.name.toUpperCase().includes(this.item_name.toUpperCase());
});
// Update status
if (this.results.length == 0) {
@@ -76,13 +77,13 @@
},
setResult(result) {
this.item_name = result.name;
this.item_price = result.sell_value;
this.item_price = result.base_price;
this.auto_open = false;
},
addItem () {
this.$emit("addItem", {
name: this.item_name,
sell_value: this.item_price
base_price: this.item_price
});
this.item_name = '';
this.item_price = '';