diff --git a/src/components/Fieberkurve.vue b/src/components/Fieberkurve.vue index 66aa98f..ee77c0b 100644 --- a/src/components/Fieberkurve.vue +++ b/src/components/Fieberkurve.vue @@ -89,7 +89,6 @@ const props = defineProps({ }) const emit = defineEmits(["update:values", "filter-by-row"]) - defineExpose({ resetSliders }) const sliders = ref([...props.defaultValues]) @@ -123,24 +122,33 @@ watch( { deep: true }, ) +function handleClick(index) { + sliders.value[index].clicked = true + + const activeFilters = sliders.value + .map((slider, idx) => + slider.clicked ? { rowIndex: idx, value: Number(slider.value) } : null + ) + .filter(Boolean) + + emit("filter-by-row", activeFilters) +} + function resetSliders() { sliders.value.forEach(slider => { slider.value = 4 slider.clicked = false }) -} -function handleClick(index) { - sliders.value[index].clicked = true - emit("filter-by-row", { rowIndex: index, value: sliders.value[index].value }) + emit("filter-by-row", []) } function updateLine() { - // Optional: Linien-Update + // Linien-Update falls nötig } onMounted(() => { - // Initial + // Initialisierung falls nötig }) @@ -226,7 +234,6 @@ onMounted(() => { } .slider.clicked::-webkit-slider-thumb { - //background-color: rgb(var(--v-theme-error)); background-color: #f45246; } @@ -253,12 +260,10 @@ onMounted(() => { .line-svg polyline { stroke: rgba(251, 194, 194, 0.86); - //background-image: linear-gradient(to bottom, #f9f9f9 0, #f5f5f5 100%); transition: stroke 0.3s ease; } .line-svg polyline.clicked { - //stroke: rgb(var(--v-theme-error)); stroke: #fa574d; } @@ -280,6 +285,7 @@ onMounted(() => { +