verdnatura/salix-front
verdnatura
/
salix-front
2
3
Fork 1
Code Issues Pull Requests 106 Releases Wiki Activity

feat: #8410 added new feature to module searchbar #1272

Merged
provira merged 18 commits from 8410-improveModuleSearchbar into dev 2025-01-31 10:02:50 +00:00
Conversation 1 Commits 18 Files Changed 1 +40 -5
1 changed files with 40 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 6cba927ebc - Show all commits

45
src/components/LeftMenu.vue
View File

@ -10,12 +10,13 @@ import routes from 'src/router/modules';
import LeftMenuItem from './LeftMenuItem.vue';
import LeftMenuItemGroup from './LeftMenuItemGroup.vue';
import VnInput from './common/VnInput.vue';
import { useRouter } from 'vue-router';
const { t } = useI18n();
const route = useRoute();
const quasar = useQuasar();
const navigation = useNavigationStore();
const router = useRouter();
const props = defineProps({
source: {
type: String,
@ -174,6 +175,35 @@ function normalize(text) {
.replace(/[\u0300-\u036f]/g, '')
.toLowerCase();
}
const searchModule = () => {
provira marked this conversation as resolved Outdated
jorgep commented 2025-01-23 12:00:40 +00:00
Outdated
Review
Copy Link

Estás haciendo 2 bucles, pasar a 1. Respuesta de copilot:

const searchModule = () => {
    const searching = ref(false);
    items.value.some((item) => {
        const title = getLocale(item.title).normalize('NFD').replace(/[\u0300-\u036f]/g, '').toLowerCase();
        if (title.includes(search.value.toLowerCase()) && !searching.value) {
            searching.value = true;
            router.push({ name: item.name });
            return true; // Termina el bucle al encontrar el primer resultado
        }
        return false;
    });
}
Estás haciendo 2 bucles, pasar a 1. Respuesta de copilot: ``` const searchModule = () => { const searching = ref(false); items.value.some((item) => { const title = getLocale(item.title).normalize('NFD').replace(/[\u0300-\u036f]/g, '').toLowerCase(); if (title.includes(search.value.toLowerCase()) && !searching.value) { searching.value = true; router.push({ name: item.name }); return true; // Termina el bucle al encontrar el primer resultado } return false; }); } ```
const moduleArrays = ref([]);
items.value.forEach((item) => {
jorgep marked this conversation as resolved Outdated
jorgep commented 2025-01-30 12:17:41 +00:00
Outdated
Review
Copy Link

No es necesario que sea ref, usar variable normal.

No es necesario que sea ref, usar variable normal.
provira commented 2025-01-30 12:29:25 +00:00
Outdated
Review
Copy Link

arreglado

arreglado
moduleArrays.value.push({
title: getLocale(item.title).normalize('NFD').replace(/[\u0300-\u036f]/g, '').toLowerCase(),
name: item.name
});
})
const searching = ref(false)
moduleArrays.value.find((module) => {
console.log(module.title);
provira marked this conversation as resolved Outdated
jorgep commented 2025-01-23 11:57:35 +00:00
Outdated
Review
Copy Link

Quitar

Quitar
if (module.title.includes(search.value.toLowerCase()) && !searching.value) {
searching.value = true;
jorgep commented 2025-01-31 08:49:30 +00:00
Outdated
Review
Copy Link

si no se usa quitar

si no se usa quitar
provira commented 2025-01-31 09:18:56 +00:00
Outdated
Review
Copy Link

quitado

quitado
router.push({ name: module.name });
}
})
}
const getLocale = (label) => {
provira marked this conversation as resolved Outdated
jorgep commented 2025-01-23 12:07:09 +00:00
Outdated
Review
Copy Link

Solo gastas esta función en 1 sitio, es innecesaria.

Solo gastas esta función en 1 sitio, es innecesaria.
const globalLocale = t(label);
jorgep marked this conversation as resolved Outdated
jorgep commented 2025-01-30 12:57:27 +00:00
Outdated
Review
Copy Link

llamar solo a la fn searchModule() @keyup.enter.stop="searchModule()"

llamar solo a la fn **searchModule()** `@keyup.enter.stop="searchModule()"`
return globalLocale;
};
const searchingValue = ref(false);
jorgep marked this conversation as resolved Outdated
jorgep commented 2025-01-23 12:04:14 +00:00
Outdated
Review
Copy Link

Las variables ponlas juntas y las funciones lo mismo.

Las variables ponlas juntas y las funciones lo mismo.
function searchingFunction(evt) {
provira marked this conversation as resolved Outdated
jorgep commented 2025-01-23 12:05:25 +00:00
Outdated
Review
Copy Link

Solo gastas esta función en 1 sitio, es innecesaria.

Solo gastas esta función en 1 sitio, es innecesaria.
searchingValue.value = true;
if(evt === null) {
searchingValue.value = false;
}
}
</script>
<template>
@ -188,10 +218,12 @@ function normalize(text) {
filled
dense
autofocus
@keyup.enter.stop="searchModule(search)"
@update:model-value="searchingFunction($event)"
provira marked this conversation as resolved Outdated
jorgep commented 2025-01-23 12:08:01 +00:00
Outdated
Review
Copy Link

en lugar de usar una función, puedes hacer searchingVal = !!$event; que te devuelve el valor booleano. Y te ahorras líneas.

en lugar de usar una función, puedes hacer searchingVal = !!$event; que te devuelve el valor booleano. Y te ahorras líneas.
/>
</QItem>
<QSeparator />
<template v-if="filteredPinnedModules.size">
<template v-if="filteredPinnedModules.size && !searchingValue">
<LeftMenuItem
v-for="[key, pinnedModule] of filteredPinnedModules"
:key="key"
@ -215,11 +247,11 @@ function normalize(text) {
</LeftMenuItem>
<QSeparator />
</template>
<template v-for="item in filteredItems" :key="item.name">
<template v-for="(item, index) in filteredItems" :key="item.name">
<template
v-if="item.children && !filteredPinnedModules.has(item.name)"
v-if="searchingValue ||item.children && !filteredPinnedModules.has(item.name)"
>
<LeftMenuItem :item="item" group="modules">
<LeftMenuItem :item="item" group="modules" :class="searchingValue && index === 0 ? 'searched' : ''">
<template #side>
<QBtn
v-if="item.isPinned === true"
@ -336,6 +368,9 @@ function normalize(text) {
.header {
color: var(--vn-label-color);
}
.searched{
jorgep commented 2025-01-23 12:12:01 +00:00
Outdated
Review
Copy Link

Sería un mejor enfoque intentar forzar el foco del item.

Sería un mejor enfoque intentar forzar el foco del item.
background-color: var(--vn-section-hover-color);
}
</style>
<i18n>
es: