Focus on next input when pressed enter
This commit is contained in:
parent
37eff2d980
commit
b6f3cc7c8f
@ -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) {
|
||||||
|
16
resources/assets/js/views/common/documents.js
vendored
16
resources/assets/js/views/common/documents.js
vendored
@ -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) {
|
||||||
|
@ -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
|
||||||
|
@ -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')
|
||||||
|
Loading…
x
Reference in New Issue
Block a user