shihaam/akaunting
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Input field is active after new item created

Browse Source
This commit is contained in:
benguozakinci@gmail.com
2021-08-03 13:07:09 +03:00
parent db8507b856
commit 7a4d28d755
4 changed files with 53 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
resources/assets/js/components/AkauntingItemButton.vue
View File

@ -21,9 +21,9 @@
type="text" type="text"
data-input="true" data-input="true"
class="form-control" class="form-control"
autocapitalize="default" autocorrect="ON" autocapitalize="default"
autocorrect="ON"
:placeholder="placeholder" :placeholder="placeholder"
:ref="'input-item-field-' + _uid"
v-model="search" v-model="search"
@input="onInput" @input="onInput"
@keydown.enter="onItemCreate" @keydown.enter="onItemCreate"
@ -33,7 +33,7 @@
</div> </div>
<ul class="aka-select-menu-options"> <ul class="aka-select-menu-options">
<div class="aka-select-menu-option" v-for="(item, index) in sortedItems" :key="index" @click="onItemSeleted(index, item.id)"> <div class="aka-select-menu-option" v-for="(item, index) in sortedItems" :key="index" @click="onItemSelected(item)">
<div class="item-select w-100"> <div class="item-select w-100">
<div class="item-select-column item-select-info w-75"> <div class="item-select-column item-select-info w-75">
<b class="item-select-info-name"><span>{{ item.name }}</span></b> <b class="item-select-info-name"><span>{{ item.name }}</span></b>
@ -196,7 +196,7 @@ export default {
data() { data() {
return { return {
item_list: [], item_list: [],
selected_items: [], invoiceItems: [],
search: '', // search column model search: '', // search column model
show: { show: {
item_selected: false, item_selected: false,
@ -208,6 +208,7 @@ export default {
show: false, show: false,
buttons: this.addNew.buttons, buttons: this.addNew.buttons,
}, },
newItems: [],
add_new_html: '', add_new_html: '',
money: { money: {
decimal: this.currency.decimal_mark, decimal: this.currency.decimal_mark,
@ -279,12 +280,6 @@ export default {
onItemList() { onItemList() {
this.show.item_list = true; this.show.item_list = true;
console.log(this.$refs['input-item-field-' + this._uid].focus());
setTimeout(function() {
this.$refs['input-item-field-' + this._uid].focus();
}.bind(this), 100);
}, },
onInput() { onInput() {
@ -303,60 +298,55 @@ export default {
} }
window.axios.get(url + '/common/items?search="' + this.search + '" limit:10') window.axios.get(url + '/common/items?search="' + this.search + '" limit:10')
.then(response => { .then(response => {
this.item_list = []; this.item_list = [];
let items = response.data.data; let items = response.data.data;
items.forEach(function (item, index) { items.forEach(function (item, index) {
this.item_list.push({ this.item_list.push({
index: index, index: index,
key: item.id, key: item.id,
value: (item.title) ? item.title : (item.display_name) ? item.display_name : item.name, value: (item.title) ? item.title : (item.display_name) ? item.display_name : item.name,
type: this.type, type: this.type,
id: item.id, id: item.id,
name: (item.title) ? item.title : (item.display_name) ? item.display_name : item.name, name: (item.title) ? item.title : (item.display_name) ? item.display_name : item.name,
description: (item.description) ? item.description : '', description: (item.description) ? item.description : '',
price: (item.price) ? item.price : (this.price == 'purchase_price') ? item.purchase_price : item.sale_price, price: (item.price) ? item.price : (this.price == 'purchase_price') ? item.purchase_price : item.sale_price,
tax_ids: (item.tax_ids) ? item.tax_ids : [], tax_ids: (item.tax_ids) ? item.tax_ids : [],
}); });
}, this); }, this);
}) })
.catch(error => { .catch(error => {
}); });
this.$emit('input', this.search); this.$emit('input', this.search);
}, },
onItemSeleted(index, item_id) { onItemSelected(item) {
let item = ''; const indexeditem = { ...item, index: this.currentIndex };
this.item_list.forEach(function (item_list, item_index) { this.addItem(indexeditem);
if (item_list.id == item_id) { },
item = item_list;
}
});
this.selected_items.push(item); addItem(item) {
this.invoiceItems.push(item);
this.$emit('item', item); this.$emit('item', item);
this.$emit('items', this.selected_items); this.$emit('items', this.invoiceItems);
this.show.item_selected = false; this.show.item_selected = false;
this.show.item_list = false; this.show.item_list = false;
this.search = '';
// Set deault item list this.search = '';
// Set default item list
this.setItemList(this.items); this.setItemList(this.items);
}, },
onItemCreate() { onItemCreate() {
let index = Object.keys(this.item_list).length; const newItem = {
index++; index: this.newItems.length,
let item = {
index: index,
key: 0, key: 0,
value: this.search, value: this.search,
type: this.type, type: this.type,
@ -367,15 +357,9 @@ export default {
tax_ids: [], tax_ids: [],
}; };
this.selected_items.push(item); this.newItems.push(newItem);
this.$emit('item', item) this.addItem(newItem);
this.$emit('items', this.selected_items);
this.setItemList(this.items);
this.show.item_selected = false;
this.show.item_list = false;
this.search = '';
/* /*
let add_new = this.add_new; let add_new = this.add_new;
@ -561,6 +545,9 @@ export default {
sortedItems() { sortedItems() {
return this.sortItems(); return this.sortItems();
}, },
currentIndex() {
return this.invoiceItems.length;
},
}, },
watch: { watch: {

18
resources/assets/js/plugins/functions.js vendored
View File

@ -15,14 +15,12 @@ function getQueryVariable(variable) {
return(false); return(false);
} }
function promiseTimeout(time) { //This function wraps setTimeout function in a promise in order to display dom manipulations on root components asynchronously & fast
return new Promise(function(resolve,reject) { const setPromiseTimeout = time =>
setTimeout(function(){ new Promise(resolve =>
resolve(time); setTimeout(() =>
}, time); resolve(time)
}); , time)
}; );
export {getQueryVariable, setPromiseTimeout}
export {getQueryVariable, promiseTimeout}

11
resources/assets/js/views/common/documents.js vendored
View File

@ -9,8 +9,7 @@ require('./../../bootstrap');
import Vue from 'vue'; import Vue from 'vue';
import DashboardPlugin from './../../plugins/dashboard-plugin'; import DashboardPlugin from './../../plugins/dashboard-plugin';
import { promiseTimeout } from './../../plugins/functions'; import { setPromiseTimeout } from './../../plugins/functions';
import Global from './../../mixins/global'; import Global from './../../mixins/global';
@ -291,15 +290,13 @@ const app = new Vue({
}, },
// Select Item added form // addItem to list
onSelectedItem(item) { onAddItem(item) {
let { index } = item; let { index } = item;
let total = 1 * item.price; let total = 1 * item.price;
let item_taxes = []; let item_taxes = [];
promiseTimeout(500).then(() => this.$refs['name-input'][index].focus()); setPromiseTimeout(200).then(() => this.$refs['name-input'][index].focus()); //add focus to new item name input
if (item.tax_ids) { if (item.tax_ids) {
item.tax_ids.forEach(function (tax_id, index) { item.tax_ids.forEach(function (tax_id, index) {
if (this.taxes.includes(tax_id)) { if (this.taxes.includes(tax_id)) {

2
resources/views/components/select-item-button.blade.php
View File

@ -7,7 +7,7 @@
:dynamic-currency="currency" :dynamic-currency="currency"
:items="{{ json_encode($items) }}" :items="{{ json_encode($items) }}"
:search-char-limit="{{ $searchCharLimit }}" :search-char-limit="{{ $searchCharLimit }}"
@item="onSelectedItem($event)" @item="onAddItem($event)"
add-item-text="{{ trans('general.form.add_an', ['field' => trans_choice('general.items', 1)]) }}" add-item-text="{{ trans('general.form.add_an', ['field' => trans_choice('general.items', 1)]) }}"
create-new-item-text="{{ trans('general.title.create', ['type' => trans_choice('general.items', 1)]) }}" create-new-item-text="{{ trans('general.title.create', ['type' => trans_choice('general.items', 1)]) }}"
></akaunting-item-button> ></akaunting-item-button>