Redesign recipe details

This commit is contained in:
2026-04-04 22:26:19 +02:00
parent bfe3074a26
commit b44b985e76
6 changed files with 206 additions and 815 deletions

View File

@@ -70,7 +70,7 @@ export function getMealPlanEditorHTML() {
<div id="mpe-summary-wrap" class="relative z-[1] shrink-0 px-5 pb-3 bg-[#2d2e2b]" style="background:#2d2e2b !important; background-image:none !important;">
<div class="flex items-stretch gap-3">
<div id="mpe-nutrition-section" class="flex-1 min-w-0"></div>
<div id="mpe-servings-row" class="shrink-0 w-[6.75rem]"></div>
<div id="mpe-servings-row" class="shrink-0 w-[5.25rem]"></div>
</div>
<div id="mpe-top-shadow" class="pointer-events-none absolute inset-x-0 -bottom-3 h-3 opacity-0 transition-opacity duration-200" style="background:linear-gradient(to bottom, rgba(0,0,0,0.12), rgba(0,0,0,0.03), rgba(0,0,0,0));"></div>
</div>
@@ -103,6 +103,8 @@ export function setupMealPlanEditor() {
recipeId: null,
date: null,
slotId: null,
originalDate: null,
originalSlotId: null,
servings: 1,
subs: {},
excluded: new Set(),
@@ -436,6 +438,8 @@ export function setupMealPlanEditor() {
S.mode = opts.mode || 'add';
S.recipeId = opts.recipeId;
S.originalDate = opts.date ? startOfDay(new Date(opts.date)) : null;
S.originalSlotId = opts.slotId || null;
S.servings = opts.servings || opts.entry?.servings || 1;
S.subs = { ...(opts.substitutions || opts.entry?.substitutions || {}) };
S.excluded = new Set(opts.entry?.excludedIngredients || []);
@@ -447,9 +451,11 @@ export function setupMealPlanEditor() {
S.addQuery = '';
if (opts.date && opts.slotId) {
S.date = opts.date;
S.date = startOfDay(new Date(opts.date));
S.calDate = new Date(S.date);
S.calExpanded = false;
S.slotId = opts.slotId;
S.showCal = false;
S.showCal = S.mode === 'edit';
} else {
const today = startOfDay(new Date());
S.date = today;
@@ -500,18 +506,38 @@ export function setupMealPlanEditor() {
function handleConfirm() {
if (!S.recipeId || !S.date || !S.slotId) return;
const plans = loadPlans();
const key = dateKey(S.date);
const targetKey = dateKey(S.date);
const nextEntry = buildEntry();
if (S.mode === 'edit' && S.entryId) {
const arr = plans[key]?.[S.slotId];
if (Array.isArray(arr)) {
const sourceDate = S.originalDate || S.date;
const sourceSlotId = S.originalSlotId || S.slotId;
const sourceKey = dateKey(sourceDate);
const sameTarget = sourceKey === targetKey && sourceSlotId === S.slotId;
if (sameTarget) {
if (!plans[targetKey]) plans[targetKey] = {};
if (!plans[targetKey][S.slotId]) plans[targetKey][S.slotId] = [];
const arr = plans[targetKey][S.slotId];
const idx = arr.findIndex((e) => e.id === S.entryId);
if (idx >= 0) arr[idx] = buildEntry();
if (idx >= 0) arr[idx] = nextEntry;
else arr.push(nextEntry);
} else {
const sourceArr = plans[sourceKey]?.[sourceSlotId];
if (Array.isArray(sourceArr)) {
const idx = sourceArr.findIndex((e) => e.id === S.entryId);
if (idx >= 0) sourceArr.splice(idx, 1);
if (sourceArr.length === 0 && plans[sourceKey]) delete plans[sourceKey][sourceSlotId];
if (plans[sourceKey] && Object.keys(plans[sourceKey]).length === 0) delete plans[sourceKey];
}
if (!plans[targetKey]) plans[targetKey] = {};
if (!plans[targetKey][S.slotId]) plans[targetKey][S.slotId] = [];
plans[targetKey][S.slotId].push(nextEntry);
}
} else {
if (!plans[key]) plans[key] = {};
if (!plans[key][S.slotId]) plans[key][S.slotId] = [];
plans[key][S.slotId].push(buildEntry());
if (!plans[targetKey]) plans[targetKey] = {};
if (!plans[targetKey][S.slotId]) plans[targetKey][S.slotId] = [];
plans[targetKey][S.slotId].push(nextEntry);
}
savePlans(plans);