Feat: Filtrar chips de ResumenMuestra según tab activa
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 1m6s
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 1m6s
- Agregar prop tabActiva a ResumenMuestra.vue - Implementar computed properties para filtrado: * mostrarChipsOrganolepticos (organoleptica + impresion-global) * mostrarChipsIntensidades (descriptiva-afectiva + impresion-global) * mostrarChipsDefectos (defectos + impresion-global) - Envolver grupos de chips con template v-if según filtrado - Pasar prop :tab-activa desde sesion.vue a ResumenMuestra - En impresion-global se muestran TODOS los chips - En otras tabs solo chips pertinentes a esa categoría
This commit is contained in:
@@ -22,6 +22,8 @@
|
||||
|
||||
<!-- Segunda línea: Chips informativos -->
|
||||
<div class="chips-container flex flex-wrap gap-0.5">
|
||||
<!-- Chips Organolépticos -->
|
||||
<template v-if="mostrarChipsOrganolepticos">
|
||||
<!-- Fragancia/Aroma -->
|
||||
<div v-if="muestra.fraganciaAromaNotas.categorias.length > 0" class="chip">
|
||||
<span class="chip-label">F/A:</span>
|
||||
@@ -45,8 +47,10 @@
|
||||
<span class="chip-label">Sen:</span>
|
||||
<span class="chip-value">{{ muestra.sensacionEnBoca.join(', ') }}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- Valores Descriptivo/Afectivo -->
|
||||
<!-- Chips Intensidades (Descriptiva/Afectiva) -->
|
||||
<template v-if="mostrarChipsIntensidades">
|
||||
<div v-if="muestra.intensidades.fragancia.afectiva !== null || muestra.intensidades.fragancia.descriptiva !== null" class="chip">
|
||||
<span class="chip-label">Fra:</span>
|
||||
<span v-if="muestra.intensidades.fragancia.afectiva !== null" class="chip-value">{{ muestra.intensidades.fragancia.afectiva }}❤️</span>
|
||||
@@ -94,7 +98,10 @@
|
||||
<span v-if="muestra.intensidades.impresionGlobal.afectiva !== null" class="chip-value">{{ muestra.intensidades.impresionGlobal.afectiva }}❤️</span>
|
||||
<span v-if="muestra.intensidades.impresionGlobal.descriptiva !== null" class="chip-value">{{ muestra.intensidades.impresionGlobal.descriptiva }}📊</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- Chips Defectos -->
|
||||
<template v-if="mostrarChipsDefectos">
|
||||
<!-- Tazas no uniformes -->
|
||||
<div v-if="muestra.tazasNoUniformes.length > 0" class="chip chip-warning">
|
||||
<span class="chip-label">NoUnif:</span>
|
||||
@@ -107,19 +114,25 @@
|
||||
<span class="chip-value">{{ muestra.tazasDefectuosas.join(',') }}</span>
|
||||
<span v-if="muestra.defecto" class="chip-value">({{ muestra.defecto }})</span>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import type { Muestra } from '~/types/catacion'
|
||||
import type { TabCatacion } from '~/composables/useCatacion'
|
||||
|
||||
interface ResumenMuestraProps {
|
||||
/** Muestra a mostrar */
|
||||
muestra: Muestra
|
||||
/** Tab activa para filtrar chips */
|
||||
tabActiva?: TabCatacion
|
||||
}
|
||||
|
||||
const props = defineProps<ResumenMuestraProps>()
|
||||
const props = withDefaults(defineProps<ResumenMuestraProps>(), {
|
||||
tabActiva: 'impresion-global',
|
||||
})
|
||||
|
||||
// Formatear categorías de fragancia/aroma
|
||||
const categoriasFragancia = computed(() => {
|
||||
@@ -140,6 +153,19 @@ const puntajeClass = computed(() => {
|
||||
if (puntaje >= 70) return 'puntaje-regular'
|
||||
return 'puntaje-bajo'
|
||||
})
|
||||
|
||||
// Determinar qué chips mostrar según la tab activa
|
||||
const mostrarChipsOrganolepticos = computed(() => {
|
||||
return props.tabActiva === 'organoleptica' || props.tabActiva === 'impresion-global'
|
||||
})
|
||||
|
||||
const mostrarChipsIntensidades = computed(() => {
|
||||
return props.tabActiva === 'descriptiva-afectiva' || props.tabActiva === 'impresion-global'
|
||||
})
|
||||
|
||||
const mostrarChipsDefectos = computed(() => {
|
||||
return props.tabActiva === 'defectos' || props.tabActiva === 'impresion-global'
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -170,6 +170,7 @@
|
||||
<template #default="{ item }">
|
||||
<CataResumenMuestra
|
||||
:muestra="item.muestra"
|
||||
:tab-activa="tabActiva"
|
||||
/>
|
||||
</template>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user