aggiungi generazione lista spesa dal piano pasti
Bottone "Genera lista della spesa" in fondo alla pagina Piano Pasti: - raccoglie tutti gli item da tutti i giorni e pasti - deduplica (case-insensitive) e salta item già presenti in lista - aggiunge come non spuntati alla lista esistente - naviga automaticamente alla tab Lista della spesa Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="app-root">
|
<div id="app-root">
|
||||||
<MealPlanner v-if="page === 'meal'" />
|
<MealPlanner v-if="page === 'meal'" @go-shop="page = 'shop'" />
|
||||||
<Converter v-else-if="page === 'convert'" />
|
<Converter v-else-if="page === 'convert'" />
|
||||||
<ShoppingList v-else-if="page === 'shop'" />
|
<ShoppingList v-else-if="page === 'shop'" />
|
||||||
<BottomNav v-model="page" />
|
<BottomNav v-model="page" />
|
||||||
|
|||||||
@@ -13,6 +13,14 @@
|
|||||||
@add="(slot, text) => addItem(day.id, slot, text)"
|
@add="(slot, text) => addItem(day.id, slot, text)"
|
||||||
@remove="(slot, idx) => removeItem(day.id, slot, idx)"
|
@remove="(slot, idx) => removeItem(day.id, slot, idx)"
|
||||||
/>
|
/>
|
||||||
|
<button class="btn-generate" @click="generateShopping">
|
||||||
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M6 2L3 6v14a2 2 0 002 2h14a2 2 0 002-2V6l-3-4z"/>
|
||||||
|
<line x1="3" y1="6" x2="21" y2="6"/>
|
||||||
|
<path d="M16 10a4 4 0 01-8 0"/>
|
||||||
|
</svg>
|
||||||
|
Genera lista della spesa
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -21,6 +29,8 @@ import { reactive, watch } from 'vue'
|
|||||||
import MealCard from '../components/MealCard.vue'
|
import MealCard from '../components/MealCard.vue'
|
||||||
import { save, load } from '../utils/storage.js'
|
import { save, load } from '../utils/storage.js'
|
||||||
|
|
||||||
|
const emit = defineEmits(['go-shop'])
|
||||||
|
|
||||||
const days = [
|
const days = [
|
||||||
{ id: 'lunedi', label: 'Lunedì' },
|
{ id: 'lunedi', label: 'Lunedì' },
|
||||||
{ id: 'martedi', label: 'Martedì' },
|
{ id: 'martedi', label: 'Martedì' },
|
||||||
@@ -50,4 +60,44 @@ function addItem(day, slot, text) {
|
|||||||
function removeItem(day, slot, idx) {
|
function removeItem(day, slot, idx) {
|
||||||
meals[day][slot].splice(idx, 1)
|
meals[day][slot].splice(idx, 1)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function generateShopping() {
|
||||||
|
const allItems = days.flatMap(d =>
|
||||||
|
['colazione', 'pranzo', 'cena'].flatMap(slot => meals[d.id][slot])
|
||||||
|
)
|
||||||
|
const existing = load('shopping', [])
|
||||||
|
const existingNames = new Set(existing.map(i => i.name.toLowerCase()))
|
||||||
|
const seen = new Set()
|
||||||
|
const toAdd = []
|
||||||
|
for (const name of allItems) {
|
||||||
|
const key = name.toLowerCase()
|
||||||
|
if (!existingNames.has(key) && !seen.has(key)) {
|
||||||
|
seen.add(key)
|
||||||
|
toAdd.push({ id: Date.now() + Math.random(), name, checked: false })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
save('shopping', [...existing, ...toAdd])
|
||||||
|
emit('go-shop')
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.btn-generate {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 8px;
|
||||||
|
background: var(--color-primary);
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 0.95rem;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 8px;
|
||||||
|
min-height: 48px;
|
||||||
|
border-radius: var(--radius);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-generate:active {
|
||||||
|
opacity: 0.85;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user