forked from verdnatura/salix-front
refs #7124 feat: autofocus without property
This commit is contained in:
parent
b3a889e8f6
commit
d7d83fd886
|
@ -29,7 +29,7 @@ module.exports = configure(function (/* ctx */) {
|
||||||
// app boot file (/src/boot)
|
// app boot file (/src/boot)
|
||||||
// --> boot files are part of "main.js"
|
// --> boot files are part of "main.js"
|
||||||
// https://v2.quasar.dev/quasar-cli/boot-files
|
// https://v2.quasar.dev/quasar-cli/boot-files
|
||||||
boot: ['i18n', 'axios', 'vnDate', 'validations'],
|
boot: ['i18n', 'axios', 'vnDate', 'validations', 'quasar'],
|
||||||
|
|
||||||
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css
|
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css
|
||||||
css: ['app.scss'],
|
css: ['app.scss'],
|
||||||
|
|
|
@ -0,0 +1,32 @@
|
||||||
|
import { QForm } from 'quasar';
|
||||||
|
import { getCurrentInstance } from 'vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
inject: { QForm },
|
||||||
|
component: { QForm },
|
||||||
|
components: { QForm },
|
||||||
|
extends: { QForm },
|
||||||
|
mounted: function () {
|
||||||
|
const vm = getCurrentInstance();
|
||||||
|
if (vm.type.name === 'QForm')
|
||||||
|
if (![ 'searchbarForm'].includes(this.$el?.id)) {
|
||||||
|
let that = this;
|
||||||
|
|
||||||
|
// AUTOFOCUS
|
||||||
|
const elementsArray = Array.from(this.$el.elements);
|
||||||
|
const index = elementsArray.findIndex(element => element.classList.contains('q-field__native'));
|
||||||
|
|
||||||
|
if (index !== -1) {
|
||||||
|
const firstInputElement = elementsArray[index];
|
||||||
|
firstInputElement.focus();
|
||||||
|
}
|
||||||
|
|
||||||
|
// KEYUP Event
|
||||||
|
document.addEventListener('keyup', function (evt) {
|
||||||
|
if (evt.keyCode === 13) {
|
||||||
|
that.onSubmit();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
|
@ -0,0 +1,6 @@
|
||||||
|
import { boot } from 'quasar/wrappers';
|
||||||
|
import qFormMixin from './qformMixin';
|
||||||
|
|
||||||
|
export default boot(({ app }) => {
|
||||||
|
app.mixin(qFormMixin);
|
||||||
|
});
|
|
@ -108,7 +108,7 @@ async function search() {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<QForm @submit="search">
|
<QForm @submit="search" id="searchbarForm">
|
||||||
<VnInput
|
<VnInput
|
||||||
id="searchbar"
|
id="searchbar"
|
||||||
v-model="searchText"
|
v-model="searchText"
|
||||||
|
|
Loading…
Reference in New Issue