#6911 save on enter #207

Merged
jsegarra merged 50 commits from 6911-saveOnEnter into dev 2024-06-07 07:20:48 +00:00
15 changed files with 83 additions and 41 deletions
Showing only changes of commit 8604c86828 - Show all commits

View File

@ -29,7 +29,8 @@ module.exports = configure(function (/* ctx */) {
// app boot file (/src/boot)
// --> boot files are part of "main.js"
// https://v2.quasar.dev/quasar-cli/boot-files
boot: ['i18n', 'axios', 'vnDate', 'validations'],
//
boot: ['i18n', 'axios', 'vnDate','quasar','setDefaults', 'validations'],
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css
css: ['app.scss'],

22
src/boot/qformMixin.js Normal file
View File

@ -0,0 +1,22 @@
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 (this.$el?.id !== 'searchbarForm') {
let that = this;
document.addEventListener('keyup', function (evt) {
if (evt.keyCode === 13) {
that.onSubmit();
}
});
}
},
};

6
src/boot/quasar.js Normal file
View File

@ -0,0 +1,6 @@
import { boot } from 'quasar/wrappers';
import qFormMixin from './qformMixin';
export default boot(({ app }) => {
app.mixin(qFormMixin);
});

41
src/boot/setDefaults.js Normal file
View File

@ -0,0 +1,41 @@
import { QInput, QSelect } from "quasar";
import { QTable} from "quasar";
const setDefault = (component, key, value) => {
const prop = component.props[key];
switch (typeof prop) {
case "object":
prop.default = value;
break;
case "function":
component.props[key] = {
type: prop,
default: value
};
break;
case "undefined":
throw new Error("unknown prop: " + key);
default:
throw new Error("unhandled type: " + typeof prop);
}
};
QInput.props.outlined = {
type: QInput.props.outlined,
default: true
};
QInput.props.dense = {
type: QInput.props.dense,
default: true
};
QInput.props.stackLabel = {
type: QInput.props.stackLabel,
default: true
};
setDefault(QInput, "outlined", false);
setDefault(QTable, "gridHeader", true);
setDefault(QTable, "color", 'red-8');
setDefault(QTable, "pagination", { rowsPerPage: 25 });
setDefault(QTable, "rowKey", 'id');
setDefault(QSelect,'optionValue','id');
setDefault(QSelect,'optionLabel','name');

View File

