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

Focus on next input when pressed enter

Browse Source
This commit is contained in:
benguozakinci@gmail.com 2021-08-25 19:51:38 +03:00
parent 37eff2d980
commit b6f3cc7c8f
4 changed files with 32 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -345,13 +345,13 @@ export default {
onItemSelected(item) { onItemSelected(item) {
const indexeditem = { ...item, index: this.currentIndex }; const indexeditem = { ...item, index: this.currentIndex };
this.addItem(indexeditem); this.addItem(indexeditem, 'oldItem');
}, },
addItem(item) { addItem(item, itemType) {
this.selected_items.push(item); this.selected_items.push(item);
this.$emit('item', item); this.$emit('item', { item, itemType } );
this.$emit('items', this.selected_items); this.$emit('items', this.selected_items);
this.show.item_selected = false; this.show.item_selected = false;
@ -380,7 +380,7 @@ export default {
? item = this.item_list[0] ? item = this.item_list[0]
: this.newItems.push(item) : this.newItems.push(item)
this.addItem(item); this.addItem(item, 'newItem');
}, },
onSubmit(event) { onSubmit(event) {

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

@ -97,6 +97,14 @@ const app = new Vue({
}, },
methods: { methods: {
onRefFocus(ref, index) {
ref
? ref === 'price'
? setPromiseTimeout(100).then(() => this.$refs[ref][0].$children[0].$el.focus())
: setPromiseTimeout(100).then(() => this.$refs[ref][index].focus())
: {}
},
onCalculateTotal() { onCalculateTotal() {
let global_discount = parseFloat(this.form.discount); let global_discount = parseFloat(this.form.discount);
let discount_total = 0; let discount_total = 0;
@ -303,12 +311,14 @@ const app = new Vue({
}, },
// addItem to list // addItem to list
onAddItem(item) { onAddItem(payload) {
let { item, itemType } = payload
let { index } = item; let { index } = item;
let inputRef = `${itemType === 'newItem' ? 'name' : 'description'}`; // indication for which input to focus first
let total = 1 * item.price; let total = 1 * item.price;
let item_taxes = []; let item_taxes = [];
setPromiseTimeout(200).then(() => this.$refs['name-input'][index].focus()); //add focus to new item name input this.onRefFocus(inputRef, index); // trigger initial focus event on 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) {

16
resources/views/components/documents/form/line-item.blade.php
View File

@ -34,7 +34,7 @@
@stack('name_input_start') @stack('name_input_start')
<input <input
type="text" type="text"
ref="name-input" ref="name"
class="form-control" class="form-control"
:name="'items.' + index + '.name'" :name="'items.' + index + '.name'"
autocomplete="off" autocomplete="off"
@ -42,8 +42,8 @@
data-item="name" data-item="name"
v-model="row.name" v-model="row.name"
@input="onBindingItemField(index, 'name')" @input="onBindingItemField(index, 'name')"
@change="form.errors.clear('items.' + index + '.name')"> @change="form.errors.clear('items.' + index + '.name')"
@keydown.enter="onRefFocus('description', index)">
<div class="invalid-feedback d-block" <div class="invalid-feedback d-block"
v-if="form.errors.has('items.' + index + '.name')" v-if="form.errors.has('items.' + index + '.name')"
v-html="form.errors.get('items.' + index + '.name')"> v-html="form.errors.get('items.' + index + '.name')">
@ -59,6 +59,7 @@
@if (!$hideDescription) @if (!$hideDescription)
<textarea <textarea
class="form-control" class="form-control"
ref="description"
placeholder="{{ trans('items.enter_item_description') }}" placeholder="{{ trans('items.enter_item_description') }}"
style="height: 46px; overflow: hidden;" style="height: 46px; overflow: hidden;"
:name="'items.' + index + '.description'" :name="'items.' + index + '.description'"
@ -66,6 +67,8 @@
data-item="description" data-item="description"
resize="none" resize="none"
@input="onBindingItemField(index, 'description')" @input="onBindingItemField(index, 'description')"
@keydown.enter.exact.prevent
@keydown.enter.exact="onRefFocus('quantity', index)"
></textarea> ></textarea>
@endif @endif
</td> </td>
@ -81,6 +84,7 @@
<input <input
type="number" type="number"
min="0" min="0"
ref="quantity"
class="form-control text-center p-0 input-number-disabled" class="form-control text-center p-0 input-number-disabled"
:name="'items.' + index + '.quantity'" :name="'items.' + index + '.quantity'"
autocomplete="off" autocomplete="off"
@ -88,8 +92,8 @@
data-item="quantity" data-item="quantity"
v-model="row.quantity" v-model="row.quantity"
@input="onCalculateTotal" @input="onCalculateTotal"
@change="form.errors.clear('items.' + index + '.quantity')"> @change="form.errors.clear('items.' + index + '.quantity')"
@keydown.enter="onRefFocus('price', index)">
<div class="invalid-feedback d-block" <div class="invalid-feedback d-block"
v-if="form.errors.has('items.' + index + '.quantity')" v-if="form.errors.has('items.' + index + '.quantity')"
v-html="form.errors.get('items.' + index + '.quantity')"> v-html="form.errors.get('items.' + index + '.quantity')">
@ -105,7 +109,7 @@
@if (!$hidePrice) @if (!$hidePrice)
<div> <div>
@stack('price_input_start') @stack('price_input_start')
{{ Form::moneyGroup('price', '', '', ['required' => 'required', 'row-input' => 'true', 'v-model' => 'row.price', 'v-error' => 'form.errors.get(\'items.\' + index + \'.price\')', 'v-error-message' => 'form.errors.get(\'items.\' + index + \'.price\')' , 'data-item' => 'price', 'currency' => $currency, 'dynamic-currency' => 'currency', 'change' => 'row.price = $event; form.errors.clear(\'items.\' + index + \'.price\'); onCalculateTotal'], 0.00, 'text-right input-price p-0') }} {{ Form::moneyGroup('price', '', '', ['required' => 'required', 'inputRef' => 'price', 'row-input' => 'true', 'v-model' => 'row.price', 'v-error' => 'form.errors.get(\'items.\' + index + \'.price\')', 'v-error-message' => 'form.errors.get(\'items.\' + index + \'.price\')' , 'data-item' => 'price', 'currency' => $currency, 'dynamic-currency' => 'currency', 'change' => 'row.price = $event; form.errors.clear(\'items.\' + index + \'.price\'); onCalculateTotal'], 0.00, 'text-right input-price p-0') }}
@stack('price_input_end') @stack('price_input_end')
</div> </div>
@endif @endif

5
resources/views/partials/form/money_group.blade.php
View File

@ -27,6 +27,10 @@
v-if="{{ $attributes['show'] }}" v-if="{{ $attributes['show'] }}"
@endif @endif
@if (isset($attributes['inputRef']))
ref="{{ $attributes['inputRef'] }}"
@endif
@if (isset($attributes['masked'])) @if (isset($attributes['masked']))
:masked="{{ ($attributes['masked']) ? 'true' : 'false' }}" :masked="{{ ($attributes['masked']) ? 'true' : 'false' }}"
@endif @endif
@ -74,6 +78,7 @@
@if (isset($attributes['row-input'])) @if (isset($attributes['row-input']))
:row-input="{{ $attributes['row-input'] }}" :row-input="{{ $attributes['row-input'] }}"
@endif @endif
></akaunting-money> ></akaunting-money>
@stack($name . '_input_end') @stack($name . '_input_end')