added implementation frontend by prompt @ 2026-02-14 05:35:18 #CODEX

frontend/src/components/today/DayMealCard.vue

@@ -0,0 +1,47 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import type { Meal, MealType } from '@/types/domain'
+
+const props = defineProps<{
+	mealType: MealType
+	label: string
+	mealOptions: Array<{ value: number; label: string }>
+	selectedMealId: number | null
+	meal: Meal | null
+}>()
+
+const emit = defineEmits<{
+	(event: 'select-meal', mealType: MealType, mealId: number | null): void
+}>()
+
+const selectedValue = computed({
+	get: () => (props.selectedMealId === null ? '' : String(props.selectedMealId)),
+	set: (value: string) => {
+		if (value.length <= 0) {
+			emit('select-meal', props.mealType, null)
+			return
+		}
+		emit('select-meal', props.mealType, Number(value))
+	},
+})
+</script>
+
+<template>
+	<section class="card day-meal-card">
+		<div class="day-meal-card__header">
+			<h3>{{ label }}</h3>
+		</div>
+		<select v-model="selectedValue" class="input-select">
+			<option value="">Bez jedálnička</option>
+			<option v-for="option in mealOptions" :key="option.value" :value="String(option.value)">
+				{{ option.label }}
+			</option>
+		</select>
+		<p class="day-meal-card__summary" v-if="meal?.totals">
+			{{ meal.totals.kcal }} kcal · B {{ meal.totals.protein_g }} g · S {{ meal.totals.carbs_g }} g · T {{ meal.totals.fat_g }} g
+		</p>
+		<p class="day-meal-card__summary" v-else>
+			Zatiaľ bez položiek.
+		</p>
+	</section>
+</template>