0
0
Fork 0

feat: #8110 apply mixin in quasar components

This commit is contained in:
Javier Segarra 2024-10-25 13:41:06 +02:00
parent c127fee467
commit 4df05b7522
3 changed files with 65 additions and 24 deletions

View File

@ -0,0 +1,39 @@
import routes from 'src/router/modules';
import { useRouter } from 'vue-router';
let isNotified = false;
export default {
created: function () {
console.error('mainShortcutMixin created');
const router = useRouter();
const keyBindingMap = routes
.filter((route) => route.meta.keyBinding)
.reduce((map, route) => {
map['Key' + route.meta.keyBinding.toUpperCase()] = route.path;
return map;
}, {});
const handleKeyDown = (event) => {
const { ctrlKey, altKey, code } = event;
if (ctrlKey && altKey && keyBindingMap[code] && !isNotified) {
event.preventDefault();
router.push(keyBindingMap[code]);
isNotified = true;
}
};
const handleKeyUp = (event) => {
const { ctrlKey, altKey } = event;
// Resetea la bandera cuando se sueltan las teclas ctrl o alt
if (!ctrlKey || !altKey) {
isNotified = false;
}
};
window.addEventListener('keydown', handleKeyDown);
window.addEventListener('keyup', handleKeyUp);
},
};

View File

@ -2,12 +2,11 @@ import { getCurrentInstance } from 'vue';
export default { export default {
mounted: function () { mounted: function () {
const vm = getCurrentInstance(); console.error('qformMixin mounted');
if (vm.type.name === 'QForm') {
if (!['searchbarForm', 'filterPanelForm'].includes(this.$el?.id)) {
// TODO: AUTOFOCUS IS NOT FOCUSING
const that = this; const that = this;
this.$el.addEventListener('keyup', function (evt) { const form = document.querySelector('.q-form#formModel');
if (!form) return;
form.addEventListener('keyup', function (evt) {
if (evt.key === 'Enter') { if (evt.key === 'Enter') {
const input = evt.target; const input = evt.target;
if (input.type == 'textarea' && evt.shiftKey) { if (input.type == 'textarea' && evt.shiftKey) {
@ -24,7 +23,5 @@ export default {
that.onSubmit(); that.onSubmit();
} }
}); });
}
}
}, },
}; };

View File

@ -3,11 +3,16 @@ import qFormMixin from './qformMixin';
import keyShortcut from './keyShortcut'; import keyShortcut from './keyShortcut';
import useNotify from 'src/composables/useNotify.js'; import useNotify from 'src/composables/useNotify.js';
import { CanceledError } from 'axios'; import { CanceledError } from 'axios';
import { QForm } from 'quasar';
import { QLayout } from 'quasar';
import mainShortcutMixin from './mainShortcutMixin';
const { notify } = useNotify(); const { notify } = useNotify();
export default boot(({ app }) => { export default boot(({ app }) => {
app.mixin(qFormMixin); QForm.mixins = [qFormMixin];
QLayout.mixins = [mainShortcutMixin];
app.directive('shortcut', keyShortcut); app.directive('shortcut', keyShortcut);
app.config.errorHandler = (error) => { app.config.errorHandler = (error) => {
let message; let message;