diff --git a/frontend/src/components/MealPlanGrid.vue b/frontend/src/components/MealPlanGrid.vue index 6fdf0e6..1bfcc94 100644 --- a/frontend/src/components/MealPlanGrid.vue +++ b/frontend/src/components/MealPlanGrid.vue @@ -14,7 +14,7 @@
-
+
-
{{ mealType }}
+
+ + +
- -
- +
@@ -60,22 +90,44 @@ import { ref } from 'vue' import { useMealPlanStore } from '../stores/mealPlan' -defineProps<{ +const props = defineProps<{ activeMealTypes: string[] canAddMealType: boolean + mealTypeChanging?: boolean }>() -defineEmits<{ +const emit = defineEmits<{ (e: 'slot-click', payload: { dayOfWeek: number; mealType: string }): void (e: 'add-meal-type'): void + (e: 'remove-meal-type', mealType: string): void + (e: 'reorder-meal-types', newOrder: string[]): void }>() const store = useMealPlanStore() const { getSlot } = store const collapsed = ref(false) +const editing = ref(false) const DAY_LABELS = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] + +function onMoveUp(idx: number) { + if (idx === 0) return + const arr = [...props.activeMealTypes] + const tmp = arr[idx - 1]! + arr[idx - 1] = arr[idx]! + arr[idx] = tmp + emit('reorder-meal-types', arr) +} + +function onMoveDown(idx: number) { + if (idx === props.activeMealTypes.length - 1) return + const arr = [...props.activeMealTypes] + const tmp = arr[idx]! + arr[idx] = arr[idx + 1]! + arr[idx + 1] = tmp + emit('reorder-meal-types', arr) +} diff --git a/frontend/src/components/MealPlanView.vue b/frontend/src/components/MealPlanView.vue index c1d4c23..eff3be9 100644 --- a/frontend/src/components/MealPlanView.vue +++ b/frontend/src/components/MealPlanView.vue @@ -25,8 +25,11 @@ @@ -273,6 +276,24 @@ async function onPickMealType(mealType: string) { mealTypeAdding.value = false } } + +async function onRemoveMealType(mealType: string) { + mealTypeAdding.value = true + try { + await store.removeMealType(mealType) + } finally { + mealTypeAdding.value = false + } +} + +async function onReorderMealTypes(newOrder: string[]) { + mealTypeAdding.value = true + try { + await store.reorderMealTypes(newOrder) + } finally { + mealTypeAdding.value = false + } +}