feat: agregar traducción de descripciones y actualizar términos de kit a paq en varios componentes

This commit is contained in:
Juan Felipe Zapata Moreno 2026-02-19 16:53:56 -06:00
parent fb37a2d62f
commit 2bb50c48c9
6 changed files with 21 additions and 5 deletions

View File

@ -12,6 +12,7 @@ const emit = defineEmits([
/** Propiedades */ /** Propiedades */
const props = defineProps({ const props = defineProps({
event: Object, event: Object,
nameMap: { type: Object, default: () => ({}) },
}); });
const icons = { const icons = {
@ -42,6 +43,14 @@ const borderColor = computed(() => {
return `border-${colors[eventType.value]} dark:border-${colors[eventType.value]}-d`; return `border-${colors[eventType.value]} dark:border-${colors[eventType.value]}-d`;
}); });
const translatedDescription = computed(() => {
let desc = props.event.description ?? '';
for (const [key, value] of Object.entries(props.nameMap)) {
desc = desc.replaceAll(`"${key}"`, `"${value}"`);
}
return desc;
});
</script> </script>
<template> <template>
@ -79,7 +88,7 @@ const borderColor = computed(() => {
<div class="flex w-full flex-col justify-start space-y-2"> <div class="flex w-full flex-col justify-start space-y-2">
<div> <div>
<h4 class="font-semibold">{{ $t('description') }}:</h4> <h4 class="font-semibold">{{ $t('description') }}:</h4>
<p>{{ event.description }}.</p> <p>{{ translatedDescription }}</p>
</div> </div>
<div> <div>
<h4 class="font-semibold">{{ $t('author') }}:</h4> <h4 class="font-semibold">{{ $t('author') }}:</h4>

View File

@ -103,7 +103,7 @@ const remove = () => {
v-if="item.is_bundle" v-if="item.is_bundle"
class="shrink-0 px-1.5 py-0.5 text-xs font-bold rounded bg-purple-100 text-purple-700 dark:bg-purple-900/30 dark:text-purple-400" class="shrink-0 px-1.5 py-0.5 text-xs font-bold rounded bg-purple-100 text-purple-700 dark:bg-purple-900/30 dark:text-purple-400"
> >
KIT PAQ
</span> </span>
<h4 class="text-sm font-semibold text-gray-800 dark:text-gray-200 line-clamp-2"> <h4 class="text-sm font-semibold text-gray-800 dark:text-gray-200 line-clamp-2">
{{ item.product_name }} {{ item.product_name }}

View File

@ -35,6 +35,12 @@ const filters = reactive({
user: '' user: ''
}); });
const movements = {
'entry': 'Entrada',
'exit': 'Salida',
'transfer': 'Transferencia'
};
/** Métodos */ /** Métodos */
const searcher = useSearcher({ const searcher = useSearcher({
url: apiTo('index'), url: apiTo('index'),
@ -133,6 +139,7 @@ onMounted(() => {
<template v-for="event in items"> <template v-for="event in items">
<Item <Item
:event="event" :event="event"
:name-map="movements"
@show="Modal.switchShowModal(event)" @show="Modal.switchShowModal(event)"
/> />
</template> </template>

View File

@ -133,7 +133,7 @@ watch(() => props.show, (val) => {
<FormInput <FormInput
v-model="form.name" v-model="form.name"
type="text" type="text"
placeholder="Ej: Kit Gamer Pro" placeholder="Ej: Kit gols Pro"
required required
/> />
<FormError :message="form.errors?.name" /> <FormError :message="form.errors?.name" />

View File

@ -149,7 +149,7 @@ watch(() => props.bundle, (bundle) => {
<FormInput <FormInput
v-model="form.name" v-model="form.name"
type="text" type="text"
placeholder="Ej: Kit Gamer Pro" placeholder="Ej: Kit gols Pro"
required required
/> />
<FormError :message="form.errors?.name" /> <FormError :message="form.errors?.name" />

View File

@ -121,7 +121,7 @@ onMounted(() => {
? 'bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400' ? 'bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400'
: 'bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-400'" : 'bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-400'"
> >
{{ bundle.available_stock }} kits {{ bundle.available_stock }} paq.
</span> </span>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-center"> <td class="px-6 py-4 whitespace-nowrap text-center">