@ -42,7 +42,7 @@ const onDataSaved = () => {
closeForm();
};
const submitData = async () => {
const onSubmit = async () => {
try {
isLoading.value = true;
const rowsToEdit = $props.rows.map((row) => ({ id: row.id, itemFk: row.itemFk }));
@ -66,7 +66,7 @@ const closeForm = () => {
</script>
<template>
<QForm @submit="submitData()" @keyup.enter="submitData()" class="all-pointer-events">
<QForm @submit="onSubmit()" class="all-pointer-events">
<QCard class="q-pa-lg">
<span ref="closeButton" class="close-icon" v-close-popup>
<QIcon name="close" size="sm" />

View File

@ -78,7 +78,7 @@ const tableColumns = computed(() => [
},
]);
const fetchResults = async () => {
const onSubmit = async () => {
try {
let filter = itemFilter;
const params = itemFilterParams;
@ -140,11 +140,7 @@ const selectItem = ({ id }) => {
@on-fetch="(data) => (InksOptions = data)"
auto-load
/>
<QForm
@submit="fetchResults()"
@keyup.enter="fetchResults()"
class="all-pointer-events"
>
<QForm @submit="onSubmit()" class="all-pointer-events">
<QCard class="column" style="padding: 32px; z-index: 100">
<span ref="closeButton" class="close-icon" v-close-popup>
<QIcon name="close" size="sm" />

View File

@ -85,7 +85,7 @@ const tableColumns = computed(() => [
},
]);
const fetchResults = async () => {
const onSubmit = async () => {
try {
let filter = travelFilter;
const params = travelFilterParams;
@ -138,11 +138,7 @@ const selectTravel = ({ id }) => {
@on-fetch="(data) => (warehousesOptions = data)"
auto-load
/>
<QForm
@submit="fetchResults()"
@keyup.enter="fetchResults()"
class="all-pointer-events"
>
<QForm @submit="onSubmit()" class="all-pointer-events">
<QCard class="column" style="padding: 32px; z-index: 100">
<span ref="closeButton" class="close-icon" v-close-popup>

veo muchos @keyup.enter=
si todos los QForm los vamos a querer así.. @jsegarra no hay forma de hacerlo por defecto así?

veo muchos @keyup.enter= si todos los QForm los vamos a querer así.. @jsegarra no hay forma de hacerlo por defecto así?

Propone sustituir en todos los sitios donde haya QForm por FormModel. Lo hago en esta tarea?

Propone sustituir en todos los sitios donde haya QForm por FormModel. Lo hago en esta tarea?
<QIcon name="close" size="sm" />

View File

@ -211,7 +211,6 @@ watch(formUrl, async () => {
<QForm
v-if="formData"
@submit="save"
@keyup.enter="save"
@reset="reset"
class="q-pa-md"
id="formModel"

View File

@ -67,7 +67,7 @@ async function remove({ id }) {
<QPage class="column items-center q-pa-md sticky">
<QPageSticky expand position="top" :offset="[16, 16]">
<QCard class="card q-pa-md">
<QForm @submit="submit" @keyup.enter="submit">
<QForm @submit="submit">
<VnInput
ref="input"
v-model="newRma.code"

View File

@ -55,7 +55,7 @@ const onSubmit = async () => {
<QDialog ref="dialogRef">
<QCard class="q-pa-md q-mb-md">
<QCardSection>
<QForm @submit="onSubmit()" @keyup.enter="onSubmit()" class="q-pa-sm">
<QForm @submit="onSubmit()" class="q-pa-sm">
<div>
{{
t('Add observation to all selected clients', {

View File

@ -67,11 +67,7 @@ async function onSubmit() {
</script>
<template>
<QForm
@submit="onSubmit"
@keyup.enter="onSubmit"
class="q-gutter-y-md q-pa-lg formCard"
>
<QForm @submit="onSubmit" class="q-gutter-y-md q-pa-lg formCard">
<VnLogo alt="Logo" fit="contain" :ratio="16 / 9" class="q-mb-md" />
<VnInput

View File

@ -48,11 +48,7 @@ async function onSubmit() {
}
</script>
<template>
<QForm
@submit="onSubmit"
@keyup.enter="onSubmit"
class="q-gutter-y-md q-pa-lg formCard"
>
<QForm @submit="onSubmit" class="q-gutter-y-md q-pa-lg formCard">
<div class="column items-center">
<QIcon name="phonelink_lock" size="xl" color="primary" />
<h5 class="text-center q-my-md">{{ t('twoFactor.insert') }}</h5>

View File

@ -211,7 +211,6 @@ const onThermographCreated = async (data) => {
:observe-form-changes="viewAction === 'create'"
:default-actions="true"
@submit="onSubmit()"
@keyup.enter="onSubmit()"
class="full-width"
style="max-width: 800px"
>

View File

@ -242,12 +242,7 @@ function exceedMaxHeight(pos) {
<template>
<QPage class="q-pa-sm q-mx-xl">
<QForm
@submit="onSubmit()"
@keyup.enter="onSubmit()"
@reset="onReset()"
class="q-pa-sm"
>
<QForm @submit="onSubmit()" @reset="onReset()" class="q-pa-sm">
<QCard class="q-pa-md">
<VnInput
filled

View File

@ -89,12 +89,7 @@ function filterType(val, update) {
<template>
<QPage class="q-pa-sm q-mx-xl">
<QForm
@submit="onSubmit()"
@keyup.enter="onSubmit()"
@reset="onReset()"
class="q-pa-sm"
>
<QForm @submit="onSubmit()" @reset="onReset()" class="q-pa-sm">
<QCard class="q-pa-md">
<div class="row q-col-gutter-md">
<div class="col">