mirror of
https://github.com/TandoorRecipes/recipes.git
synced 2026-01-02 12:49:02 -05:00
meal plan editor tweaks
This commit is contained in:
@@ -21,7 +21,7 @@
|
||||
<div class="align-self-center">
|
||||
<v-btn variant="flat" icon="">
|
||||
<i class="fas fa-plus"></i>
|
||||
<meal-plan-dialog></meal-plan-dialog>
|
||||
<model-edit-dialog model="MealPlan"></model-edit-dialog>
|
||||
</v-btn>
|
||||
</div>
|
||||
</div>
|
||||
@@ -40,7 +40,7 @@
|
||||
<v-list-item-subtitle>
|
||||
{{ p.mealType.name }}
|
||||
</v-list-item-subtitle>
|
||||
<meal-plan-dialog :meal-plan="p"></meal-plan-dialog>
|
||||
<model-edit-dialog model="MealPlan" :item="p"></model-edit-dialog>
|
||||
</v-list-item>
|
||||
|
||||
</v-list>
|
||||
@@ -55,14 +55,13 @@
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {computed, onMounted, PropType, ref, toRefs} from 'vue'
|
||||
import RecipeCard from "@/components/display/RecipeCard.vue";
|
||||
import {computed, onMounted, ref} from 'vue'
|
||||
import {useDisplay} from "vuetify";
|
||||
import {MealPlan, Recipe, RecipeOverview} from "@/openapi";
|
||||
import {MealPlan} from "@/openapi";
|
||||
import {useMealPlanStore} from "@/stores/MealPlanStore";
|
||||
import {DateTime} from "luxon";
|
||||
import MealPlanDialog from "@/components/dialogs/MealPlanDialog.vue";
|
||||
import {homePageCols} from "@/utils/breakpoint_utils";
|
||||
import ModelEditDialog from "@/components/dialogs/ModelEditDialog.vue";
|
||||
|
||||
|
||||
const loading = ref(false)
|
||||
|
||||
@@ -17,9 +17,8 @@
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<meal-plan-dialog :meal-plan="mealPlan"></meal-plan-dialog>
|
||||
<model-edit-dialog model="MealPlan" :item="mealPlan" @delete="(args: MealPlan) => emit('delete', args)"></model-edit-dialog>
|
||||
</v-card-text>
|
||||
|
||||
</v-card>
|
||||
</template>
|
||||
|
||||
@@ -28,12 +27,16 @@
|
||||
import {computed, PropType} from "vue";
|
||||
import {IMealPlanNormalizedCalendarItem} from "@/types/MealPlan";
|
||||
import RecipeImage from "@/components/display/RecipeImage.vue";
|
||||
import MealPlanDialog from "@/components/dialogs/MealPlanDialog.vue";
|
||||
import ModelEditDialog from "@/components/dialogs/ModelEditDialog.vue";
|
||||
import {MealPlan} from "@/openapi";
|
||||
|
||||
const emit = defineEmits({
|
||||
onDragStart: (value: IMealPlanNormalizedCalendarItem, event: DragEvent) => {
|
||||
return true
|
||||
},
|
||||
delete: (value: MealPlan) => {
|
||||
return true
|
||||
}
|
||||
})
|
||||
|
||||
let props = defineProps({
|
||||
|
||||
@@ -2,22 +2,25 @@
|
||||
<v-row class="h-100">
|
||||
<v-col>
|
||||
<!-- TODO add hint about CTRL key while drag/drop -->
|
||||
<v-btn>
|
||||
|
||||
<model-edit-dialog model="MealPlan"></model-edit-dialog>
|
||||
</v-btn>
|
||||
|
||||
<CalendarView
|
||||
:items="planItems"
|
||||
class="theme-default"
|
||||
:item-content-height="calendarItemHeight"
|
||||
:enable-drag-drop="true"
|
||||
@dropOnDate="dropCalendarItemOnDate">
|
||||
@dropOnDate="dropCalendarItemOnDate"
|
||||
@click-date="">
|
||||
<template #header="{ headerProps }">
|
||||
<CalendarViewHeader :header-props="headerProps"/>
|
||||
</template>
|
||||
<template #item="{ value, weekStartDate, top }">
|
||||
<meal-plan-calendar-item :item-height="calendarItemHeight" :value="value" :item-top="top" @onDragStart="currentlyDraggedMealplan = value" :detailed-items="lgAndUp"></meal-plan-calendar-item>
|
||||
<meal-plan-calendar-item
|
||||
:item-height="calendarItemHeight"
|
||||
:value="value"
|
||||
:item-top="top"
|
||||
@onDragStart="currentlyDraggedMealplan = value"
|
||||
@delete="(arg: MealPlan) => {useMealPlanStore().plans.delete(arg.id)}"
|
||||
:detailed-items="lgAndUp"
|
||||
></meal-plan-calendar-item>
|
||||
</template>
|
||||
</CalendarView>
|
||||
</v-col>
|
||||
@@ -37,8 +40,8 @@ import {computed, onMounted, ref} from "vue";
|
||||
import {DateTime} from "luxon";
|
||||
import {useDisplay} from "vuetify";
|
||||
import {useMealPlanStore} from "@/stores/MealPlanStore";
|
||||
import MealPlanEditor from "@/components/model_editors/MealPlanEditor.vue";
|
||||
import ModelEditDialog from "@/components/dialogs/ModelEditDialog.vue";
|
||||
import {MealPlan} from "@/openapi";
|
||||
|
||||
const {lgAndUp} = useDisplay()
|
||||
|
||||
|
||||
Reference in New Issue
Block a user