diff --git a/src/boot/keyShortcut.js b/src/boot/keyShortcut.js index 5afb5b74a..6da06c8bf 100644 --- a/src/boot/keyShortcut.js +++ b/src/boot/keyShortcut.js @@ -1,6 +1,6 @@ export default { - mounted: function (el, binding) { - const shortcut = binding.value ?? '+'; + mounted(el, binding) { + const shortcut = binding.value || '+'; const { key, ctrl, alt, callback } = typeof shortcut === 'string' @@ -8,25 +8,24 @@ export default { key: shortcut, ctrl: true, alt: true, - callback: () => - document - .querySelector(`button[shortcut="${shortcut}"]`) - ?.click(), + callback: () => el?.click(), } : binding.value; + if (!el.hasAttribute('shortcut')) { + el.setAttribute('shortcut', key); + } + const handleKeydown = (event) => { if (event.key === key && (!ctrl || event.ctrlKey) && (!alt || event.altKey)) { callback(); } }; - // Attach the event listener to the window window.addEventListener('keydown', handleKeydown); - el._handleKeydown = handleKeydown; }, - unmounted: function (el) { + unmounted(el) { if (el._handleKeydown) { window.removeEventListener('keydown', el._handleKeydown); } diff --git a/src/components/CreateBankEntityForm.vue b/src/components/CreateBankEntityForm.vue index 2da3aa994..7c4b94a6a 100644 --- a/src/components/CreateBankEntityForm.vue +++ b/src/components/CreateBankEntityForm.vue @@ -14,7 +14,7 @@ const { t } = useI18n(); const bicInputRef = ref(null); const state = useState(); -const customer = computed(() => state.get('customer')); +const customer = computed(() => state.get('Customer')); const countriesFilter = { fields: ['id', 'name', 'code'], diff --git a/src/components/FormModel.vue b/src/components/FormModel.vue index 2e580257c..59141d374 100644 --- a/src/components/FormModel.vue +++ b/src/components/FormModel.vue @@ -84,7 +84,7 @@ const $props = defineProps({ }, reload: { type: Boolean, - default: false, + default: true, }, defaultTrim: { type: Boolean, @@ -97,7 +97,7 @@ const $props = defineProps({ }); const emit = defineEmits(['onFetch', 'onDataSaved']); const modelValue = computed( - () => $props.model ?? `formModel_${route?.meta?.title ?? route.name}` + () => $props.model ?? `formModel_${route?.meta?.title ?? route.name}`, ).value; const componentIsRendered = ref(false); const arrayData = useArrayData(modelValue); @@ -105,8 +105,8 @@ const isLoading = ref(false); // Si elegimos observar los cambios del form significa que inicialmente las actions estaran deshabilitadas const isResetting = ref(false); const hasChanges = ref(!$props.observeFormChanges); -const originalData = ref({}); -const formData = computed(() => state.get(modelValue)); +const originalData = computed(() => state.get(modelValue)); +const formData = ref({}); const defaultButtons = computed(() => ({ save: { dataCy: 'saveDefaultBtn', @@ -127,8 +127,6 @@ const defaultButtons = computed(() => ({ })); onMounted(async () => { - originalData.value = JSON.parse(JSON.stringify($props.formInitialData ?? {})); - nextTick(() => (componentIsRendered.value = true)); // Podemos enviarle al form la estructura de data inicial sin necesidad de fetchearla @@ -148,7 +146,7 @@ onMounted(async () => { JSON.stringify(newVal) !== JSON.stringify(originalData.value); isResetting.value = false; }, - { deep: true } + { deep: true }, ); } }); @@ -156,16 +154,24 @@ onMounted(async () => { if (!$props.url) watch( () => arrayData.store.data, - (val) => updateAndEmit('onFetch', val) + (val) => updateAndEmit('onFetch', val), ); +watch( + originalData, + (val) => { + if (val) formData.value = JSON.parse(JSON.stringify(val)); + }, + { immediate: true }, +); + watch( () => [$props.url, $props.filter], async () => { - originalData.value = null; + state.set(modelValue, null); reset(); await fetch(); - } + }, ); onBeforeRouteLeave((to, from, next) => { @@ -197,7 +203,6 @@ async function fetch() { updateAndEmit('onFetch', data); } catch (e) { state.set(modelValue, {}); - originalData.value = {}; throw e; } } @@ -236,6 +241,7 @@ async function saveAndGo() { } function reset() { + formData.value = JSON.parse(JSON.stringify(originalData.value)); updateAndEmit('onFetch', originalData.value); if ($props.observeFormChanges) { hasChanges.value = false; @@ -254,13 +260,12 @@ function filter(value, update, filterOptions) { (ref) => { ref.setOptionIndex(-1); ref.moveOptionSelection(1, true); - } + }, ); } function updateAndEmit(evt, val, res) { state.set(modelValue, val); - originalData.value = val && JSON.parse(JSON.stringify(val)); if (!$props.url) arrayData.store.data = val; emit(evt, state.get(modelValue), res); diff --git a/src/components/ItemsFilterPanel.vue b/src/components/ItemsFilterPanel.vue index dc2a34435..48f607a30 100644 --- a/src/components/ItemsFilterPanel.vue +++ b/src/components/ItemsFilterPanel.vue @@ -282,7 +282,7 @@ const setCategoryList = (data) => { { return locale.includes(normalizedSearch); }); }); - const filteredPinnedModules = computed(() => { if (!search.value) return pinnedModules.value; const normalizedSearch = search.value @@ -72,7 +71,7 @@ watch( items.value = []; getRoutes(); }, - { deep: true } + { deep: true }, ); function findMatches(search, item) { @@ -104,33 +103,40 @@ function addChildren(module, route, parent) { } function getRoutes() { - if (props.source === 'main') { - const modules = Object.assign([], navigation.getModules().value); - - for (const item of modules) { - const moduleDef = routes.find( - (route) => toLowerCamel(route.name) === item.module - ); - if (!moduleDef) continue; - item.children = []; - - addChildren(item.module, moduleDef, item.children); - } - - items.value = modules; + const handleRoutes = { + main: getMainRoutes, + card: getCardRoutes, + }; + try { + handleRoutes[props.source](); + } catch (error) { + throw new Error(`Method is not defined`); } +} +function getMainRoutes() { + const modules = Object.assign([], navigation.getModules().value); - if (props.source === 'card') { - const currentRoute = route.matched[1]; - const currentModule = toLowerCamel(currentRoute.name); - let moduleDef = routes.find( - (route) => toLowerCamel(route.name) === currentModule + for (const item of modules) { + const moduleDef = routes.find( + (route) => toLowerCamel(route.name) === item.module, ); + if (!moduleDef) continue; + item.children = []; - if (!moduleDef) return; - if (!moduleDef?.menus) moduleDef = betaGetRoutes(); - addChildren(currentModule, moduleDef, items.value); + addChildren(item.module, moduleDef, item.children); } + + items.value = modules; +} + +function getCardRoutes() { + const currentRoute = route.matched[1]; + const currentModule = toLowerCamel(currentRoute.name); + let moduleDef = routes.find((route) => toLowerCamel(route.name) === currentModule); + + if (!moduleDef) return; + if (!moduleDef?.menus) moduleDef = betaGetRoutes(); + addChildren(currentModule, moduleDef, items.value); } function betaGetRoutes() { @@ -223,9 +229,16 @@ const searchModule = () => {