mirror of
https://github.com/mealie-recipes/mealie.git
synced 2025-07-30 18:49:41 +02:00
1b0de02b71
* add json editor to theme editor * add toolbars tools to recipe sections * fix recipe yield * add updated_date to recipe schema * update time cards * fix mobile buttons * fix asset URL * fix PG errors CRUD * remove -d from docker-pro * fix theme tests * remvoe old typing * abstract count function Co-authored-by: hay-kot <hay-kot@pm.me>
64 lines
1.8 KiB
Vue
64 lines
1.8 KiB
Vue
<template>
|
|
<v-container fill-height>
|
|
<v-row>
|
|
<v-col sm="12">
|
|
<v-card v-for="(meal, index) in mealPlan.meals" :key="index" class="my-2">
|
|
<v-row dense no-gutters align="center" justify="center">
|
|
<v-col order="1" md="6" sm="12">
|
|
<v-card flat class="align-center justify-center" align="center" justify="center">
|
|
<v-card-title class="justify-center">
|
|
{{ meal.name }}
|
|
</v-card-title>
|
|
<v-card-subtitle> {{ $d(new Date(meal.date), "short") }}</v-card-subtitle>
|
|
|
|
<v-card-text> {{ meal.description }} </v-card-text>
|
|
|
|
<v-card-actions>
|
|
<v-spacer></v-spacer>
|
|
<v-btn align="center" color="secondary" text @click="$router.push(`/recipe/${meal.slug}`)">
|
|
{{ $t("recipe.view-recipe") }}
|
|
</v-btn>
|
|
<v-spacer></v-spacer>
|
|
</v-card-actions>
|
|
</v-card>
|
|
</v-col>
|
|
<v-col order-sm="0" :order-md="getOrder(index)" md="6" sm="12">
|
|
<v-card flat>
|
|
<v-img :src="getImage(meal.slug)" max-height="300"> </v-img>
|
|
</v-card>
|
|
</v-col>
|
|
</v-row>
|
|
</v-card>
|
|
</v-col>
|
|
</v-row>
|
|
</v-container>
|
|
</template>
|
|
|
|
<script>
|
|
import { api } from "@/api";
|
|
import { utils } from "@/utils";
|
|
export default {
|
|
data() {
|
|
return {
|
|
mealPlan: {},
|
|
};
|
|
},
|
|
async mounted() {
|
|
this.mealPlan = await api.mealPlans.thisWeek();
|
|
if (!this.mealPlan) {
|
|
utils.notify.warning(this.$t("meal-plan.no-meal-plan-defined-yet"));
|
|
}
|
|
},
|
|
methods: {
|
|
getOrder(index) {
|
|
if (index % 2 == 0) return 2;
|
|
else return 0;
|
|
},
|
|
getImage(image) {
|
|
return api.recipes.recipeImage(image);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped></style>
|